.lesson-list-component{display:flex;flex-wrap:wrap;gap:10px 14px}.lesson-list-component .lesson-item{border-radius:var(--old-radius-level4);box-shadow:0 1px var(--old-blur-level1) #5b5b5b1a;flex:1;min-width:278px;overflow:hidden;position:relative}.lesson-list-component .lesson-item:empty{box-shadow:none;height:0}.lesson-list-component .lesson-item .menu-area{background:#00000040;position:absolute;right:15px;top:8px;z-index:2}.lesson-list-component .lesson-item .menu-area .menu-btn{height:38px;width:38px}.lesson-list-component .lesson-item .menu-area .menu-btn .path{fill:var(--old-color-white)}.lesson-list-component .lesson-item .menu-area .menu-list{background:var(--old-color-container-secondary);border:1px solid var(--old-color-border-primary-focused);display:none;position:absolute;right:0;top:100%;width:100px}.lesson-list-component .lesson-item .menu-area .menu-list.--active{display:block}.lesson-list-component .lesson-item .menu-area .menu-list .btn{padding:10px 0;text-align:center;width:100%}.lesson-list-component .lesson-item .menu-area .menu-list .btn.--red{color:var(--old-color-red-600)}.lesson-list-component .lesson-item .number{left:10px;position:absolute;top:10px;width:34px;z-index:10}.lesson-list-component .lesson-item .number .img{width:100%}.lesson-list-component .lesson-item .number .text{color:var(--old-color-white);font-size:var(--old-font-size-subtitle-s);font-weight:var(--font-weight-semibold);left:50%;position:absolute;top:11px;transform:translate(-50%)}.lesson-list-component .lesson-item .link-item{position:relative;z-index:1}.lesson-list-component .lesson-item .img-area{height:0;overflow:hidden;padding-bottom:51.875%;position:relative;width:100%;z-index:1}.lesson-list-component .lesson-item .img-area:before{background:linear-gradient(180deg,rgba(0,0,0,.5),transparent);content:"";display:block;height:69px;left:0;position:absolute;right:0;top:0;z-index:2}.lesson-list-component .lesson-item .img-area .img{position:absolute;z-index:1}.lesson-list-component .lesson-item .img-area .img.--vertical{height:auto;left:0;top:50%;transform:translateY(-50%);width:100%}.lesson-list-component .lesson-item .img-area .img.--horizon{height:100%;left:50%;top:0;transform:translate(-50%);width:auto}.lesson-list-component .lesson-item .text-area{padding:10px}.lesson-list-component .lesson-item .info-area{display:flex;justify-content:space-between;margin-bottom:11px}.lesson-list-component .lesson-item .info-area .profile-area{align-items:center;color:var(--old-color-gray-580);display:flex;font-size:var(--old-font-size-overline);font-weight:var(--font-weight-medium)}.lesson-list-component .lesson-item .info-area .profile-area .profile-image{border-radius:50%;height:20px;overflow:hidden;position:relative;width:20px}.lesson-list-component .lesson-item .info-area .profile-area .profile-image .img{position:absolute}.lesson-list-component .lesson-item .info-area .profile-area .profile-image .img.--vertical{height:auto;left:0;top:50%;transform:translateY(-50%);width:100%}.lesson-list-component .lesson-item .info-area .profile-area .profile-image .img.--horizon{height:100%;left:50%;top:0;transform:translate(-50%);width:auto}.lesson-list-component .lesson-item .info-area .profile-area .name{margin:0 4px 0 6px;max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:keep-all}.lesson-list-component .lesson-item .info-area .profile-area .category{padding-left:5px;position:relative}.lesson-list-component .lesson-item .info-area .profile-area .category:before{background:var(--old-color-border-primary-hover);border-radius:var(--old-radius-full);content:"";display:block;height:10px;left:0;position:absolute;top:50%;transform:translateY(-50%);width:1px}.lesson-list-component .lesson-item .info-area .tag-list{display:flex;gap:2px}.lesson-list-component .lesson-item .info-area .tag-list .tag{background:#f4f6fc;border-radius:var(--old-radius-level4);color:#7d8089;font-size:var(--old-font-size-overline);height:18px;line-height:18px;padding:0 6px}.lesson-list-component .lesson-item .title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:var(--old-color-gray-800);font-size:var(--old-font-size-body-m);font-weight:var(--font-weight-semibold);height:2.4em;line-height:var(--old-line-height-normal);margin-bottom:11px;overflow:hidden;text-overflow:ellipsis;word-break:break-all}.lesson-list-component .lesson-item .activity-area{align-items:center;display:flex;justify-content:space-between}.lesson-list-component .lesson-item .activity-area .icon{height:20px;width:20px}.lesson-list-component .lesson-item .activity-area .icon .path{fill:var(--old-color-gray-600)}.lesson-list-component .lesson-item .activity-area .left{align-items:center;color:var(--old-color-gray-400);-moz-column-gap:4px;column-gap:4px;display:flex;font-size:var(--old-font-size-overline)}.lesson-list-component .lesson-item .activity-area .left .divider{background:var(--old-color-border-primary-hover);border:0;border-radius:var(--old-radius-full);height:10px;margin:0;padding:0;width:1px}.lesson-list-component .lesson-item .activity-area .right{align-items:center;-moz-column-gap:10px;column-gap:10px;display:flex}.lesson-list-component .lesson-item .activity-area .right .text{align-items:center;color:var(--old-color-gray-600);-moz-column-gap:4px;column-gap:4px;display:flex;font-size:var(--old-font-size-overline);justify-content:center}.lesson-list-component .no-data{background:var(--old-color-background-primary1);color:var(--old-color-gray-500);font-size:var(--old-font-size-body-m);padding:100px 0;text-align:center;width:100%}