.activebody { width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; }

.activebody .active { width: 100%; height: 2.72rem; overflow: hidden; position: relative; background: url("../../assets/image/active.png") no-repeat center center; background-size: cover; }

.activebody .active .title { width: 50%; height: 1.92rem; position: absolute; top: 0px; left: 0; display: flex; flex-direction: column; justify-content: center;background: linear-gradient(90deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%);padding-left: 3.51rem; padding-top: .8rem; }

.activebody .active .title .zh { font-family: Alibaba PuHuiTi 2.0; font-size: .4rem; font-weight: 500; line-height: normal; letter-spacing: 0em; font-variation-settings: "opsz" auto; font-feature-settings: "kern" on; color: #FFFFFF; }

.activebody .active .title .en { margin-top: .08rem; font-family: DingTalk JinBuTi; font-size: .2rem; font-weight: normal; line-height: normal; text-transform: uppercase; letter-spacing: 0em; font-variation-settings: "opsz" auto; font-feature-settings: "kern" on; color: rgba(255, 255, 255, 0.4); }

.activebody .content { width: 1200px; }

.activebody .content .breadcrumbs { margin: 40px 0; }

.activebody .content .activeList { width: 100%; display: flex; flex-wrap: wrap; }

.activebody .content .activeList .actives { width: 580px; height: 240px; display: flex; margin-bottom: 40px; cursor: pointer; position: relative; }

.activebody .content .activeList .actives:hover .info { background-color: #D3192B; }

.activebody .content .activeList .actives:hover .info .name, .activebody .content .activeList .actives:hover .info .introduction, .activebody .content .activeList .actives:hover .info .button { color: #fff; }

.activebody .content .activeList .actives:hover .info .introduction, .activebody .content .activeList .actives:hover .info .button { opacity: .6; }

.activebody .content .activeList .actives:hover .info .button .grayRight {display: none;}
.activebody .content .activeList .actives:hover .info .button .whiteRight {display: inline-block;}

.activebody .content .activeList .actives .img { width: 180px; height: 240px; }

.activebody .content .activeList .actives .img img { width: 100%; height: 100%; }

.activebody .content .activeList .actives .info { flex: 1; height: 216px; background-color: #F5F5F5; margin-top: 24px; padding: 24px; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; }

.activebody .content .activeList .actives .info .name { font-family: Alibaba PuHuiTi 2.0; font-size: 18px; font-weight: 500; line-height: 24px; letter-spacing: 0em; font-variation-settings: "opsz" auto; font-feature-settings: "kern" on; color: #333333; }

.activebody .content .activeList .actives .info .introduction { margin: 24px 0; font-family: Alibaba PuHuiTi 2.0; font-size: 14px; font-weight: normal; line-height: 24px; letter-spacing: 0em; font-variation-settings: "opsz" auto; font-feature-settings: "kern" on; color: #999999; /*word-break: break-all;*/ overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }

.activebody .content .activeList .actives .info .button { font-family: Alibaba PuHuiTi 2.0; font-size: 18px; font-weight: normal; line-height: 24px; letter-spacing: 0em; font-variation-settings: "opsz" auto; font-feature-settings: "kern" on; color: #999999; }

.activebody .content .activeList .actives .info .button .whiteRight{display: none;}

.activebody .content .activeList .actives .info .button:hover { opacity: 1; }

.activebody .content .activeList .actives:nth-child(2n-1) { margin-right: 40px; }

.activebody .content .Pagination { width: 100%; }

@media (max-width: 750px) { .activebody { transform: none; }
  .activebody .active { box-sizing: border-box; padding-left: 20px;height: 2rem; }
  .activebody .active .title {width: 80%; height: 100%; top: 0; padding-left: 0.24rem;padding-top: 0rem;box-sizing: border-box;}
  .activebody .active .title .zh {font-size: 25px;}
  .activebody .active .title .en {font-size: 16px;}
  .activebody .content { width: 100%; }
  .activebody .content .breadcrumbs { padding-left: .24rem; margin: .4rem 0; }
  .activebody .content .activeList { padding: 0 .24rem;box-sizing: border-box; }
  .activebody .content .activeList .actives { height: auto; margin-bottom: .5rem; }
  .activebody .content .activeList .actives:nth-child(2n-1) { margin-right: 0; }
  .activebody .content .details .left { display: none; }
  .activebody .content .activeList .actives .img { width: 2.16rem; height: 2.9rem; }
  .activebody .content .activeList .actives .info { height: 2.43rem; margin-top: 0.48rem; padding: 0 .4rem; }
  .activebody .content .activeList .actives .info .name { font-size: .36rem; line-height: .48rem; }
  .activebody .content .activeList .actives .info .introduction { font-size: .28rem; margin: 0.1rem 0; -webkit-line-clamp: 2; line-height: .35rem; }
  .activebody .content .activeList .actives .info .button { font-size: .36rem; }
}