.index{width:100%;max-width:1100px}.index-list{display:grid;grid-template-columns:repeat(4, 1fr);gap:20px;width:100%}.index-item{aspect-ratio:1;display:flex;flex-direction:column;align-items:flex-start;max-width:500px;padding:20px;text-decoration:none;color:#444;background-color:#fff;border:1px solid #dedede;border-radius:4px;overflow:hidden;transition:background-color .3s,color .1s}.index-item:hover,.index-item:focus,.index-item:active{background-color:#f8f8f8;color:#444}.index-item:hover-category,.index-item:focus-category,.index-item:active-category{color:#f8f8f8}.index-item-category{margin-bottom:10px;padding:5px 10px;background-color:#3ea29d;color:#fff;font-size:1.1rem;line-height:1;font-weight:500;border-radius:4px;text-transform:uppercase}.index-item-title{margin-bottom:10px;font-weight:500;font-size:2.8rem;line-height:1.1;color:#444;text-decoration:none}.index-item-date{font-size:1.1rem}@media all and (max-width: 850px){.index-list{grid-template-columns:repeat(3, 1fr)}.index-item-title{font-size:2.4rem}}@media all and (max-width: 580px){.index-list{grid-template-columns:1fr;gap:0}.index-item{max-width:none;aspect-ratio:auto;border-radius:0;border-top-width:0}.index-item:first-child{border-top-width:1px;border-radius:4px 4px 0 0}.index-item:last-child{border-radius:0 0 4px 4px}.index-item-title{margin-bottom:5px}}@media all and (max-width: 460px){.index-item-title{font-size:2rem}}