@media screen and (min-width: 768px) {
    *, *:before, *:after {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }
    html,body{
        min-width: 920px;
    }
    .waper{
        position: relative;
        width: 100%;
        height: 80vh;
    }
    .waper img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .newsContent{
        width: 100%;
        padding-top: 50px;
        box-sizing: border-box;
        position: relative;
        display: -webkit-box;
    }
    .newsTab{
        width: 20%;
        min-width: 160px;
        box-sizing: border-box;
    }
    .newsTab ul{
        width: 100%;
    }
    .newsTab ul li{
        width: 100%;
        height: 60px;
        line-height: 60px;
        text-align: center;
        letter-spacing: 0.05rem;
        cursor: pointer;
        list-style: none;
        font-size: 20px;
        position: relative;
    }
    @keyframes liwidth{
        from {width: 0;}
        to {width: 1.1rem;}
    }
    .newsTab-li:before{
        position: absolute;
        content: "";
        left: 0;
        right: 0;
        bottom: 10px;
        margin: auto;
        width: 5rem;
        height: 2px;
        background-color: #00adb5;
    }
    .newsContents{
        width: 80%;
        max-width: calc(100% - 160px);
        height: 100%;
        min-height: 40vh;
        box-sizing: border-box;
        position: relative;
    }
    .newsContents-all{
        width: 100%;
    }

    .newsContents-all a {
        color: #2b2b2b;
    }
    .newsContents-unit{
        width: 100%;
        padding: 40px 0 40px 0;
        /* height: 35vh; */
        /* min-height: 200px; */
        height: calc(12vw + 80px);
        /* min-height: 135px; */
        min-height: 215px;
        box-sizing: border-box;
        border-bottom: 1px#B9B9B9 solid;
        position: relative;
        font-size: 18px;
        cursor: pointer;
    }
    .newsContents-unit:first-child{
        padding: 20px 0 40px 0;
        height: calc(12vw + 60px);
        min-height: 195px;
    }
    .newsContents-unit-navigation{
        width: 16vw;
        min-width: 180px;
        height: 12vw;
        min-height: 135px;
        float: left;
        object-fit: cover;
    }
    .newsContents-unit-nr{
        width: calc(100% - 16vw);
        max-width: calc(100% - 180px);
        height: 12vw;
        min-height: 135px;
        /* border: 1px red solid; */
        box-sizing: border-box;
        padding:0.8vw 25% 0 40px;
        float: left;
        position: relative;
    }

    .newsContents-unit-title{
        font-size: 17px;
    }
    .newsContents-unit-time{
        height: 4vw;
        line-height: 4vw;
        font-size: 17px;
    }
    .newsContents-unit-eye{
        padding-left: 0.36rem;
        margin-left: 20px;
        background:url('../../img/news/eye.png') no-repeat;
        background-size:0.2rem 0.2rem;
        background-position: 0 50%;
    }
    .newsContents-unit-brief{
        width: 100%;
        /* height: 6vw; */
        display: -webkit-box;
        text-overflow:ellipsis;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden;
        position: absolute;
        left: 0;
        bottom: 0.5vw;
        padding:0 25% 0 40px;
        font-size: 17px;
    }
    .newsContents-Page{
        width: 100%;
        height: 180px;
        line-height: 180px;
        padding-left: 5%;
    }
    .loadings{
        width: 100%;
        height: 100vh;
        position: fixed;
        top: 0;
        left: 0;
        background-color: rgba(0, 0, 0, 0.6);
        z-index: 999;
    }
    .load-container {
        width: 60px;
        height: 60px;
        background-color: #15AB97;
        position: fixed;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
        z-index: 1000;
        -webkit-animation: rotateplane 1.2s infinite ease-in-out;
        animation: rotateplane 1.2s infinite ease-in-out;
    }
    @-webkit-keyframes rotateplane {
        0% { -webkit-transform: perspective(120px) }
        50% { -webkit-transform: perspective(120px) rotateY(180deg) }
        100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
    }

    @keyframes rotateplane {
        0% {
            transform: perspective(120px) rotateX(0deg) rotateY(0deg);
            -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
        } 50% {
              transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
              -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
          } 100% {
                transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
                -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
            }
    }
    .footerall{
        width: 100%;
        min-height: 550px;
        background-color: #343434;
        color: #FFFFFF;
        padding: 60px 0 0 0;
    }
}
@media screen and (min-width: 768px) and (max-width: 1360px) {
    .newsTab{
        font-size: 18px;
    }
    @keyframes liwidth{
        from {width: 0;}
        to {width: 78px;}
    }
    .newsTab-li:before{
        position: absolute;
        content: "";
        left: 0;
        right: 0;
        bottom: 10px;
        margin: auto;
        width: 78px;
        height: 2px;
        background-color: #00adb5;
        animation:liwidth 0.3s linear;
        -webkit-animation:liwidth 0.3s linear;
    }
}
