.activity-item {cursor: pointer;position: relative;height: 2.55rem;margin-bottom: 0.2rem;margin-right: 0.2rem;overflow: hidden;background-color: #000000;}
.activity-list.col-3,
.activity-list.col-2,
.activity-list.grid {margin-right: -0.2rem;}
.activity-list.col-3 .activity-item,
.activity-list.grid .col-3.activity-item {width: calc(33.333333% - 20px);}
.activity-list.col-2 .activity-item,
.activity-list.grid .col-2.activity-item {width: calc(50% - 20px);}
.col-3.activity-item {height: 2.55rem;}
.col-2.activity-item {height: 3.65rem;}
.activity-name {position: absolute;bottom: 0;left: 0;width: 100%;height: 0.44rem;line-height: 0.44rem;padding: 0 0.2rem;color: #fff;font-size: 0.16rem;background: rgba(0, 0, 0, .4);-webkit-transition: -webkit-transform 0.35s;transition: transform 0.35s;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}
.activity-desc {position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;flex-direction: column;padding: 0 0.2rem;}
.activity-desc h2 {position: relative;width: 100%;overflow: hidden;padding: 0.5em 0;font-size: 0.16rem;opacity: 0;}
.activity-desc h2:after {position: absolute;bottom: 0;left: 0;width: 100%;height: 2px;background: #FFAF3E;content: '';-webkit-transition: -webkit-transform 0.35s;transition: transform 0.35s;-webkit-transform: translate3d(-100%, 0, 0);transform: translate3d(-100%, 0, 0);}
.activity-item .activity-desc p {width: 100%;padding: 1em 0;opacity: 0;color: #fff;-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;transition: opacity 0.35s, transform 0.35s;-webkit-transform: translate3d(100%, 0, 0);transform: translate3d(100%, 0, 0);}
.activity-item:hover .activity-desc p {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}
.activity-item:hover .activity-desc h2:after {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}
.activity-item:hover .activity-desc h2 {opacity: 1;}
.activity-item:hover .activity-name {-webkit-transform: translate3d(0, 100%, 0);transform: translate3d(0, 100%, 0);}
.activity-item:hover .activity-desc p {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}
.activity-item:hover img {opacity: 0.4;}