﻿body {
    background: #F4F9FF;
}

@media screen and (min-width:1200px) {
    .banner img {
        display: block;
        width: 100%;
        object-fit: none;
    }
}

@media screen and (max-width:1200px) {
    .banner {
        height: 4rem;
    }

    .banner img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

@media screen and (min-width:1200px) {
    .listbox {
        width: 100%;
        max-width: 1920px;
        margin: 55px auto 75px;
    }

    .listbox .tab {
        height: 77px;
        border-bottom: 2px solid #1162bd;
    }

    .listbox .tab .fl {
        float: left;
        padding-top: 10px;
        line-height: 32px;
        font-size: 24px;
        font-weight: bold;
        color: #333;
    }

    .listbox .tab .fr {
        float: right;
    }

    .listbox .tab .fr a {
        float: left;
        padding: 6px;
        width: 83px;
        line-height: 40px;
        font-size: 17px;
        color: #fff;
        text-align: center;
        background: #0A58B4;
        border-radius: 5px;
    }

    .listbox .tab .fr .select {
        float: right;
        margin-left: 14px;
        height: 52px;
        position: relative;
        cursor: pointer;
    }

    .listbox .tab .fr .select .choose {
        float: left;
        width: 136px;
        height: 40px;
        padding: 6px;
        line-height: 40px;
        font-size: 17px;
        color: #fff;
        text-align: center;
        border-radius: 5px 0 0 5px;
        background: #0A58B4;
    }

    .listbox .tab .fr .select .iconfont {
        float: right;
        padding: 6px;
        width: 40px;
        line-height: 40px;
        font-size: 20px;
        color: #fff;
        text-align: center;
        background: #1162bd;
        border-radius: 0 5px 5px 0;
    }

    .listbox .tab .fr .select .selectlist {
        position: absolute;
        top: 52px;
        left: 0;
        width: 148px;
        background: #0A58B4;
        display: none;
        z-index: 2;
    }

    .listbox .tab .fr .select .selectlist p {
        line-height: 40px;
        font-size: 20px;
        color: #fff;
        text-align: center;
    }

    .listbox .tab .fr .select .selectlist p:hover {
        color: #fff;
        background: #1162bd;
    }

    .listbox .list {
        margin-top: 54px;
    }

    .listbox .list .item {
        display: block;
        padding: 32px 30px;
        height: 196px;
        background: #fff;
        position: relative;
        border-radius: 5px;
        margin-bottom: 35px;
    }

    .listbox .list .item .pic {
        float: left;
        width: 334px;
        height: 196px;
        overflow: hidden;
        border-radius: 4px;
    }

    .listbox .list .item .pic img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .listbox .list .item .info {
        float: left;
        padding: 10px 0 0 36px;
        width: 770px;
    }

    .listbox .list .item .info .time {
        height: 38px;
    }

    .listbox .list .item .info .time .day {
        float: left;
        line-height: 38px;
        font-size: 30px;
        color: #1f1f1f;
        font-family: "shuzi1";
        font-weight: bold;
    }

    .listbox .list .item .info .time .year {
        padding-top: 12px;
        float: left;
        margin-left: 20px;
        line-height: 22px;
        font-size: 16px;
        color: #999;
        font-family: "shuzi1";
        font-weight: bold;
    }

    .listbox .list .item .info .tit {
        margin-top: 24px;
        height: 24px;
        line-height: 24px;
        font-size: 18px;
        color: #1f1f1f;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .listbox .list .item .info .desc {
        margin-top: 24px;
        line-height: 26px;
        font-size: 15px;
        color: #999;
        height: 52px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .listbox .list .item .iconfont {
        position: absolute;
        top: 41px;
        right: 36px;
        width: 40px;
        line-height: 40px;
        font-size: 24px;
        text-align: center;
        background: #0A58B4;
        color: #fff;
        border-radius: 50%;
        text-indent: 3px;
    }

    .listbox .list .item:hover {
        background: rgba(164, 179, 198, 0.2);
    }

    

    .listbox .list .item:hover .iconfont {
        background: #fff;
        color: #1162bd;
    }
}

@media screen and (max-width:1200px) {
    .listbox {
        margin: .4rem .3rem;
    }

    .listbox .tab {
        height: .9rem;
        display: flex;
        justify-content: space-between;
        border-bottom: .02rem solid #1162bd;
    }

    .listbox .tab .fl {
        line-height: .7rem;
        font-size: .34rem;
        font-weight: bold;
        color: #333;
    }

    .listbox .tab .fr {
        height: .7rem;
        display: inline-flex;
    }

    .listbox .tab .fr a {
        width: 1.2rem;
        line-height: .7rem;
        font-size: .3rem;
        color: #fff;
        text-align: center;
        background: #0A58B4;
        border-radius: .04rem;
    }

    .listbox .tab .fr .select {
        margin-left: .2rem;
        height: .7rem;
        display: inline-flex;
        position: relative;
        cursor: pointer;
    }

    .listbox .tab .fr .select .choose {
        width: 1.8rem;
        height: .7rem;
        line-height: .7rem;
        font-size: .3rem;
        color: #fff;
        text-align: center;
        border-radius: .06rem 0 0 .06rem;
        background: #0A58B4;
    }

    .listbox .tab .fr .select .iconfont {
        width: .7rem;
        line-height: .7rem;
        font-size: .3rem;
        color: #fff;
        text-align: center;
        background: #1162bd;
        border-radius: 0 .06rem .06rem 0;
    }

    .listbox .tab .fr .select .selectlist {
        position: absolute;
        top: .7rem;
        left: 0;
        width: 1.8rem;
        background: #0A58B4;
        display: none;
        z-index: 2;
    }

    .listbox .tab .fr .select .selectlist p {
        line-height: .6rem;
        font-size: .3rem;
        color: #fff;
        text-align: center;
    }

    .listbox .tab .fr .select .selectlist p:hover {
        color: #fff;
        background: #1162bd;
    }

    .listbox .list {
        margin-top: .3rem;
    }

    .listbox .list .item {
        display: flex;
        padding: .2rem;
        background: #fff;
        position: relative;
        border-radius: .04rem;
        margin-bottom: .25rem;
    }

    .listbox .list .item .pic {
        width: 35%;
        height: 2.1rem;
        overflow: hidden;
        border-radius: .04rem;
    }

    .listbox .list .item .pic img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .listbox .list .item .info {
        width: 65%;
        padding-left: .2rem;
        box-sizing: border-box;
    }

    .listbox .list .item .info .time {
        height: .5rem;
    }

    .listbox .list .item .info .time .day {
        float: left;
        line-height: .5rem;
        font-size: .4rem;
        color: #1f1f1f;
        font-family: "shuzi1";
        font-weight: bold;
    }

    .listbox .list .item .info .time .year {
        padding-top: .1rem;
        float: left;
        margin-left: .15rem;
        line-height: .36rem;
        font-size: .26rem;
        color: #999;
        font-family: "shuzi1";
        font-weight: bold;
    }

    .listbox .list .item .info .tit {
        margin-top: .1rem;
        height: .5rem;
        line-height: .5rem;
        font-size: .32rem;
        color: #1f1f1f;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .listbox .list .item .info .desc {
        margin-top: .1rem;
        line-height: .44rem;
        font-size: .26rem;
        color: #999;
        height: .88rem;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .listbox .list .item .iconfont {
        position: absolute;
        top: .2rem;
        right: .2rem;
        width: .5rem;
        line-height: .5rem;
        font-size: .22rem;
        text-align: center;
        background: #0A58B4;
        color: #fff;
        border-radius: 50%;
    }
}

@media screen and (min-width:1200px) {
    .news {
        margin: 80px auto;
        width: 100%;
        max-width: 1920px;
    }

    .news .detail {
        padding: 60px 45px;
        width: 1110px;
        margin: 0 auto;
        background: #fff;
        border-radius: 5px;
    }

    .news .detail .tit {
        line-height: 30px;
        font-size: 22px;
        font-weight: bold;
        color: #1f1f1f;
        margin-bottom: 52px;
    }

    .news .detail .info {
        padding: 10px 36px;
        height: 36px;
        background: #F6F4F4;
    }

    .news .detail .info .time {
        float: left;
    }

    .news .detail .info .time .iconfont {
        float: left;
        line-height: 36px;
        font-size: 18px;
        color: #999;
        margin-right: 5px;
    }

    .news .detail .info .time span {
        float: left;
        line-height: 36px;
        font-size: 14px;
        color: #666;
    }

    .news .detail .info .look {
        float: left;
        margin-left: 20px;
    }

    .news .detail .info .look .iconfont {
        float: left;
        line-height: 36px;
        font-size: 16px;
        color: #999;
        margin-right: 5px;
    }

    .news .detail .info .look span {
        float: left;
        line-height: 36px;
        font-size: 14px;
        color: #666;
    }

    .news .detail .info a {
        float: right;
        line-height: 36px;
        font-size: 14px;
        color: #bbb;
    }

    .news .detail .cont {
        margin-top: 50px;
    }

    .news .detail .cont * {
        max-width: 100%;
    }

    .news .other {
        width: 1200px;
        margin: 36px auto 0;
    }

    .news .other .fl {
        float: left;
        width: 900px;
    }

    .news .other .fl p {
        line-height: 35px;
        font-size: 15px;
        color: #666;
    }

    .news .other .fl p a {
        color: #666;
    }

    .news .other .btn {
        float: right;
        padding: 10px;
        width: 135px;
        height: 35px;
        line-height: 35px;
        font-size: 15px;
        color: #666;
        text-align: center;
        border-radius: 5px;
        background: #fff;
    }
}

@media screen and (max-width:1200px) {
    .news {
        margin: .4rem 0;
    }

    .news .detail {
        padding: .3rem;
        background: #fff;
    }

    .news .detail .tit {
        line-height: .5rem;
        font-size: .34rem;
        font-weight: bold;
        color: #1f1f1f;
        margin-bottom: .2rem;
    }

    .news .detail .info {
        padding: 0 .1rem;
        height: .6rem;
        background: #F6F4F4;
    }

    .news .detail .info .time {
        float: left;
        height: .6rem;
        display: inline-flex;
        align-items: center;
    }

    .news .detail .info .time .iconfont {
        font-size: .24rem;
        color: #999;
        margin-right: .06rem;
    }

    .news .detail .info .time span {
        font-size: .24rem;
        color: #666;
    }

    .news .detail .info .look {
        float: left;
        margin-left: .2rem;
        height: .6rem;
        display: inline-flex;
        align-items: center;
    }

    .news .detail .info .look .iconfont {
        font-size: .24rem;
        color: #999;
        margin-right: .06rem;
    }

    .news .detail .info .look span {
        font-size: .24rem;
        color: #666;
    }

    .news .detail .info a {
        float: right;
        line-height: .6rem;
        font-size: .26rem;
        color: #bbb;
    }

    .news .detail .cont {
        margin-top: .2rem;
    }

    .news .detail .cont * {
        word-break: break-all;
        max-width: 100%;
    }

    .news .other {
        margin: .3rem .3rem 0;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .news .other .fl {
        width: 5rem;
        margin-right: .2rem;
        flex: 1 2 auto;
    }

    .news .other .fl p {
        line-height: .5rem;
        font-size: .28rem;
        color: #666;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .news .other .fl p a {
        color: #666;
    }

    .news .other .btn {
        width: 1.3rem;
        height: .8rem;
        line-height: .8rem;
        font-size: .26rem;
        color: #666;
        text-align: center;
        border-radius: .04rem;
        background: #fff;
    }
}