.news .news-wrap{display:flex;margin-top: 20px;}
.news .wrap-r{flex:1}
.news .wrap-r .news-list{display:flex;padding:0;flex-wrap:wrap;margin:0}
.news .wrap-r .news-list li{width:32%;margin-right:2%;margin-bottom:3%;border:1px solid #e5e5e5;border-radius:var(--border);overflow:hidden}
.news .wrap-r .news-list li:nth-child(3n){margin-right:0}
.news .wrap-r .news-list li .img{overflow:hidden}
.news .wrap-r .news-list li .img img{transform:scale(1.01);transition:all .2s linear;width:100%}
.news .wrap-r .news-list li .info{background-color:#FFFFFF;border-top:none;box-sizing:border-box;padding:4%}
.news .wrap-r .news-list li .info .time{color:var(--color);display:block;font-size:16px}
.news .wrap-r .news-list li .info .title{color:var(--fontcolor);font-size:18px;font-weight:var(--fontbold5);line-height:1.2;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;transition:all .2s linear;margin-top:20px;padding-bottom: 15px;}
.news .wrap-r .news-list li .info .text{color:var(--summarycolor);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;font-size:15px;margin-top:10px}
.news .wrap-r .news-list li .info .more-btn{color:var(--fontcolor);transition:all .2s linear;margin:6px 0;display:inline-flex;align-items:center;border-radius:var(--border);padding:4px 0;text-transform:lowercase;margin-top:10px}
.news .wrap-r .news-list li .info .more-btn em{font-weight:var(--fontbold5);font-size:14px;margin-top:2px;margin-left:4px}
.news .wrap-r .news-list li:hover .info .title{color:var(--color)}
.news .wrap-r .news-list li:hover .img img{transform:scale(1.03)}
.news .wrap-r .news-list li:hover .info .more-btn{background-color:var(--color);padding:4px 10px;color:#FFFFFF}
.news .wrap-r .news-list.list0 li{width:100%;border:none;margin-right:0;display:flex;align-items:center;border-radius:var(--border);overflow:hidden}
.news .wrap-r .news-list.list0 li:nth-child(even){background-color:#fafafa}
.news .wrap-r .news-list.list0 li .img{width:300px;border-radius:var(--border);overflow:hidden}
.news .wrap-r .news-list.list0 li .info{padding:0 30px;background-color:transparent}
.news .wrap-r .particulars{background-color:#FFFFFF;box-shadow:7px 0 10px 0 rgba(197,198,199,.27);box-sizing:border-box;padding:2%}
.news .wrap-r .particulars .title{color:var(--fontcolor);font-size:28px;font-weight:var(--fontbold5)}
.news .wrap-r .particulars .line-wrap{display:flex;align-items:center;margin:10px 0;font-size:15px;color:var(--color)}
.news .wrap-r .particulars .line-wrap div{margin-right:20px}
.news .wrap-r .particulars .line-wrap .newscontent-date{display:inline-flex;align-items:center;color:var(--color);flex-wrap:wrap}
.news .wrap-r .particulars .line-wrap .newscontent-date em{font-size:12px;margin-right:4px}
.news .wrap-r .particulars .line-wrap .newscontent-date span{margin:4px 0}
.news .wrap-r .particulars .line-wrap .newscontent-date .te{margin-right:16px}
.news .wrap-r .particulars .line-wrap div{display:flex;align-items:center}
.news .wrap-r .particulars .new-info{margin-top:2%}
.news .wrap-r .particulars .new-info p{margin:0;color:#222}
.news .wrap-r .particulars .new-info .item-tit{font-size:20px;font-weight:var(--fontbold5);margin-top:20px;margin-bottom:10px}
.news .wrap-r .particulars .de-img{display:flex;align-items:center;justify-content:space-between;margin:4% 0}
.news .wrap-r .particulars .de-img div{width:46%}
.news .wrap-r .particulars .de-img img{width:100%}
.news .wrap-r .particulars .share-like{display:flex;align-items:center;margin:3% 0}
.news .wrap-r .particulars .share-like .st-btn{width:40px;height:40px;border:1px solid #dcdcdc;border-radius:var(--border);display:flex;align-items:center;justify-content:center;color:var(--color);cursor:pointer;margin-right:2%;transition:all .2s linear}
.news .wrap-r .particulars .share-like .st-btn:hover{transform:translateY(-10px)}
.news .wrap-r .news-deta-page{margin:4% 0}
.news .newscontent-details{margin-bottom:20px}
.news .newscontent-details article{margin-bottom:10px}

.sidebar{width:340px;margin-right:50px}
.sidebar .mod{background-color:#FFFFFF;box-shadow:0 3px 18px 0 rgba(0,0,0,.16);box-sizing:border-box;padding:20px;margin-bottom:20px;border-radius:var(--border)}
.sidebar .mod .title p{font-size:24px;color:var(--fontcolor);font-weight:var(--fontbold5);margin:0;text-transform:capitalize}
.sidebar .mod .title::after{content:"";display:inline-block;width:83px;height:3px;background-color:#EDD648}
.sidebar .mod ul{padding:0}

.sidebar .categories ul li{margin:4px 0;background-color:#f2f6f9}
.sidebar .categories>ul>li>a{display:flex;align-items:center;justify-content:space-between;width:100%;box-sizing:border-box;padding:12px;padding-right:40px;transition:all .2s linear}
.sidebar .categories ul li a.act{background-color:var(--color);color:#FFFFFF}

.sidebar .products ul li{margin:10px 0;border-radius:var(--border);overflow:hidden}
.sidebar .products ul li>div{display:flex;align-items:center;background-color:#f2f6f9}
.sidebar .products ul li>div .img{width:110px;border-radius:var(--border);overflow:hidden;border-top-right-radius:0;border-bottom-right-radius:0}
.sidebar .products ul li .img img{width:100%;transform:scale(1);transition:all .2s linear}
.sidebar .products ul li .text{flex:1;margin:0 10px;box-sizing:border-box;padding:0 10px}
.sidebar .products ul li div div{display:inline-flex;flex:1}
.sidebar .products ul li .text p{font-size:14px;color:var(--fontcolor);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;transition:all .2s linear}
.sidebar .products ul li:hover .img img{transform:scale(1.03)}
.sidebar .products ul li:hover .text p{color:var(--color)}

.sidebar .mod ul li:hover>a{background-color:var(--color);color:#FFFFFF}
.sidebar .mod ul li:hover em{color:#FFFFFF}

.sidebar .categories .sub-menu li{margin:4px 0}
.sidebar .categories .sub-menu a{display:inline-block;width:100%;box-sizing:border-box;padding:10px 20px}
.sidebar .categories .menu-item{position:relative}
.sidebar .categories .menu-item>em{position:absolute;right:0;top:0;width:40px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px}
.sidebar .categories .menu-item .sub-menu{display:none}
.sidebar .categories .menu-item.active>em{color:#FFFFFF}
.sidebar .categories .menu-item.active>a{color:#FFFFFF;background-color:#EDD648}
.sidebar .categories .menu-item.active .sub-menu{display:block}
.sidebar .categories .menu-item>em::before{transform:rotate(0);transition:all .2s linear}
.sidebar .categories .menu-item.active>em::before{transform:rotate(90deg)}
.sidebar .categories ul li:hover>a{background-color:#EDD648;color:#FFFFFF}
.sidebar .categories ul li ul li:hover>a{background-color:#EDD648;color:#FFFFFF}

.sidebar .news ul li{margin:16px 0;border-radius:var(--border);overflow:hidden}
.sidebar .news ul li>a{display:flex}
.sidebar .news.mod ul li:hover>a{background-color:#FFFFFF;color:var(--color)}
/**.sidebar .mod ul li ul li:hover a{color:var(--color);background-color:transparent}*/
.sidebar .news a .left{width:130px;margin-right:10px;overflow:hidden;border-radius:var(--border)}
.sidebar .news a .left img{width:100%;transform:scale(1);transition:all .2s linear}
.sidebar .news a .right{flex:1}
.sidebar .news a .right p{margin:0;color:var(--fontcolor);transition:all .2s linear;line-height:1.4;font-weight:var(--fontbold5);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin-top:10px}
.sidebar .news a .right span{color:var(--color);font-size:14px}
.sidebar .news ul li:hover .right p{color:var(--color)}
.sidebar .news ul li:hover .left img{transform:scale(1.05)}
.sidebar .sidebar-cate>li ul li.active a{color:var(--color)}

.news .sidebar .related-item{display:flex;align-items:center;margin-bottom:10px;background-color:#f2f6f9;border-radius:var(--border);overflow:hidden}
.news .sidebar .related-item .related-img{width:110px;overflow:hidden;border-radius:var(--border)}
.news .sidebar .related-item .related-img img{width:100%;transition:all .2s linear}
.news .sidebar .related-item:hover .related-img img{transform:scale(1.05)}
.news .sidebar .related-item .related-info{flex:1;padding:0 10px}
.news .sidebar .related-item .related-info .related-title{color:var(--fontcolor);margin:0 10px;transition:all .2s linear}
.news .sidebar .related-item:hover .related-info .related-title{color:var(--color)}



@media screen and (max-width: 1024px) {
  .sidebar {
    display: none;
    width: 100%;
    margin-right: 0;
  }
}