@media screen and (min-width: 768px) {
    .shouji{
        display: none;
    }
    .wrap {
        position: relative;
        margin-top: 75px;
        width: 100%;
        padding: 0 7%;
    }
    .lunbo {
        position: relative;
    }
    .swiper-container{
        height:100%;
    }
    /*蒙版*/
    .mengban {
        position: absolute;
        bottom: 0;
        text-align: center;
        width: 100%;
        height: 60px;
        line-height: 60px;
        background-color: rgba(0,0,0,0.6);
        color: white;
        font-size: 20px;
    }
    .logo{
        position: relative;
        background-color: rgba(198, 199, 198, 0.6);
        padding: 0 10px;
        font-size: 0;
    }
    .logoWrap{
        position: relative;
        top:50%;
        transform: translateY(-50%);
        font-size: 0;
        border: 0;
    }
    .base-sin{
        position: relative;
        display: inline-block;
        width: calc(100%/9 - 20px );
        background-color: white;
        margin-left:10px;
        margin-right:10px;
        padding: 20px;
        border-radius: 4px;
    }
    .swiper-slide a{
        position: relative;
        overflow: hidden;
        position: relative;
        width: 100%;
        height: 100%;
        display: block;
    }
    .base-sin:last-child{
        padding: 4px;
    }

    .base-adapter.dot {
        position: relative;
        border: 1px dashed #666666;
        border-radius: 4px;
    }

    .plus-box {
        position: relative;
        color: #999;
        font-size: 36px;
        line-height: 1;
    }
    .baseDots {
        color: #999;
    }

    .plus {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .active{
        padding: 0px;
        box-shadow: 0 0 0 10px white;
    }
    .base-adapter{
        position: relative;
        width:100%;
        padding-bottom:100%;

    }
    .base-adapter a{
        position: absolute;
        top:0;
        left:0;
        width:100%;
        height: 100%;
        font-size: 12px;
    }
    .addBase{
        border:none;
    }
    .addBase:before{
        content: '';
        position: absolute;
        margin: 5px;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border: 1px dotted #777;
        border-radius: 6px;
    }


    .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
        opacity: .35;
        cursor: auto!important;
        pointer-events: auto;
    }
}
@media screen and (max-width: 768px) {
    .wrap{
        display: none;
    }
    .base{
        margin: 15px 0;
    }
    .base:nth-child(odd)
    {
        padding:0;
        padding-right: 7.5px;
    }
    .base:nth-child(even)
    {
        padding: 0;
        padding-left: 7.5px;
    }
    .shouji {
        margin-bottom: 15px;
    }
    .single{
        position: relative;
        width:100%;
       padding-bottom:calc(100%/4*3) ;
        display: inline-block;
        border: 1px solid #eee;
    }
    .single img{
        position: absolute;
        top:0;
        left:0;
        height:100%;
        width:100%;
    }
}