.animated {
	-webkit-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-fill-mode:both;
	animation-fill-mode:both
}
@-webkit-keyframes bounceInDown {
	0%,60%,75%,90%,to {
	-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);
	animation-timing-function:cubic-bezier(.215,.61,.355,1)
}
0% {
	opacity:0;
	-webkit-transform:translate3d(0,-3000px,0);
	transform:translate3d(0,-3000px,0)
}
60% {
	opacity:1;
	-webkit-transform:translate3d(0,25px,0);
	transform:translate3d(0,25px,0)
}
75% {
	-webkit-transform:translate3d(0,-10px,0);
	transform:translate3d(0,-10px,0)
}
90% {
	-webkit-transform:translate3d(0,5px,0);
	transform:translate3d(0,5px,0)
}
to {
	-webkit-transform:translateZ(0);
	transform:translateZ(0)
}
}@keyframes bounceInDown {
	0%,60%,75%,90%,to {
	-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);
	animation-timing-function:cubic-bezier(.215,.61,.355,1)
}
0% {
	opacity:0;
	-webkit-transform:translate3d(0,-3000px,0);
	transform:translate3d(0,-3000px,0)
}
60% {
	opacity:1;
	-webkit-transform:translate3d(0,25px,0);
	transform:translate3d(0,25px,0)
}
75% {
	-webkit-transform:translate3d(0,-10px,0);
	transform:translate3d(0,-10px,0)
}
90% {
	-webkit-transform:translate3d(0,5px,0);
	transform:translate3d(0,5px,0)
}
to {
	-webkit-transform:translateZ(0);
	transform:translateZ(0)
}
}.bounceInDown {
	-webkit-animation-name:bounceInDown;
	animation-name:bounceInDown
}
@-webkit-keyframes pulse {
	0% {
	-webkit-transform:scaleX(1);
	transform:scaleX(1)
}
50% {
	-webkit-transform:scale3d(1.05,1.05,1.05);
	transform:scale3d(1.05,1.05,1.05)
}
to {
	-webkit-transform:scaleX(1);
	transform:scaleX(1)
}
}@keyframes pulse {
	0% {
	-webkit-transform:scaleX(1);
	transform:scaleX(1)
}
50% {
	-webkit-transform:scale3d(1.05,1.05,1.05);
	transform:scale3d(1.05,1.05,1.05)
}
to {
	-webkit-transform:scaleX(1);
	transform:scaleX(1)
}
}.pulse {
	-webkit-animation-name:pulse;
	animation-name:pulse;
	-webkit-animation-iteration-count:infinite;
	animation-iteration-count:infinite
}
@-webkit-keyframes right-top {
	0% {
	-webkit-transform:translate3d(.25rem,-.25rem,0);
	transform:translate3d(.25rem,-.25rem,0)
}
50% {
	-webkit-transform:translate3d(.5rem,-1rem,0);
	transform:translate3d(.5rem,-1rem,0)
}
to {
	-webkit-transform:translate3d(.25rem,-.25rem,0);
	transform:translate3d(.25rem,-.25rem,0)
}
}@keyframes right-top {
	0% {
	-webkit-transform:translate3d(.25rem,-.25rem,0);
	transform:translate3d(.25rem,-.25rem,0)
}
50% {
	-webkit-transform:translate3d(.5rem,-1rem,0);
	transform:translate3d(.5rem,-1rem,0)
}
to {
	-webkit-transform:translate3d(.25rem,-.25rem,0);
	transform:translate3d(.25rem,-.25rem,0)
}
}.right-top {
	-webkit-animation-name:right-top;
	animation-name:right-top;
	-webkit-animation-iteration-count:infinite;
	animation-iteration-count:infinite
}
@-webkit-keyframes left-btm {
	0% {
	-webkit-transform:translate3d(-.25rem,.25rem,0) rotate(180deg);
	transform:translate3d(-.25rem,.25rem,0) rotate(180deg)
}
50% {
	-webkit-transform:translate3d(-.5rem,1rem,0) rotate(180deg);
	transform:translate3d(-.5rem,1rem,0) rotate(180deg)
}
to {
	-webkit-transform:translate3d(-.25rem,.25rem,0) rotate(180deg);
	transform:translate3d(-.25rem,.25rem,0) rotate(180deg)
}
}@keyframes left-btm {
	0% {
	-webkit-transform:translate3d(-.25rem,.25rem,0) rotate(180deg);
	transform:translate3d(-.25rem,.25rem,0) rotate(180deg)
}
50% {
	-webkit-transform:translate3d(-.5rem,1rem,0) rotate(180deg);
	transform:translate3d(-.5rem,1rem,0) rotate(180deg)
}
to {
	-webkit-transform:translate3d(-.25rem,.25rem,0) rotate(180deg);
	transform:translate3d(-.25rem,.25rem,0) rotate(180deg)
}
}.left-btm {
	-webkit-animation-name:left-btm;
	animation-name:left-btm;
	-webkit-animation-iteration-count:infinite;
	animation-iteration-count:infinite
}
article,body,div,h1,h2,h3,html,i,img,p,section,span {
	margin:0;
	padding:0;
	-webkit-box-sizing:border-box;
	box-sizing:border-box
}
body,html {
	font-size:16px;
	line-height:1.5;
	font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,Arial,PingFang SC,Hiragino Sans GB,STHeiti,Microsoft YaHei,Microsoft JhengHei,Source Han Sans SC,Noto Sans CJK SC,Source Han Sans CN,Noto Sans SC,Source Han Sans TC,Noto Sans CJK TC,WenQuanYi Micro Hei,SimSun,sans-serif;
	background-color:#fff
}
.icon {
	display:inline-block
}
.txt-ellipsis {
	display:block;
	white-space:nowrap
}
.txt-ellipsis,.txt-ellipsis-two {
	text-overflow:ellipsis;
	overflow:hidden
}
.txt-ellipsis-two {
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2;
	word-break:break-all
}
.flex-hcenter {
	-webkit-box-pack:center;
	-ms-flex-pack:center;
	justify-content:center
}
.flex-hcenter,.flex-vcenter {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex
}
.flex-vcenter {
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center
}
.g-vcenter {
	position:absolute;
	top:50%;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%)
}
.g-hcenter {
	-webkit-transform:translateX(-50%);
	transform:translateX(-50%)
}
.g-center,.g-hcenter {
	position:absolute;
	left:50%
}
.g-center {
	top:50%;
	-webkit-transform:translate(-50%,-50%);
	transform:translate(-50%,-50%)
}
.g-flex-center {
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-ms-flex-direction:column;
	flex-direction:column
}
.center,.g-flex-center,.long-press,.long-press .l-img,.long-press .l-tips,.operation-box,.operation-btns,.operation-header {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center;
	-webkit-box-pack:center;
	-ms-flex-pack:center;
	justify-content:center
}
#app,body,html {
	min-height:100%;
	width:100%;
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none
}
.wrapper {
	position:relative;
	overflow-x:hidden;
	width:100%;
	min-height:100vh;
	max-width:500px;
	margin:0 auto;
	background-image:url(../img/20190829-bg.png);
	background-repeat:no-repeat;
	background-size:cover
}
.operation-number {
	margin-top:.4rem;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack:center;
	-ms-flex-pack:center;
	justify-content:center;
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center;
	text-align:center;
	color:#fff;
	font-size:14px
}
.operation-number span {
	display:inline-block;
	padding:1px 5px;
	border-radius:25px;
	background-color:#ea4727;
	color:#feee92
}
.operation-header {
	margin-top:1.8rem;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-ms-flex-direction:column;
	flex-direction:column
}
.operation-header div {
	background-size:contain;
	background-repeat:no-repeat
}
.operation-header .h-logo {
	text-align:center
}
.operation-header .h-logo img {
	height:1.5rem
}
.operation-header .h-title {
	margin-top:.5rem;
	width:13.125rem;
	height:6.3rem;
	background-image:url(../img/20190906-logo2.png)
}
.operation-header .h-slogan {
	margin-top:.125rem;
	width:9.35rem;
	height:1.05rem;
	background-image:url(./img/20190906-logo3.png)
}
.operation-box {
	margin-top:.5rem
}
.operation-box .next,.operation-box .prev {
	background-image:url(../img/20190829-btn.png);
	background-size:contain;
	border-radius:50%;
	width:2.275rem;
	height:2.275rem
}
.operation-box .prev {
	-webkit-transform:rotate(180deg);
	transform:rotate(180deg)
}
.operation-box .operation-img {
	margin:0 .75rem;
	background:#fff;
	border:.25rem solid #fbe6b5;
	border-radius:.75rem;
	font-size:0
}
.operation-box .operation-img .cropper-content {
	border-radius:.5rem;
	position:relative;
	width:9.5rem;
	height:9.5rem;
	margin-left:50%;
	-webkit-transform:translateX(-50%);
	transform:translateX(-50%);
	overflow:hidden
}
.operation-box .operation-img .cropper-content .vue-cropper {
	background:#d8d8d8
}
.operation-btns {
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-ms-flex-direction:column;
	flex-direction:column;
	margin-top:.75rem
}
.operation-btns .o-btn {
	background-size:100% 100%
}
.operation-btns .o-btn1 {
	width:11.6rem;
	height:3.325rem;
	background-image:url(../img/btn1.png)
}
.operation-btns .o-btn2 {
	position:relative;
	width:11.6rem;
	height:3.75rem;
	background-image:url(../img/save-btn.png)
}
.operation-btns .o-btn3 {
	width:11.625rem;
	height:3.75rem;
	background-image:url(./img/btn3.png)
}
.operation-tips {
	text-align:center
}
.operation-tips p {
	background-image:radial-gradient(circle at 7% 0,#fff,#feff74);
	font-size:14px;
	font-weight:400;
	font-style:normal;
	font-stretch:normal;
	line-height:normal;
	letter-spacing:1.7px;
	text-align:center;
	-webkit-background-clip:text;
	background-clip:text;
	-webkit-text-fill-color:transparent
}
.operation-logo {
	text-align:center
}
.operation-logo img {
	height:1rem
}
.operation-done {
	text-align:center
}
.operation-done .act-done-text {
	margin:1.25rem 0 2rem;
	height:.75rem
}
.operation-done .act-done-happy {
	margin-bottom:2.5rem;
	height:5.15rem
}

@media screen and (min-height:600px) {
	.operation-box {
	margin-top:1rem;
	margin-bottom:1rem
}
}@media screen and (min-height:700px) {
	.operation-box {
	margin-top:1.5rem;
	margin-bottom:1.5rem
}
.operation-btns {
	margin-bottom:.5rem
}
.operation-header .h-logo {
	margin-top:.75rem
}
.operation-header .h-title {
	margin-top:1rem
}
}.cropper-drag-box {
	position:relative;
	z-index:9999999
}
.frame-image {
	position:absolute;
	right:0;
	bottom:0;
	z-index:999;
	width:100%;
	height:100%
}
.van-popup {
	background-color:transparent
}
.long-press {
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-ms-flex-direction:column;
	flex-direction:column;
	width:12.975rem;
	height:16.25rem;
	background-image:url(./img/20190829-longpress.svg);
	background-size:cover
}
.long-press .l-img {
	width:100%;
	height:13.375rem
}
.long-press .l-img img {
	width:10.7rem;
	height:10.7rem
}
.long-press .l-tips {
	-webkit-box-flex:1;
	-ms-flex:1;
	flex:1;
	font-size:1rem;
	font-weight:700
}
.first-tips {
	position:relative;
	margin-top:18.25rem;
	margin-left:50%;
	-webkit-transform:translate3d(-50%,-50%,0);
	transform:translate3d(-50%,-50%,0);
	width:4.575rem;
	height:6.975rem
}
.first-tips .center-bg {
	position:absolute;
	left:0;
	top:0;
	width:4.575rem;
	height:6.975rem;
	background-size:contain
}
.first-tips .top-arrow {
	right:0;
	top:0
}
.first-tips .bottom-arrow,.first-tips .top-arrow {
	position:absolute;
	width:.825rem;
	height:px22rem(41)
}
.first-tips .bottom-arrow {
	left:0;
	bottom:0
}
.first-text {
	color:#fff;
	font-size:20px;
	text-align:center
}
.cropper-box-canvas {
	width:132px;
	height:132px;
	-webkit-transform:scale(1.43939) translate3d(20.1474px,20.1474px,0) rotate(0deg);
	transform:scale(1.43939) translate3d(20.1474px,20.1474px,0) rotate(0deg)
}
.cropper-box-canvas img {
	width:100%
}
.fade-enter-active,.fade-leave-active {
	-webkit-transition:opacity .5s;
	transition:opacity .5s
}
.fade-enter,.fade-leave-to {
	opacity:0
}
