*{
	padding: 0;
	margin: 0 auto;
}
.wrapper{
  position: relative;
  padding: 20px 70px 10px 70px;
  overflow-x: hidden;
  max-width: 940px;
  height: 435px;
  background-color: #f8f8f8;
}
.wrapper .icon{
  position: absolute;
  top:0;
  width: 90px;
  height: 100%;
  display: flex;
  align-items: center;
}
.wrapper .icon:first-child{
  left: 0;
  background: linear-gradient(90deg, #f8f8f8 100%, transparent);
}
.wrapper .icon:last-child{
  right: 0;
  justify-content: flex-end;
  background: linear-gradient(-90deg, #f8f8f8 100%, transparent);
}
.wrapper .icon i{
  width: 55px;
  height: 55px;
  line-height: 55px;
  text-align: center;
  background: #E0E0E0;
  color: #fff;
  cursor: pointer;
  font-size: 1.2rem;
  border-radius: 50%;
}
.wrapper .icon i:hover{
  background-color: #40B8F2;
  color:#fff;
}
.wrapper .icon:first-child i{
  margin-left: 15px;
}
.wrapper .icon:last-child i{
  margin-right: 15px;
}
.tabs-box{
  display: flex;
  gap: 10px;
  list-style: none;
  overflow-x: hidden;
  scroll-behavior: smooth;
}
.tabs-box.dragging {
  scroll-behavior: auto;
  cursor: grab;
}

.tabs-box .tab{
  width:252px;
  height:400px;
  cursor: pointer;
  white-space: nowrap;
  padding: 0px 10px;
}

.tabs-box.dragging .tab{
  user-select: none;
  pointer-events: none;
}
.wh{
	width:252px;
	height: 400px;
	margin: 0 auto;
}
.zzimg{
	width:252px;
	height:350px;
	transform: all 1s;
}
.zzimg:hover{
	transform: scale(1.05);
}

.zzword{
   text-align: center;
	margin: 10px auto;
	width:200px;
	line-height: 1.2rem;
	height: 30px;
	font-size: 13px;
	color: #5f5f5f;
}