@media screen and (min-width:320px) and (max-width:500px){
    html {
        min-width: auto;
    }
    .mobile-hide {
        display: none !important;
    }
    .header {
        width: 100%;
        min-width: 100%;
        height: 200px;
        min-height: 200px;
        display: flex;
        flex-direction: row;
        align-items: center;
        padding-left: 0;
        position: relative;
    }
    .header-bg {
        width: 100%;
        min-width: 100%;
        max-width: 100%;
        position: absolute;
        left: 0;
        top: 0;
        object-fit: cover;
        object-position: bottom center;
        min-height: 200px;
        height: 200px;
        z-index: -1;
        transform: scaleX(1);
    }
    .header-logo a{
        display: flex;
        flex-direction: row;
        align-items: center;
        margin-bottom: 20px;
    }
    .header-logo-image {
        width: 50px;
        height: 50px;
    }
    .header-logo-text {
        font-size: 25px;
        font-weight: 600;
        color: #fff;
    }

    .menu {
        display: none;
    }

    .content {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0 13px;
    }
    .fast {
        display: flex;
        flex-direction: row;
        width: 100%;
        justify-content: space-between;
        align-self: center;
        margin-top: 10px;
    }
    .fast-list {
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: 46%;
        height: 180px;
        box-shadow: 1px 1px 3px 1px rgba(135, 172, 175, 0.5);
        border-radius: 5px;
        align-items: center;
        cursor: pointer;
        background: linear-gradient(to bottom, #E2F0FF, #FEFFFF);
    }
    .fast-list-icon {
        width: 90px;
        height: 90px;
    }
    .fast-list-text {
        font-size: 18px;
        font-weight: 600;
        color: #333;
        margin-top: 10px;
    }

    .card-content {
        flex: 1;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .card {
        width: 100%;
        flex-direction: column;
        margin-top: 12px;
        box-shadow: 1px 1px 3px 0 rgba(135, 172, 175, 0.5);
        border-radius: 15px;
        min-height: 120px;
        overflow: hidden;
    }
    .card-title {
        display: flex;
        width: 100%;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        overflow: hidden;
        padding: 15px;
        border-radius: 15px 15px 0 0;
        margin-bottom: 15px;
    }
    .card-title-text {
        font-size: 18px;
        font-weight: 600;
    }
    .card-title-icon {
        width: 30px;
        height: 30px;
        position: relative;
        right: -18px;
    }
    .card-list {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 6px;
        width: 100%;
        padding: 5px 10px 5px 18px;
        position: relative;

    }
    .card-list::before {
        content: "•";
        color: #1E77E7;
        font-size: 18px;
        position: absolute;
        left: 5px;
        top: 30%;
    }
    .card-list-text {
        color: #000;
        padding: 0 0 3px 0;
        border-radius: 8px;
        min-width: 87px;
        font-size: 14px;
        font-weight: 600;
        width: 100%;
    }
    .card-list-title {
        width: 100%;
        color: #444;
        overflow:hidden;
        white-space: nowrap;
        font-size: 14px;
        text-overflow: ellipsis;
        -o-text-overflow:ellipsis;
    }
    .card-list-title:hover {
        color: #1178b3;
    }

    .news-location {
        padding-left: 5% !important;
    }

    .news {
        width: 90%;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-left: 5%;
        flex: 1;
    }
    .news-title {}
    .news-subtitle {}
    .news-detail {
        width: 100%;
        max-width: 100%;
    }
    .news-detail img{
        max-width: 100%;
    }
    .news_sx {
        margin-bottom: 30px;
        width: 100%;
        display: flex;
        flex-direction: column;
        margin-top: 10px;
    }
    .news_sx a{
        color: #1178b3;
    }
    .phone {
        width: 100%;
        background: #0879b4;
        color: #fff;
        margin-bottom: 20px;
        height: 92px;
        border-radius: 10px;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
        padding: 0 20px;
        display: flex;
    }
    .phone-icon {
        width: 56px;
        height: 40px;
    }
    .phone-number {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        font-size: 18px;
    }

    .page ul{
        display: flex;
        flex-direction: row;
        justify-content: center;
        margin-bottom: 15px;
    }

    .page ul li{
        margin: 5px;
    }
    .page ul li a:hover{
        color: #0879b4;
    }
    .page-current {
        color: #2db578;
    }
    .page-nouse {
        cursor: not-allowed;
        opacity: 0.5;
    }

    .location {
        color: #16a085;
        padding-left:  10px;
        margin-top: 20px;
        margin-bottom: 10px;
    }
    .location a {
        cursor: pointer;
    }
    .location a:hover {
        color: #0879b4;
    }
    .footer {
        margin-top: 20px;
        background: #0159A1;
        width: 100%;
        padding: 7px 5%;
        color: #fff;
        font-size: 13px;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    .foot-left {
        display: flex;
        flex-direction: column;
        padding-right: 10px;
    }
    .foot-right {
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-top: 10px;
    }
    .foot-line{
        width: 100%;
        margin: 1px 0;
        display: flex;
        flex-direction: row;
        align-items: center;
    }
    .foot-line:hover{
        color: #fff;
    }
    .foot-line img{
        width: 16px;
        height: 16px;
        margin-right: 3px;
    }
    .foot-code {
        width: 70px;
        height: 70px;
    }
    .foot-wechat {
        font-size: 11px;
        margin-top: 3px;
    }
    .recent {
        display: flex;
        flex-direction: column;
        width: 100%;
    }
    .recent-title {
        background: #0879B4;
        color: #fff;
        font-size: 14px;
        font-weight: 600;
        width: 100%;
        height: 35px;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 0 10px;
    }
    .recent-title img{
        width: 29px;
        height: 32px;
        transform: scale(0.7);
    }

    .title {
        font-size: 18px;
        font-weight: 600;
        display: flex;
        justify-content: center;
        margin: 20px 0 5px 0;
        position: relative;
        align-self: flex-start;
        padding-left: 5px;
    }

    .title-left {
        color: #333;
    }

    .title-right {
        color: #0F5DEB;
    }

    .title-bottom {
        position: absolute;
        bottom: 2px;
        right: 10%;
        width: 80%;
        height: 6px;
        background: linear-gradient(to left, #2db578, transparent);
        border-radius: 3px;
        z-index: -1;
    }

    .link {
        width: 100%;
        margin-top: 10px;
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        justify-content: space-between;
    }

    .link p {
        width: 100%;
    }

    .link a {
        width: 100%;
        display: block;
        box-shadow: 1px 1px 3px 1px rgba(135, 172, 175, 0.5);
        height: 60px;
        padding-left: 15px;
        line-height: 60px;
        margin-bottom: 15px;
        border-radius: 8px;
        background: linear-gradient(to right, #CEF0F6, #FEFFFF);
        font-size: 16px;
        font-weight: 600;
        position: relative;
    }

    .link a::after {
        content: '立即进入';
        position: absolute;
        right: 15px;
        top: 15px;
        font-size: 14px;
        font-weight: 500;
        color: #3D95C4;
        background: #E5EEF7;
        border-radius: 10px;
        padding: 2px 15px;
        height: 30px;
        line-height: 30px;
        box-shadow: 1px 1px 3px 1px rgba(135, 172, 175, 0.5);
        background: linear-gradient(to bottom, #CEF0F6, #FEFFFF);
    }

}