.article-list{padding:80px 0}.article-list .article-list-wrapper{display:flex;flex-direction:column;gap:24px 0}.article-list .article-list-wrapper .list-item{position:relative;overflow:hidden}.article-list .article-list-wrapper .list-item::before{content:'';display:block;width:150%;height:150%;background:linear-gradient(to right, var(--primary-color), var(--primary-color-light));position:absolute;top:-25%;left:-25%;z-index:-2;opacity:0;transition:all .5s ease}.article-list .article-list-wrapper .list-item::after{content:'';position:absolute;inset:4px;background:#f7f7f7;z-index:-1}@keyframes rotation{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.article-list .article-list-wrapper .list-item .item-cell{padding:30px;display:flex;justify-content:space-between;align-items:center}.article-list .article-list-wrapper .list-item .item-cell .item-content{width:calc(100% - 300px);display:flex;padding-right:24px}.article-list .article-list-wrapper .list-item .item-cell .item-content .date{width:150px;padding-left:30px;padding-right:60px;display:flex;flex-shrink:0;flex-direction:column;justify-content:center;align-items:center;color:#999}.article-list .article-list-wrapper .list-item .item-cell .item-content .text{width:calc(100% - 150px)}.article-list .article-list-wrapper .list-item .item-cell .item-content .text p{font-size:14px;color:#999;margin:0}.article-list .article-list-wrapper .list-item .item-cell .photo{width:300px;height:190px;overflow:hidden}.article-list .article-list-wrapper .list-item .item-cell .photo img{width:100%;height:100%;object-fit:cover;transition:all .5s ease}.article-list .article-list-wrapper .list-item .item-cell .photo img:hover{transform:scale(1.2)}.article-list .article-list-wrapper .list-item:hover::before{animation:rotation 2s linear infinite;opacity:1}.article-list .article-list-wrapper .list-item:hover .item-cell .item-content .date,.article-list .article-list-wrapper .list-item:hover .item-cell .item-content .text{color:var(--primary-color)}@media screen and (max-width:768px){.article-list{padding:24px 0}.article-list .article-list-wrapper .list-item:hover::before{animation:initail;opacity:0}.article-list .article-list-wrapper .list-item .item-cell{padding:20px;flex-direction:column}.article-list .article-list-wrapper .list-item .item-cell .item-content{width:100%;flex-direction:column;padding-right:0}.article-list .article-list-wrapper .list-item .item-cell .item-content .date{width:100%;padding:0;margin-bottom:10px}.article-list .article-list-wrapper .list-item .item-cell .item-content .text{width:100%}.article-list .article-list-wrapper .list-item .item-cell .item-content .text p{font-size:12px}.article-list .article-list-wrapper .list-item .item-cell .photo{width:100%;height:200px;margin-top:20px}}