.article-left{box-sizing:border-box;border-radius:7px;padding:30px}.article-list{box-sizing:border-box;gap:20px;padding:20px}.article-list li{background-image:linear-gradient(#383c41 20% 100%),linear-gradient(#6d6d6d 50%,#000 100%);border-radius:10px;gap:20px;padding:20px;display:flex}.article-img{border-radius:10px;flex:0 0 220px;height:120px;overflow:hidden}.article-img picture{width:100%;height:100%;overflow:hidden}.article-img img{object-fit:cover;border-radius:10px;transition:all 1s;width:100%!important;height:100%!important}.article-img img:hover{transform:scale(1.1)}.article-list li>div{flex-direction:column;flex:1;justify-content:space-between;display:flex}.article-list li>div>div{flex-direction:column;gap:10px;display:flex}.article-list li>div>div a{color:#fff;font-size:24px;text-decoration:none}.article-list li>div>div p{color:#ccc}.article-list li>div>div>div{justify-content:space-between;align-items:center;margin-top:10px;display:flex}.article-list li>div>div>div span{color:#999}.article-list li>div>div>div a{color:#fff;background-image:linear-gradient(#232426 0%,#383c41 100%),linear-gradient(#6d6d6d 50%,#000 100%);border-radius:7px;padding:5px 20px;font-size:16px;text-decoration:none}.article-list li>div>a{color:#fff;background-image:linear-gradient(#232426 0%,#383c41 100%),linear-gradient(#6d6d6d 50%,#000 100%);border-radius:7px;align-self:flex-end;padding:5px 20px;text-decoration:none}.layout-body{justify-content:space-between;gap:30px;display:flex}.layout-body>.layout-left{flex:1}.layout-right{flex-shrink:0;width:300px}.no-articles{border-radius:12px;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:800px;margin:20px 0;padding:0;display:flex}.no-articles svg{width:100px;height:100px;margin-bottom:20px}.no-articles svg path{stroke:#666}.no-articles p{color:#666;margin-bottom:10px;font-size:20px}.no-articles span{color:#444;font-size:14px}@media screen and (max-width:768px){.main-box{width:90%}.layout-body{flex-direction:column}.layout-right{width:100%}.layout-body>.layout-left{width:auto}.article-left{padding:3px}.article-list{padding:0}.article-list-item{padding:2px}.article-list-item a{flex-direction:column;justify-content:center;align-items:center;display:flex;overflow:hidden}.no-articles{min-height:300px}.no-articles svg{width:80px;height:80px}.no-articles p{font-size:18px}.no-articles span{font-size:12px}}@media screen and (max-width:1215px){.article-list li{flex-direction:column}.article-img{flex:none;width:100%;height:200px}.article-list li>div{gap:15px}.article-list li>div>div a{font-size:20px}}
