img{
  display: block;
}
/* 左右箭头 */
.commom-change{
  width: 2.8vw;
  height: 2.8vw;
  z-index: 2;
  cursor: pointer;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  /* background: rgba(255, 255, 255, 0.05); */
  /* box-shadow: 0px 0px 10px 2px rgba(255, 255, 255, 0.4) inset; */
  /* backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px); */
  /* border:2px solid rgba(255, 255, 255, .2); */
  /* -webkit-transition: transform 1s cubic-bezier(.06,.67,.07,.96), box-shadow 1s cubic-bezier(.06,.67,.07,.96);
  transition: transform 1s cubic-bezier(.06,.67,.07,.96), box-shadow 1s cubic-bezier(.06,.67,.07,.96); */
  display: flex;
  justify-content: flex-start;
  overflow: hidden;
}
.change-next {
  justify-content: flex-end;
}
.commom-change:hover{
  transform: scale(0.95);
  border: 1px solid #fff;
  /* box-shadow: 0px 0px 10px 2px rgba(255, 255, 255, .9) inset;; */
}
.commom-change .change-img{
  position: relative;
  width: 200%;
  height: 100%;
  -webkit-transition: transform 1s cubic-bezier(.06,.67,.07,.96);
  transition: transform 1s cubic-bezier(.06,.67,.07,.96);
  display: flex;
  justify-content: flex-start;
}
.change-prev:hover .change-img {
  transform: translateX(-50%);
}
.change-next:hover .change-img {
  transform: translateX(50%);
}
/* 页码 */
.common-page{
  position: absolute;
  color: rgba(255, 255, 255, 0.5);
  z-index: 2;
  display: flex;
}
.page-item{
  position: relative;
  font-size: 0.8vw;
  box-sizing: border-box;
  border-bottom: 2px solid rgba(255, 255, 255, 0.5);
  width: 6vw;
  text-align: center;
}
.page-item:last-child{
  margin-right: 0;
}
.page-item.active{
  color: #fff;
  border-bottom: 2px solid #ae1f21;
}
.page-item p{
  margin-bottom: 0.5vw;
}
/* 查看更多按钮 */
.more-btn {
  width: 8.6vw;
  height: 2vw;
  border: 1px solid #898e92;
  -webkit-transition: all 0.5s linear 0s;
  transition: all 0.5s linear 0s;
  border-radius: 50px;
}
.more-btn p, .more-btn a{
  text-align: center;
  font-size: 0.8vw;
  line-height: 2vw;
  cursor: pointer;
  color: #020001;
  -webkit-transition: all 0.5s linear 0s;
  transition: all 0.5s linear 0s;
}
.more-btn:hover {
  background: #b01f26;
  border: 1px solid #b01f26;
}
.more-btn:hover p, .more-btn:hover a{
  color: #ffffff;
}
/* 渐变红底白颜色标题 */
.common-title{
  width: 6vw;
  line-height: 2vw;
  background: linear-gradient(to right, #AF1F25, #E3524F);
  color: #FDFEFF;
  font-size: 1vw;
  font-weight: 800;
  text-align: center;
  border-radius: 5px;
}
/* 红色标题 */
.common-r-title p:nth-child(1){
  font-size: 1.5vw;
  font-weight: 800;
  color: #AF1F25;
  margin-bottom: 0.88vw;
}
.common-r-title p:nth-child(2){
  font-size: 1vw;
  color: #848ba5;
}
@media screen and (max-width: 1024px){
  /* 左右箭头 */
  .commom-change{
    display: none;
  }
  /* 红色标题 */
  .common-r-title p:nth-child(1){
    font-size: 4vw;
    margin-bottom: 2vw;
  }
  .common-r-title p:nth-child(2){
    font-size: 2.7vw;
  }
  /* 页码 */
  .page-item{
    width: 8vw;
    margin-right: 1vw;
  }
  .page-item p{
    opacity: 0;
  }
  /* 查看更多 */
  .more-btn{
    width: 20vw;
    height: 4.6vw;
    margin: 3vw auto 0;
  }
  .more-btn p, .more-btn a{
    font-size: 2vw;
    line-height: 4.6vw;
  }
}
@media screen and (max-width:767px){
  /* 红色标题 */
  .common-r-title p:nth-child(1){
    font-size: 6vw;
    margin-bottom: 2vw;
  }
  .common-r-title p:nth-child(2){
    font-size: 4vw;
  }
  /* 查看更多 */
  .more-btn{
    width: 35vw;
    height: 8vw;
  }
  .more-btn p, .more-btn a{
    font-size: 4vw;
    line-height: 8vw;
  }
}