

@media screen and (min-width:960px) {

    #modelTabbox {
        width: 12rem;
        height: auto;
        margin: 0.6rem auto 0 auto;
    }

    .globelFont {
        width: 12rem;
        height: auto;
        margin: 0 auto;
    }

    .globelFont img {
        width: auto;
        height: 1.32rem;
        display: block;
        margin: 0 auto;
    }

    #modelTabbox ul {
        width: 100%;
        height: 2.4rem;
        display: flex;
        margin-top: 0.6rem;
    }

    #modelTabbox ul li {
        width: 1.8rem;
        height: 2.2rem;
        position: relative;
        margin-right: 0.24rem;
        -webkit-transition: -webkit-transform 0.35s, color 0.35s;
        transition: transform 0.35s, color 0.35s;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    #modelTabbox ul li img {
        display: block;
        width: 1.8rem;
        height: auto;
        position: absolute;
        top: 0;
        left: 0;
    }

    #modelTabbox ul li p {
        width: 1.8rem;
        height: 0.38rem;
        background: rgba(0, 0, 0, 0.5);
        font-size: 0.16rem;
        line-height: 0.38rem;
        color: #fff;
        text-align: center;
        position: absolute;
        bottom: 0;
        left: 0;
    }

    #modelTabbox ul li.checkBtn {
        width: 1.72rem;
        -webkit-transform: translate3d(0, 0, 0) translate3d(0, -20px, 0);
        transform: translate3d(0, 0, 0) translate3d(0, -20px, 0);
        border: 4px solid #C02230;
    }

    #modelTabbox ul li.checkBtn p {
        background: #C02230;
        width: 1.72rem;
    }

    #modelTabbox ul li.checkBtn img {
        width: 1.72rem;
        height: auto;
    }

    #modelTabbox ul li:last-child {
        margin-right: 0 !important;
    }

    .modelOne {
        width: 100%;
        height: auto;
        margin-top: 0.5rem;
        position: relative;
    }

    .upimgleft {
        position: absolute;
        top: -1.97rem;
        left: 0;
        z-index: -100;
    }

    .modelOne dl {
        width: 100%;
        height: 8rem;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -o-box;
        display: box;
        -webkit-box-orient: horizontal;
        -moz-box-orient: horizontal;
        -ms-flex-direction: row;
        -o-box-orient: horizontal;
        box-orient: horizontal;
        min-width: 12rem;
        margin: 0 auto;
    }

    .modelOne dl dt {
        width: 38%;
        min-width: 3.6rem;
        position: relative;
    }

    .modelOne dl dt .dspic {
        width: 3.7rem;
        height: 4.48rem;
        display: block;
        margin: 0 auto;
        position: absolute;
        top: 0.09rem;
        right: 0;
    }

    .modelOne dl dt .dsjs {
        width: 100%;
        height: 3.43rem;
        background: #E6C364;
        position: absolute;
        bottom: 0;
        right: 0;
    }

    .modelOne dl dt .dsjs .dsjsname {
        height: 100px;
        position: absolute;
        right: 0;
        top: 0;
    }

    .modelOne dl dt .dsjs .dsjstit {
        height: 0.51rem;
        position: absolute;
        top: 1.1rem;
        right: 0;
    }

    .dsjstitcon {
        width: 3.7rem;
        position: absolute;
        top: 1.7rem;
        right: 0;
    }

    .dsjstitcon li {
        width: 100%;
        text-align: center;
        line-height: 0.26rem;
        font-size: 0.2rem;
        color: #000;
        margin-bottom: 0.1rem;
    }

    .dsjstitcon li i {
        font-size: 0.16rem;
        color: #C21F2B;
        margin-right: 0.04rem;
    }

    .modelOne dl dd {
        width: 62%;
        min-width: 8.3rem;
        height: 8rem;
    }

    .modelOne dl dd .gdpic2 {
        width: auto;
        height: 0.93rem;
        display: block;
    }

    .modelOne dl dd .dsfontjs {
        width: 100%;
        height: 7.07rem;
        overflow-y: auto;
        background: #C21F2B;
    }

    .modelOne dl dd .dsfontjs ul {
        width: 7.9rem;
        height: auto;
        margin: 0.3rem 0 0.3rem 0.3rem;
    }

    .modelOne dl dd .dsfontjs ul li h3 {
        font-size: 0.36rem;
        color: #E5C26B;
    }

    .modelOne dl dd .dsfontjs ul li span {
        display: block;
        width: 0.9rem;
        height: 0.04rem;
        margin-top: 0.1rem;
        margin-left: 0.51rem;
        background: #E5C26B;

    }

    .modelOne dl dd .dsfontjs ul p {
        font-size: 0.16rem;
        color: #fff;
        line-height: 0.36rem;
        margin-top: 0.15rem;
    }

    .modelOne dl dd .dsfontjs ul p span {
        color: #E5C26B;
    }

    .modelTwo {
        width: 100%;
        height: 9.05rem;
        background: url(/course/img/dsk/modelbg1.png) 0 453px no-repeat;
    }

    .modelTwo .dsvideoBox {
        width: 12rem;
        height: auto;
        margin: 0 auto;
    }
    .moonediv{
        display: none;
    }
    


}


@media screen and (max-width:960px) {
    
    .Pbanimg, .boradTitp, #header, #ykbanSign, .pagetitp, .upimgleft, .upimgright, .hrefBox, .pagetit2, #pcbottom {
        display: none !important;
    }


    .modelTabbox{
        width: 100%;
        height: auto;
        margin: 0 auto;
    }
    .globelFont{
        width:auto;
        height: 0.775rem;
        margin: 0.055rem auto;
    }
    .globelFont img{
        width: auto;
        margin: 0 ;
        height: 0.775rem;
        display: block;
        margin: 0 auto;
    }
    #modelTabbox #teapic{
        margin: 0 0.055rem;
        display: flex;
    }
    #modelTabbox #teapic li{
        width: 0.565rem;
        height: 0.8rem;
        position: relative;
        margin-right: 0.1rem;
        -webkit-transition: -webkit-transform 0.35s, color 0.35s;
        transition: transform 0.35s, color 0.35s;
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
    }
    #modelTabbox ul li img{
        display: block;
        width: 0.565rem;
        height:auto;
        position: absolute;
        top: 0;
        left: 0;
    }
    #modelTabbox ul li p{
        width: 0.565rem;
        height: 0.16rem;
        background:rgba(0, 0, 0, 0.5);
        font-size:0.07rem;
        line-height: 0.16rem;
        color: #fff;
        text-align: center;
        position: absolute;
        bottom: 0;
        left: 0;
    }
    #modelTabbox #teapic li.checkBtn{
        width: 0.525rem;
        -webkit-transform: translate3d(0,0,0) translate3d(0,-0.2rem,0);
        transform: translate3d(0,0,0) translate3d(0,-0.2rem,0);
        border: 0.04rem solid #C02230;
    }
    #modelTabbox #teapic li.checkBtn p{
        background: #C02230;
        width: 0.525rem;
    }
    #modelTabbox #teapic li.checkBtn img{
        width: 0.525rem;
        height: auto;
        display: block;
    }
    #modelTabbox #teapic li:last-child{
        margin-right: 0!important;
    }
    #modelone .moonediv,#modelTwo .dsvideoBox,#modelThr .modelThrcon{
        display: none;
    }

    .modelOne{
        width: 100%;
        height: auto;
        margin-top: 0.125rem;
        position: relative;
    }
    .modelOne dl{
        width: 100%;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -o-box;
        display: box;
        -webkit-box-orient: horizontal;
        -moz-box-orient: horizontal;
        -ms-flex-direction: row;
        -o-box-orient: horizontal;
        box-orient: horizontal;
        margin: 0 auto;
    }
    .modelOne dl dt{
        width: 1.1rem;
        position: relative;
    }
    .modelOne dl dt .dspic{
        width: 1rem;
        height: 1.21rem;
        display: block;
        margin: 0 auto;
        position: absolute;
        top: 0.04rem;
        right: 0;
    }
    .modelOne dl dt .dsjs{
        width: 100%;
        height: 1.35rem;
        background: #E6C364;
        position: absolute;
        bottom: 0;
        right: 0;
    }
    .modelOne dl dt .dsjs .dsjsname{
        height: 0.32rem;
        position: absolute;
        right: -0.05rem;
        top: 0;
    }
    .modelOne dl dt .dsjs .dsjstit{
        height: 0.2rem;
        position: absolute;
        top: 0.34rem;
        right: -0.15rem;
    }
    .dsjstitcon{
        width: 100%;
        position: absolute;
        top: 0.775rem;
        right: 0;
    }
    .dsjstitcon li{
        width: 100%;
        text-align: center;
        line-height: 0.15rem;
        font-size: 0.07rem;
        color: #000;
    }
    .dsjstitcon li i{
        font-size: 0.06rem;
        color: #C21F2B;
        margin-right: 0.025rem;
    }
    .modelOne dl dd{
        width: 2.65rem;
        height: 2.58rem;
    }
    .modelOne dl dd .gdpic2{
        width: auto;
        height: 0.25rem;
        display: block;
    }
    .modelOne dl dd .dsfontjs{
        width: 100%;
        height: 2.33rem;
        overflow-y: auto;
        background: #C21F2B;
    }
    .modelOne dl dd .dsfontjs ul{
        height: auto;
        margin: 0.12rem 0.08rem 0.12rem 0.16rem;
    }
    .modelOne dl dd .dsfontjs ul li h3{
        font-size: 0.17rem;
        color: #E5C26B;
    }
    .modelOne dl dd .dsfontjs ul li span{
        display: block;
        width: 0.25rem;
        height: 0.02rem;
        margin-top: 0.1rem;
        margin-left: 0.1rem;
        background: #E5C26B;
    }
    .modelOne dl dd .dsfontjs ul p{
        font-size: 0.08rem;
        color: #fff;
        line-height: 0.18rem;
        margin-top: 0.07rem;
    }
    .modelOne dl dd .dsfontjs ul p span{
        color: #E5C26B;
    }
    .modelTwo{
        width: 100%;
        height: 2.72rem;
        background: url(/course/img/dsk/modelbgm1.png)  0 3.11rem no-repeat;
    }
    #modelTwo{
        width: 100%;
    }
    .modelTwo .dsvideoBox{
        height: auto;
        margin: 0 0.1rem;
    }

}