.dianzan {
    position: relative;
    height: 56px;
    width: 112px;
    display: flex;
    align-items: center;
    border-radius: 56px;
    justify-content: center;
    text-align: center;
    margin: 20px auto;
    border: 1px solid #3766F2;
    color: #3766F2;
    cursor: pointer;
}
.dianzan-num {
    margin-left: 5px;
}
.iconfont.dianzan-icon {
    font-size: 22px;
}
.dianzan.dianzan-active {
    border: 1px solid #E5EAF9;
    background: #E5EAF9;
}
.dianzan.dianzan-active {
    border: 1px solid #E5EAF9;
    background: #E5EAF9;
}
.dianzan.disabled {
    border: 1px solid #f5f5f5;
    background: #f5f5f5;
    color: #ccc;
    cursor: default;
}
.dianzan-unactive:hover .dianzan-icon {
    animation:dianzan 0.3s infinite alternate;
	-webkit-animation:dianzan 0.3s infinite alternate;
}
.add-one {
	position: absolute;
	width: 74px;
    text-align: center;
	top: 12px;
	opacity: 0;
	font-weight: 700;
	color: #adadad;
	animation:add 0.8s 1 cubic-bezier(0.25,0.1,0.25,1);
	-webkit-animation:add 0.8s 1 cubic-bezier(0.25,0.1,0.25,1);
}
@keyframes dianzan {
	0% {
		transform:rotate(0deg);
		-moz-transform:rotate(0deg);
		-webkit-transform: rotate(0deg);
	}
	100% {
		transform:rotate(15deg);
		-moz-transform:rotate(15deg);
		-webkit-transform: rotate(15deg);
	}
}
@-webkit-keyframes dianzan {
	0% {
		-webkit-transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(15deg);
	}
} 
@keyframes add {
	0% {
		opacity: 0;
		font-size:12px;
		transform:translate(0,0);
	}
	100% {
		opacity: 1;
		font-size:20px;
		transform:translate(0,-40px);
		display: none;
	}
}
@-moz-keyframes add {
	0% {
		opacity: 0;
		font-size:12px;
		-moz-transform:translate(0,0);
	}
	100% {
		opacity: 1;
		font-size:20px;
		-moz-transform:translate(0,-40px);
		display: none;
	}
}
@-webkit-keyframes add {
	0% {
		opacity: 0;
		font-size:12px;
		-webkit-transform: translate(0,0);
	}
	100% {
		opacity: 1;
		font-size:20px;
		-webkit-transform: translate(0,-40px);
		display: none;
	}
}
@-o-keyframes add {
	0% {
		opacity: 0;
		font-size:12px;
		font-size:20px;
		-o-transform: translate(0,0);
	}
	100% {
		opacity: 1;
		font-size:20px;
		-o-transform: translate(0,-40px);
		display: none;
	}
}