.app {
	-ms-flex: 1 0 0px;
	flex: 1 0 0;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap
}

.app footer {
	height: 50px;
	line-height: 50px;
	border-top: 1px solid #e4e4e4;
	background-color: #fff;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap
}

.app footer a {
	-ms-flex: 1;
	flex: 1;
	text-align: center;
	font-size: 12px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	line-height: 1
}

.app footer a .iconfont {
	display: none;
	font-size: 30px
}

.app footer a .iconfont:first-of-type {
	display: inline-block
}

.app footer a.active .iconfont:first-of-type,.app footer a:active .iconfont:first-of-type {
	display: none
}

.app footer a.active .iconfont:nth-of-type(2),.app footer a:active .iconfont:nth-of-type(2) {
	display: inline-block
}

.m-color {
	color: #ff6a45
}

.search-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 95%;
    height: 2.8rem;
    padding-left: 1.45333rem;
    background-color: #f7f7f7;
    border-radius: 2.4rem;
    margin:0 auto;
}
.btn-search {
    width: 2.85333rem;
    height: 2.85333rem;
    text-align: center;
}
.btn-phb {
    width: 2.85333rem;
    height: 2.85333rem;
    text-align: center;
    font-size: 28px;
    font-weight: 700;
}
.search-bar button i.iconfont
  {
    transform: scaleX(-1);
  }
.image-icon-search {
    width: 2.08rem;
    height: 2.08rem;
    background-image: url(../wap_images/search.png);
}
.image-icon {
	margin-top: 5px;
    display: inline-block;
    line-height: 1;
    vertical-align: middle;
    background-size: contain;
    background-repeat: no-repeat;
}
.search-bar-input {
    flex: 1;
    height: 1.83333rem;
    margin-right: .21333rem;
    font-size: 14px;
    line-height: .53333rem;
    color: #1b1b1b;
    background-color: transparent;
    outline: none;
    border: 0;
}

.nav-activity-bar {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 95%;
    margin:0 auto;
}
.nav-item {
    width:30%;
    height: 5.62667rem;
    border-radius: .16rem;
}


.nav-item img {
    width: 100%;
    height: 100%;
}
.a-color-1 {
	color: #5aaefd
}

.a-color-2 {
	color: #3ebb8c
}

.t-color-1 {
	color: #454545
}

.t-color-2 {
	color: #737373
}

.t-color-3 {
	color: #b5b5b5
}

.fz12 {
	font-size: 12px
}

.fz13 {
	font-size: 13px
}

.fz14 {
	font-size: 14px
}

.fz15 {
	font-size: 15px
}

.fz16 {
	font-size: 16px
}

.fz17 {
	font-size: 17px
}

.fz18 {
	font-size: 18px
}

.fz19 {
	font-size: 19px
}

.fz20 {
	font-size: 20px
}

.index {
	-ms-flex: 1 0 0px;
	flex: 1 0 0;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap
}

.index .banner {
	background-color: #fff
}

.index .banner img {
	width: 100%
}

.index .games {
	background-color: #fff;
	-ms-flex: 0 0 100px;
	flex: 0 0 100px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap
}

.index .games a {
	-ms-flex: 1 0 0px;
	flex: 1 0 0;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	font-size: 12px
}

.index .games a,.index .games a span {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.index .games a span {
	width: 55px;
	height: 55px;
	background-color: #ff6a45;
	border-radius: 20px;
	margin-bottom: 8px;
	color: #fff
}

.index .games a span i.iconfont {
	font-size: 48px
}

.index .platform {
	background-color: #fff;
	margin-top: 15px;
	padding: 0 0 15px;
	font-size: 13px
}

.index .platform h3 {
	height: 32px;
	margin: 8px 0 0
}

.index .platform.hot h3 {
	background: transparent url(../wap_images/hot.png) top/106px 32px no-repeat
}

.index .platform.lol h3 {
	background: transparent url(../wap_images/lol.png) top/106px 32px no-repeat
}

.index .platform.wzry h3 {
	background: transparent url(../wap_images/gok.png) top/106px 32px no-repeat
}

.index .platform.pubg h3 {
	background: transparent url(../wap_images/pubg.png) top/106px 32px no-repeat
}

.index .platform.cj h3 {
	background: transparent url(../wap_images/pgqq.png) top/106px 32px no-repeat
}

.index .platform .accompany-list {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly
}

.index .platform .accompany-list .accompany {
	border-radius: 5px;
	box-shadow: 0 0 8px 0 hsla(0,0%,80%,.4);
	width: 170px;
	height: 205px;
	margin: 0 4px 10px;
	overflow: hidden
}

.index .platform .accompany-list .accompany .user-pic {
	height: 150px;
	position: relative;
	overflow: hidden
}

.index .platform .accompany-list .accompany .user-pic img {
	max-width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%)
}

.index .platform .accompany-list .accompany p {
	margin: 10px 0 0;
	padding: 0 10px
}

.index .platform .accompany-list .accompany p .user-price {
	color: #ff6a45;
	font-weight: 700
}

.index .platform .accompany-list .accompany p .state {
	vertical-align: middle
}

.index .platform .accompany-list .accompany p .state:before {
	content: "";
	display: none;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	position: relative;
	top: -2px;
	margin-right: 5px
}

.index .platform .accompany-list .accompany p .state.online {
	color: #3ebb8c
}

.index .platform .accompany-list .accompany p .state.online:before {
	display: inline-block;
	background-color: #3ebb8c
}

.index .platform .accompany-list .accompany p .state.offline {
	color: #b5b5b5
}

.index .platform .accompany-list .accompany p .state.offline:before {
	display: inline-block;
	background-color: #b5b5b5
}

.index .platform .accompany-list .accompany p span:nth-of-type(2) {
	float: right;
	font-size: 12px
}

.index .platform .load-more {
	text-align: center;
	margin-top: 5px
}

.index .platform .load-more a span,.m-color {
	color: #ff6a45
}

.search {
	background-color: #eaecf2;
	font-size: 13px
}

.search .accompany-list {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
	-ms-flex-line-pack: start;
	align-content: flex-start;
	margin-top: 10px
}

.search .accompany-list .accompany {
	border-radius: 5px;
	background-color: #fff;
	box-shadow: 0 0 8px 0 hsla(0,0%,80%,.4);
	width: 170px;
	height: 205px;
	margin: 0 4px 10px;
	overflow: hidden
}

.search .accompany-list .accompany .user-pic {
	height: 150px;
	position: relative;
	overflow: hidden
}

.search .accompany-list .accompany .user-pic img {
	max-width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%)
}

.search .accompany-list .accompany p {
	margin: 10px 0 0;
	padding: 0 10px
}

.search .accompany-list .accompany p .user-price {
	color: #ff6a45;
	font-weight: 700
}

.search .accompany-list .accompany p .state {
	vertical-align: middle
}

.search .accompany-list .accompany p .state:before {
	content: "";
	display: none;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	position: relative;
	top: -2px;
	margin-right: 5px
}

.search .accompany-list .accompany p .state.online {
	color: #3ebb8c
}

.search .accompany-list .accompany p .state.online:before {
	display: inline-block;
	background-color: #3ebb8c
}

.search .accompany-list .accompany p .state.offline {
	color: #b5b5b5
}

.search .accompany-list .accompany p .state.offline:before {
	display: inline-block;
	background-color: #b5b5b5
}

.search .accompany-list .accompany p span:nth-of-type(2) {
	float: right;
	font-size: 13px
}

.search .filter-conditions:last-of-type {
	margin-bottom: 10px
}

.search .filter-conditions h3 {
	font-size: 15px;
	font-weight: 400;
	margin: 15px 10px
}

.search .filter-conditions .filter-conditions-wrap {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
	-ms-flex-line-pack: justify;
	align-content: space-between
}

.search .buttons {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: stretch;
	align-items: stretch
}

.search .buttons button {
	-ms-flex: 1;
	flex: 1;
	border-top: 1px solid #e4e4e4
}

.search .buttons button:last-of-type {
	color: #fff;
	background-color: #ff6a45;
	border-top: 1px solid #ff6a45
}

.comm-sound {
	display: inline-block
}

.comm-sound .audio {
	display: none
}

.comm-sound .control {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: center;
	align-items: center;
	width: 78px;
	height: 20px;
	border-radius: 10px;
	background: #13bfa6;
	overflow: hidden;
	font-size: 12px
}

.comm-sound .control i {
	font-size: 20px;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	color: #fff
}

.comm-sound .control .play {
	vertical-align: middle;
	cursor: pointer
}

.comm-sound .control .play,.comm-sound .control .time {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none
}

.comm-sound .control .time {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	color: #fff;
	white-space: nowrap;
	transition: all .5s
}

.comm-sound .control .speaker {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	vertical-align: middle
}

.comm-sound .control .speaker.play {
	background-position: 50%
}

.player-detail {
	background-color: #eaecf2
}

.player-detail .mt10 {
	margin-top: 10px
}

.player-detail .player-content {
	position: relative;
	padding-top: 370px
}

.player-detail .player-content .wrap {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	background-color: #eaecf2;
	position: relative;
	z-index: 1
}

.player-detail .banner {
	background-color: #fff;
	position: fixed;
	top: 50px;
	left: 0;
	right: 0;
	height: 370px
}

.player-detail .banner .block {
	height: 370px;
	position: relative
}

.player-detail .banner .block img {
	max-width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%)
}

.player-detail .banner .state {
	width: 45px;
	height: 28px;
	font-size: 16px;
	position: absolute;
	left: 10px;
	bottom: 10px;
	z-index: 1;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.player-detail .banner .state.online {
	color: #fff;
	background-color: #3ebb8c
}

.player-detail .cell-wrap {
	padding: 0 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: center;
	align-items: center
}

.player-detail .cell-wrap> {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	margin-right: 10px
}

.player-detail .cell-wrap>:last-of-type {
	margin-right: 0
}

.player-detail .play-info {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px
}

.player-detail .play-info .name {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap
}

.player-detail .play-info .name i.icon-boy {
	color: #5aaefd
}

.player-detail .play-info .name i.icon-girl {
	color: #f4608e
}

.player-detail .play-info .name div {
	max-width: 64px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden
}

.player-detail .play-info .playing-state {
	-ms-flex: 1;
	flex: 1
}

.player-detail .play-info .playing-state div {
	position: relative
}

.player-detail .play-info .playing-state div img {
	width: 58px;
	height: 27px
}

.player-detail .play-info .playing-state div span {
	position: absolute;
	top: 40%;
	left: 50%;
	transform: translate(-50%,-50%);
	color: #fff;
	white-space: nowrap
}

.player-detail .play-info .follow {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.player-detail .play-info .follow i.iconfont {
	color: #ff6a45;
	margin-top: -5px
}

.player-detail .play-info .follow.followed i.iconfont:before {
	content: "\E6C5"!important
}

.player-detail .skills {
	-ms-flex: 0 0 70px;
	flex: 0 0 70px;
	-ms-flex-align: stretch;
	align-items: stretch
}

.player-detail .skills .skill {
	-ms-flex: 1;
	flex: 1;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: start;
	align-items: flex-start;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly
}

.player-detail .skills .more-skills button {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.player-detail .skills .more-skills button i.iconfont {
	transform: scaleX(-1);
	font-weight: 700
}

.player-detail .description {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	-ms-flex-align: stretch;
	align-items: stretch;
	padding: 10px;
	font-size: 16px
}

.player-detail .description div {
	line-height: 1.5
}

.player-detail .appraisal {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.player-detail .appraisal header {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap
}

.player-detail .appraisal header div {
	-ms-flex: 1;
	flex: 1
}

.player-detail .appraisal header div:nth-of-type(2) {
	text-align: right;
	text-align: end
}

.player-detail .appraisal .comment {
	border-top: 1px solid #e4e4e4;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	padding: 10px;
	margin: 0 -10px
}

.player-detail .appraisal .comment>div {
	margin: 5px 0
}

.player-detail .appraisal .comment .user {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: center;
	align-items: center
}

.player-detail .appraisal .comment .user> {
	margin-right: 10px
}

.player-detail .appraisal .comment .user .user-pic {
	width: 40px;
	height: 40px;
	position: relative;
	border-radius: 50px;
	overflow: hidden
}

.player-detail .appraisal .comment .user .user-pic img {
	max-width: 100%;
	max-height: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%)
}

.player-detail footer {
	height: 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.player-detail footer button {
	-ms-flex: 1;
	flex: 1;
	font-size: 17px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4
}

.player-detail footer button:last-of-type {
	color: #fff;
	border-top: 1px solid #ff6a45;
	background-color: #ff6a45
}

.player-detail .filter-conditions:last-of-type {
	margin-bottom: 10px
}

.player-detail .filter-conditions h3 {
	font-size: 15px;
	font-weight: 400;
	margin: 15px 10px
}

.player-detail .filter-conditions .filter-conditions-wrap {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
	-ms-flex-line-pack: justify;
	align-content: space-between
}

.player-detail .buttons {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: stretch;
	align-items: stretch
}

.player-detail .buttons button {
	-ms-flex: 1;
	flex: 1;
	color: #fff;
	background-color: #ff6a45
}


.fade-enter-active,.fade-leave-active {
	transition: all .1s linear
}

.fade-enter,.fade-leave-to {
	opacity: 0
}

.mui-common-box {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 1;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.mui-common-box .overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,.3)
}

.mui-common-box .box {
	background-color: #fff;
	border-radius: 30px;
	position: relative;
	z-index: 1;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.mui-common-box .box header {
	-ms-flex: 0 0 45px;
	flex: 0 0 45px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.mui-common-box .box .box-content {
	padding: 0 15px;
	line-height: 1.3
}

.mui-common-box .box footer {
	-ms-flex: 0 0 55px;
	flex: 0 0 55px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.pay-box .box {
	transform: translateY(-50%)
}

.pay-box .content .pay-password {
	border: 1px solid #e4e4e4;
	border-radius: 10px;
	overflow: hidden;
	font-size: 0;
	white-space: nowrap
}

.pay-box .content .pay-password span {
	display: inline-block;
	width: 16.66667%;
	height: 45px;
	line-height: 45px;
	background-color: #eaecf2;
	border-left: 1px solid #e4e4e4;
	text-align: center;
	vertical-align: middle
}

.pay-box .content .pay-password span:first-of-type {
	border-left: 0
}

.pay-box .content .pay-password span.active:before {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background-color: #737373;
	vertical-align: middle
}

.pay-box .content .set-password {
	position: absolute;
	right: 75px;
	bottom: 14px;
	font-size: 12px;
	color: #ff6a45
}

.pay-box .content .set-password:hover {
	text-decoration: underline
}

.pay-box .security-keyboard {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	background-color: #eaecf2;
	padding: 3px;
	z-index: 1;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	transform: translateY(0)
}

.pay-box .security-keyboard .key-wrap {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
	-ms-flex-line-pack: distribute;
	align-content: space-around
}

.pay-box .security-keyboard .key-wrap div {
	-ms-flex: 1 0 30%;
	flex: 1 0 30%;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	margin: 3px;
	height: 50px;
	background-color: #fff;
	border-radius: 10px;
	font-weight: 700;
	font-size: 24px
}

.keyboard-slide-enter-active,.keyboard-slide-leave-active {
	transition: all .3s ease
}

.keyboard-slide-enter,.keyboard-slide-leave-to {
	transform: translateY(100%)!important
}


.order-info {
	background-color: #eaecf2
}

.order-info ul {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	margin-top: 10px;
	background-color: #fff;
	border-bottom: 1px solid #e4e4e4;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.order-info ul li {
	padding: 0 10px;
	border-top: 1px solid #e4e4e4;
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.order-info ul li> {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.order-info ul:first-of-type li {
	-ms-flex-pack: justify;
	justify-content: space-between
}

.order-info ul:first-of-type li input[type=text] {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	border: 0
}

.order-info ul:first-of-type li i.icon-boy {
	color: #5aaefd
}

.order-info ul:first-of-type li i.icon-girl {
	color: #f4608e
}

.order-info ul:nth-of-type(2) li .coupons {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-pack: justify;
	justify-content: space-between
}

.order-info ul:nth-of-type(2) li .coupons i.iconfont {
	transform: scaleX(-1);
	-ms-flex-pack: end;
	justify-content: flex-end
}

.order-info ul:nth-of-type(2) li label {
	-ms-flex: 0 0 95px;
	flex: 0 0 95px
}

.order-info ul:nth-of-type(2) li strong {
	color: #d31111
}

.order-info ul:nth-of-type(2) li input[type=text] {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	border: 0;
	border-radius: 5px;
	margin: 5px;
	padding: 0 10px
}

.order-info ul:nth-of-type(3) li label {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-pack: justify;
	justify-content: space-between
}

.order-info ul:nth-of-type(3) li label div {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.order-info ul:nth-of-type(3) li label div i.iconfont {
	margin-right: 5px
}

.order-info ul:nth-of-type(3) li label div i.iconfont.icon-yue {
	color: #ff6a45
}

.order-info ul:nth-of-type(3) li label div i.iconfont.icon-weixinzhifu {
	color: #00b700
}

.order-info ul:nth-of-type(3) li label div i.iconfont.icon-zhifubao {
	color: #25abee
}

.order-info ul:nth-of-type(4) {
	border-bottom: 0
}

.order-info ul:nth-of-type(4) li {
	-ms-flex-pack: justify;
	justify-content: space-between
}

.order-info footer {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	background-color: #fff
}

.order-info footer label {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	padding-left: 10px;
	border-top: 1px solid #e4e4e4
}

.order-info footer button {
	color: #fff;
	background-color: #ff6a45;
	margin-top: -1px;
	margin-right: -10px;
	-ms-flex: 0 0 132px;
	flex: 0 0 132px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.coupon-list {
	background-color: #eaecf2
}

.coupon-list .coupon {
	border-radius: 10px;
	background-color: #fff;
	margin: 10px 10px 0;
	overflow: hidden;
	-ms-flex: 0 0 124px;
	flex: 0 0 124px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.coupon-list .coupon.used {
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%)
}

.coupon-list .coupon .coupon-type {
	-ms-flex: 1 0 0px;
	flex: 1 0 0;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.coupon-list .coupon .coupon-type .discounted-price {
	-ms-flex: 0 0 90px;
	flex: 0 0 90px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	padding: 15px 0 0 25px
}

.coupon-list .coupon .coupon-type .discounted-price span {
	color: #ff6a45
}

.coupon-list .coupon .coupon-type .discounted-price span:first-of-type {
	font-size: 12px;
	display: inline-block;
	width: 35px;
	height: 16px;
	border-radius: 5px;
	border: 1px solid #ff6a45;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.coupon-list .coupon .coupon-type .discounted-price span:nth-of-type(2) {
	font-size: 14px
}

.coupon-list .coupon .coupon-type .discounted-price span:nth-of-type(2) strong {
	font-size: 28px
}

.coupon-list .coupon .coupon-type .description {
	-ms-flex: 1 0 0px;
	flex: 1 0 0;
	padding: 15px 0 0 25px
}

.coupon-list .coupon .coupon-type .description h4 {
	font-size: 16px;
	margin: 0;
	padding-right: 15px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-pack: justify;
	justify-content: space-between
}

.coupon-list .coupon .coupon-type .description h4 i.iconfont {
	font-size: 18px
}

.coupon-list .coupon .coupon-type .description p {
	margin: 5px 0 0;
	font-size: 12px
}

.coupon-list .coupon button {
	-ms-flex: 0 0 38px;
	flex: 0 0 38px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	color: #ff6a45;
	border-top: 1px dashed #e4e4e4;
	font-size: 16px;
	position: relative
}

.coupon-list .coupon button:after,.coupon-list .coupon button:before {
	content: "";
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background-color: #eaecf2;
	position: absolute
}

.coupon-list .coupon button:before {
	top: 0;
	left: 0;
	transform: translate(-50%,-50%)
}

.coupon-list .coupon button:after {
	top: 0;
	right: 0;
	transform: translate(50%,-50%)
}

.coupon-detail {
	background-color: #eaecf2
}

.coupon-detail ul {
	margin-top: 10px;
	background-color: #fff;
	border-bottom: 1px solid #e4e4e4
}

.coupon-detail ul li {
	height: 50px;
	border-top: 1px solid #e4e4e4;
	padding: 0 10px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between
}

.order-list.fixed {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: #eaecf2
}

.order-list dl {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	background-color: #fff;
	margin: 10px 0 0
}

.order-list dl dt {
	float: left;
	width: 50px;
	text-align: center;
	padding-top: 17px
}

.order-list dl dt img {
	width: 32px;
	height: 32px;
	border-radius: 50%
}

.order-list dl dd {
	overflow: hidden;
	padding: 15px 10px 0 0;
	position: relative;
	height: 110px
}

.order-list dl dd p {
	color: #737373;
	margin: 0
}

.order-list dl dd p span:last-of-type {
	float: right
}

.order-list dl dd p:first-of-type {
	font-size: 16px
}

.order-list dl dd p:nth-of-type(2) {
	font-size: 13px;
	margin: 7px 0 0
}

.order-list dl dd p:nth-of-type(3) {
	font-size: 15px;
	/*height: 44px;
	line-height: 44px;
	border-top: 1px solid #e4e4e4;
	position: absolute;*/
	left: 0;
	right: 10px;
	bottom: 0
}

.order-list .filter-conditions:last-of-type {
	margin-bottom: 10px
}

.order-list .filter-conditions h3 {
	font-size: 15px;
	font-weight: 400;
	margin: 15px 10px
}

.order-list .filter-conditions .filter-conditions-wrap {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
	-ms-flex-line-pack: justify;
	align-content: space-between
}

.order-list .buttons {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: stretch;
	align-items: stretch
}

.order-list .buttons button {
	-ms-flex: 1;
	flex: 1;
	border-top: 1px solid #e4e4e4
}

.order-list .buttons button:last-of-type {
	color: #fff;
	background-color: #ff6a45;
	border-top: 1px solid #ff6a45
}


.order-detail {
	background-color: #eaecf2
}

.order-detail .user {
	margin-top: 10px;
	background-color: #fff;
	padding: 0 10px;
	-ms-flex: 0 0 70px;
	flex: 0 0 70px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: stretch;
	align-items: stretch
}

.order-detail .user .user-pic {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.order-detail .user .user-pic img {
	width: 32px;
	height: 32px;
	border-radius: 50%
}

.order-detail .user .user-info {
	margin-left: 10px;
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly
}

.order-detail .user .user-info div {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between
}

.order-detail .user .user-info div button {
	border: 1px solid #ff6a45;
	border-radius: 5px;
	font-size: 12px;
	color: #ff6a45;
	padding: 4px 5px
}

.order-detail .order {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4
}

.order-detail .order .number {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	padding: 0 10px
}

.order-detail .order .info {
	-ms-flex: 0 0 132px;
	flex: 0 0 132px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
	padding: 0 10px;
	border-top: 1px solid #e4e4e4
}

.order-detail .coupon-info {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4
}

.order-detail .coupon-info> {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px
}

.order-detail .coupon-info a,.order-detail .coupon-info div {
	padding: 0 10px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.order-detail .coupon-info a {
	-ms-flex-pack: justify;
	justify-content: space-between;
	border-top: 1px solid #e4e4e4
}

.order-detail .order-progress {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4
}

.order-detail .order-progress> {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	padding: 0 10px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.order-detail .order-progress .current-progress {
	-ms-flex: 0 0 60px;
	flex: 0 0 60px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
	border-top: 1px solid #e4e4e4
}

.order-detail .order-progress .current-progress div {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	color: #b5b5b5;
	font-size: 12px
}

.order-detail .order-progress .current-progress div:before {
	content: "";
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background-color: #b5b5b5;
	margin-bottom: 10px
}

.order-detail .order-progress .current-progress div.active {
	color: #ff6a45
}

.order-detail .order-progress .current-progress div.active:before {
	background-color: #ff6a45
}

.order-detail .order-progress .current-progress span {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	height: 1px;
	background-color: #b5b5b5;
	margin: 20px 10px 0
}

.order-detail .order-progress .current-progress span.active {
	background-color: #ff6a45
}

.order-detail .remarks {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	padding: 0 10px
}

.order-detail .remarks label {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.order-detail .remarks input {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	margin: 10px 0;
	padding: 0 10px;
	border-radius: 5px;
	border: 1px solid #e4e4e4;
	outline: none
}

.order-detail footer {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.order-detail footer.view button {
	-ms-flex: 1;
	flex: 1;
	font-size: 17px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4
}

.order-detail footer.view button:last-of-type {
	color: #fff;
	border-top: 1px solid #ff6a45;
	background-color: #ff6a45
}

.order-detail footer.manage button {
	-ms-flex: 1;
	flex: 1;
	font-size: 17px;
	color: #fff;
	background-color: #5aaefd;
	border-top: 1px solid #5aaefd
}

.order-detail footer.manage button:nth-last-of-type(2) {
	border-top: 1px solid #3ebb8c;
	background-color: #3ebb8c
}

.order-detail footer.manage button:last-of-type {
	border-top: 1px solid #ff6a45;
	background-color: #ff6a45
}

.order-detail .revocation-box .comm-textarea-pure {
	height: 195px
}

.order-detail .revocation-box button {
	margin: 0 5px
}

.order-detail .transferBox p {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}



.personal-center .user {
	-ms-flex: 0 0 136px;
	flex: 0 0 136px;
	display: -ms-flexbox;
	display: flex;


	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	background-color: #fff;
	padding: 0 10px
}

.personal-center .user .user-info,.personal-center .user .user-info a {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.personal-center .user .user-info a .user-pic {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.personal-center .user .user-info a .user-pic img {
	width: 50px;
	height: 50px;
	border-radius: 50%
}

.personal-center .user .user-info a .info {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: stretch;
	align-items: stretch;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin-left: 10px
}

.personal-center .user .user-info a .info>div {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
	padding: 10px 0
}

.personal-center .user .user-info a .info>div div {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.personal-center .user .user-info a .info>div div span {
	display: inline-block;
	height: 16px;
	border-radius: 3px;
	margin-left: 10px;
	color: #fff;
	font-size: 12px;
	position: relative;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.personal-center .user .user-info a .info>div div span i.iconfont {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%) scale(.5)
}

.personal-center .user .user-info a .info>div div span.girl {
	width: 16px;
	background-color: #f4608e
}

.personal-center .user .user-info a .info>div div span.boy {
	width: 16px;
	background-color: #5aaefd
}

.personal-center .user .user-info a .info>div div span.level {
	background-color: #5aaefd;
	padding: 0 3px;
	white-space: nowrap;
	text-align: center
}

.personal-center .user .user-info a .info>div div span.level em {
	display: inline-block;
	transform: scale(.75);
	font-style: normal
}

.personal-center .user .user-info a .info>i {
	-ms-flex-item-align: center;
	align-self: center
}

.personal-center .user .user-wallet {
	-ms-flex: 0 0 55px;
	flex: 0 0 55px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	font-size: 13px;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
	margin: 0 -10px
}

.personal-center .user .user-wallet a {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	margin: 10px 0;
	color: #737373;
	border-right: 1px solid #e4e4e4
}

.personal-center .user .user-wallet a:last-of-type {
	border-right: 0
}

.personal-center .user .user-wallet a strong {
	color: #454545;
	font-size: 15px;
	margin-bottom: 3px
}

.personal-center .user .user-wallet a span {
	width: 62px;
	height: 28px;
	border: 1px solid #737373;
	border-radius: 5px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.personal-center ul {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 10px;
	padding-left: 10px;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
	background-color: #fff
}

.personal-center ul li {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding-right: 10px;
	border-top: 1px solid #e4e4e4
}

.personal-center ul li:first-of-type {
	border-top: 0
}

.personal-center ul li span {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.personal-center ul li span i.iconfont {
	margin-right: 5px
}

.comm-uploader {
	display: inline-block;
	position: relative
}

.comm-uploader div[id] {
	opacity: 0
}

.comm-uploader div[id],.comm-uploader div[id] label {
	position: absolute!important;
	top: 0!important;
	left: 0!important;
	right: 0!important;
	bottom: 0!important
}


.personal-info {
	background-color: #eaecf2
}

.personal-info .user-head {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin-top: 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
	padding: 10px 10px 15px
}

.personal-info .user-head>div {
	-ms-flex: 0 0 160px;
	flex: 0 0 160px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.personal-info .user-head>div .pic-area {
	-ms-flex: 0 0 160px;
	flex: 0 0 160px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	margin-top: 20px;
	border-radius: 10px;
	overflow: hidden
}

.personal-info .user-head>div .pic-area img {
	max-width: 100%;
	max-height: 100%
}

.personal-info .user-head>div .choice-area {
	-ms-flex: 0 0 160px;
	flex: 0 0 160px;
	height: 160px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	margin-top: 20px;
	position: relative
}

.personal-info .user-head>div .choice-area input {
	position: absolute;
	opacity: 0
}

.personal-info .user-head>div .choice-area img {
	max-width: 100%;
	max-height: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%)
}

.personal-info .user-head>div .choice-area p {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	margin: 0 20px;
	position: relative;
	z-index: 1;
	font-size: 11px;
	line-height: 1.5
}

.personal-info .user-head>div .choice-area p i.iconfont {
	font-size: 72px
}

.personal-info .user-head>div .choice-area p span {
	position: relative;
	top: -30px
}

.personal-info ul {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
	padding-left: 10px
}

.personal-info ul li {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
	border-top: 1px solid #e4e4e4;
	padding-right: 10px
}

.personal-info ul li:first-of-type {
	border-top: 0
}

.personal-info ul li img {
	transform: scale(.4) translateX(50%)
}

.personal-info ul li>span:last-of-type {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}


.gender-change{
	background-color: #eaecf2
}

.gender-change ul{
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-bottom: 1px solid #e4e4e4;
	padding-left: 10px
}

.gender-change ul,.gender-change ul li{
	display: -ms-flexbox;
	display: flex;
	align-items: stretch;
	border-top: 1px solid #e4e4e4
}

.gender-change ul li{
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	padding-right: 10px
}

.gender-change ul li:first-of-type {
	border-top: 0
}

.gender-change ul li label{
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between
}

.gender-change .comm-btn{
	margin: 20px 10px 0
}


.text-change {
	background-color: #eaecf2
}

.text-change ul {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-bottom: 1px solid #e4e4e4;
	padding-left: 10px
}

.text-change ul,.text-change ul li {
	display: -ms-flexbox;
	display: flex;
	align-items: stretch;
	border-top: 1px solid #e4e4e4
}

.text-change ul li {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	padding-right: 10px
}

.text-change ul li:first-of-type {
	border-top: 0
}

.text-change ul li input {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
	border: 0;
	padding-right: 10px
}

.text-change .comm-btn {
	margin: 20px 10px 0
}


.my-wallet {
	background-color: #eaecf2
}

.my-wallet .balance {
	-ms-flex: 0 0 100px;
	flex: 0 0 100px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	background-color: #fff;
	border-bottom: 1px solid #e4e4e4
}

.my-wallet .balance strong {
	margin-top: 5px;
	font-size: 22px
}

.my-wallet .record {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 10px;
	padding: 0 10px;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
	background-color: #fff;
	font-size: 15px
}

.my-wallet .record>div {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between
}

.my-wallet .record .title {
	-ms-flex: 0 0 45px;
	flex: 0 0 45px
}

.my-wallet .record .description {
	-ms-flex: 0 0 100px;
	flex: 0 0 100px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	border-top: 1px solid #e4e4e4;
	padding: 5px 0
}

.my-wallet .record .description div {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between
}

.my-wallet .record .remarks {
	border-top: 1px solid #e4e4e4;
	-ms-flex: 0 0 35px;
	flex: 0 0 35px
}

.my-wallet .filter-conditions:last-of-type {
	margin-bottom: 10px
}

.my-wallet .filter-conditions h3 {
	font-size: 15px;
	font-weight: 400;
	margin: 15px 10px
}

.my-wallet .filter-conditions .filter-conditions-wrap {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
	-ms-flex-line-pack: justify;
	align-content: space-between
}

.my-wallet .buttons {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: stretch;
	align-items: stretch
}

.my-wallet .buttons button {

	-ms-flex: 1;
	flex: 1;
	border-top: 1px solid #e4e4e4
}

.my-wallet .buttons button:last-of-type {
	color: #fff;
	background-color: #ff6a45;
	border-top: 1px solid #ff6a45
}


.my-recharge {
	background-color: #eaecf2
}

.my-recharge .balance {
	-ms-flex: 0 0 100px;
	flex: 0 0 100px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	background-color: #fff;
	border-bottom: 1px solid #e4e4e4
}

.my-recharge .balance strong {
	margin-top: 5px;
	font-size: 22px
}

.my-recharge .amount {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 10px;
	background-color: #fff
}

.my-recharge .amount .title {
	-ms-flex: 0 0 45px;
	flex: 0 0 45px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	padding: 0 10px;
	border-bottom: 1px solid #e4e4e4
}

.my-recharge .amount .type-amount {
	-ms-flex: 0 0 45px;
	flex: 0 0 45px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 15px;
	margin-bottom: 15px;
	padding: 0 10px;
	position: relative
}

.my-recharge .amount .type-amount input {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	padding: 0 35px 0 10px;
	border: 1px solid #e4e4e4;
	border-radius: 10px;
	font-size: 20px
}

.my-recharge .amount .type-amount span {
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	font-size: 20px
}

.my-recharge .amount .choice-amount {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
	padding-bottom: 10px
}

.my-recharge .amount .choice-amount label {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	font-size: 20px;
	margin: 10px 10px 0;
	position: relative
}

.my-recharge .amount .choice-amount label input {
	position: absolute;
	opacity: 0
}

.my-recharge .amount .choice-amount label span {
	width: 108px;
	height: 72px;
	border: 1px solid #e4e4e4;
	border-radius: 10px;
	transition: all .1s linear;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.my-recharge .amount .choice-amount label input:checked~span {
	border-color: #ff6a45;
	background-color: #ff6a45;
	color: #fff
}

.my-recharge ul {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	margin-top: 10px;
	padding-left: 10px;
	background-color: #fff;
	border-bottom: 1px solid #e4e4e4;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.my-recharge ul li {
	padding: 0 10px 0 0;
	border-top: 1px solid #e4e4e4;
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.my-recharge ul li> {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.my-recharge ul li label {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-pack: justify;
	justify-content: space-between
}

.my-recharge ul li label div {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.my-recharge ul li label div i.iconfont {
	margin-right: 5px
}

.my-recharge ul li label div i.iconfont.icon-yue {
	color: #ff6a45
}

.my-recharge ul li label div i.iconfont.icon-weixinzhifu {
	color: #00b700
}

.my-recharge ul li label div i.iconfont.icon-zhifubao {
	color: #25abee
}

.my-recharge footer {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	background-color: #fff
}

.my-recharge footer button {
	color: #fff;
	background-color: #ff6a45;
	margin-top: -1px;
	margin-right: -10px;
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}



.my-coupons {
	background-color: #eaecf2
}

.my-coupons .coupon {
	border-radius: 10px;
	background-color: #fff;
	margin: 10px 10px 0;
	overflow: hidden;
	position: relative;
	-ms-flex: 0 0 124px;
	flex: 0 0 124px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.my-coupons .coupon.used:after {
	content: "";
	width: 120px;
	height: 85px;
	background: transparent url(../assets/images/coupon-used.c38006a5973a.png) 50%/cover no-repeat;
	position: absolute;
	right: 15px;
	bottom: 0
}

.my-coupons .coupon.expired {
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%)
}

.my-coupons .coupon.expired:after {
	content: "";
	width: 120px;
	height: 85px;
	background: transparent url(../assets/images/coupon-expired.0261db0de8a3.png) 50%/cover no-repeat;
	position: absolute;
	right: 15px;
	bottom: 0
}

.my-coupons .coupon .coupon-type {
	-ms-flex: 1 0 0px;
	flex: 1 0 0;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.my-coupons .coupon .coupon-type .discounted-price {
	-ms-flex: 0 0 90px;
	flex: 0 0 90px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	padding: 15px 0 0 25px
}

.my-coupons .coupon .coupon-type .discounted-price span {
	color: #ff6a45
}

.my-coupons .coupon .coupon-type .discounted-price span:first-of-type {
	font-size: 12px;
	display: inline-block;
	width: 35px;
	height: 16px;
	border-radius: 5px;
	border: 1px solid #ff6a45;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.my-coupons .coupon .coupon-type .discounted-price span:nth-of-type(2) {
	font-size: 14px
}

.my-coupons .coupon .coupon-type .discounted-price span:nth-of-type(2) strong {
	font-size: 28px
}

.my-coupons .coupon .coupon-type .description {
	-ms-flex: 1 0 0px;
	flex: 1 0 0;
	padding: 15px 0 0 25px
}

.my-coupons .coupon .coupon-type .description h4 {
	font-size: 16px;
	margin: 0;
	padding-right: 15px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-pack: justify;
	justify-content: space-between
}

.my-coupons .coupon .coupon-type .description h4 i.iconfont {
	font-size: 18px
}

.my-coupons .coupon .coupon-type .description p {
	margin: 5px 0 0;
	font-size: 12px
}

.my-coupons .coupon .data-time {
	-ms-flex: 0 0 38px;
	flex: 0 0 38px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	padding-left: 30px;
	color: #b5b5b5;
	border-top: 1px dashed #e4e4e4;
	font-size: 16px;
	position: relative
}

.my-coupons .coupon .data-time:after,.my-coupons .coupon .data-time:before {
	content: "";
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background-color: #eaecf2;
	position: absolute
}

.my-coupons .coupon .data-time:before {
	top: 0;
	left: 0;
	transform: translate(-50%,-50%)
}

.my-coupons .coupon .data-time:after {
	top: 0;
	right: 0;
	transform: translate(50%,-50%)
}



.account-security {
	background-color: #eaecf2
}

.account-security ul {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
	padding-left: 10px
}

.account-security ul li {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
	border-top: 1px solid #e4e4e4;
	padding-right: 10px
}

.account-security ul li:first-of-type {
	border-top: 0
}

.account-security ul li label {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.account-security ul li label .iconfont {
	color: #b5b5b5;
	margin-right: 3px
}


.change-password {
	background-color: #eaecf2
}

.change-password ul {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-bottom: 1px solid #e4e4e4;
	padding-left: 10px
}

.change-password ul,.change-password ul li {
	display: -ms-flexbox;
	display: flex;
	align-items: stretch;
	border-top: 1px solid #e4e4e4
}

.change-password ul li {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	padding-right: 10px
}

.change-password ul li:first-of-type {
	border-top: 0
}

.change-password ul li input {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
	border: 0;
	padding-right: 10px
}

.change-password .comm-btn {
	margin: 20px 10px 0
}



.bind-phone {
	background-color: #eaecf2
}

.bind-phone ul {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-bottom: 1px solid #e4e4e4;
	padding-left: 10px
}

.bind-phone ul,.bind-phone ul li {
	display: -ms-flexbox;
	display: flex;
	align-items: stretch;
	border-top: 1px solid #e4e4e4
}

.bind-phone ul li {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	padding-right: 10px
}

.bind-phone ul li:first-of-type {
	border-top: 0
}

.bind-phone ul li label {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	padding-right: 30px
}

.bind-phone ul li input {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
	border: 0;
	padding-right: 10px
}

.bind-phone ul li a {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	color: #ff6a45;
	text-decoration: underline
}

.bind-phone .comm-btn {
	margin: 20px 10px 0
}

.bind-phone .buttons {
	margin: 20px 10px 0;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between
}

.bind-phone .buttons .comm-btn {
	-ms-flex: 1 1 50%;
	flex: 1 1 50%;
	margin: 0 5px
}



.pay-password {
	background-color: #eaecf2
}

.pay-password ul {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-bottom: 1px solid #e4e4e4;
	padding-left: 10px
}

.pay-password ul,.pay-password ul li {
	display: -ms-flexbox;
	display: flex;
	align-items: stretch;
	border-top: 1px solid #e4e4e4
}

.pay-password ul li {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	padding-right: 10px
}

.pay-password ul li:first-of-type {
	border-top: 0
}

.pay-password ul li input {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
	border: 0;
	padding-right: 10px
}

.pay-password ul li a {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	color: #ff6a45;
	text-decoration: underline
}

.pay-password .comm-btn {
	margin: 20px 10px 0
}


.customer-service {
	background-color: #eaecf2
}

.customer-service ul {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
	padding-left: 10px
}

.customer-service ul li {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
	border-top: 1px solid #e4e4e4;
	padding-right: 10px
}

.customer-service ul li:first-of-type {
	border-top: 0
}

.customer-service ul li label {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.customer-service ul li label .iconfont {
	color: #b5b5b5;
	margin-right: 3px
}



.suggest {
	background-color: #eaecf2
}

.suggest .comm-textarea {
	margin: 10px
}

.suggest footer {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	background-color: #fff
}

.suggest footer button {
	color: #fff;
	background-color: #ff6a45;
	margin-top: -1px;
	margin-right: -10px;
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}



.my-player-info {
	background-color: #eaecf2
}

.my-player-info ul {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
	padding-left: 10px
}

.my-player-info ul li {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
	border-top: 1px solid #e4e4e4;
	padding-right: 10px
}

.my-player-info ul li:first-of-type {
	border-top: 0
}

.my-player-info ul li label {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.my-player-info ul li label .iconfont {
	color: #b5b5b5;
	margin-right: 3px
}

.my-player-info ul li img {
	transform: scale(.4) translateX(50%)
}


.my-player-gallery {
	background-color: #eaecf2
}

.my-player-gallery .gallery {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
	-ms-flex-line-pack: start;
	align-content: flex-start;
	padding-top: 5px;
	padding-bottom: 20px
}

.my-player-gallery .gallery div {
	-ms-flex: 0 0 160px;
	flex: 0 0 160px;
	height: 160px;
	border-radius: 10px;
	overflow: hidden;
	position: relative;
	background-color: #fff;
	margin: 15px 8px 0
}

.my-player-gallery .gallery div img {
	max-width: 100%;
	max-height: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%)
}



.my-service-manage {
	background-color: #eaecf2;
	font-size: 16px
}

.my-service-manage ul {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
	padding-left: 10px
}

.my-service-manage ul li {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
	border-top: 1px solid #e4e4e4;
	padding-right: 10px
}

.my-service-manage ul li.ai-s {
	-ms-flex-align: stretch;
	align-items: stretch
}

.my-service-manage ul li:first-of-type {
	border-top: 0
}

.my-service-manage ul li:first-of-type button {
	color: #fff;
	background-color: #ff6a45;
	border-top: 1px solid #ff6a45;
	padding: 2px 10px;
	border-radius: 5px
}

.my-service-manage ul li:nth-of-type(2) {
	-ms-flex: 0 0 65px;
	flex: 0 0 65px
}

.my-service-manage ul li:nth-of-type(2) img {
	width: 50px;
	height: 50px;
	border-radius: 10px
}

.my-service-manage ul li:nth-of-type(3) {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	-ms-flex-align: stretch;
	align-items: stretch;
	padding: 10px 10px 10px 0
}

.my-service-manage ul li:nth-of-type(3) div {
	line-height: 1.5
}

.my-service-manage ul li label {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between
}

.my-service-manage ul li .comm-checkbox {
	-ms-flex: 1;
	flex: 1
}

.my-service-manage ul li input[type=text] {
	border: 0;
	background-color: #f7f7f7;
	border-radius: 5px;
	margin: 5px;
	padding: 10px;
	-ms-flex-item-align: stretch;
	align-self: stretch;
	width: 100px
}

.my-service-manage .filter-conditions:last-of-type {
	margin-bottom: 10px
}

.my-service-manage .filter-conditions h3 {
	font-size: 15px;
	font-weight: 400;
	margin: 15px 10px
}

.my-service-manage .filter-conditions .filter-conditions-wrap {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
	-ms-flex-line-pack: justify;
	align-content: space-between
}

.my-service-manage .buttons {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: stretch;
	align-items: stretch
}

.my-service-manage .buttons button {
	-ms-flex: 1;
	flex: 1;
	color: #fff;
	background-color: #ff6a45;
	border-top: 1px solid #ff6a45
}

.my-service-manage footer {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	background-color: #fff
}

.my-service-manage footer button {
	color: #fff;
	background-color: #ff6a45;
	margin-top: -1px;
	margin-right: -10px;
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}



.my-order-manage {
	background-color: #eaecf2
}

.my-order-manage dl {
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	background-color: #fff;
	margin: 10px 0 0
}

.my-order-manage dl dt {
	float: left;
	width: 50px;
	text-align: center;
	padding-top: 17px
}

.my-order-manage dl dt img {
	width: 32px;
	height: 32px;
	border-radius: 50%
}

.my-order-manage dl dd {
	overflow: hidden;
	padding: 15px 10px 0 0;
	position: relative;
	height: 110px
}

.my-order-manage dl dd p {
	color: #737373;
	margin: 0
}

.my-order-manage dl dd p span:last-of-type {
	float: right
}

.my-order-manage dl dd p:first-of-type {
	font-size: 16px
}

.my-order-manage dl dd p:nth-of-type(2) {
	font-size: 13px;
	margin: 7px 0 0
}

.my-order-manage dl dd p:nth-of-type(3) {
	font-size: 15px;
	height: 44px;
	line-height: 44px;
	border-top: 1px solid #e4e4e4;
	position: absolute;
	left: 0;
	right: 10px;
	bottom: 0
}

.my-order-manage .filter-conditions:last-of-type {
	margin-bottom: 10px
}

.my-order-manage .filter-conditions h3 {
	font-size: 15px;
	font-weight: 400;
	margin: 15px 10px
}

.my-order-manage .filter-conditions .filter-conditions-wrap {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
	-ms-flex-line-pack: justify;
	align-content: space-between
}

.my-order-manage .buttons {
	-ms-flex: 0 0 50px;
	flex: 0 0 50px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: stretch;
	align-items: stretch
}

.my-order-manage .buttons button {
	-ms-flex: 1;
	flex: 1;
	color: #fff;
	background-color: #ff6a45;
	border-top: 1px solid #ff6a45
}



.login ul {
	margin: 10px 0 0;
	padding: 0 0 0 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.login ul li {
	-ms-flex: 0 0 60px;
	flex: 0 0 60px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	position: relative;
	border-bottom: 1px solid #e4e4e4
}

.login ul li:last-of-type {
	border-bottom: 0
}

.login ul li input {
	border: 0;
	-ms-flex: 1;
	flex: 1;
	font-size: 16px;
	padding: 0 10px 0 30px
}

.login .button-panel {
	margin: 25px 10px 15px
}

.login .other-panel {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	margin: 0 10px
}

.login .other-panel div {
	-ms-flex: 1;
	flex: 1;
	font-size: 14px
}

.login .other-panel div:last-of-type {
	text-align: right
}



.register {
	background-color: #eaecf2
}

.register ul {
	margin: 10px 0 0;
	padding: 0 0 0 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.register ul li {
	-ms-flex: 0 0 60px;
	flex: 0 0 60px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	position: relative;
	border-bottom: 1px solid #e4e4e4;
	padding-right: 10px
}

.register ul li:last-of-type {
	border-bottom: 0
}

.register ul li input {
	border: 0;
	-ms-flex: 1;
	flex: 1;
	font-size: 16px;
	padding: 0 10px 0 0
}

.register ul li span {
	width: 88px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.register ul li span img {
	max-width: 100%;
	max-height: 100%
}

.register ul li a {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	font-size: 15px
}

.register .button-panel {
	margin: 25px 10px 15px
}

.register .other-panel {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-pack: center;
	justify-content: center;
	font-size: 14px
}



.retrieve-password {
	background-color: #eaecf2
}

.retrieve-password ul {
	margin: 10px 0 0;
	padding: 0 0 0 10px;
	background-color: #fff;
	border-top: 1px solid #e4e4e4;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: stretch;
	align-items: stretch
}

.retrieve-password ul li {
	-ms-flex: 0 0 60px;
	flex: 0 0 60px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	position: relative;
	border-bottom: 1px solid #e4e4e4;
	padding-right: 10px
}

.retrieve-password ul li:last-of-type {
	border-bottom: 0
}

.retrieve-password ul li input {
	border: 0;
	-ms-flex: 1;
	flex: 1;
	font-size: 16px;
	padding: 0 10px 0 0
}

.retrieve-password ul li span {
	width: 88px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.retrieve-password ul li span img {
	max-width: 100%;
	max-height: 100%
}

.retrieve-password ul li a {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	font-size: 15px
}

.retrieve-password .button-panel {
	margin: 25px 10px 15px
}

.retrieve-password .other-panel {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-pack: center;
	justify-content: center;
	font-size: 14px
}


.service-agreement .content {
	margin: 10px 0 0;
	padding: 0 10px;
	background-color: #fff;
	font-size: 14px
}

.service-agreement .content h4 {
	font-size: 14px;
	margin: 10px 0;
	color: #454545
}

.service-agreement .content span,.service-agreement .content strong {
	color: #ff6a45
}

.service-agreement .content p {
	margin: 10px 0;
	line-height: 1.8;
	text-indent: 2em
}

.mui-container {
	-ms-flex: 1 0 0px;
	flex: 1 0 0;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap
}

.mui-container.fixed-container {
	position: fixed;
	width: 100%;
	height: 100%
}


.mui-header {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	background-color: #fff;
	font-size: 18px;
	position: relative;
	border-bottom: 1px solid #e4e4e4;
	padding: 0 5px
}

.mui-title {
	-ms-flex: 1;
	flex: 1;
	-ms-flex-order: 5;
	order: 5
}

.mui-title .mui-title-content {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 0 90px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.mui-title .mui-title-content div {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden
}

.mui-buttons {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	position: relative;
	font-size: 14px
}

.mui-buttons.start {
	-ms-flex-order: 1;
	order: 1;
	-ms-flex-pack: start;
	justify-content: flex-start
}

.mui-buttons.end {
	-ms-flex-order: 10;
	order: 10;
	-ms-flex-pack: end;
	justify-content: flex-end
}

.mui-button {
	color: currentColor;
	padding: 0;
	border: 0;
	background-color: transparent;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.mui-back-button .iconfont {
	font-size: 18px;
	font-weight: 700
}


.mui-content {
	-ms-flex: 1 0 0px;
	flex: 1 0 0;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	overflow-y: auto;
	overflow-x: hidden
}


.mui-tabs {
	-ms-flex: 0 0 45px;
	flex: 0 0 45px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	height: 45px;
	background-color: #fff;
	border-bottom: 1px solid #e4e4e4
}


.mui-tab {
	-ms-flex: 1;
	flex: 1;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	-ms-flex-pack: center;
	justify-content: center
}

.mui-tab button {
	padding: 0;
	border: 0;
	background-color: transparent;
	padding: 0 10px;
	border-bottom: 2px solid transparent
}

.mui-tab.active button {
	color: #ff6a45;
	border-bottom-color: #ff6a45
}



.mui-slide-panel {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 1
}

.mui-slide-panel .overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,.5)
}

.mui-slide-panel .mui-slide-content {
	position: absolute;
	top: 0;
	left: 40px;
	right: 0;
	bottom: 0;
	background-color: #fff;
	transform: translateZ(0);
	transform: translateX(0);
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	overflow-y: auto;
	overflow-x: hidden
}

.fade-enter-active,.fade-leave-active {
	transition: opacity .3s
}

.fade-enter,.fade-leave-to {
	opacity: 0!important
}

.slide-enter-active,.slide-leave-active {
	transition: all .3s ease-out
}

.slide-enter,.slide-leave-to {
	transform: translateX(100%)!important
}


.mui-group {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
	-ms-flex-line-pack: justify;
	align-content: space-between;
	background-color: #fff
}


.mui-filter-button {
	color: currentColor;
	padding: 0;
	border: 0;
	background-color: transparent;
	position: relative;
	font-size: 12px;
	margin: 5px
}

.mui-filter-button input {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0
}

.mui-filter-button span {
	width: 100px;
	height: 30px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	background-color: #efefef;
	border: 1px solid #efefef;
	border-radius: 10px
}

.mui-filter-button span i.iconfont {
	display: none;
	font-size: 18px;
	position: relative;
	top: -1px
}

.mui-filter-button input:checked~span {
	color: #ff6a45;
	border-color: #ff6a45;
	background-color: transparent
}

.mui-filter-button input:checked~span i.iconfont {
	display: inline
}


.mui-stepper {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.mui-stepper span {
	margin: 0 10px
}

.mui-stepper button {
	width: 35px;
	height: 35px;
	color: #fff;
	background-color: #ff6a45;
	border-radius: 5px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.mui-stepper button[disabled] {
	background-color: #b5b5b5
}

.loading-wrap {
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.4);
	z-index: 10;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.loading-wrap .loading {
	-ms-flex: 0 0 60px;
	flex: 0 0 60px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-flow: column nowrap;
	flex-flow: column nowrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
	color: hsla(0,0%,100%,.8)
}

.loading-wrap .sp {
	width: 32px;
	height: 32px;
	clear: both
}

.loading-wrap .sp-circle {
	border: 4px solid rgba(0,0,0,.25);
	border-top: 4px solid #fff;
	border-radius: 50%;
	animation: spCircRot--24d058e6 .6s infinite linear
}

@keyframes spCircRot--24d058e6 {
	0% {
		transform: rotate(0deg)
	}

	to {
		transform: rotate(359deg)
	}
}