.event {
  height: 8.19rem;
  display: flex;
}

.event .left {
  width: 13.26rem;
  height: 100%;
  position: relative;
}

.event .left img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.event .right {
  flex: 1;
  display: flex;
  flex-direction: column;
  /* justify-content: space-between; */
}

.event .right .title {
  padding-left: .3rem;
  position: relative;
}

.event .right .title .bg {
  position: absolute;
  top: 0;
  left: -5%;
  width: 5.7rem;
  object-fit: cover;
}

.event .right .title .p1 {
  font-size: .7rem;
}

.event .right .title .p2 {
  font-size: .23rem;
  color: #888888;
}

.event .right ul {
  width: 100%;
}

.event .right ul li {
  display: flex;
  flex-direction: column;
  align-items: end;
  position: relative;
  z-index: 1;
  height: 2.06rem;
  cursor: pointer;
  border: none;
  line-height: normal;
}

.event .right .event-news-more {
  position: absolute;
  top: 0;
  right: .36rem;
}

.event .right ul li .date {
  width: .82rem;
  height: .78rem;
  background: #E7B064;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
  z-index: 1;
  margin-bottom: .1rem;
  margin-right: .36rem;
}

.event .right ul li i {
  font-size: .26rem;
  text-align: center;
  font-style: normal;
}

.event .right ul li span {
  font-size: .32rem;
}

.event .right ul li .info {
  font-size: .32rem;
  text-align: right;
  z-index: 1;
}

.event .right ul li img {
  position: absolute;
  top: -.2rem;
  height: 2.6rem;
  width: 0rem;
  transition: all .4s;
  z-index: -1;
}

.event .right ul .active {
  width: 7.3rem;
  z-index: -1;
}

.event .right ul li a {
  padding: .22rem .36rem .09rem 0;
  padding-top: .22rem;
  font-size: .28rem;
  color: #000;
  text-decoration: none;
  width: 5.44rem;
  text-align: right;
  word-break: break-all;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin-bottom: 0;
}

.event .right ul li p {
  font-size: .26rem;
  color: #fff;
  margin-bottom: 0;

}

.event .right ul li .l-event-li-item-span {
  position: relative;
  padding: .08rem .72rem .08rem 0rem;
  font-weight: 400;
  font-size: .23rem;
  color: #444444;
  margin-bottom: 0;
}

.event .right ul li .l-event-li-item-span a,
.event .right ul li .l-event-li-item-span span {
  padding: 0;
  font-weight: 400;
  font-size: .23rem;
  color: #444444;
  margin-bottom: 0;
}



.event .right ul li .item-time::after {
  content: " ";
  position: absolute;
  right: 0.38rem;
  top: 50%;
  transform: translateY(-50%);
  width: 0.16rem;
  height: 0.16rem;
  background-image: url('../images/newsImage/icons/time_icon.png');
  background-size: contain;
  background-repeat: no-repeat;
}

.event .right ul li .item-place::after {
  content: " ";
  position: absolute;
  right: 0.38rem;
  top: 50%;
  transform: translateY(-50%);
  width: 0.16rem;
  height: 0.16rem;
  background-image: url('../images/newsImage/icons/place_icon.png');
  background-size: contain;
  background-repeat: no-repeat;
}



@media (max-width: 768px) {
  p {
    margin-bottom: 0;
  }

  .event {
    height: auto;
  }

  .event .right {
    padding: 0 10px;
  }

  .event .left {
    display: none;
  }

  .event .right .title {
    padding: 16px 0;
  }

  .event .right .title .bg {
    left: 50%;
    transform: translateX(-50%);
  }

  .event .right .title .p1 {
    font-size: 16px;
    text-align: center;
  }

  .event .right .title .p2 {
    font-size: 14px;
    text-align: center;
  }

  .event .right ul li {
    align-items: start;
    background-color: #fff;
    height: auto;
    box-shadow: 0px 0px 10px rgba(3, 3, 3, 0.1);
    margin-bottom: 6px;
  }

  .event .right ul li img {
    display: none;
  }

  .event .right ul li a {
    width: 100%;
    text-align: center;
    font-size: 14px;
    /* padding: 6px; */
    padding: 6px 46px 20px 46px;
  }

  .event .right ul li .date {
    width: 40px;
    height: 40px;
    margin-bottom: 4px;
  }

  .event .right ul li .date i {
    font-size: 14px;
  }

  .event .right ul li .date span {
    font-size: 14px;
    margin-left: 0 !important;
  }

}