.four-content {
  background-color: #f7f7f7;
  width: 19.2rem;
  height: 7.94rem;
  overflow: hidden !important;
  z-index: 1;
}
.four-content .backImg {
  height: 7.94rem;
  overflow: hidden !important;
  z-index: 2;
  display: flex;
  justify-content: space-between;
}
.four-content .backImg div:nth-child(1) {
  width: 9.4rem;
  height: 7.94rem;
  background: url(../images/content-four/colin-lloyd-eB8mGuV0KNQ-unsplash.png) no-repeat;
  background-size: 9.4rem;
  background-position: 0 45%;
}
.four-content .backImg div:nth-child(2) {
  width: 6.07rem;
  height: 7.94rem;
  background: url(../images/content-four/colin-lloyd-eB8mGuV0KNQ-unsplash2.png) no-repeat;
  background-size: 6.07rem;
  background-position: 0 95%;
}
.four-content .top img {
  position: absolute;
  width: 4.2rem;
  top: 23.44rem;
  left: 7.28rem;
  z-index: 5;
}
.four-content .content {
  position: absolute;
  display: flex;
  z-index: 99;
  top: 24.6rem;
  left: 4.3rem;
}
.four-content .content .left {
  margin-right: 2.4rem;
  position: relative;
}
.four-content .content .left p {
  margin-left: 1.05rem;
  font-size: 0.3rem;
  font-weight: bold;
  color: #333333;
  line-height: 0.2rem;
  margin-bottom: 0.37rem;
}
@keyframes beat-four-one {
  0% {
    bottom: 3.25rem;
  }
  25% {
    bottom: 3.35rem;
  }
  50% {
    bottom: 3.25rem;
  }
  65% {
    bottom: 3.3rem;
  }
  80% {
    bottom: 3.25rem;
  }
  90% {
    bottom: 3.275rem;
  }
  100% {
    bottom: 3.25rem;
  }
}

.four-content .content .left li{
    display: flex;
    align-items: center;
    justify-content: space-between;
	padding: 0 .2rem;
}
.four-content .content .left li span{
	display: flex;
	align-items: center;
}
.four-content .content .left li span i{
	font-size: 0.24rem;
	font-weight: 400;
	color: #ffffff;
}
.four-content .content .left li span em{
	font-size: 0.24rem;
	color: #ffffff;
	font-weight: bold;
	padding-left: .5rem;
}

.four-content .content .left li:nth-child(1):hover {
  animation-name: beat-four-one;
  /*动画名称*/
  animation-duration: 0.5s;
  /*设置秒数*/
  animation-timing-function: linear;
  /*速度曲线*/
  animation-iteration-count: 1;
  -webkit-animation-iteration-count: 1;
  /*播放次数*/
  animation-direction: alternate;
  /*逆向播放*/
  animation-play-state: running;
  /*正在运行*/
}
.four-content .content .left li:nth-child(1) {
  width: 3.71rem;
  height: 0.5rem;
  background: url(../images/content-four/14.png) no-repeat;
  background-size: 100%;
  position: absolute;
  bottom: 3.25rem;
}
/* .four-content .content .left li:nth-child(1) div {
  width: 3.3rem;
  margin-top: -0.45rem;
  margin-left: 0.16rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.four-content .content .left li:nth-child(1) div div {
  margin-top: 0.4rem;
}
.four-content .content .left li:nth-child(1) div div span:nth-child(1) {
  font-size: 0.24rem;
  font-weight: 400;
  color: #ffffff;
}
.four-content .content .left li:nth-child(1) div div span:nth-child(2) {
  font-size: 0.24rem;
  color: #ffffff;
  font-weight: bold;
  margin-right: 1.2rem;
} */
.four-content .content .left li:nth-child(1) img {
  width: 0.36rem;
  height: 0.42rem;
}
@keyframes beat-four-two {
  0% {
    top: 1.08rem;
  }
  25% {
    top: 0.98rem;
  }
  50% {
    top: 1.08rem;
  }
  65% {
    top: 1.03rem;
  }
  80% {
    top: 1.08rem;
  }
  90% {
    top: 1.055rem;
  }
  100% {
    top: 1.08rem;
  }
}
.four-content .content .left li:nth-child(2):hover {
  animation-name: beat-four-two;
  /*动画名称*/
  animation-duration: 0.5s;
  /*设置秒数*/
  animation-timing-function: linear;
  /*速度曲线*/
  animation-iteration-count: 1;
  -webkit-animation-iteration-count: 1;
  /*播放次数*/
  animation-direction: alternate;
  /*逆向播放*/
  animation-play-state: running;
  /*正在运行*/
}
.four-content .content .left li:nth-child(2) {
  width: 3.71rem;
  height: 0.5rem;
  background: url(../images/content-four/19.png) no-repeat;
  background-size: 100%;
  position: absolute;
  top: 1.08rem;
}
/* .four-content .content .left li:nth-child(2) div {
  width: 3.3rem;
  margin-top: -0.45rem;
  margin-left: 0.16rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.four-content .content .left li:nth-child(2) div div {
  margin-top: 0.4rem;
}
.four-content .content .left li:nth-child(2) div div span:nth-child(1) {
  font-size: 0.24rem;
  font-weight: 400;
  color: #ffffff;
}
.four-content .content .left li:nth-child(2) div div span:nth-child(2) {
  font-size: 0.24rem;
  color: #ffffff;
  font-weight: bold;
}
.four-content .content .left li:nth-child(2) div i {
  margin-left: 0.36rem;
} */
.four-content .content .left li:nth-child(2) img {
  width: 0.29rem;
  height: 0.41rem;
}
@keyframes beat-four-three {
  0% {
    top: 1.59rem;
  }
  25% {
    top: 1.49rem;
  }
  50% {
    top: 1.59rem;
  }
  65% {
    top: 1.54rem;
  }
  80% {
    top: 1.59rem;
  }
  90% {
    top: 1.565rem;
  }
  100% {
    top: 1.59rem;
  }
}
.four-content .content .left li:nth-child(3):hover {
  animation-name: beat-four-three;
  /*动画名称*/
  animation-duration: 0.5s;
  /*设置秒数*/
  animation-timing-function: linear;
  /*速度曲线*/
  animation-iteration-count: 1;
  -webkit-animation-iteration-count: 1;
  /*播放次数*/
  animation-direction: alternate;
  /*逆向播放*/
  animation-play-state: running;
  /*正在运行*/
}
.four-content .content .left li:nth-child(3) {
  width: 3.71rem;
  height: 0.5rem;
  background: url(../images/content-four/20.png) no-repeat;
  background-size: 100%;
  position: absolute;
  top: 1.59rem;
}
/* .four-content .content .left li:nth-child(3) div {
  width: 3.3rem;
  margin-top: -0.45rem;
  margin-left: 0.16rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.four-content .content .left li:nth-child(3) div div {
  margin-top: 0.4rem;
}
.four-content .content .left li:nth-child(3) div div span:nth-child(1) {
  font-size: 0.24rem;
  font-weight: 400;
  color: #ffffff;
}
.four-content .content .left li:nth-child(3) div div span:nth-child(2) {
  font-size: 0.24rem;
  color: #ffffff;
  font-weight: bold;
}
.four-content .content .left li:nth-child(3) div i {
  margin-left: 1.1rem;
} */
.four-content .content .left li:nth-child(3) img {
  width: 0.34rem;
  height: 0.29rem;
}
@keyframes beat-four-four {
  0% {
    top: 2.09rem;
  }
  25% {
    top: 1.99rem;
  }
  50% {
    top: 2.09rem;
  }
  65% {
    top: 2.04rem;
  }
  80% {
    top: 2.09rem;
  }
  90% {
    top: 2.065rem;
  }
  100% {
    top: 2.09rem;
  }
}
.four-content .content .left li:nth-child(4):hover {
  animation-name: beat-four-four;
  /*动画名称*/
  animation-duration: 0.5s;
  /*设置秒数*/
  animation-timing-function: linear;
  /*速度曲线*/
  animation-iteration-count: 1;
  -webkit-animation-iteration-count: 1;
  /*播放次数*/
  animation-direction: alternate;
  /*逆向播放*/
  animation-play-state: running;
  /*正在运行*/
}
.four-content .content .left li:nth-child(4) {
  width: 3.71rem;
  height: 0.5rem;
  background: url(../images/content-four/19.png) no-repeat;
  background-size: 100%;
  position: absolute;
  top: 2.09rem;
}
/* .four-content .content .left li:nth-child(4) div {
  width: 3.3rem;
  margin-top: -0.45rem;
  margin-left: 0.16rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.four-content .content .left li:nth-child(4) div div {
  margin-top: 0.4rem;
}
.four-content .content .left li:nth-child(4) div div span:nth-child(1) {
  font-size: 0.24rem;
  font-weight: 400;
  color: #ffffff;
}
.four-content .content .left li:nth-child(4) div div span:nth-child(2) {
  font-size: 0.24rem;
  color: #ffffff;
  font-weight: bold;
}
.four-content .content .left li:nth-child(4) div i {
  margin-left: 1.45rem;
} */
.four-content .content .left li:nth-child(4) img {
  width: 0.34rem;
  height: 0.35rem;
}
@keyframes beat-four-five {
  0% {
    top: 2.6rem;
  }
  25% {
    top: 2.5rem;
  }
  50% {
    top: 2.6rem;
  }
  65% {
    top: 2.55rem;
  }
  80% {
    top: 2.6rem;
  }
  90% {
    top: 2.575rem;
  }
  100% {
    top: 2.6rem;
  }
}
.four-content .content .left li:nth-child(5):hover {
  animation-name: beat-four-five;
  /*动画名称*/
  animation-duration: 0.5s;
  /*设置秒数*/
  animation-timing-function: linear;
  /*速度曲线*/
  animation-iteration-count: 1;
  -webkit-animation-iteration-count: 1;
  /*播放次数*/
  animation-direction: alternate;
  /*逆向播放*/
  animation-play-state: running;
  /*正在运行*/
}
.four-content .content .left li:nth-child(5) {
  width: 3.71rem;
  height: 0.5rem;
  background: url(../images/content-four/14.png) no-repeat;
  background-size: 100%;
  position: absolute;
  top: 2.6rem;
}
/* .four-content .content .left li:nth-child(5) div {
  width: 3.3rem;
  margin-top: -0.45rem;
  margin-left: 0.16rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.four-content .content .left li:nth-child(5) div div {
  margin-top: 0.4rem;
}
.four-content .content .left li:nth-child(5) div div span:nth-child(1) {
  font-size: 0.24rem;
  font-weight: 400;
  color: #ffffff;
}
.four-content .content .left li:nth-child(5) div div span:nth-child(2) {
  font-size: 0.24rem;
  color: #ffffff;
  font-weight: bold;
}
.four-content .content .left li:nth-child(5) div i {
  margin-left: 0.6rem;
} */
.four-content .content .left li:nth-child(5) img {
  width: 0.38rem;
  height: 0.29rem;
}
@keyframes beat-four-six {
  0% {
    top: 3.11rem;
  }
  25% {
    top: 3.01rem;
  }
  50% {
    top: 3.11rem;
  }
  65% {
    top: 3.06rem;
  }
  80% {
    top: 3.11rem;
  }
  90% {
    top: 3.085rem;
  }
  100% {
    top: 3.11rem;
  }
}
.four-content .content .left li:nth-child(6):hover {
  animation-name: beat-four-six;
  /*动画名称*/
  animation-duration: 0.5s;
  /*设置秒数*/
  animation-timing-function: linear;
  /*速度曲线*/
  animation-iteration-count: 1;
  -webkit-animation-iteration-count: 1;
  /*播放次数*/
  animation-direction: alternate;
  /*逆向播放*/
  animation-play-state: running;
  /*正在运行*/
}
.four-content .content .left li:nth-child(6) {
  width: 3.71rem;
  height: 0.5rem;
  background: url(../images/content-four/19.png) no-repeat;
  background-size: 100%;
  position: absolute;
  top: 3.11rem;
}
/* .four-content .content .left li:nth-child(6) div {
  width: 3.3rem;
  margin-top: -0.45rem;
  margin-left: 0.16rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.four-content .content .left li:nth-child(6) div div {
  margin-top: 0.4rem;
}
.four-content .content .left li:nth-child(6) div div span:nth-child(1) {
  font-size: 0.24rem;
  font-weight: 400;
  color: #ffffff;
}
.four-content .content .left li:nth-child(6) div div span:nth-child(2) {
  font-size: 0.24rem;
  color: #ffffff;
  font-weight: bold;
}
.four-content .content .left li:nth-child(6) div i {
  margin-left: 1.72rem;
} */
.four-content .content .left li:nth-child(6) img {
  width: 0.38rem;
  height: 0.38rem;
}
@keyframes beat-four-seven {
  0% {
    top: 3.62rem;
  }
  25% {
    top: 3.52rem;
  }
  50% {
    top: 3.62rem;
  }
  65% {
    top: 3.57rem;
  }
  80% {
    top: 3.62rem;
  }
  90% {
    top: 3.595rem;
  }
  100% {
    top: 3.62rem;
  }
}
.four-content .content .left li:nth-child(7):hover {
  animation-name: beat-four-seven;
  /*动画名称*/
  animation-duration: 0.5s;
  /*设置秒数*/
  animation-timing-function: linear;
  /*速度曲线*/
  animation-iteration-count: 1;
  -webkit-animation-iteration-count: 1;
  /*播放次数*/
  animation-direction: alternate;
  /*逆向播放*/
  animation-play-state: running;
  /*正在运行*/
}
.four-content .content .left li:nth-child(7) {
  width: 3.71rem;
  height: 0.5rem;
  background: url(../images/content-four/20.png) no-repeat;
  background-size: 100%;
  position: absolute;
  top: 3.62rem;
}
/* .four-content .content .left li:nth-child(7) div {
  width: 3.2rem;
  margin-top: -0.45rem;
  margin-left: 0.16rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.four-content .content .left li:nth-child(7) div div {
  margin-top: 0.4rem;
}
.four-content .content .left li:nth-child(7) div div span:nth-child(1) {
  font-size: 0.24rem;
  font-weight: 400;
  color: #ffffff;
}
.four-content .content .left li:nth-child(7) div div span:nth-child(2) {
  font-size: 0.24rem;
  color: #ffffff;
  font-weight: bold;
}
.four-content .content .left li:nth-child(7) div i {
  margin-left: 1.6rem;
} */
.four-content .content .left li:nth-child(7) img {
  width: 0.25rem;
  height: 0.35rem;
}
.four-content .content .right p {
  margin-left: 0.22rem;
  font-size: 0.3rem;
  font-weight: bold;
  color: #333333;
  line-height: 0.2rem;
  margin-bottom: 0.28rem;
}
.four-content .content .right ul {
  width: 5.78rem;
  height: 3.4rem;
  background: url(../images/content-four/15.png) no-repeat;
  background-size: 100%;
  font-size: 0.24rem;
  font-weight: 400;
  color: #ffffff;
  line-height: 0.48rem;
  padding: 0.22rem 0.22rem;
}
.four-content .content .right ul li {
  display: flex;
  align-items: center;
}
.four-content .content .right ul li div {
  margin-right: 0.2rem;
  text-align: center;
  line-height: 0.32rem;
  color: #b02318;
  width: 0.32rem;
  height: 0.32rem;
  background: #ffffff;
  border-radius: 50%;
}
.four-content .bottom-button {
  position: absolute;
  width: 2.95rem;
  height: 0.57rem;
  background: #1f70ec;
  border-radius: 0.29rem;
  top: 29.6rem;
  left: 8.13rem;
  text-align: center;
  cursor: pointer;
}
.four-content .bottom-button div {
  margin-top: 0.16rem;
  font-size: 0.24rem;
  font-weight: 400;
  color: #ffffff;
}
