/* 可以设置不同的进入和离开动画 */
/* 设置持续时间和动画函数 */
.slide-fade-enter-active {
    transition: all .3s ease;
}
.slide-fade-leave-active {
    transition: all .1s cubic-bezier(1.0, 0.5, 0.8, 1.0);
}
.slide-fade-enter, .slide-fade-leave-to
    /* .slide-fade-leave-active for below version 2.1.8 */ {
    transform: translateY(-200px);
    opacity: 0;
}

.van-sidebar{
    width: 100%;
    opacity: 100%;
}

#showPopup{
    position: relative;
}

#header_box{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
}

.logos_img{
    width: 160px !important;
}

.head_height{height: 50px}

.van-sidebar-item{
    font-size: 18px;
    padding: 15px 30px 15px 20px;
}
.new-header{
    height: 50px;
}



/*list样式*/
/*手机*/
@media (max-width: 389px) {
    :root{
        /*item总宽度*/
        --main-media--width:117px;
        /*item总高度*/
        --main-media--height:170px;
        /*item-img宽高*/
        --main-media--img:117px;
        /*item-text高 总高度-高度*/
        --main-media--text:50px;
        /*边框*/
        --margin--com:5px;
        /*字体*/
        --font-size:10px;
        /*顶部margin*/
        --top--margin:55px;
    }
}

@media (min-width: 390px) and (max-width: 414px) {
     :root{
        /*item总宽度*/
        --main-media--width:123px;
        /*item总高度*/
        --main-media--height:173px;
        /*item-img宽高*/
        --main-media--img:123px;
        /*item-text高 总高度-高度*/
        --main-media--text:50px;
        /*边框*/
        --margin--com:5px;
        /*字体*/
        --font-size:10px;
        /*顶部margin*/
        --top--margin:55px;
    }
}


/*手机*/
@media (min-width: 414px) and (max-width: 768px) {
     :root{
        /*item总宽度*/
        --main-media--width:131px;
        /*item总高度*/
        --main-media--height:181px;
        /*item-img宽高*/
        --main-media--img:131px;
        /*item-text高 总高度-高度*/
        --main-media--text:50px;
        /*边框*/
        --margin--com:5px;
        /*字体*/
        --font-size:10px;
        /*顶部margin*/
        --top--margin:55px;
    }
}
/*平板*/
@media (min-width: 768px) and (max-width: 1024px) {
    :root{
        /*item总宽度*/
        --main-media--width:260px;
        /*item总高度*/
        --main-media--height:320px;
        /*item-img宽高*/
        --main-media--img:260px;
        /*item-text高 总高度-高度*/
        --main-media--text:60px;
        /*边框*/
        --margin--com:10px;
        /*字体*/
        --font-size:10px;
        /*顶部margin*/
        --top--margin:60px;
    }
}

@media (min-width: 1024px) and (max-width: 1279px) {
    :root{
        /*item总宽度*/
        --main-media--width:342px;
        /*item总高度*/
        --main-media--height:442px;
        /*item-img宽高*/
        --main-media--img:342px;
        /*item-text高 总高度-高度*/
        --main-media--text:100px;
        /*边框*/
        --margin--com:15px;
        /*字体*/
        --font-size:20px;
        /*顶部margin*/
        --top--margin:65px;
    }
}

@media (min-width: 1280px) and (max-width: 1919px) {
    :root{
        /*item总宽度*/
        --main-media--width:342px;
        /*item总高度*/
        --main-media--height:442px;
        /*item-img宽高*/
        --main-media--img:342px;
        /*item-text高 总高度-高度*/
        --main-media--text:100px;
        /*边框*/
        --margin--com:15px;
        /*字体*/
        --font-size:20px;
        /*顶部margin*/
        --top--margin:65px;
    }
}

@media (min-width: 1920px) {
    :root{
        /*item总宽度*/
        --main-media--width:460px;
        /*item总高度*/
        --main-media--height:560px;
        /*item-img宽高*/
        --main-media--img:460px;
        /*item-text高 总高度-高度*/
        --main-media--text:100px;
        /*边框*/
        --margin--com:15px;
        /*字体*/
        --font-size:20px;
        /*顶部margin*/
        --top--margin:65px;
    }
}

.new-content{
    width: 100%;
    margin-top:var(--top--margin);
}


@keyframes fadenum {0%{opacity:0;}100%{opacity:1;}}
.new-content-item{
    width: var(--main-media--width);height: var(--main-media--height);float: left;background:white;margin-left: var(--margin--com);margin-bottom: var(--margin--com);animation: fadenum 5s 1;;
}

.new-content-itemimg{
    width: var(--main-media--img);height: var(--main-media--img);
    display: flex;
    align-items: center; justify-content: center;
}

.new-content-item-img{
    max-width: 100%;
    height: auto;
}
.new-content-item-text{
    height: var(--main-media--text);
    display: flex;align-items: center; justify-content: center;
    text-align: center;
    line-height: var(--main-media--text);
    font-size: var(--font-size);
}

.new-content-item-text span{
    width: 90%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}