body{background-color:#f8f8f8}.material-list{padding:80px 0}.material-list .material-list-wrapper{display:flex;flex-wrap:wrap;gap:48px}.material-list .material-list-wrapper .material-item{position:relative;width:calc(100% / 2 - (48px * 1 / 2));background-color:#fff;padding:24px;display:flex;align-items:center}.material-list .material-list-wrapper .material-item .photo{width:20%;overflow:hidden}.material-list .material-list-wrapper .material-item .photo img{width:100%;height:100%;object-fit:contain;transition:all .5s ease}.material-list .material-list-wrapper .material-item .material-content{width:80%;padding-left:24px;display:flex;flex-direction:column;gap:6px}.material-list .material-list-wrapper .material-item .material-content .hits,.material-list .material-list-wrapper .material-item .material-content .date{color:#999}.material-list .material-list-wrapper .material-item .material-content .button-wrappper{display:flex}.material-list .material-list-wrapper .material-item .material-content .button-wrappper .button{padding:12px 48px;border-radius:4px;background-color:rgba(254,237,59,0.937);color:#000;text-align:center;cursor:pointer}.material-list .material-list-wrapper .material-item:hover .material-link .material-content .date,.material-list .material-list-wrapper .material-item:hover .material-link .material-content .text{color:var(--primary-color)}@media screen and (max-width:992px){.material-list{padding:24px 12px}.material-list .material-list-wrapper{gap:24px}.material-list .material-list-wrapper .material-item{width:100%;padding:12px}.material-list .material-list-wrapper .material-item .photo{width:30%}.material-list .material-list-wrapper .material-item .material-content{width:70%}.material-list .material-list-wrapper .material-item .material-content .button-wrappper{display:flex}.material-list .material-list-wrapper .material-item .material-content .button-wrappper .button{padding:6px 24px}}