@charset "UTF-8";

.box.p-upgrade-v3:after,.box.p-upgrade-v3:before {
	top: 0;
	pointer-events: none;
	content: ""
}

.i-upv3-arrow {
	width: 2.4rem;
	height: 2.2rem;
	background-position: 0 -2.9rem
}

.i-upv3-arrow2 {
	width: 1.2rem;
	height: 2.2rem;
	background-position: -2.4rem -2.9rem
}

.i-upv3-bt {
	width: 33.3rem;
	height: 7.3rem;
	background-position: 0 -28.6rem
}

.i-upv3-de1 {
	width: 5rem;
	height: 5rem;
	background-position: -18.15rem -11.2rem
}

.i-upv3-de2 {
	width: 5.1rem;
	height: 5rem;
	background-position: -7.95rem -11.2rem
}

.i-upv3-de3 {
	width: 5rem;
	height: 5rem;
	background-position: -28.15rem -11.2rem
}

.i-upv3-kf1 {
	width: 5.5rem;
	height: 6.3rem;
	background-position: -11.1rem -22.3rem
}

.i-upv3-kf2 {
	width: 6.1rem;
	height: 6.3rem;
	background-position: 0 -22.3rem
}

.i-upv3-kf3 {
	width: 6.7rem;
	height: 6.1rem;
	background-position: -19.8rem -16.2rem
}

.i-upv3-kf4 {
	width: 5.5rem;
	height: 6.1rem;
	background-position: -26.5rem -16.2rem
}

.i-upv3-logo {
	width: 4.4rem;
	height: 4.4rem;
	background-position: -6.5rem -2.9rem
}

.i-upv3-tag {
	width: 7.95rem;
	height: 3.35rem;
	background-position: 0 -11.2rem
}

.i-upv3-txt01 {
	width: 5.5rem;
	height: 4.5rem;
	background-position: -10.9rem -2.9rem
}

.i-upv3-txt02 {
	width: 6.2rem;
	height: 4.6rem;
	background-position: -16.4rem -2.9rem
}

.i-upv3-txt1 {
	width: 24.3rem;
	height: 2.7rem;
	background-position: 0 0
}

.i-upv3-txt2 {
	width: 30.3rem;
	height: 3.5rem;
	background-position: 0 -7.7rem
}

.i-upv3-v1,.i-upv3-v2,.i-upv3-v3,.i-upv3-v4 {
	width: 2.9rem;
	height: 2.9rem
}

.i-upv3-v1 {
	background-position: -3.6rem -2.9rem
}

.i-upv3-v2 {
	background-position: -30.1rem 0
}

.i-upv3-v3 {
	background-position: -24.3rem 0
}

.i-upv3-v4 {
	background-position: -27.2rem 0
}

.i-upv3-xy1,.i-upv3-xy2,.i-upv3-xy3 {
	width: 4.8rem;
	height: 4.8rem
}

.i-upv3-xy1 {
	background-position: 0 -16.2rem
}

.i-upv3-xy2 {
	background-position: -22.6rem -2.9rem
}

.i-upv3-xy3 {
	background-position: -27.4rem -2.9rem
}

.i-upv3-zc1 {
	width: 5rem;
	height: 5rem;
	background-position: -14.8rem -16.2rem
}

.i-upv3-zc2 {
	width: 5rem;
	height: 5rem;
	background-position: -9.8rem -16.2rem
}

.i-upv3-zc3 {
	width: 5rem;
	height: 5rem;
	background-position: -4.8rem -16.2rem
}

.i-upv3-zz1 {
	width: 5rem;
	height: 5rem;
	background-position: -6.1rem -22.3rem
}

.i-upv3-zz2 {
	width: 5.1rem;
	height: 5rem;
	background-position: -13.05rem -11.2rem
}

.i-upv3-zz3 {
	width: 5rem;
	height: 5rem;
	background-position: -23.15rem -11.2rem
}

.i-pls-app,.i-pls-asset,.i-pls-birthday,.i-pls-book,.i-pls-certificate,.i-pls-flash,.i-pls-gift,.i-pls-party,.i-pls-phone,.i-pls-pledge {
	width: 4rem;
	height: 4rem
}



.i-pls-app {
	background-position: 0 0
}

.i-pls-asset {
	background-position: 0 -4rem
}

.i-pls-birthday {
	background-position: 0 -8rem
}

.i-pls-book {
	background-position: 0 -12rem
}

.i-pls-certificate {
	background-position: 0 -16rem
}

.i-pls-credit {
	width: 4rem;
	height: 4rem;
	background-position: 0 -20rem
}

.i-pls-flash {
	background-position: 0 -24rem
}

.i-pls-gift {
	background-position: 0 -28rem
}

.i-pls-party {
	background-position: 0 -32rem
}

.i-pls-phone {
	background-position: 0 -36rem
}

.i-pls-pledge {
	background-position: 0 -40rem
}





.upgrade-v3-index .i-upv3-arrow {
position: absolute;
left: 50%;
transform: translate3d(-50%,0,0);
bottom: 1.8rem;
z-index: 2
}

.upgrade-v3-index .i-upv3-arrow:before {
content: "";
position: absolute;
left: -1.5rem;
right: -1.5rem;
top: -1.5rem;
bottom: -1.5rem
}

.up-v3-cnt,.up-v3-hd {
position: relative;
z-index: 2
}

.up-v3-hd {
padding: 12% 0 0
}

.up-v3-hd .hd-cnt {
padding: 2.2rem  0 0
}

.vip-up-v3-des {

font-size: 1.8rem;
font-weight:bold;
display: inline-block;
color: #f4c887;
}

.up-v3-cnt {
margin: 0rem auto 0;
width: 18rem;
/*height: 170px;*/
display: inline-block;
/*padding: 170px 0 0;*/
opacity: .3
}

.up-v3-cnt .itm {
border-radius: 4px;
overflow: hidden
}

.up-v3-cnt .itm img {
display: block;
vertical-align: top;
width: 100%
}

.up-v3-cnt .itm.itm1,.up-v3-cnt .itm.itm2,.up-v3-cnt .itm.itm3,.up-v3-cnt .itm.itm4 {
position: absolute;
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%
}

.up-v3-cnt .itm.itm1 {
top: 5px;
-webkit-transform: translate3d(0,52px,0);
transform: translate3d(0,52px,0);
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
opacity: .9
}

.up-v3-cnt .itm.itm2 {
top: 10px;
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
opacity: .9
}

.up-v3-cnt .itm.itm3 {
top: 63px;
-webkit-transform: translate3d(0,-53px,0);
transform: translate3d(0,-53px,0);
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
opacity: .9
}

.up-v3-cnt .itm.itm4 {
top: 114px;
-webkit-transform: translate3d(0,-104px,0);
transform: translate3d(0,-104px,0);
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
overflow: hidden;
z-index: 2
}

.up-v3-cnt .itm.itm4 .itm-flash {
position: absolute;
width: 200px;
top: 0
}

.mod-title-a {
display: block;
margin: 3rem auto -.1rem;
color: transparent
}

.index-bd {
padding: 0 2rem
}

.index-bd .mod-block {
background-color: rgba(255,255,255,.04);
border-radius: 5px;
margin-bottom: 2rem
}

.index-bd .mod-block .hd {
padding: 2.5rem 0 3.6rem!important;
line-height: 1
}

.index-bd .mod-block .hd .txt1 {
font-size: 2.7rem;
font-weight: 400;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: .4px
}

@media all and (width:320px),all and (width:375px),all and (width:414px) {
.index-bd .mod-block .hd .txt1 {
font-weight: 500;
-webkit-text-stroke-width: 0
}}

.index-bd .mod-block .hd .txt1 span {
color: #efbf95;
background: -webkit-linear-gradient(-53deg,#fedebd,#efbf95);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent
}

.index-bd .mod-block .hd .txt2 {
color: #a8744e;
font-size: 1.4rem;
margin-top: 1rem
}

.index-bd .mod-block .mod-list-a {
padding-bottom: 2.5rem;
display: -webkit-box;
display: -ms-flexbox;
text-align: center
}

.index-bd .mod-block .mod-list-a .item {
width: 100%;
-webkit-box-flex: 1;
-ms-flex: 1;
line-height: 1;
color: #cb9472
}

.index-bd .mod-block .mod-list-a .item .txt1 {
margin-top: 1rem;
font-size: 1.4rem;
font-weight: 400;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: .4px
}

@media all and (width:320px),all and (width:375px),all and (width:414px) {
.index-bd .mod-block .mod-list-a .item .txt1 {
font-weight: 500;
-webkit-text-stroke-width: 0
}}

.index-bd .mod-block .mod-list-a .item .txt2 {
margin-top: .7rem;
font-size: 1.2rem;
opacity: .7
}

.index-bd .slider-waper {
width: 100%;
overflow: hidden
}

.index-bd .slider-waper .slider-list {
width: 100%;
position: relative
}

.index-bd .slider-waper .slider-list .item {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
box-sizing: border-box
}

.index-bd .slider-waper .list-dots {
padding: 3rem 1.5rem 2.2rem;
text-align: center;
font-size: 0
}

.index-bd .slider-waper .list-dots .item {
display: inline-block;
width: 8px;
height: 8px;
border-radius: 50%;
background-color: #efc9ac;
opacity: .2;
margin: 0 3px
}

.index-bd .slider-waper .list-dots .item.cur {
opacity: 1
}

.index-bd .slider-waper .list-a {
padding-top: 47.7%
}

.index-bd .slider-waper .list-a .item {
position: absolute;
right: 3.7rem;
left: 3.7rem;
width: initial;
height: 100%;
top: 0
}

.index-bd .slider-waper .list-a .item img,.index-bd .slider-waper .list-b .item img,.index-bd .slider-waper .list-c .item img {
width: 100%
}

.index-bd .slider-waper .list-b,.index-bd .slider-waper .list-c {
padding-top: 61.1%
}

.index-bd .slider-waper .list-b .item,.index-bd .slider-waper .list-c .item {
padding: 0 2rem
}

.index-bd .slider-waper .list-c {
padding-top: 51%
}

.index-bd .type-high {
position: relative
}

.index-bd .type-high .i-upv3-tag {
position: absolute;
top: -.2rem;
left: -.5rem;
color: #0f0f12;
font-size: 1.2rem;
font-weight: 400;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: .4px;
line-height: 2.8rem
}

@media all and (width:320px),all and (width:375px),all and (width:414px) {
.index-bd .type-high .i-upv3-tag {
	font-weight: 500;
	-webkit-text-stroke-width: 0
}}

.index-bd .type-high .hd {
	padding: 2.8rem 0 3.6rem!important
}

.index-bd .type-kf .mod-kfs {
	position: relative
}

.index-bd .type-kf .mod-kfs i {
	position: absolute
}

.index-bd .type-kf .mod-kfs .i-upv3-kf2 {
	top: -1.3rem;
	left: 50%;
	margin-left: 4.5rem;
	-webkit-animation: dotsfloat 1.5s -1.3s alternate infinite
}

.index-bd .type-kf .mod-kfs .i-upv3-kf1 {
	top: -1.3rem;
	right: 50%;
	margin-right: 4.5rem;
	-webkit-animation: dotsfloat 1.4s -2s alternate infinite
}

.index-bd .type-kf .mod-kfs .i-upv3-kf4 {
	top: 5.8rem;
	left: 50%;
	margin-left: 8rem;
	-webkit-animation: dotsfloat 1.6s -.6s alternate infinite
}

.index-bd .type-kf .mod-kfs .i-upv3-kf3 {
	top: 5.8rem;
	right: 50%;
	margin-right: 8rem;
	-webkit-animation: dotsfloat 1.2s -1s alternate infinite
}

.index-bd .type-kf .mod-bd-img {
	width: 23.8rem;
	margin-bottom: 1.8rem
}

.index-bd .type-birthday .mod-bd-img {
	display: inline-block;
	margin-top: -1.4rem;
	margin-bottom: 2.4rem;
	width: 26.1rem
}

.index-bd .type-zz .mod-bd-img {
	display: inline-block;
	margin-top: -3.7rem;
	margin-bottom: 1.2rem;
	width: 33.7rem
}

.spe-choose-wrap .spe-choose-cnt {
	overflow: hidden
}

.spe-choose-wrap .spe-com-tt {
	margin: 0 12%
}

.spe-choose-wrap .islider-outer {
	position: relative;
	padding: 45% 0 0;
	width: 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	overflow: hidden
}

.spe-choose-wrap .spe-choose-ul {
	padding: 0 2.8rem;
	position: relative
}

.spe-choose-wrap .islider-html {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	overflow: visible;
	width: auto;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	padding: 0 11%
}

.spe-choose-wrap .islider-html .choose-itm-cnt {
	position: relative;
	width: 100%;
	overflow: hidden;
	border-radius: 5px
}

.spe-choose-wrap .islider-html .choose-itm-cnt .itm-line {
	position: absolute;
	left: 0;
	top: 0;
	width: 200%;
	height: 200%;
	border-width: 1px;
	border-style: solid;
	border-color: #594c45;
	border-radius: 10px;
	-webkit-transform: scale(.5);
	-webkit-transform-origin: 0 0;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	pointer-events: none;
	z-index: 8
}

.spe-choose-wrap .islider-html .choose-itm-cnt .itm-mask {
	display: block;
	pointer-events: none;
	background: #000;
	opacity: .5;
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	-webkit-transition: opacity 1s ease;
	transition: opacity 1s ease
}

.spe-choose-wrap .islider-html.islider-active .itm-mask {
	opacity: 0
}

.spe-choose-wrap .islider-html.turn-fade .itm-mask {
	opacity: .5
}

.spe-choose-wrap .islider-html.turn-light .itm-mask {
	opacity: 0
}

.spe-choose-wrap .islider-html img {
	width: 100%;
	height: 100%;
	display: block;
	vertical-align: top;
	position: relative;
	z-index: 1;
	border-radius: 5px;
	overflow: hidden
}

.spe-choose-wrap .islider-html .rt {
	position: absolute;
	top: 0;
	right: 0;
	width: 45%;
	padding: 1.5rem 1rem 1rem;
	height: 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	background: rgba(0,0,0,.6);
	z-index: 3
}

.spe-choose-wrap .islider-html .rt .num-txt {
	font-size: 1.1rem;
	color: #e2b08b;
	line-height: 1.4rem
}

.spe-choose-wrap .islider-html .rt .tt {
	padding: 1rem 0 0;
	line-height: 1.9rem;
	display: inline-block;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	-webkit-text-stroke-width: .4px;
	font-size: 1.6rem;
	background: -webkit-gradient(linear,left top,right top,from(#edcaa9),to(#f4c193));
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent
}

@media all and (width:320px),all and (width:375px),all and (width:414px) {
	.spe-choose-wrap .islider-html .rt .tt {
		font-weight: 500;
		-webkit-text-stroke-width: 0
	}
}

.spe-choose-wrap .islider-html .rt .des {
	padding: .7rem 0 0;
	font-size: 1.1rem;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	-webkit-text-stroke-width: .4px;
	line-height: 1.5rem;
	color: #a58167
}

@media all and (width:320px),all and (width:375px),all and (width:414px) {
	.spe-choose-wrap .islider-html .rt .des {
		font-weight: 500;
		-webkit-text-stroke-width: 0
	}
}

.spe-choose-wrap .islider-html.cur {
	left: 10%;
	top: 1.7rem;
	opacity: 1;
	width: 80%
}

.spe-choose-wrap .islider-html.itm-lf {
	-webkit-transform: scale(.9) translate3d(-113%,0,0);
	transform: scale(.9) translate3d(-113%,0,0)
}

.spe-choose-wrap .islider-html.itm-rt {
	-webkit-transform: scale(.9) translate3d(113%,0,0);
	transform: scale(.9) translate3d(113%,0,0)
}

.spe-choose-wrap .dot-wrap {
	padding: 3rem 1.5rem 2.2rem;
	text-align: center
}

.spe-choose-wrap .dot-wrap .dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #efc9ac;
	margin: 0 2px;
	opacity: .2;
	display: inline-block
}

.spe-choose-wrap .dot-wrap .dot.cur {
	opacity: 1
}

.animate-expand.up-v3-cnt {
	-webkit-animation: expandShow .8s .3s ease-in-out forwards;
	animation: expandShow .8s .3s ease-in-out forwards
}

.animate-expand .itm4 {
	-webkit-animation: cdFly4 .6s 1.8s ease-in-out forwards;
	animation: cdFly4 .6s 1.8s ease-in-out forwards
}

.animate-expand .itm3 {
	-webkit-animation: cdFly3 .6s 1.8s ease-in-out forwards;
	animation: cdFly3 .6s 1.8s ease-in-out forwards
}

.animate-expand .itm2 {
	-webkit-animation: cdFly2 .6s 1.8s ease-in-out forwards;
	animation: cdFly2 .6s 1.8s ease-in-out forwards
}

.animate-expand .itm1 {
	-webkit-animation: cdFly1 .6s 1.8s ease-in-out forwards;
	animation: cdFly1 .6s 1.8s ease-in-out forwards
}

@-webkit-keyframes expandShow {
	0% {
		opacity: .1
	}

	100% {
		opacity: 1
	}
}

@keyframes expandShow {
	0% {
		opacity: .1
	}

	100% {
		opacity: 1
	}
}

@-webkit-keyframes cdFly4 {
	0% {
		-webkit-transform: translate3D(0,-104px,0) scale(1);
		opacity: 1
	}

	100% {
		-webkit-transform: translate3D(0,13px,0) scale(1);
		opacity: 1
	}
}

@keyframes cdFly4 {
	0% {
		transform: translate3D(0,-104px,0) scale(1);
		opacity: 1
	}

	100% {
		transform: translate3D(0,13px,0) scale(1);
		opacity: 1
	}
}

@-webkit-keyframes cdFly3 {
	0% {
		-webkit-transform: translate3D(0,-53px,0) scale(1);
		opacity: 1
	}

	100% {
		-webkit-transform: translate3D(0,2px,0) scale(.98);
		opacity: 1
	}
}

@keyframes cdFly3 {
	0% {
		transform: translate3D(0,-53px,0) scale(1);
		opacity: 1
	}

	100% {
		transform: translate3D(0,2px,0) scale(.98);
		opacity: 1
	}
}

@-webkit-keyframes cdFly2 {
	0% {
		-webkit-transform: translate3D(0,0,0) scale(1);
		opacity: 1
	}

	100% {
		-webkit-transform: translate3D(0,0,0) scale(.94);
		opacity: 1
	}
}

@keyframes cdFly2 {
	0% {
		transform: translate3D(0,0,0) scale(1);
		opacity: 1
	}

	100% {
		transform: translate3D(0,0,0) scale(.94);
		opacity: 1
	}
}

@-webkit-keyframes cdFly1 {
	0% {
		-webkit-transform: translate3D(0,52px,0) scale(1);
		opacity: 1
	}

	100% {
		-webkit-transform: translate3D(0,-10px,0) scale(.9);
		opacity: 1
	}
}

@keyframes cdFly1 {
	0% {
		transform: translate3D(0,52px,0) scale(1);
		opacity: 1
	}

	100% {
		transform: translate3D(0,-10px,0) scale(.9);
		opacity: 1
	}
}

.itm-flash {
	-webkit-transform: translate3D(-100%,0,0);
	transform: translate3D(-100%,0,0)
}

.itm-flash.ani-cd-flash {
	-webkit-animation: cdFlash 1.3s .3s ease-in-out forwards;
	animation: cdFlash 1.3s .3s ease-in-out forwards
}

@-webkit-keyframes cdFlash {
	0% {
		-webkit-transform: translate3D(-100%,0,0)
	}

	100% {
		-webkit-transform: translate3D(200%,0,0)
	}
}

@keyframes cdFlash {
	0% {
		transform: translate3D(-100%,0,0)
	}

	100% {
		transform: translate3D(200%,0,0)
	}
}

.i-upv3-arrow {
	-webkit-animation: arrowFly 1.5s 2s ease-in-out infinite;
	animation: arrowFly 1.5s 2s ease-in-out infinite
}

@-webkit-keyframes arrowFly {
	0%,100% {
		-webkit-transform: translate3D(-50%,0,0)
	}

	50% {
		-webkit-transform: translate3D(-50%,-8px,0)
	}
}

@keyframes arrowFly {
	0%,100% {
		transform: translate3D(-50%,0,0)
	}

	50% {
		transform: translate3D(-50%,-8px,0)
	}
}

.upgrade-v3-cnt {
	position: relative;
	opacity: 0;
	z-index: 2;
	padding-bottom: 9rem;
	overflow-x: hidden
}

.upgrade-v3-cnt .hd {
	padding: 15% 0 3.4rem
}

.upgrade-v3-cnt .cd-hd {
	display: -webkit-box;
	display: -ms-flexbox;
	padding: 0 2rem
}

.upgrade-v3-cnt .cd-hd .itm {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	padding: 0 0 2.2rem;
	position: relative
}

.upgrade-v3-cnt .cd-hd .itm i {
	-webkit-transform: scale(.84);
	transform: scale(.84);
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%
}

.upgrade-v3-cnt .cd-hd .itm .des {
	padding: .4rem 0 0;
	color: rgba(255,255,255,.4);
	font-size: 1.4rem;
	-webkit-transform: scale(.84);
	transform: scale(.84)
}

.upgrade-v3-cnt .cd-hd .itm.cur i {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%
}