@font-face {
    font-family: 'iconfont';
    /* Project id 265676 */
    src: url('//at.alicdn.com/t/font_265676_gy6a9w7gy17.woff2?t=1624861631013') format('woff2'), url('//at.alicdn.com/t/font_265676_gy6a9w7gy17.woff?t=1624861631013') format('woff'), url('//at.alicdn.com/t/font_265676_gy6a9w7gy17.ttf?t=1624861631013') format('truetype');
}

.iconfont {
    font-family: "iconfont" !important;
    font-size: 14px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
    font-weight: normal;
}

[v-cloak] {
    display: none;
}

html * {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

html {
    font-size: 52% !important;
}

@media only screen and (min-width: 330px) {
    html {
        font-size: 62.5% !important;
    }
}

@media only screen and (min-width: 370px) {
    html {
        font-size: 64% !important;
    }
}

@media only screen and (min-width: 414px) {
    html {
        font-size: 66% !important;
    }
}

html {
    font-size: 62.5%;
}

html * {
    box-sizing: border-box;
}

body {
    font-family: "微软雅黑", arial;
    font-size: 14px;
    color: #4c4c4c;
    margin: 0;
    padding: 0;
}

ol,
ul,
dl,
li,
dt,
dl,
dd {
    list-style: none;
    margin: 0;
    padding: 0;
}

a {
    color: #4c4c4c;
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

.text-center {
    text-align: center;
}

.clear {
    clear: both;
}

.hide {
    display: none !important;
}

.center-clock {
    margin: 0 auto;
    display: block;
}

button {
    border: none;
    outline: none !important;
}

.pm {
    background-color: #faf8f7;
    width: 100%;
    height: 100%;
    position: fixed;
    overflow: auto;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
}

.center-block {
    display: block;
    margin: 0 auto;
}

.text-center {
    text-align: center;
}

.img-res {
    width: 100%;
}

.font-12 {
    font-size: 1.2rem;
}

.font-13 {
    font-size: 1.3rem;
}

.font-14 {
    font-size: 1.4rem;
}

.font-15 {
    font-size: 1.5rem;
}

.font-16 {
    font-size: 1.6rem;
}

.font-18 {
    font-size: 1.8rem;
}

.font-main {
    color: #333;
}

.font-less {
    color: #999;
}

.bg-white {
    background-color: #fff;
}

/*flex*/
.flex-1 {
    -webkit-box-flex: 1;
    /* OLD - iOS 6-, Safari 3.1-6 */
    -moz-box-flex: 1;
    /* OLD - Firefox 19- */
    -webkit-flex: 1;
    /* Chrome */
    -ms-flex: 1;
    /* IE 10 */
    flex: 1;
}

.row {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
    flex-flow: row;
    -webkit-flex-flow: row;
    -moz-flex-flow: row;
    flex-direction: row;
    margin-left: 0;
    margin-right: 0;
}

.column {
    display: box;
    /* OLD - Android 4.4- */
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
    /* 09版 */
    -webkit-box-orient: vertical;
    /* 12版 */
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
}

.flex-center {
    -webkit-box-align: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    align-items: center;
}

.flex-bottom {
    -webkit-box-align: end;
    -moz-align-items: flex-end;
    -webkit-align-items: flex-end;
    align-items: flex-end;
}

.btn {
    border: none;
    outline: none;
    text-align: center;
    background-color: inherit;
}

.flex-wrap {
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
}

.overflow-y {
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
}

.overflow-y::-webkit-scrollbar {
    display: none;
}

.p-pmblack {
    background-color: #faf8f7;
    width: 100%;
    height: 100%;
    position: fixed;
    overflow: auto;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 4;
}

.text-over {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fc-b-main {
    color: #4d4d4d;
}

.fc-b-less {
    color: #999999;
}

.holl-btn {
    border-radius: 999px;
    background: rgba(0, 0, 0, 0);
    border: none;
    outline: none;
    position: relative;
    transition: all 0.3s;
    color: #ff7f24;
}

.holl-btn::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #ff7f24;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-radius: 999px;
}

.holl-btn:active {
    background-color: #ff7f24;
    color: #fff;
}

.holl-btnwhite {
    border-radius: 999px;
    background: rgba(0, 0, 0, 0);
    border: none;
    outline: none;
    position: relative;
    transition: all 0.3s;
    color: #4c4c4c;
}

.holl-btnwhite::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #cccccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-radius: 999px;
}

.holl-btnwhite:active {
    background-color: #eaeaea;
    color: #fff;
}

.nomalbtn {
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.nomalbtn:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.nomalbtn.defbtn {
    background-image: none;
    background-color: #cccccc;
    color: #fff;
    box-shadow: none;
}

.green-btn {
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    background-color: #3cc51f;
    outline: none;
}

.green-btn:active {
    background-color: #3dea18;
}

@keyframes optyin {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@-ms-keyframes optyin {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@-webkit-keyframes optyin {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@mixin optyin {
    animation: 0.4s optyin forwards;
    -webkit-animation: 0.4s optyin forwards;
}
/*底部消失*/
@keyframes bothide {
    from {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
    }
}

@-webkit-keyframes bothide {
    from {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
    }
}

@-ms-keyframes bothide {
    from {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
    }
}

@-moz-keyframes bothide {
    from {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
    }
}

/*底部消失*/
/*底部进入*/
@keyframes botshow {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
}

@-webkit-keyframes botshow {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
}

@-ms-keyframes botshow {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
}

@-moz-keyframes botshow {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
}

/*顶部进入*/
@keyframes topshow {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 0%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 100%, 0);
    }
}

@-webkit-keyframes topshow {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 0%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 100%, 0);
    }
}

@-ms-keyframes topshow {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 0%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 100%, 0);
    }
}

@-moz-keyframes topshow {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 0%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 100%, 0);
    }
}

/*顶部退出*/
@keyframes tophide {
    from {
        opacity: 1;
        -webkit-transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 0%, 0);
    }
}

@-webkit-keyframes tophide {
    from {
        opacity: 1;
        -webkit-transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 0%, 0);
    }
}

@-ms-keyframes tophide {
    from {
        opacity: 1;
        -webkit-transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 0%, 0);
    }
}

@-moz-keyframes tophide {
    from {
        opacity: 1;
        -webkit-transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 0%, 0);
    }
}

/*ZOOMIN*/
@-webkit-keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
    50% {
        opacity: 1;
    }
}

@keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
    50% {
        opacity: 1;
    }
}

/*ZOOMIN*/
@-webkit-keyframes zoomout {
    from {
        opacity: 1;
    }
    100% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
}

@keyframes zoomout {
    from {
        opacity: 1;
    }
    100% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
}

@-webkit-keyframes tada {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
    10%,
    20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    }
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    }
    40%,
    60%,
    80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    }
    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes tada {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
    10%,
    20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    }
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    }
    40%,
    60%,
    80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    }
    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes righthide {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

@-webkit-keyframes righthide {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

@keyframes rightshow {
    from {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes rightshow {
    from {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@mixin righthide {
    animation: righthide 0.3s forwards !important;
    -webkit-animation: righthide 0.3s forwards !important;
}
@keyframes photoshow {
    from {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes photoshow {
    from {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes photohide {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
}

@-webkit-keyframes photohide {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
}

@mixin photohide() {
    animation: photohide 0.3s forwards !important;
    -webkit-animation: photohide 0.3s forwards !important;
}
.righthide {
    @include photohide;
}

@keyframes topshow {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
}

@-webkit-keyframes topshow {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
}

@-moz-keyframes topshow {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
}

@-ms-keyframes topshow {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
}

@keyframes tophide {
    from {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
    }
}

@-webkit-keyframes tophide {
    from {
        opacity: 1;
        -webkit-transform: translate3d(0, 0%, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
    }
}

@keyframes zoominout {
    0% {
        -webkit-transform: scale(1);
    }
    25% {
        -webkit-transform: scale(1.25);
    }
    50% {
        -webkit-transform: scale(1);
    }
    75% {
        -webkit-transform: scale(1.25);
    }
    100% {
        -webkit-transform: scale(1);
    }
}

@-webkit-keyframes zoominout {
    0% {
        -webkit-transform: scale(1);
    }
    25% {
        -webkit-transform: scale(1.25);
    }
    50% {
        -webkit-transform: scale(1);
    }
    75% {
        -webkit-transform: scale(1.25);
    }
    100% {
        -webkit-transform: scale(1);
    }
}

@keyframes fanzhuan {
    0% {
        -webkit-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }
    25% {
        -webkit-transform: rotateY(-180deg);
        transform: rotateY(-180deg);
    }
    50% {
        -webkit-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }
    75% {
        -webkit-transform: rotateY(180deg);
        transform: rotateY(180deg);
    }
    100% {
        -webkit-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }
}

@-webkit-keyframes fanzhuan {
    0% {
        -webkit-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }
    25% {
        -webkit-transform: rotateY(-180deg);
        transform: rotateY(-180deg);
    }
    50% {
        -webkit-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }
    75% {
        -webkit-transform: rotateY(180deg);
        transform: rotateY(180deg);
    }
    100% {
        -webkit-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }
}

.zoomin-enter-active {
    animation: zoomIn 0.4s forwards;
    -webkit-animation: zoomIn 0.4s forwards;
}

.botin-enter-active {
    animation: botshow 0.4s forwards;
    -webkit-animation: botshow 0.4s forwards;
}

.botin-leave-active {
    animation: bothide 0.4s forwards;
    -webkit-animation: bothide 0.4s forwards;
}

.topin-enter-active {
    animation: topshow 0.4s forwards;
    -webkit-animation: topshow 0.4s forwards;
}

.topin-leave-active {
    animation: tophide 0.4s forwards;
    -webkit-animation: tophide 0.4s forwards;
}

.optyin-enter-active {
    animation: optyin 0.4s forwards;
    -webkit-animation: optyin 0.4s forwards;
}

.optyin-leave-active {
    display: none;
}

/*LOADER-4*/
@-webkit-keyframes ball-turn {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes ball-turn {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.loader-4 {
    position: fixed;
    left: 50%;
    top: 50%;
    border: 0.4rem double #ff5722;
    width: 5.4rem;
    height: 5.4rem;
    margin-left: -2.7rem;
    margin-top: -2.7rem;
    border-radius: 999px;
    -webkit-animation: ball-turn 1s linear infinite;
    animation: ball-turn 1s linear infinite;
}

.loader-4:before,
.loader-4:after {
    content: "";
    position: absolute;
    width: 12px;
    height: 12px;
    background: #ff5722;
    border-radius: 50%;
    bottom: 0;
    right: 37px;
}

.loader-4:after {
    left: 37px;
    top: 0;
}

#loading {
    background-color: #faf8f7;
    height: 100%;
    width: 100%;
    position: fixed;
    z-index: 1;
    margin-top: 0px;
    top: 0px;
}

#loading-center {
    width: 100%;
    height: 100%;
    position: relative;
}

#loading-center-absolute {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 150px;
    width: 104px;
    margin-top: -75px;
    margin-left: -46px;
}

.object {
    width: 14px;
    height: 14px;
    background-color: #ff7d55;
    float: left;
    margin-right: 20px;
    margin-top: 65px;
    -moz-border-radius: 50% 50% 50% 50%;
    -webkit-border-radius: 50% 50% 50% 50%;
    border-radius: 50% 50% 50% 50%;
}

#object_one {
    -webkit-animation: object_one 1.5s infinite;
    animation: object_one 1.5s infinite;
}

#object_two {
    -webkit-animation: object_two 1.5s infinite;
    animation: object_two 1.5s infinite;
    -webkit-animation-delay: 0.25s;
    animation-delay: 0.25s;
}

#object_three {
    -webkit-animation: object_three 1.5s infinite;
    animation: object_three 1.5s infinite;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
}

@-webkit-keyframes object_one {
    75% {
        -webkit-transform: scale(0);
    }
}

@keyframes object_one {
    75% {
        transform: scale(0);
        -webkit-transform: scale(0);
    }
}

@-webkit-keyframes object_two {
    75% {
        -webkit-transform: scale(0);
    }
}

@keyframes object_two {
    75% {
        transform: scale(0);
        -webkit-transform: scale(0);
    }
}

@-webkit-keyframes object_three {
    75% {
        -webkit-transform: scale(0);
    }
}

@keyframes object_three {
    75% {
        transform: scale(0);
        -webkit-transform: scale(0);
    }
}

.topay {
    background-color: #f5f5f5;
}

.topay .storeinfo {
    padding: 1.3rem 2rem;
    background-color: #fff;
    position: relative;
}

.topay .storeinfo:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.topay .storeinfo .name {
    color: #212121;
    font-size: 1.4rem;
}

.topay .storeinfo .orderid {
    margin-top: 0.8rem;
}

.topay .storeinfo .balance {
    margin-top: 0.8rem;
}

.topay .paymoney {
    background-color: #fff;
    padding: 1.3rem 2rem;
    margin-top: 0.6rem;
}

.topay .paymoney .moneyinput {
    position: relative;
    margin-top: 0.5rem;
    padding: 0.3rem 0;
}

.topay .paymoney .moneyinput:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.topay .paymoney .moneyinput .moneyicon {
    font-size: 2rem;
    color: #212121;
    margin-right: 0.2rem;
}

.topay .paymoney .moneyinput input {
    border: none;
    outline: none;
    color: #212121;
    font-size: 2.4rem;
    line-height: 1;
    width: 100%;
}

.topay .paymoney .moneyinput .mdinput {
    color: #212121;
    font-size: 2.4rem;
    line-height: 1;
}

.topay .storinfo .pay .money .mdinput {
    font-size: 1.6rem;
}

.topay .paymoney .moneyinput .Discount {
    width: 8rem;
    text-align: center;
    color: #999999;
}

.topay .DiscountUsed {
    margin-top: 1rem;
    font-size: 1.4rem;
    color: #ff7f24;
}

.topay .couponlist li {
    padding: 1.5rem 1.5rem;
    background-color: #f5f5f5;
    border-radius: 0.6rem;
    margin-top: 1rem;
    border: 0.1rem solid #f5f5f5;
}

.topay .couponlist li > i {
    width: 1.6rem;
    height: 1.6rem;
    border: 0.1rem solid #a9a9a9;
    border-radius: 50%;
    margin-right: 0.8rem;
    position: relative;
}

.topay .couponlist li > i > i {
    position: absolute;
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 50%;
    top: 50%;
    left: 50%;
    background-color: #ff7f24;
    margin-left: -0.4rem;
    margin-top: -0.4rem;
    display: none;
}

.topay .couponlist li .text {
    font-size: 1.4rem;
    color: #212121;
}

.topay .couponlist li .tuijian {
    display: inline-block;
    width: 3.8rem;
    margin-left: 0.8rem;
}

.topay .couponlist li.active {
    background-color: #fff2e9;
    border: 0.1rem solid #ff7f24;
}

.topay .couponlist li.active > i {
    border: 0.1rem solid #ff842d;
}

.topay .couponlist li.active > i > i {
    display: block;
}

.topay .topaybtn {
    display: block;
    margin: 3rem auto;
    width: 100%;
    height: 4.4rem;
    border-radius: 6px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.topay .topaybtn:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.topay .Bookkeepingpay {
    text-align: center;
    font-size: 1.4rem;
    color: #4d4d4d;
}

.topay .Bookkeepingpay .icon-sjin-arrow-right-bold {
    font-size: 14px;
    color: #666;
}

.topay .tipinputcode {
    position: fixed;
    width: 100%;
    max-height: 100%;
    min-height: 32rem;
    background-color: #fff;
    left: 0%;
    bottom: 0%;
    border-radius: 0.4rem 0.4rem 0 0;
    padding: 2rem 1.4rem;
}

.topay .tipinputcode .typeselect {
    padding: 0;
    position: relative;
}

.topay .tipinputcode .typeselect:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.topay .tipinputcode .typeselect .typebtn {
    margin-right: 2rem;
    font-size: 1.4rem;
    color: #999999;
}

.topay .tipinputcode .typeselect .typebtn.active {
    font-size: 1.6rem;
    color: #ff7f24;
}

.topay .tipinputcode .typeselect .close {
    color: #999999;
    text-align: center;
    width: 4rem;
    height: 4rem;
    font-size: 1.4rem;
    background-color: rgba(0, 0, 0, 0);
}

.topay .tipinputcode .selecttag {
    position: relative;
    height: 4rem;
    text-align: center;
    line-height: 4rem;
    font-size: 1.4rem;
    overflow: hidden;
    border-radius: 0.4rem 0.4rem 0 0;
}

.topay .tipinputcode .selecttag::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.topay .tipinputcode .selecttag .active {
    color: #fff;
    background-color: #ff7f24;
}

.topay .tipinputcode .tip {
    text-align: center;
    font-size: 1.4rem;
    margin-top: 4rem;
    color: #999999;
}

.topay .tipinputcode .keyinput {
    display: block;
    margin: 0 auto;
    width: 16rem;
    height: 4rem;
    overflow: hidden;
    border: 1px solid #999999;
    border-radius: 999px;
    margin-top: 2rem;
}

.topay .tipinputcode .keyinput input {
    width: 100%;
    font-size: 1.4rem;
    text-align: center;
    padding: 1rem 0;
    border: none;
    outline: none;
}

.topay .tipinputcode .subcode {
    display: block;
    margin: 0 auto;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    width: 16rem;
    height: 3.6rem;
    margin-top: 4rem;
}

.topay .tipinputcode .subcode:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.topay .tipinputcode .nouse {
    text-align: center;
    font-size: 1.4rem;
    margin-top: 1rem;
    color: #999999;
}

.topay .tipinputcode .nouse .nousebtn {
    font-size: 1.4rem;
    color: #4c4c4c;
    padding: 0 1rem;
}

.topay .tipinputcode .nocoupon {
    text-align: center;
    font-size: 1.4rem;
    color: #666;
    padding: 2rem;
    margin-top: 4rem;
}

.topay .tipinputcode .mycoupnlist {
    margin-top: 1rem;
    padding: 0 1rem;
}

.topay .tipinputcode .mycoupnlist li {
    margin-bottom: 1rem;
    background-color: #fff;
    border-radius: 0.8rem;
    box-shadow: 0rem 0.3rem 1rem rgba(0, 0, 0, 0.1);
    position: relative;
    overflow: hidden;
}

.topay .tipinputcode .mycoupnlist li .money {
    color: #ff7f24;
    min-width: 8rem;
    padding-left: 1rem;
    text-align: center;
}

.topay .tipinputcode .mycoupnlist li .money span:nth-child(1) {
    font-size: 2.8rem;
}

.topay .tipinputcode .mycoupnlist li .money span:nth-child(2) {
    font-size: 1.6rem;
}

.topay .tipinputcode .mycoupnlist li .head-box {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.topay .tipinputcode .mycoupnlist li .coupnname {
    font-size: 1.6rem;
    color: #212121;

}

.topay .tipinputcode .mycoupnlist li .coupondec {
    font-size: 1.2rem;
    color: #999999;
    margin-top: 0.5rem;
}

.topay .tipinputcode .mycoupnlist li .time {
    position: relative;

    width: 100%;
    font-size: 1.2rem;
    color: #999999;
    padding: 0.5rem 2rem;
    border-top: 1px dashed #ccc;
}

.topay .tipinputcode .mycoupnlist li .time:before,
.topay .tipinputcode .mycoupnlist li .time:after {
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background-color: #f2f3f5;
    position: absolute;
    content: '';
    left: -0.5rem;
    top: -0.5rem;
}

.topay .tipinputcode .mycoupnlist li .time:after {
    left: auto;
    right: -0.5rem;
}

.topay .tipinputcode .mycoupnlist li .jiao {
    width: 8rem;
    height: 8rem;
    position: absolute;
    right: 0;
    top: 0;
    background-color: #ff7f24;
    transform: rotate(45deg);
    margin-right: -4rem;
    margin-top: -4rem;
}

.topay .tipinputcode .mycoupnlist li .jiao > div {
    font-size: 1.2rem;
    color: #fff;
    text-align: center;
    position: absolute;
    bottom: 0.2rem;
    left: 0.1rem;
    width: 100%;
    transform: rotate(0deg);
}

.topay .tipinputcode .mycoupnlist li.def .money,
.topay .tipinputcode .mycoupnlist li.def .coupnname,
.topay .tipinputcode .mycoupnlist li.def .coupondec,
.topay .tipinputcode .mycoupnlist li.def .time {
    color: #999999;
}

.topay .tipinputcode .mycoupnlist li.def .jiao {
    background-color: #ccc;
}

.topay .tipinputcode .quanitem {
    display: block;
    margin: 0 auto;
    width: 80%;
    padding-bottom: 4rem;
}

.topay .tipinputcode .quanitem li {
    background-color: #fff5ee;
    margin-top: 1.5rem;
    height: 3.2rem;
    border-radius: 0.6rem 0 0 0.6rem;
    position: relative;
    padding-left: 1.4rem;
    overflow: hidden;
    line-height: 3.2rem;
    color: #ff8b39;
    font-size: 1.4rem;
}

.topay .tipinputcode .quanitem li::before {
    content: '';
    position: absolute;
    width: 0.8rem;
    left: 0;
    top: 0;
    height: 100%;
    display: block;
    background-color: #fd8937;
}

.topay .tipinputcode .quanlist {
    min-height: 14rem;
    padding: 1rem 2rem;
}

.topay .tipinputcode .quanlist li {
    margin-top: 0.5rem;
    background-image: url(../images/collectcoupons/quan.png);
    background-size: 100% 100%;
    height: 7.8rem;
    position: relative;
}

.topay .tipinputcode .quanlist li .moneybig {
    position: absolute;
    left: 7%;
    top: 50%;
    line-height: 2rem;
    margin-top: -1rem;
    color: #ff7f24;
}

.topay .tipinputcode .quanlist li .moneybig > span:nth-child(1) {
    font-size: 1.8rem;
}

.topay .tipinputcode .quanlist li .moneybig > span:nth-child(2) {
    font-size: 3.4rem;
}

.topay .tipinputcode .quanlist li .name {
    position: absolute;
    font-size: 1.4rem;
    color: #333;
    left: 24%;
    top: 50%;
    margin-top: -2rem;
    max-width: 16rem;
}

.topay .tipinputcode .quanlist li .dec {
    position: absolute;
    font-size: 1.2rem;
    color: #4c4c4c;
    left: 24%;
    top: 50%;
    margin-top: 0.2rem;
    max-width: 16rem;
}

.topay .tipinputcode .quanlist li .rightfont {
    position: absolute;
    right: 6%;
    top: 50%;
    margin-top: -2.4rem;
    line-height: 1.6rem;
    font-size: 1.4rem;
    width: 1rem;
}

.topay .Rechargebeforesub {
    position: fixed;
    width: 28rem;
    min-height: 8rem;
    background-color: #fff;
    left: 50%;
    top: 50%;
    margin-left: -14rem;
    margin-top: -16rem;
    border-radius: 0.4rem;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15), 0px 1px 8px rgba(0, 0, 0, 0.1);
    padding-bottom: 2rem;
}

.topay .Rechargebeforesub > .close {
    position: absolute;
    right: 0rem;
    top: -5rem;
    color: #fff;
    text-align: center;
    width: 4rem;
    height: 4rem;
    font-size: 2.4rem;
    color: rgba(255, 255, 255, 0.9);
    background-color: rgba(0, 0, 0, 0);
    border: none;
}

.topay .Rechargebeforesub .rechargtitle {
    padding: 1rem;
    text-align: center;
    font-size: 1.6rem;
    color: #F98436;
    position: relative;
}

.topay .Rechargebeforesub .rechargtitle::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.topay .Rechargebeforesub .recharginfo {
    padding: 1rem 2rem;
    font-size: 1.4rem;
    color: #4d4d4d;
    word-break: break-all;
    position: relative;
}

.topay .Rechargebeforesub .recharginfo span.yellow {
    color: #F98436;
}

.topay .Rechargebeforesub .recharginfo .copewith,
.topay .Rechargebeforesub .recharginfo .consumption {
    font-size: 1.4rem;
    color: #212121;
    padding: 0.4rem 0;
    line-height: 1;
    margin-top: 1rem;
}

.topay .Rechargebeforesub .recharginfo .copewith .rightmoney,
.topay .Rechargebeforesub .recharginfo .consumption .rightmoney {
    font-size: 1.4rem;
    color: #000000;
    position: relative;
    top: -0.2rem;
    text-align: right;
}

.topay .Rechargebeforesub .recharginfo .copewith .redfont,
.topay .Rechargebeforesub .recharginfo .consumption .redfont {
    color: #fe0000;
}

.topay .Rechargebeforesub .recharginfo .consumption {
    color: #4c4c4c;
}

.topay .Rechargebeforesub .recharginfo .rechargedec {
    margin-top: 1.2rem;
    color: #666;
}

.topay .Rechargebeforesub .recharginfo .redenvelopes {
    margin-top: 1.2rem;
    border: 0.1rem solid #ff7f24;
    background-color: #fff2e9;
    border-radius: 0.8rem;
    padding: 1.2rem 1.4rem 1.2rem 1.4rem;
    line-height: 1;
}

.topay .Rechargebeforesub .recharginfo .redenvelopes .redbagtitle {
    font-size: 1.8rem;
    color: #ff7f24;
}

.topay .Rechargebeforesub .recharginfo .redenvelopes .redbagdec {
    margin-top: 0.8rem;
    font-size: 1.2rem;
    color: #999999;
}

.topay .Rechargebeforesub .paybtn button {
    display: block;
    margin: 0 auto;
    width: 14rem;
    padding: 1.2rem 0;
}

.topay .Rechargebeforesub .paybtn button:nth-child(1) {
    margin-top: 2rem;
    padding: 1rem 0;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    background-color: #3cc51f;
    outline: none;
}

.topay .Rechargebeforesub .paybtn button:nth-child(1):active {
    background-color: #3dea18;
}

.topay .Rechargebeforesub .paybtn button:nth-child(2) {
    margin-top: 1rem;
    padding: 0.8rem 0;
    background-color: rgba(0, 0, 0, 0);
    color: #999999;
}

.topay .redbagcenter {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 30;
}

.topay .redbagcenter .redbag {
    position: relative;
    display: block;
    margin: 0 auto;
    margin-top: 12rem;
    width: 24rem;
}

.topay .redbagcenter .redbag .close {
    position: absolute;
    right: 0rem;
    top: -5rem;
    color: #fff;
    text-align: center;
    width: 4rem;
    height: 4rem;
    font-size: 2.4rem;
    color: rgba(255, 255, 255, 0.9);
    background-color: rgba(0, 0, 0, 0);
    border: none;
    font-weight: normal;
}

.topay .redbagcenter .redbag > img {
    width: 100%;
    display: block;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

.topay .redbagcenter .redbag .redbagtext {
    position: absolute;
    top: 0;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    margin-top: 10rem;
    width: 100%;
}

.topay .redbagcenter .redbag .openclick {
    position: absolute;
    top: 17rem;
    left: 50%;
    width: 8rem;
    height: 8rem;
    margin-left: -4rem;
    background-color: rgba(0, 0, 0, 0);
}

.topay .redbagcenter .redbag .openclick > img {
    width: 100%;
}

.topay .redbagcenter .redbag .openclick.fanzhuan {
    animation: fanzhuan 0.8s forwards;
    -webkit-animation: fanzhuan 0.8s forwards;
}

.topay .redbagopen {
    position: fixed;
    left: 50%;
    margin-left: -16rem;
    width: 32rem;
    bottom: 24%;
    overflow: hidden;
    height: 45rem;
    z-index: 40;
}

.topay .redbagopen .botfixbg-1 {
    position: absolute;
    width: 100%;
    height: 8rem;
    bottom: 0;
    background-color: #ba2e17;
    z-index: 4;
    border-radius: 0.6rem 0.6rem 0 0;
}

.topay .redbagopen .botfixbg-2 {
    position: absolute;
    width: 100%;
    bottom: 0;
    height: 4.6rem;
    background-repeat: repeat-x;
    background-size: contain;
    z-index: 6;
}

.topay .redbagopen .botfixbg-2 .flowercenter {
    width: 2rem;
    height: 2rem;
    display: block;
    margin: 0 auto;
    margin-top: 1.5rem;
}

.topay .redbagopen .openbagmain {
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -14rem;
    width: 28rem;
    background-color: #fff2df;
    height: 39rem;
    z-index: 5;
    border-radius: 0.6rem;
    animation: botshow 1s forwards;
}

.topay .redbagopen .openbagmain .close {
    position: absolute;
    right: 0rem;
    top: -5rem;
    color: #fff;
    text-align: center;
    width: 4rem;
    height: 4rem;
    font-size: 2.4rem;
    color: rgba(255, 255, 255, 0.9);
    background-color: rgba(0, 0, 0, 0);
    border: none;
    font-weight: normal;
}

.topay .redbagopen .openbagmain .title-1 {
    font-size: 1.4rem;
    margin-top: 2.4rem;
    color: #dc5c39;
    text-align: center;
}

.topay .redbagopen .openbagmain .title-2 {
    font-size: 1.6rem;
    margin-top: 0.5rem;
    color: #dc5c39;
    text-align: center;
}

.topay .redbagopen .openbagmain .quan {
    width: 24rem;
    padding: 1.5rem 2rem;
    margin: 0 auto;
    margin-top: 1.4rem;
    border-radius: 0.4rem;
    background-image: linear-gradient(to right, #f98436, #fb6f40);
}

.topay .redbagopen .openbagmain .quan .midbox {
    display: block;
    margin: 0 auto;
    width: 8.8rem;
    position: relative;
}

.topay .redbagopen .openbagmain .quan .midbox > img {
    width: 100%;
    box-shadow: 0 0.2rem 0.4rem rgba(223, 112, 55, 0.2);
}

.topay .redbagopen .openbagmain .quan .midbox .fixtopfont {
    position: absolute;
    top: 0.6rem;
    line-height: 2.2rem;
    width: 100%;
    text-align: center;
    color: #cd422d;
    font-size: 1.4rem;
}

.topay .redbagopen .openbagmain .quan .midbox .fixmoney {
    position: absolute;
    top: 5rem;
    line-height: 2.2rem;
    width: 100%;
    text-align: center;
    color: #cd422d;
    font-size: 3.2rem;
}

.topay .redbagopen .openbagmain .quan .midbox .fixbot {
    position: absolute;
    top: 8rem;
    line-height: 2.2rem;
    width: 100%;
    text-align: center;
    color: #cd422d;
    font-size: 1.4rem;
}

.topay .redbagopen .touse {
    width: 22rem;
    display: block;
    margin: 0 auto;
    border-radius: 999;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    text-align: center;
    line-height: 4rem;
    margin-top: 4rem;
}

.topay .redbagopen .touse:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.followgzh {
    position: fixed;
    max-width: 28rem;
    background-color: #fff;
    border-radius: 1rem;
    left: 50%;
    top: 50%;
    margin-left: -15rem;
    margin-top: -20rem;
    padding-top: 2rem;
    z-index: 35;
    box-shadow: 0rem 0.3rem 1rem rgba(0, 0, 0, 0.1);
}

.followgzh .close {
    position: absolute;
    right: 0rem;
    top: -5rem;
    color: #fff;
    text-align: center;
    width: 4rem;
    height: 4rem;
    font-size: 2.4rem;
    color: rgba(255, 255, 255, 0.9);
    background-color: rgba(0, 0, 0, 0);
    border: none;
    font-weight: normal;
}

.followgzh .attendcode {
    margin: 0 auto;
    display: block;
    width: 20rem;
    height: 20rem;
    margin-top: 2rem;
}

.followgzh .followfont {
    text-align: center;
    font-size: 1.4rem;
    color: #212121;
    margin: 2rem;
}

.autograph {
    position: fixed;
    left: 0;
    width: 100%;
    bottom: 0;
    background-color: #fff;
    z-index: 4;
    padding: 0 3rem;
    padding-top: 1rem;
}

.autograph .closebtn {
    position: absolute;
    right: 1rem;
    top: 2rem;
    font-size: 2rem;
    background-color: rgba(0, 0, 0, 0);
    color: #ff7f24;
    z-index: 4;
}

.autograph .fonttips {
    margin-top: 1rem;
}

.autograph .topinfo {
    position: relative;
    padding: 2.5rem 0rem;
}

.autograph .topinfo:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.autograph .topinfo .paymoney {
    font-size: 1.4rem;
    color: #000;
}

.autograph .topinfo .paymoney .left {
    width: 8rem;
}

.autograph .topinfo .paymoney span {
    font-size: 2.2rem;
}

.autograph .topinfo .nomalitem {
    margin-top: 0.8rem;
    color: #4c4c4c;
}

.autograph .topinfo .nomalitem .left {
    width: 8rem;
}

.autograph .closebtn {
    border: none;
    outline: none;
    text-align: center;
    background-color: inherit;
    font-size: 1.8rem;
    color: #b3b3b3;
}

.autograph .canvasbox {
    background-color: #fff;
}

.autograph .canvasbox canvas {
    width: 100%;
    height: 100%;
    margin-top: 0.5rem;
    border: 1px solid #ccc;
}

.autograph .twobtn {
    padding-bottom: 3rem;
    margin-top: 2rem;
}

.autograph .twobtn button {
    width: 13rem;
    height: 4rem;
    display: block;
    margin: 0 auto;
    font-size: 1.6rem;
}

.selectorganization {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    padding: 2rem 1rem 0 1rem;
    z-index: 5;
    background-color: rgba(0, 0, 0, 0.5);
}

.selectorganization .bookkeeping {
    margin-top: 1rem;
}

.selectorganization .bookkeeping button {
    border: none;
    outline: none;
    text-align: center;
    background-color: inherit;
    color: #212121;
    width: 10rem;
    margin-right: 1rem;
    padding: 0.4rem 0;
}

.selectorganization .bookkeeping button i {
    color: #999999;
    font-size: 1.8rem;
    vertical-align: -0.1rem;
}

.selectorganization .selectitem {
    background-color: #fff;
    height: 100%;
    z-index: 4;
    border-radius: 1rem 1rem 0 0;
    position: relative;
}

.selectorganization .selectitem .oglist {
    padding-bottom: 6rem;
}

.selectorganization .selectitem .closebtn {
    position: absolute;
    right: 1rem;
    top: 2rem;
    font-size: 2rem;
    background-color: rgba(0, 0, 0, 0);
    color: #b3b3b3;
    z-index: 4;
}

.selectorganization .selectitem .ogtitle {
    text-align: center;
    font-size: 1.6rem;
    color: #212121;
    font-weight: bold;
    margin-top: 6rem;
}

.selectorganization .selectitem ol {
    margin-top: 1rem;
    padding: 0 1.5rem;
}

.selectorganization .selectitem ol li {
    padding: 1.5rem;
    border-radius: 1rem;
    position: relative;
    margin-top: 0.8rem;
}

.selectorganization .selectitem ol li:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-radius: 2rem;
}

.selectorganization .selectitem ol li .select {
    position: absolute;
    font-size: 2.4rem;
    right: 1rem;
    top: 1.2rem;
    color: #cccccc;
    background-color: rgba(0, 0, 0, 0);
}

.selectorganization .selectitem ol li .ogname {
    font-size: 1.6rem;
    color: #333;
}

.selectorganization .selectitem ol li .ognum {
    margin-top: 0.6rem;
}

.selectorganization .selectitem ol li .ogadmin {
    margin-top: 0.6rem;
    padding: 0.6rem 0;
    position: relative;
}

.selectorganization .selectitem ol li .ogadmin:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.selectorganization .selectitem ol li .ogmoney {
    margin-top: 0.6rem;
}

.selectorganization .selectitem ol li.active {
    box-shadow: 0 1px 8px rgba(255, 127, 36, 0.2);
}

.selectorganization .selectitem ol li.active .select {
    color: #ff7f24;
}

.selectorganization .selectitem ol li.active:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #ff7f24;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.selectorganization .selectitem .ogpaybtn {
    display: block;
    margin: 0 auto;
    width: 80%;
    height: 4.4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    margin-top: 2rem;
    text-align: center;
    line-height: 4.3rem;
}

.selectorganization .selectitem .ogpaybtn:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.selectorganization .selectitem .jointip {
    font-size: 1.4rem;
    text-align: center;
    margin-top: 1rem;
    padding: 1rem 0;
}

.topay .topscrollbar {
    position: relative;
}

.topay .topscrollbar .bgimg {
    width: 100%;
    display: block;
}

.topay .topscrollbar > .row {
    position: absolute;
    width: 90%;
    left: 5%;
    top: 14%;
    height: 4rem;
}

.topay .topscrollbar > .row .icon {
    width: 3.2rem;
}

.topay .topscrollbar > .row .scroll {
    width: 0;
    height: 3.2rem;
    margin-left: 1rem;
    border-radius: 999px;
    text-align: left;
    margin-top: 0.5rem;
}

.topay .storimg img {
    width: 100%;
    display: block;
}

.topay .storinfo {
    padding: 1rem;
}

.topay .storinfo .storname {
    font-size: 1.4rem;
    color: #4d4d4d;
    text-align: center;
    line-height: 4rem;
    position: relative;
}
.topay.newtopay .storinfo .storname::before{
    display: none;
}

.topay .storinfo .storname::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.topay .storinfo .balance {
    padding: 1rem;
    position: relative;
    background-color: #fff;
    border-radius: 6px;
    box-shadow: 1px 5px 10px 0 #eee;
}

.topay.newtopay .storinfo .balance .available{
    display: flex;
    align-items: center;
}

.topay .storinfo .balance .available {
    font-size: 1.4rem;
}

.topay .storinfo .balance .available .monyicon {
    font-size: 1.4rem;
    color: #ff7f24;
    margin: 0 0.3rem;
}

.topay .storinfo .balance .available .money {
    font-size: 1.6rem;
    color: #ff7f24;
    position: relative;
    display: inline-block;
}

.topay .storinfo .balance .available .money .icon-sjin-wenhao {
    font-size: 1rem;
    position: absolute;
    top: 0.2rem;
    right: -1.5rem;
    color: #999;
}

.topay .storinfo .balance .available .money .showUserBalance-box-bg {
    position: fixed;
    width: 100vw;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 98;
}

.topay .storinfo .balance .available .money .showUserBalance-box {
    position: absolute;
    top: 0.5rem;
    right: -17rem;
    width: 15rem;
    background-color: #fff;
    box-shadow: 1px 1px 10px 0 #ccc;
    text-align: center;
    padding: 1rem;
    z-index: 99;
    border-radius: 0 6px 6px;
    color: #999;
    font-size: 1.4rem;
}

.topay .storinfo .balance .tip {
    font-size: 1.2rem;
    color: #999999;
    margin-top: 0.8rem;
}

.topay .storinfo .toRecharge {
    padding: 0.8rem 1.4rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0);
    border: none;
    outline: none;
    position: relative;
    transition: all 0.3s;
    color: #ff7f24;
}

.topay .storinfo .toRecharge::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 2px solid #ff7f24;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-radius: 999px;
}

.topay .storinfo .toRecharge:active {
    background-color: #ff7f24;
    color: #fff;
}

.topay .storinfo .pay {
    padding: 1rem;
    position: relative;

    margin-top: 2rem;
    background-color: #fff;
    border-radius: 6px;
    box-shadow: 1px 5px 10px 0 #eee;
}

.topay .storinfo .pay .botcopshow {
    margin-top: 0.5rem;
    color: #999999;
}

.topay .storinfo .pay .botcopshow span {
    color: #F98436;
}

.topay .storinfo .pay .left {
    font-size: 1.4rem;
    color: #4d4d4d;
}

.topay .storinfo .pay .mdinput input {
    width: 100%;
    padding: 0.5rem;
    border: none;
    outline: none;
    color: #4d4d4d;
    height: 3rem;
    line-height: 3rem;
    font-size: 1.4rem;
}

.topay .storinfo .pay .youhui {
    margin-left: 1rem;
    margin-right: 1rem;
    color: #666;
}

.topay .storinfo .pay .youhui .icon-sjin-duigou {
    color: #ff7624;
    display: inline-block;
    margin-right: 2px;
    margin-top: -1px;
    vertical-align: middle;
}

.topay .storinfo .pay .printjobid {
    font-size: 1.2rem;
    color: #999999;
    height: 2rem;
    line-height: 2rem;
}

.topay .storinfo .pay .money {
    margin-top: 1rem;
}

.topay .storinfo .pay .money .icon-sjin-renminbi {
    margin-left: -0.6rem;
    color: #4d4d4d;
    font-size: 3rem;
}

.Recharge .toptitle {
    text-align: center;
    font-size: 1.4rem;
    position: relative;
    color: #4d4d4d;
    height: 4rem;
    line-height: 4rem;
    background-color: #fff;
}

.Recharge .toptitle::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Recharge .balancebox {
    padding: 0 1.8rem;
    background-color: #fff;
    color: #4d4d4d;
    height: 4rem;
    line-height: 4rem;
    position: relative;
}

.Recharge .balancebox::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Recharge .balancebox .left {
    width: 7rem;
}

.Recharge .balancebox .right {
    font-size: 1.4rem;
    width: 0;
}

.Recharge .balancebox .right input {
    width: 100%;
    border: none;
    outline: none;
}

.Recharge .limit {
    text-align: center;
    font-size: 1.4rem;
    color: #ff7f24;
    padding: 1rem 0;
    background-color: #fff;
    position: relative;
}

.Recharge .limit::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Recharge .choselist {
    flex-wrap: wrap;
    padding: 1rem 1.8rem;
}

.Recharge .choselist li {
    width: 33%;
    margin-top: 1.6rem;
}

.Recharge .choselist li button {
    transition: all 0.3s;
    height: 6rem;
    background-color: #fff;
    display: block;
    margin: 0 auto;
    width: 10.8rem;
    position: relative;
}

.Recharge .choselist li button::before {
    border-radius: 0.6rem;
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Recharge .choselist li button div {
    color: #ff7f24;
}

.Recharge .choselist li button div:nth-child(2) {
    font-size: 1.2rem;
}

.Recharge .choselist li button.des {
    background-color: #e5e5e5;
}

.Recharge .choselist li button.des div {
    color: #999999;
}

.Recharge .choselist li button.des::before {
    border: none;
}

.Recharge .choselist li button.active {
    background-color: #fde7d7;
}

.Recharge .choselist li button.active::before {
    border-radius: 0.6rem;
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #ff7f24;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Recharge .topaybtn {
    display: block;
    margin: 0 auto;
    margin-top: 4rem;
    width: 80%;
    height: 4.4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.Recharge .topaybtn:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.Recharge .topaybtn.defbtn {
    background-image: none;
    background-color: #cccccc;
    color: #fff;
    box-shadow: none;
}

.Recharge .paydec {
    display: block;
    margin: 0 auto;
    width: 80%;
    color: #999999;
    margin-top: 2rem;
    font-size: 1.4rem;
}

.Recharge .paydec dd {
    margin-top: 0.4rem;
    line-height: 1.5;
}

.firstRecharge {
    background-color: #f5f5f5;
}

.firstRecharge > div {
    padding: 2rem 0;
}

.firstRecharge .content {
    text-align: center;
}

.firstRecharge .balancetext {
    font-size: 1.4rem;
    color: #ea5d2e;
}

.firstRecharge .balancemoney {
    margin-top: 0.8rem;
    color: #ea5d2e;
}

.firstRecharge .balancemoney span {
    font-size: 1.2rem;
}

.firstRecharge .balancemoney > .money {
    font-size: 2.2rem;
}

.firstRecharge .howtouse {
    font-size: 1.4rem;
    color: #999;
    margin-top: 1.2rem;
}

.firstRecharge .clicktorecharge {
    display: block;
    margin: 0 auto;
    width: 14rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    font-size: 1.4rem;
    margin-top: 1.2rem;
    padding: 1rem;
}

.firstRecharge .clicktorecharge:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.firstRecharge .canget {
    font-size: 1.4rem;
    color: #ff7f24;
    margin-top: 1.2rem;
}

.newrecharge .topbg {
    height: 22rem;
    background-image: -moz-linear-gradient(top, #ff7f24, #f2f3f5);
    /* Firefox */
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ff7f24), color-stop(1, #f2f3f5));
    /* Saf4+, Chrome */
}

.newrecharge .content {
    padding: 0 1rem;
    position: relative;
    margin-top: -20rem;
}

.newrecharge .content .center {
    background-color: #fff;
    padding: 1rem;
    padding-top: 2rem;
    border-radius: 0.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    padding-bottom: 4rem;
}

.newrecharge .tipfont {
    font-size: 1.4rem;
    margin-top: 1rem;
}

.newrecharge .balance {
    font-size: 1.2rem;
    color: #999999;
    text-align: center;
}

.newrecharge .balancemoney {
    font-size: 2.2rem;
    color: #212121;
    text-align: center;
    margin-top: 0.6rem;
}

.newrecharge .rechargetypelist .item {
    width: 25%;
    margin-top: 1.5rem;
}

.newrecharge .rechargetypelist .item .moneybox {
    width: 7.6rem;
    height: 8rem;
    border-radius: 0.6rem;
    margin: 0 auto;
    background-color: #f5f5f5;
    transition: background-color 0.3s;
    padding-top: 1.6rem;
}

.newrecharge .rechargetypelist .item .moneybox .moneytitle {
    text-align: center;
    font-size: 1.4rem;
    color: #212121;
}

.newrecharge .rechargetypelist .item .moneybox .moneydec {
    text-align: center;
    font-size: 1.2rem;
    color: #fe2425;
    margin-top: 0.6rem;
}

.newrecharge .rechargetypelist .item.active .moneybox {
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #ffa024), color-stop(1, #ff7f24));
}

.newrecharge .rechargetypelist .item.active .moneybox .moneytitle,
.newrecharge .rechargetypelist .item.active .moneybox .moneydec {
    color: #fff;
}

.newrecharge .redtip {
    font-size: 1.2rem;
    margin-top: 2rem;
    color: #fe2425;
    padding: 0 1rem;
}

.newrecharge .other {
    margin-top: 4rem;
    border-bottom: 0.1rem solid #e0e0e0;
}

.newrecharge .othertext {
    padding: 0 1rem;
    font-size: 1.2rem;
    color: #212121;
}

.newrecharge .othermoney {
    padding: 1rem 0;
}

.newrecharge .othermoney > div:nth-child(1) {
    padding: 0 1rem;
    font-size: 2.2rem;
}

.newrecharge .othermoney input {
    width: 100%;
    border: none;
    outline: none;
    font-size: 1.6rem;
    color: #212121;
    line-height: 2rem;
}

.newrecharge .rechargebtn {
    width: 28rem;
    height: 4.4rem;
    text-align: center;
    border-radius: 999px;
    color: #fff;
    line-height: 4.4rem;
    font-size: 1.6rem;
    background-color: #ffffff;
    box-shadow: 0 rpx 0.2rem 0.4rem rgba(255, 106, 0, 0.08);
    margin: 0 auto;
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #ffa024), color-stop(1, #ff7f24));
    margin-top: 3rem;
}

.newrecharge .rechargebtn.def {
    background-color: #E6E6E6;
    color: #999999;
    background-image: none;
}

.newrecharge .Explain {
    position: relative;
    width: 34rem;
    margin: 0 auto;
    padding-bottom: 4rem;
    font-size: 1.2rem;
    color: #999999;
    line-height: 2rem;
}

.paysuccess,
.Rechargesuccess {
    background-color: #fff;
    padding-bottom: 6rem;
}

.paysuccess .ads img,
.Rechargesuccess .ads img {
    width: 100%;
}

.paysuccess .successicon,
.Rechargesuccess .successicon {
    text-align: center;
    margin-top: 2rem;
}

.paysuccess .successicon i,
.Rechargesuccess .successicon i {
    font-size: 2rem;
    vertical-align: -0.2rem;
    margin-right: 0.5rem;
    color: #15aa10;
}

.paysuccess .successicon span,
.Rechargesuccess .successicon span {
    font-size: 1.4rem;
    color: #4d4d4d;
}

.paysuccess .pricecenter,
.Rechargesuccess .pricecenter {
    text-align: center;
    margin-top: 1rem;
}

.paysuccess .pricecenter .money,
.Rechargesuccess .pricecenter .money {
    font-size: 3.6rem;
    color: #15aa10;
    margin-right: 0.4rem;
}

.paysuccess .pricecenter .yuan,
.Rechargesuccess .pricecenter .yuan {
    font-size: 1.4rem;
    color: #15aa10;
}

.paysuccess .storinfolist,
.Rechargesuccess .storinfolist {
    width: 68%;
    font-size: 1.4rem;
    position: relative;
    padding-bottom: 2.4rem;
    padding-top: 1rem;
    display: block;
    margin: 0 auto;
}

.paysuccess .storinfolist::before,
.Rechargesuccess .storinfolist::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.paysuccess .storinfolist > div,
.Rechargesuccess .storinfolist > div {
    margin-top: 1rem;
}

.paysuccess .evaluation,
.Rechargesuccess .evaluation {
    margin-top: 1rem;
}

.paysuccess .evaluation .top,
.Rechargesuccess .evaluation .top {
    text-align: center;
    font-size: 1.4rem;
}

.paysuccess .evaluation .startitem,
.Rechargesuccess .evaluation .startitem {
    text-align: center;
    padding: 1rem 0 1.5rem 0;
}

.paysuccess .evaluation .startitem button,
.Rechargesuccess .evaluation .startitem button {
    display: inline-block;
    margin: 0 0.4rem;
    text-align: center;
    height: 4rem;
    font-size: 3.8rem;
    color: #CCCCCC;
    background-color: rgba(0, 0, 0, 0);
    padding: 0;
}

.paysuccess .evaluation .startitem button.active,
.Rechargesuccess .evaluation .startitem button.active {
    color: #fdde0c;
}

.paysuccess .evaluation .decstar,
.Rechargesuccess .evaluation .decstar {
    text-align: center;
    font-size: 1.2rem;
}

.paysuccess .evaluation .Complaint textarea,
.Rechargesuccess .evaluation .Complaint textarea {
    display: block;
    margin: 0 auto;
    width: 60%;
    height: 8rem;
    padding: 1rem;
    font-size: 1.4rem;
    background-color: #f0eeef;
    border: none;
    outline: none;
    resize: none;
    margin-top: 4rem;
    border-radius: 0.4rem;
}

.paysuccess .evaluation .subComplaint,
.Rechargesuccess .evaluation .subComplaint {
    display: block;
    margin: 0 auto;
    margin-top: 4rem;
    width: 60%;
    padding: 0.8rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.paysuccess .evaluation .subComplaint:active,
.Rechargesuccess .evaluation .subComplaint:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.paysuccess .evaluation .toComplaintpage,
.Rechargesuccess .evaluation .toComplaintpage {
    display: block;
    margin: 0 auto;
    font-size: 1.4rem;
    color: #999999;
    margin-top: 2rem;
    padding: 0.5rem 2rem;
    background-color: rgba(0, 0, 0, 0);
}

.paysuccess .bannertree,
.Rechargesuccess .bannertree {
    width: 34rem;
    max-width: 90%;
    display: block;
    margin: 0 auto;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    position: relative;
}

.paysuccess .bannertree .num,
.Rechargesuccess .bannertree .num {
    line-height: 1.4rem;
    position: absolute;
    font-size: 1.2rem;
    left: 50%;
    top: 10%;
    margin-left: 3.2%;
    text-align: center;
    margin-top: 0.1rem;
    color: #43a774;
    width: 3rem;
}

.Rechargesuccess .backbtn {
    margin: 0 auto;
    margin-top: 4rem;
    width: 80%;
}

.Rechargesuccess .backbtn button {
    padding: 0.8rem;
    display: block;
    margin: 0 auto;
    width: 12rem;
}

.success-pop {
    position: fixed;
    z-index: 30;
    width: 30rem;
    background-color: #fff;
    left: 50%;
    top: 50%;
    margin-left: -15rem;
    margin-top: -20rem;
    padding: 1rem 1.5rem 2.4rem 1.5rem;
    box-shadow: 0 0.3rem 0.4rem rgba(0, 0, 0, 0.15);
    border-radius: 0.4rem;
}

.success-pop .pop-title {
    text-align: center;
    padding: 1rem 0rem;
    font-size: 1.6rem;
    color: #0BC11F;
}

.success-pop .pop-des {
    line-height: 2;
    font-size: 1.4rem;
}

.success-pop .welfare-title {
    color: #ffa024;
    position: relative;
    padding-top: 1rem;
}

.success-pop .welfare-title:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-top: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.success-pop .welfare-link {
    width: 14rem;
    display: block;
    margin: 0 auto;
    margin-top: 2rem;
}

.success-pop .welfare-des {
    margin-top: 1rem;
}

.success-pop .welfare-con {
    text-align: center;
    margin-top: 2rem;
}

.success-pop .pop-confirm {
    width: 20rem;
    height: 4rem;
    line-height: 4rem;
    text-align: center;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    display: block;
    margin: 0 auto;
    margin-top: 2.8rem;
}

.success-pop .pop-confirm:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.pop-environment {
    position: fixed;
    z-index: 30;
    width: 30rem;
    background-color: #fff;
    left: 50%;
    top: 50%;
    margin-left: -15rem;
    margin-top: -20rem;
    padding: 1rem 1.5rem 2.4rem 1.5rem;
    box-shadow: 0 0.3rem 0.4rem rgba(0, 0, 0, 0.15);
    border-radius: 0.4rem;
    animation: optyin 0.5s forwards;
    -webkit-animation: optyin 0.5s forwards;
}

.pop-environment .close {
    position: absolute;
    right: 1rem;
    font-size: 2.4rem;
    color: #cccccc;
}

.pop-environment .pop-title {
    text-align: center;
    padding: 1rem 0rem;
    font-size: 1.6rem;
    color: #212121;
}

.pop-environment .pop-text {
    font-size: 1.4rem;
    text-align: center;
    line-height: 1.8;
}

.pop-environment .pop-text .fw {
    font-weight: bold;
}

.pop-environment .see {
    margin-top: 1.4rem;
}

.feedback {
    padding-bottom: 6rem;
    background-color: #fff;
}

.feedback .feedbacktitle {
    text-align: center;
    font-size: 1.6rem;
    color: #4d4d4d;
    margin-top: 2rem;
}

.feedback .feedbackinput,
.feedback .phoneinput {
    width: 80%;
    display: block;
    margin: 0 auto;
    margin-top: 2rem;
}

.feedback .feedbackinput .top,
.feedback .phoneinput .top {
    font-size: 1.4rem;
    color: #4d4d4d;
}

.feedback .feedbackinput textarea,
.feedback .phoneinput textarea {
    margin-top: 1rem;
    padding: 0.6rem;
    background-color: #f0eeef;
    border-radius: 0.4rem;
    resize: none;
    height: 11rem;
    border: none;
    width: 100%;
    outline: none;
}

.feedback .imguploader {
    width: 80%;
    display: block;
    margin: 0 auto;
    margin-top: 2rem;
}

.feedback .imguploader .imgup {
    flex-wrap: wrap;
    margin-top: 1.6rem;
}

.feedback .imguploader .imgup .pic {
    width: 33.3%;
}

.feedback .imguploader .imgup .pic .picmid {
    position: relative;
    display: block;
    margin: 0 auto;
    background-color: #f2f2f2;
    width: 8rem;
    height: 8rem;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.feedback .imguploader .imgup .pic .picmid::before,
.feedback .imguploader .imgup .pic .picmid::after {
    content: '';
    width: 0.2rem;
    height: 1.8rem;
    border-radius: 999px;
    display: block;
    background-color: #ccc;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -0.1rem;
    margin-top: -0.9rem;
}

.feedback .imguploader .imgup .pic .picmid::after {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
}

.feedback .imguploader .imgup .pic .picmid.haspic::before,
.feedback .imguploader .imgup .pic .picmid.haspic::after {
    display: none;
}

.feedback .phoneinput {
    margin-top: 2rem;
}

.feedback .phoneinput .phone {
    position: relative;
    margin-top: 1rem;
}

.feedback .phoneinput .phone::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-radius: 0.8rem;
}

.feedback .phoneinput .phone input {
    width: 100%;
    padding: 1rem 1rem;
    border: none;
    outline: none;
}

.feedback .subfeedback {
    display: block;
    margin: 0 auto;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    width: 80%;
    padding: 1rem 0;
    margin-top: 4rem;
}

.feedback .subfeedback:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.Storeselection,
.Storeselectiontype2 {
    padding: 0 1.5rem;
    background-color: #f2f3f5;
    min-height: 100vh;
}

.Storeselection .storetitle,
.Storeselectiontype2 .storetitle {
    font-size: 1.6rem;
    color: #212121;
    padding: 1rem;
}

.Storeselection .city,
.Storeselectiontype2 .city {
    font-size: 1.6rem;
    color: #999999;
}

.Storeselection .city span,
.Storeselectiontype2 .city span {
    font-size: 1.8rem;
}

.Storeselection .storlist,
.Storeselectiontype2 .storlist {
    padding: 0 0.5rem;
    background-color: #fff;
    border-radius: 1rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.14);
}

.Storeselection .storlist li,
.Storeselectiontype2 .storlist li {
    padding: 1rem;
    position: relative;
}

.Storeselection .storlist li:before,
.Storeselectiontype2 .storlist li:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Storeselection .storlist li:nth-last-child(1):before,
.Storeselectiontype2 .storlist li:nth-last-child(1):before {
    border: none;
}

.Storeselection .storlist li .storname,
.Storeselectiontype2 .storlist li .storname {
    font-size: 1.2rem;
    color: #4c4c4c;
}

.Storeselection .storlist li .detailname,
.Storeselectiontype2 .storlist li .detailname {
    margin-top: 0.5rem;
}

.Storeselection .storlist li .detailname i,
.Storeselectiontype2 .storlist li .detailname i {
    font-size: 1.6rem;
    color: #cccccc;
}

.Storeselection .storlist li .detailname span,
.Storeselectiontype2 .storlist li .detailname span {
    font-size: 1.4rem;
    margin-left: 0.4rem;
    color: #212121;
}

.Storeselection .storlist li .contact,
.Storeselectiontype2 .storlist li .contact {
    margin-top: 0.5rem;
}

.Storeselection .storlist li .contact span,
.Storeselectiontype2 .storlist li .contact span {
    font-size: 1.2rem;
    margin-right: 1.4rem;
    color: #999999;
}

.Storeselection .storlist li .contact span i,
.Storeselectiontype2 .storlist li .contact span i {
    font-size: 1.4rem;
    color: #999999;
}

.Storeselectiontype2 .gou {
    position: absolute;
    right: 0.8rem;
    top: 3.1rem;
    font-size: 2rem;
    color: #ff7e24;
}

.Rechargelist {
    padding-bottom: 4rem;
}

.Rechargelist .toptitle {
    text-align: center;
    font-size: 1.4rem;
    color: #4d4d4d;
    height: 4.6rem;
    line-height: 4.6rem;
    background-color: #fff;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 10;
}

.Rechargelist .toptitle::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Rechargelist .lists {
    margin-top: 4.6rem;
}

.Rechargelist .lists ol {
    padding: 1rem 0.8rem;
}

.Rechargelist .lists ol li {
    margin-top: 1rem;
    background-color: #fff;
    border-radius: 0.8rem;
    padding: 1.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
}

.Rechargelist .lists ol li .top {
    font-size: 1.2rem;
    position: relative;
    padding: 0.4rem 0 1rem 0;
}

.Rechargelist .lists ol li .top:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Rechargelist .lists ol li .top .time {
    font-size: 1.2rem;
    color: #4c4c4c;
}

.Rechargelist .lists ol li .top .nomal {
    color: #0bc11f;
}

.Rechargelist .lists ol li .top .yellow {
    color: #f1970a;
}

.Rechargelist .lists ol li .moneyline {
    font-size: 1.4rem;
    color: #4c4c4c;
    margin-top: 1rem;
}

.Rechargelist .lists ol li .moneyline > div {
    margin-right: 2rem;
}

.Rechargelist .lists ol li .balance {
    margin-top: 1rem;
    font-size: 1.4rem;
    color: #4c4c4c;
}

.Rechargelist .lists .lastloader {
    font-size: 1.4rem;
    text-align: center;
    margin-top: 1rem;
    padding: 1rem 0;
    color: #999999;
}

.Rechargedetails {
    background-color: #f2f3f5;
}

.Rechargedetails .second-child {
    position: fixed;
    width: 100%;
    top: 4.6rem;
    bottom: 0;
    overflow-x: hidden;
    overflow-y: scroll;
}

.Rechargedetails .toptitle {
    text-align: center;
    font-size: 1.4rem;
    color: #4d4d4d;
    height: 4.6rem;
    line-height: 4.6rem;
    background-color: #fff;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 10;
}

.Rechargedetails .toptitle::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}


.Rechargedetails .lists {
    background-color: #fff;
    padding: 0 1rem;
}

.Rechargedetails .lists .listitem {
    padding: 1.25rem 0;
    border-bottom: 1px solid #e0e0e0;
    display: block;
}

.Rechargedetails .lists .listitem:nth-last-child(1) {
    border: none
}

.Rechargedetails .lists .listitem .consumption {
    width: 4rem;
    height: 4rem;
    margin-right: 1rem;
}

.Rechargedetails .lists .listitem .flex-1 {
    width: 0
}

.Rechargedetails .lists .listitem .name {
    font-size: 1.4rem;
    color: #212121;
}

.Rechargedetails .lists .listitem .time {
    font-size: 1.2rem;
    color: #999999;
    margin-top: 0.5rem;
}

.Rechargedetails .lists .money {
    font-size: 1.8rem;
    color: #ff7f24;
    text-align: right;
}

.Rechargedetails .lists .money .bonus {
    font-size: 1.2rem;
    color: #999;
}

.consumptionList {
    padding-bottom: 4rem;
}

.consumptionList .toptitle {
    text-align: center;
    font-size: 1.4rem;
    color: #4d4d4d;
    height: 4.6rem;
    line-height: 4.6rem;
    background-color: #fff;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 10;
}

.consumptionList .toptitle::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.consumptionList .lists {
    margin-top: 4.6rem;
}

.consumptionList .lists ol {
    padding: 1rem 0.8rem;
}

.consumptionList .lists ol li {
    margin-top: 1rem;
    background-color: #fff;
    border-radius: 0.8rem;
    padding: 1.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
}

.consumptionList .lists ol li .storname {
    font-size: 1.4rem;
    color: #4c4c4c;
}

.consumptionList .lists ol li .money {
    color: #0bc11f;
    font-size: 1.4rem;
}

.consumptionList .lists ol li .bot {
    font-size: 1.2rem;
    color: #4C4C4C;
    margin-top: 0.8rem;
}

.consumptionList .lists ol li .bot .left {
    width: 6.2rem;
}

.consumptionList .lists .lastloader {
    font-size: 1.4rem;
    text-align: center;
    margin-top: 1rem;
    padding: 1rem 0;
    color: #999999;
}

.joinclass {
    background-color: #f6f6f6;
}

.joinclass .main {
    background-color: #fff;
    padding: 0 1.4rem;
    padding-bottom: 3rem;
}

.joinclass .main .toptitle {
    font-size: 1.6rem;
    color: #212121;
    text-align: center;
    padding: 1.6rem 0;
}

.joinclass .main .classcodeinput {
    font-size: 1.4rem;
    color: #212121;
}

.joinclass .main .inputbox {
    position: relative;
    margin-top: 2rem;
}

.joinclass .main .inputbox:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.joinclass .main .inputbox input {
    width: 100%;
    padding: 1.4rem 0;
    border-bottom: 1px solid #ccc;
    outline: none;
    border: none;
}

.joinclass .main .codeclass {
    padding: 1rem 0;
    font-size: 1.4rem;
    color: #212121;
}

.joinclass .main .subbtn button {
    display: block;
    margin: 0 auto;
    margin-top: 8rem;
    width: 80%;
    height: 4.4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    background-image: linear-gradient(to right, #f98436, #fb6f40);
    outline: none;
}

.joinclass .main .subbtn button:active {
    background-image: linear-gradient(to right, #f9a268, #fb865e);
}

.joinclass .main .tocreate {
    text-align: center;
    margin-top: 3rem;
}

.joinclass .main .tocreate a {
    font-size: 1.4rem;
    color: #999999;
}

.joinclasstip {
    position: fixed;
    width: 26rem;
    min-height: 30.8rem;
    z-index: 5;
    background-color: #fff;
    left: 50%;
    top: 50%;
    margin-left: -13rem;
    margin-top: -15rem;
    border-radius: 0.8rem;
    padding: 0 2rem;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
    animation: 0.4s optyin forwards;
    -webkit-animation: 0.4s optyin forwards;
}

.joinclasstip .top {
    font-size: 1.6rem;
    color: #212121;
    text-align: center;
    margin-top: 2rem;
}

.joinclasstip .confirm {
    font-size: 1.4rem;
    color: #212121;
    margin-top: 2.4rem;
}

.joinclasstip .curntclass {
    font-size: 1.4rem;
    color: #ff7f24;
    margin-top: 1rem;
}

.joinclasstip .curentcode {
    font-size: 1.4rem;
    color: #212121;
    margin-top: 2rem;
    text-align: center;
}

.joinclasstip .curentcodeinput {
    width: 23rem;
    border: 1px solid #ccc;
    border-radius: 999px;
    margin: 0 auto;
    margin-top: 1rem;
    overflow: hidden;
}

.joinclasstip .curentcodeinput input {
    outline: none;
    width: 100%;
    padding: 1rem;
    border: none;
    text-align: center;
    font-size: 1.4rem;
}

.joinclasstip .botbtn {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 4.4rem;
    font-size: 1.4rem;
    width: 100%;
}

.joinclasstip .botbtn:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-top: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.joinclasstip .botbtn > div {
    text-align: center;
    line-height: 4.3rem;
    color: #666666;
    transition: all 0.2s;
}

.joinclasstip .botbtn > div:active {
    background-color: #f5f5f5;
}

.joinclasstip .botbtn .right {
    position: relative;
    color: #212121;
}

.joinclasstip .botbtn .right:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-left: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.createclass {
    background-color: #f6f6f6;
}

.createclass .main {
    background-color: #fff;
    padding: 0 1.4rem;
    padding-bottom: 3rem;
}

.createclass .main .toptitle {
    font-size: 1.6rem;
    color: #212121;
    text-align: center;
    padding: 1.6rem 0;
}

.createclass .main .listitem {
    padding: 1.2rem 0;
    position: relative;
}

.createclass .main .listitem:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.createclass .main .listitem .leftname {
    font-size: 1.4rem;
    color: #212121;
    width: 8.2rem;
}

.createclass .main .listitem .rightselece {
    padding-left: 0.2rem;
}

.createclass .main .listitem .rightselece select {
    width: 100%;
    border: none;
    outline: none;
    font-size: 1.4rem;
    background-color: rgba(0, 0, 0, 0);
}

.createclass .main .listitem .rightinput {
    padding-left: 0.2rem;
}

.createclass .main .listitem .rightinput input {
    width: 100%;
    border: none;
    outline: none;
}

.createclass .main .stor {
    font-size: 1.4rem;
    color: #212121;
}

.createclass .main .subbtn button {
    display: block;
    margin: 0 auto;
    margin-top: 4rem;
    width: 80%;
    height: 4.4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    background-image: linear-gradient(to right, #f98436, #fb6f40);
    outline: none;
}

.createclass .main .subbtn button:active {
    background-image: linear-gradient(to right, #f9a268, #fb865e);
}

.createclass .main .Tips {
    font-size: 1.4rem;
    color: #666666;
    margin-top: 3rem;
}

.myclass {
    background-color: #f6f6f6;
    padding-bottom: 4rem;
}

.myclass .topinfo {
    background-color: #fff;
    border-radius: 0 0 0.8rem 0.8rem;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
}

.myclass .topinfo .classname {
    background-color: #f46601;
    padding: 2rem 2rem 1rem 2rem;
}

.myclass .topinfo .classname .name {
    font-size: 1.6rem;
    color: #fff;
}

.myclass .topinfo .classname .classnumber {
    font-size: 1.4rem;
    color: #fff;
    margin-top: 1rem;
}

.myclass .topinfo .classattribute {
    background-color: #fa7314;
    padding: 0.6rem 2rem;
}

.myclass .topinfo .classattribute > .flex-1 {
    color: #fff;
    padding: 0 0.5rem;
    font-size: 1.2rem;
}

.myclass .topinfo .classattribute a {
    color: #fff;
}

.myclass .topinfo .classattribute i {
    display: block;
    margin-right: 0.5rem;
    position: relative;
    top: 0.1rem;
}

.myclass .topinfo .consumption {
    padding: 1.5rem 0 1rem 0;
    background-color: #fff;
    border-radius: 0 0 0.8rem 0.8rem;
}

.myclass .topinfo .consumption .topfont {
    font-size: 1.4rem;
    color: #333333;
    text-align: center;
}

.myclass .topinfo .consumption .lr {
    position: relative;
}

.myclass .topinfo .consumption .lr:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-right: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.myclass .topinfo .consumption .money {
    text-align: center;
    color: #ff7f24;
    margin-top: 0.6rem;
}

.myclass .topinfo .consumption .money span:nth-child(1) {
    font-size: 1.2rem;
}

.myclass .topinfo .consumption .money span:nth-child(2) {
    font-size: 1.6rem;
}

.myclass .nobind {
    padding: 0 1rem;
    margin-top: 1rem;
}

.myclass .nobind > div {
    padding: 1.5rem 0;
    background-color: #fff;
    border-radius: 0.4rem;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
}

.myclass .nobind > div .top {
    font-size: 1.4rem;
    color: #333333;
    text-align: center;
}

.myclass .nobind > div .dec {
    font-size: 1.4rem;
    color: #f60e0e;
    margin-top: 0.5rem;
    text-align: center;
}

.myclass .nobind > div .inputbox {
    margin-top: 2rem;
    padding: 0 1.5rem;
}

.myclass .nobind > div .inputbox > div {
    background-color: #f6f6f6;
    border-radius: 0.4rem;
    overflow: hidden;
}

.myclass .nobind > div .inputbox > div input {
    width: 100%;
    outline: none;
    border: none;
    background-color: rgba(0, 0, 0, 0);
    padding: 1.4rem;
}

.myclass .nobind > div .subbtn button {
    display: block;
    margin: 0 auto;
    width: 18rem;
    background-color: #fa7314;
    color: #fff;
    font-size: 1.4rem;
    transition: background-color 0.3s;
    padding: 0.8rem 0 1rem 0;
    border-radius: 999px;
    margin-top: 1.6rem;
}

.myclass .nobind > div .subbtn button:active {
    background-color: #fb8e42;
}

.myclass .isbind {
    padding: 0 1rem;
    margin-top: 1rem;
}

.myclass .isbind > div {
    padding: 1.5rem;
    background-color: #fff;
    border-radius: 0.4rem;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
}

.myclass .isbind > div .account {
    font-size: 1.2rem;
    text-align: center;
    margin-top: 1rem;
}

.myclass .isbind > div .account > div:nth-child(2) {
    position: relative;
}

.myclass .isbind > div .account > div:nth-child(2):before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-right: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-left: 1px solid #ccc;
}

.myclass .isbind > div .account > div > div:nth-child(2) {
    color: #fb8e42;
    margin-top: 0.5rem;
}

.myclass .isbind > div .top {
    font-size: 1.4rem;
    color: #fa7314;
}

.myclass .isbind > div .bot {
    font-size: 1.4rem;
    color: #999999;
    margin-top: 1rem;
}

.myclass .Classmate {
    padding: 0 1rem;
    margin-top: 1rem;
}

.myclass .Classmate .classmatetitle {
    font-size: 1.4rem;
    color: #212121;
}

.myclass .Classmate .toInvitation {
    padding: 0.5rem 1rem;
    background-color: #fa7314;
    border-radius: 999px;
    color: #fff;
    transition: background-color 0.3s;
}

.myclass .Classmate .toInvitation:active {
    background-color: #fb8e42;
}

.myclass .Classmate .toInvitation i {
    font-size: 1.4rem;
}

.myclass .Classmate .toInvitation span {
    font-size: 1.2rem;
}

.myclass .Classmate > div {
    padding: 1.5rem;
    background-color: #fff;
    border-radius: 0.4rem;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
}

.myclass .Classmate .list li {
    padding: 1rem 0;
    position: relative;
}

.myclass .Classmate .list li:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.myclass .Classmate .list li:nth-last-child(1):before {
    border: none;
}

.myclass .Classmate .list .head {
    width: 3.6rem;
    height: 3.6rem;
    border-radius: 50%;
    margin-right: 1rem;
}

.myclass .Classmate .list .name {
    font-size: 1.4rem;
    color: #212121;
}

.myclass .Classmate .list .addtime {
    font-size: 1.2rem;
    color: #999999;
    margin-top: 0.2rem;
}

.classcodebox {
    position: fixed;
    background-color: #fff;
    left: 50%;
    top: 50%;
    margin-left: -12rem;
    width: 24rem;
    height: 30rem;
    margin-top: -15rem;
    border-radius: 0.8rem;
    z-index: 5;
    animation: optyin 0.3s forwards;
    -webkit-animation: optyin 0.3s forwards;
    transition: all 0.3s;
}

.classcodebox .code {
    width: 20rem;
    height: 20rem;
    background-color: #ccc;
    display: block;
    margin: 0 auto;
    margin-top: 2rem;
}

.classcodebox .fonttip {
    font-size: 1.4rem;
    text-align: center;
    color: #fa7314;
    margin-top: 1rem;
}

.classcodebox .close {
    margin-top: 1rem;
}

.classcodebox .close button {
    display: block;
    margin: 0 auto;
    width: 12rem;
    height: 3.4rem;
    background-color: #fa7314;
    border-radius: 999px;
    color: #fff;
    transition: background-color 0.3s;
    font-size: 1.4rem;
}

.classcodebox .close button:active {
    background-color: #fb8e42;
}

.myclassjoin {
    background-color: #ff7f24;
}

.myclassjoin .codeimg {
    position: relative;
}

.myclassjoin .codeimg .joinbg {
    width: 100%;
    display: block;
}

.myclassjoin .codeimg .codebox {
    position: absolute;
    width: 10.6rem;
    height: 10.6rem;
    background-color: #ccc;
    display: block;
    left: 50%;
    top: 50%;
    margin-left: -5.3rem;
    margin-top: -10%;
}

.myclassjoin #mycanvas {
    width: 100%;
}

.selftasks {
    padding-bottom: 4rem;
}

.selftasks .toptitle {
    text-align: center;
    font-size: 1.4rem;
    color: #4d4d4d;
    height: 4.6rem;
    line-height: 4.6rem;
    background-color: #fff;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 10;
}

.selftasks .toptitle::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.selftasks .lists {
    margin-top: 4.6rem;
}

.selftasks .lists ol {
    padding: 1rem 0.8rem;
}

.selftasks .lists ol li {
    margin-top: 1rem;
    background-color: #fff;
    border-radius: 0.8rem;
    padding: 1.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
}

.selftasks .lists ol li .top {
    font-size: 1.2rem;
    position: relative;
    padding: 0.4rem 0 1rem 0;
}

.selftasks .lists ol li .top:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    overflow: hidden;
    pointer-events: none;
}

.selftasks .lists ol li .top .nomal {
    color: #0bc11f;
}

.selftasks .lists ol li .top .yellow {
    color: #f1970a;
}

.selftasks .lists ol li .time,
.selftasks .lists ol li .money {
    font-size: 1.4rem;
    color: #4c4c4c;
    margin-top: 0.4rem;
}

.selftasks .lists ol li .time .left,
.selftasks .lists ol li .money .left {
    width: 8rem;
}

.selftasks .lists ol li .time {
    margin-top: 0.6rem;
}

.selftasks .lists ol .filelist {
    position: relative;
    padding-bottom: 0.8rem;
}
.selftasks .lists ol .filelist.no-border:before{
    display: none;
}

.selftasks .lists ol .filelist .result {
    float: right;
    top: 0;
    margin-top: -2.5rem;
}

.selftasks .lists ol .filelist .money {
    float: right;
    top: 0;
    margin-top: -0.5rem;
    font-size: 1.2rem;
}

.text-align-right {
    text-align: right;
}

.selftasks .lists ol .filelist:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    overflow: hidden;
    pointer-events: none;
}

.selftasks .lists ol .file {
    margin-top: 1rem;
}

.selftasks .lists ol .file .lefticon {
    width: 3.2rem;
    height: 3.2rem;
    margin-right: 1rem;
}

.selftasks .lists ol .file .filename,
.selftasks .lists ol .file .name {
    font-size: 1.2rem;
    word-break: break-all;
}

.selftasks .lists ol .file .name {
    margin-top: 0.5rem;
}

.selftasks .lists ol .file .taglist {
    margin-top: 0.8rem;
}

.selftasks .lists ol .file .taglist .tag {
    padding: 0.4rem 1rem;
    background-color: #f1f1f1;
    color: #4c4c4c;
    font-size: 1.2rem;
    text-align: center;
    float: left;
    border-radius: 999px;
    margin-right: 1rem;
    margin-bottom: 0.4rem;
    line-height: 1.2rem;
}

.selftasks .lists ol .file.ecp .status-and-money .result, .selftasks .lists ol .file.ecp .status-and-money .money{
    margin: 0;
}
.selftasks .lists ol .file.ecp .status-and-money{
    display: flex;
    flex-direction: column;
    text-align: right;
}
.selftasks .lists ol .file.ecp .img-box img{
    margin: 0;
}
.selftasks .lists ol .file.ecp .img-box .downloadbtn{
    margin: 0 auto;
    width: 3rem;
    height: 2rem;
    line-height: 2rem;
    background-color: #ff7f24;
    color: #fff;
    border-radius: 0.8rem;
    font-size: 1.1rem;
}
.selftasks .lists ol .file.ecp .img-box{
    margin-right: 1.2rem;
    text-align: center;
}
.selftasks .lists ol .file.ecp .ooo{
    color: #ff7f24;
}
.selftasks .lists ol .file.ecp{
    align-items: center;
}

.selftasks .lastloader {
    font-size: 1.4rem;
    text-align: center;
    margin-top: 1rem;
    padding: 1rem 0;
    color: #999999;
}

.selftasks .iconfont {
    color: #999;
}

.selftasks .detail-box {
    font-size: 1.2rem;
    color: #999;
    padding: 1rem 0;
}

.selftasks .detail-box .waitfor {
    color: #ff7f24;
}

.selftasks .row {
    line-height: 2.5rem;
}

.selftasks .file-img-box {
    position: relative;
}

.selftasks .file-img-box span {
    position: absolute;
    bottom: -0.4rem;
    left: 0;
    font-size: 1.2rem;
    padding-left: 0.4rem;
}

.selftasks .file-img-box span.fail {
    color: red;
}

.selftasks .file-img-box span.nofile {
    position: relative;
    padding-right: 2rem;
}


.integral {
    padding-bottom: 4rem;
}

.integral .toptitle {
    text-align: center;
    font-size: 1.4rem;
    color: #4d4d4d;
    height: 4.6rem;
    line-height: 4.6rem;
    background-color: #fff;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 10;
}

.integral .toptitle::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.integral .lists {
    margin-top: 4.6rem;
}

.integral .lists ol {
    padding: 1rem 0.8rem;
}

.integral .lists ol li {
    margin-top: 1rem;
    background-color: #fff;
    border-radius: 0.8rem;
    padding: 1.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
}

.integral .lists ol li .Obtain .flex-1 {
    font-size: 1.4rem;
    color: #4c4c4c;
}

.integral .lists ol li .Obtain .add {
    color: #0bc11f;
    font-size: 1.8rem;
}

.integral .lists ol li .Obtain .less {
    color: #ec0949;
    font-size: 1.8rem;
}

.integral .lists ol li .time,
.integral .lists ol li .money {
    font-size: 1.2rem;
    color: #4c4c4c;
    margin-top: 0.4rem;
}

.integral .lists ol li .time .left,
.integral .lists ol li .money .left {
    width: 8rem;
}

.integral .lists ol li .time {
    margin-top: 0.6rem;
}

.integral .lists .lastloader {
    font-size: 1.4rem;
    text-align: center;
    margin-top: 1rem;
    padding: 1rem 0;
    color: #999999;
}

.personalcenter .topheadbox {
    padding: 1.6rem 1rem 1rem 1rem;
    background-image: -moz-linear-gradient(top, #ff7f24, #f2f3f5);
    /* Firefox */
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ff7f24), color-stop(1, #f2f3f5));
    /* Saf4+, Chrome */
}

.personalcenter .headbox {
    background-color: #fff;
    border-radius: 0.8rem;
    padding-bottom: 2rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.1);
}

.personalcenter .headbox .head {
    width: 4.4rem;
    height: 4.4rem;
    border: 0.2rem solid #fff;
    border-radius: 999px;
    overflow: hidden;
    display: block;
    margin: 0 auto;
    position: relative;
    top: -0.8rem;
}

.personalcenter .headbox .head > img {
    width: 100%;
    height: 100%;
}

.personalcenter .headbox .name,
.personalcenter .headbox .phone {
    font-size: 1.4rem;
    text-align: center;
    position: relative;
    top: -0.4rem;
}

.personalcenter .headbox .name {
    color: #212121;
}

.personalcenter .headbox .phone {
    color: #999999;
    display: block;
}

.personalcenter .headbox .exchange {
    text-align: center;
}

.personalcenter .headbox .exchange > div:nth-child(1) {
    position: relative;
}

.personalcenter .headbox .exchange > div:nth-child(1):before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-right: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    height: 160%;
    top: 20%;
}

.personalcenter .headbox .exchange .top {
    font-size: 1.2rem;
    color: #999999;
}

.personalcenter .headbox .exchange .money {
    margin-top: 0.8rem;
    font-size: 1.4rem;
    color: #212121;
}

.personalcenter .headbox .exchange .subbtn {
    margin-top: 0.8rem;
}

.personalcenter .headbox .exchange .subbtn a {
    border: 0.1rem solid #ff7a22;
    color: #ff7a22;
    text-align: center;
    width: 8rem;
    display: block;
    margin: 0 auto;
    padding: 0.5rem 0;
    border-radius: 999px;
}

.personalcenter .headbox .bannertree {
    width: 34rem;
    max-width: 90%;
    display: block;
    margin: 0 auto;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

.personalcenter .headbox .bannertree .num {
    line-height: 1.4rem;
    position: absolute;
    font-size: 1.2rem;
    left: 50%;
    top: 8%;
    margin-left: 3.2%;
    text-align: center;
    margin-top: 0.1rem;
    color: #43a774;
    width: 3rem;
}

.personalcenter .botlist {
    padding: 0 1rem;
    padding-bottom: 0;
    background-color: #fff;
}

.personalcenter .botlist ol li {
    padding: 1.5rem 0.5rem;
    position: relative;
    transition: all 0.3s;
}

.personalcenter .botlist ol li:active {
    background-color: #fafafa;
}

.personalcenter .botlist ol li:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.personalcenter .botlist ol li:nth-last-child(1)::before {
    border: none;
}

.personalcenter .botlist ol li .iconleft {
    width: 2.8rem;
    height: 2.8rem;
    background-size: cover;
    margin-right: 0.8rem;
}

.personalcenter .botlist ol li .jt {
    color: #999;
}

.transferOut .toptitle {
    text-align: center;
    font-size: 1.4rem;
    position: relative;
    color: #4d4d4d;
    height: 4rem;
    line-height: 4rem;
    background-color: #fff;
}

.transferOut .toptitle::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.transferOut .transfer {
    padding: 1rem 2rem;
}

.transferOut .transfer .mid {
    background-color: #fff;
    border-radius: 0.8rem;
    padding: 1rem 2rem;
    padding-bottom: 2rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.1);
}

.transferOut .transfer .mid .balance {
    text-align: center;
    font-size: 1.4rem;
    color: #212121;
    margin-top: 1rem;
}

.transferOut .transfer .mid .balance span {
    color: #ff7f24;
}

.transferOut .transfer .mid .phoneinput {
    margin-top: 1rem;
    border-bottom: 0.1rem solid #ccc;
    padding: 1rem;
}

.transferOut .transfer .mid .phoneinput input {
    width: 100%;
    font-size: 1.4rem;
    text-align: center;
    border: none;
    outline: none;
}

.transferOut .transfer .mid .acquire {
    font-size: 1.4rem;
    margin-top: 1rem;
}

.transferOut .transfer .mid .acquire span {
    color: #ff7f24;
}

.transferOut .transfer .mid .acquirebtn {
    display: block;
    margin: 0 auto;
    margin-top: 2rem;
    width: 80%;
    height: 4.4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.transferOut .transfer .mid .acquirebtn:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.transferOut .describe {
    margin-top: 1rem;
}

.transferOut .describe li {
    color: #999999;
    font-size: 1.4rem;
    line-height: 1.5;
}

.rechargeout-box {
    width: 28rem;
    position: fixed;
    left: 50%;
    top: 50%;
    margin-left: -14rem;
    background-color: #fff;
    padding: 1rem;
    z-index: 5;
    border-radius: 0.6rem;
    padding-bottom: 2rem;
    margin-top: -14rem;
    animation: botshow 0.4s forwards;
    -webkit-animation: botshow 0.4s forwards;
}

.rechargeout-box .rightclose {
    position: absolute;
    width: 2.2rem;
    height: 2.2rem;
    font-size: 1.6rem;
    right: 1rem;
    top: 1rem;
    color: #999999;
    background-color: rgba(0, 0, 0, 0);
    text-align: center;
}

.rechargeout-box .headbox {
    width: 4.4rem;
    height: 4.4rem;
    border-radius: 50%;
    display: block;
    margin: 0 auto;
    overflow: hidden;
}

.rechargeout-box .headbox img {
    width: 100%;
    height: 100%;
}

.rechargeout-box .name {
    font-size: 1.4rem;
    text-align: center;
    color: #666666;
}

.rechargeout-box .Turnout {
    text-align: center;
    font-size: 1.4rem;
    margin-top: 0.5rem;
}

.rechargeout-box .Turnout span {
    color: #ff7f24;
}

.rechargeout-box .turnoutcode {
    text-align: center;
    font-size: 1.4rem;
    margin-top: 1.8rem;
}

.rechargeout-box .turnoutcode span {
    color: #ff7f24;
}

.rechargeout-box .code {
    font-size: 1.4rem;
    color: #212121;
    width: 80%;
    display: block;
    margin: 0 auto;
    margin-top: 1rem;
    border-bottom: 1px solid #ccc;
}

.rechargeout-box .code input {
    padding: 0.6rem 0;
    width: 100%;
    outline: none;
    text-align: center;
    border: none;
}

.rechargeout-box .outbtn {
    margin-top: 1rem;
}

.rechargeout-box .outbtn button {
    display: block;
    margin: 0 auto;
    margin-top: 2rem;
    width: 80%;
    height: 4.4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.rechargeout-box .outbtn button:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.errpage {
    padding: 0 4rem;
}

.errpage .erricon {
    display: block;
    width: 8rem;
    height: 8rem;
    margin-top: 15rem;
}

.errpage .errmsg {
    font-size: 1.4rem;
    margin-top: 2rem;
    text-align: center;
    line-height: 1.8;
}

.bgAccesslist {
    padding: 0 1.5rem;
    background-color: #f5f5f5;
    min-height: 100vh;
}

.bgAccesslist .Listtitle {
    font-size: 1.6rem;
    color: #4c4c4c;
    padding: 1.5rem 0;
}

.bgAccesslist .Listtitle a {
    margin-right: 1.6rem;
    width: 7.6rem;
    text-align: center;
    font-size: 1.2rem;
    border-radius: 999px;
    background-color: #ffe6d9;
    padding: 0.4rem 0;
    color: #ff7e3e;
}

.bgAccesslist ol li {
    margin-top: 0.8rem;
    background-color: #fff;
    border-radius: 0.8rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.15);
    padding: 0.4rem 1rem 1rem 1rem;
}

.bgAccesslist ol li:nth-child(1) {
    margin-top: 0;
}

.bgAccesslist ol li .head {
    width: 2rem;
    height: 2rem;
    margin-right: 0.5rem;
    border-radius: 50%;
    overflow: hidden;
}

.bgAccesslist ol li .cont {
    font-size: 1.2rem;
}

.bgAccesslist ol li .cont > div:nth-child(2) {
    margin-top: 0.6rem;
}

.bgAccesslist ol li .subbtn a {
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    font-size: 1.2rem;
    padding: 0.5rem 1rem;
    box-shadow: 0 0.2rem 0.2rem rgba(0, 0, 0, 0.1);
}

.bgAccesslist ol li .subbtn a:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.bgAccessdetail {
    background-color: #f5f5f5;
    padding: 1rem;
    min-height: 100vh;
}

.bgAccessdetail .userinfo {
    background-color: #fff;
    border-radius: 0.8rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.05);
    padding: 1rem;
}

.bgAccessdetail .userinfo .midheadbox {
    width: 4.4rem;
    height: 4.4rem;
    display: block;
    margin: 0 auto;
    margin-top: 1rem;
    border-radius: 50%;
    overflow: hidden;
}

.bgAccessdetail .userinfo .name {
    text-align: center;
    font-size: 1.4rem;
    color: #140e0a;
    margin-top: 1rem;
}

.bgAccessdetail .userinfo .centerinfo {
    font-size: 1.4rem;
    width: 30rem;
    display: block;
    margin: 0 auto;
    margin-top: 2rem;
    color: #140e0a;
}

.bgAccessdetail .userinfo .centerinfo > div {
    padding: 0.4rem 0;
}

.bgAccessdetail .userinfo .centerinfo .left {
    text-align: right;
    width: 8rem;
}

.bgAccessdetail .userinfo .centerinfo .flex-1 {
    width: 0;
}

.bgAccessdetail .botlist {
    background-color: #fff;
    border-radius: 0.8rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.05);
    padding: 1rem;
    margin-top: 1rem;
}

.bgAccessdetail .botlist .toptitle {
    font-size: 1.4rem;
    color: #140e0a;
    position: relative;
    padding-left: 1rem;
    margin-bottom: 0.5rem;
}

.bgAccessdetail .botlist .toptitle:before {
    content: '';
    width: 0.4rem;
    height: 1rem;
    border-radius: 999px;
    background-color: #ff7f24;
    position: absolute;
    left: 0.2rem;
    top: 0.5rem;
}

.bgAccessdetail .botlist ol li {
    padding: 0.6rem;
}

.bgAccessdetail .botlist ol li a {
    padding: 0.8rem 0;
}

.bgAccessdetail .botlist ol li .flex-1 span {
    color: #ff7f24;
}

.bgAccessdetail .botlist ol li:nth-child(2n) {
    background-color: #f5f5f5;
}

.bgAccessdetail .botlist .loadermore {
    margin-top: 1rem;
}

.bgAccessdetail .botlist .loadermore button {
    display: block;
    margin: 0 auto;
    border: none;
    outline: none;
    text-align: center;
    background-color: inherit;
    color: #999999;
}

.LostandFound {
    background-color: #f0f0f0;
    min-height: 100vh;
}

.LostandFound .topyellow {
    width: 100%;
    height: 18rem;
    background-color: #ff7f24;
    border-radius: 0 0 80% 80%;
}

.LostandFound .topyellow .itemcard {
    width: 30rem;
    background-color: #ffffff;
    border-radius: 1rem;
    box-shadow: 0 0.4rem 0.8rem rgba(153, 153, 153, 0.2);
    display: block;
    margin: 0 auto;
    position: relative;
    top: 4rem;
    padding-bottom: 3rem;
}

.LostandFound .topyellow .itemcard .item {
    width: 50%;
    margin-top: 3rem;
    position: relative;
}

.LostandFound .topyellow .itemcard .item:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-right: 1px solid #f0f0f0;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.LostandFound .topyellow .itemcard .item img {
    width: 10rem;
    display: block;
    margin: 0 auto;
}

.LostandFound .topyellow .itemcard .item .name {
    width: 10rem;
    font-size: 1.8rem;
    text-align: center;
    color: #333333;
    display: block;
    margin: 0 auto;
}

.LostandFondlist {
    padding-top: 4rem;
    background-color: #f0f0f0;
    min-height: 100vh;
}

.LostandFondlist .head {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    background-color: #fff;
    text-align: right;
    height: 4rem;
    line-height: 4rem;
    padding: 0rem 1rem;
    box-shadow: 0rem 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    color: #333333;
}

.LostandFondlist .head .iconfont {
    color: #ff7f24;
}

.LostandFondlist .list {
    padding: 0 0.4rem;
}

.LostandFondlist .list li {
    padding: 0.4rem;
    margin-top: 1rem;
    width: 50%;
}

.LostandFondlist .list li .mid {
    background-color: #fff;
    padding: 1rem;
    border-radius: 0.4rem;
}

.LostandFondlist .list li .mid .itemimg {
    width: 14rem;
    height: 14rem;
    display: block;
    margin: 0 auto;
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    position: relative;
}

.LostandFondlist .list li .mid .itemimg .isfind {
    width: 0;
    height: 0;
    border-top: 6rem solid rgba(255, 127, 36, 0.8);
    border-right: 6rem solid transparent;
    position: relative;
}

.LostandFondlist .list li .mid .itemimg .isfind .text {
    color: #fff;
    position: absolute;
    font-size: 1.4rem;
    width: 6rem;
    top: -4.8rem;
    left: -0.8rem;
    text-align: center;
    transform: rotate(-45deg);
}

.LostandFondlist .list li .mid .itemname {
    color: #333333;
    font-size: 1.4rem;
    height: 2rem;
    left: 2rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 1rem;
}

.LostandFondlist .list li .mid .itemname i {
    display: inline-block;
    width: 0.4rem;
    height: 1.6rem;
    background-color: #ff7f24;
    vertical-align: -0.3rem;
    margin-right: 0.4rem;
}

.LostandFondlist .backtotop {
    position: fixed;
    width: 5.2rem;
    height: 5.2rem;
    color: #ff7f24;
    right: 1.6rem;
    bottom: 6rem;
    border-radius: 50%;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

.LostandFondlist .backtotop i {
    position: relative;
    display: block;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    top: -0.2rem;
}

.LostandFondlist .backtotop > div {
    text-align: center;
    font-size: 1.2rem;
}

.LostandFondlist .noinfo {
    padding-top: 10rem;
    width: 20rem;
    display: block;
    margin: 0 auto;
}

.LostandFondlist .noinfo .text {
    font-size: 1.4rem;
    text-align: center;
}

.environment {
    background-color: #5cc27f;
    background-image: url(../images/environment/bg.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
    display: block;
    margin: 0 auto;
    max-width: 580px;
}

.environment .environmenttitle {
    position: absolute;
    left: 50%;
    top: 1rem;
    width: 24rem;
    margin-left: -12rem;
}

.environment .envdec {
    position: absolute;
    left: 50%;
    width: 28rem;
    margin-left: -14rem;
    top: 9.4%;
    padding: 1rem 0;
    border-top: 0.1rem solid #21b66d;
    border-bottom: 0.1rem solid #21b66d;
}

.environment .contentlist {
    position: absolute;
    width: 34rem;
    left: 50%;
    margin-left: -17rem;
    top: 45rem;
    background-color: rgba(255, 255, 255, 0.85);
    border-radius: 1rem;
    padding: 2rem 2rem;
    font-size: 1.6rem;
}

.environment .contentlist .font-big {
    font-size: 2.6rem;
}

.environment .contentlist .save {
    margin-top: 0.8rem;
}

.environment .contentlist .trees {
    margin: 0 0.2rem;
}

.environment .contentlist .quite {
    margin-top: 1rem;
}

.environment .contentlist .quite .flex-1 {
    margin-left: 0.4rem;
}

.environment .contentlist .quite .blocknumber {
    width: 3.6rem;
    height: 3.6rem;
    margin-right: 0.4rem;
    background-image: -moz-linear-gradient(top, #a7e98f, #4ab87a);
    /* Firefox */
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #a7e98f), color-stop(1, #4ab87a));
    /* Saf4+, Chrome */
}

.environment .contentlist .quite .blocknumber:nth-last-child(1) {
    margin-right: 0;
}

.environment .contentlist .quite .blocknumber .numbers {
    width: 3.6rem;
    height: 3.6rem;
    background-image: url(../images/environment/numbers.png);
    background-size: 3.6rem 36rem;
    transition: all 0.8s;
    -webkit-transform: all 0.8s;
}

.environment .contentlist .quite.sm .blocknumber {
    width: 2.4rem;
    height: 2.4rem;
}

.environment .contentlist .quite.sm .numbers {
    width: 2.4rem;
    height: 2.4rem;
    background-size: 2.4rem 24rem;
}

.chooseSchool {
    background-color: #fff;
}

.chooseSchool .top {
    padding: 0 1rem;
    margin-top: 1.1rem;
}

.chooseSchool .top .cancel {
    width: 6rem;
    text-align: center;
}

.chooseSchool .top .searchinput {
    background-color: #f5f5f5;
    border-radius: 999rem;
    padding: 1rem 0;
    padding-top: 1.2rem;
}

.chooseSchool .top .searchinput i {
    color: #4d4d4d;
    width: 4rem;
    text-align: center;
    font-size: 1.8rem;
    line-height: 2rem;
    margin-left: 1rem;
}

.chooseSchool .top .searchinput input {
    width: 100%;
    border: none;
    outline: none;
    background-color: rgba(0, 0, 0, 0);
    line-height: 2rem;
    font-size: 1.4rem;
}

.chooseSchool .topline-2 {
    padding: 0 2rem;
    position: relative;
}

.chooseSchool .topline-2 > div {
    padding: 1.5rem 0 1.2rem 0;
    font-size: 1.4rem;
    position: relative;
}

.chooseSchool .topline-2 > div:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.chooseSchool .topline-2 > div .province {
    padding: 0 1rem;
}

.chooseSchool .topline-2 > div .province > i {
    margin-left: 0.5rem;
}

.chooseSchool .schoollist {
    position: relative;
}

.chooseSchool .schoollist ol {
    margin-top: 1rem;
    padding: 0 2rem;
}

.chooseSchool .schoollist ol li {
    padding: 1.2rem 0;
    font-size: 1.4rem;
}

.chooseSchool .schoollist .sheng {
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    top: 0rem;
    left: 0;
    position: absolute;
}

.chooseSchool .schoollist .sheng .shenglist {
    padding-top: 2rem;
    padding-left: 1rem;
    padding-right: 1rem;
    background-color: #fff;
}

.chooseSchool .schoollist .sheng .shenglist > div {
    width: 25%;
    margin-bottom: 1.5rem;
}

.chooseSchool .schoollist .sheng .shenglist > div .itembox {
    width: 7.6rem;
    height: 3.4rem;
    line-height: 3.4rem;
    text-align: center;
    border: 0.1rem solid #cccccc;
    display: block;
    margin: 0 auto;
    border-radius: 0.6rem;
    font-size: 1.4rem;
    color: #212121;
}

.chooseSchool .schoollist .sheng .shenglist > div.active .itembox {
    border: 0.1rem solid #ff7f24;
    background-color: #fff2e9;
}

.followpage {
    background-image: -moz-linear-gradient(top, #ff8225, #ffb33e);
    /* Firefox */
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ff8225), color-stop(1, #ffb33e));
    /* Saf4+, Chrome */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff8225', endColorstr='#ffb33e', GradientType='0');
    /* IE*/
    padding: 0 2rem;
}

.followpage .midbox {
    width: 100%;
    margin-top: 3rem;
    position: relative;
}

.followpage .midbox .bgimg {
    width: 100%;
}

.followpage .midbox .codeimg {
    position: absolute;
    left: 50%;
    bottom: 22%;
    margin-left: -6rem;
    width: 12rem;
    height: 12rem;
}

.followpage .midbox .codeimg .code {
    width: 12rem;
    height: 12rem;
    border: 0.4rem solid #fff;
    border-radius: 0.8rem;
    box-shadow: 0 0.15rem 0.6rem rgba(80, 24, 2, 0.1);
}

.followpage .midbox .codeimg .topfont {
    width: 100%;
    margin-top: 0.8rem;
    text-align: center;
    font-size: 1.4rem;
    color: #ff791a;
}

.followpage .midbox .nofolow {
    position: absolute;
    width: 10rem;
    left: 50%;
    bottom: 2.5rem;
    margin-left: -5rem;
    text-align: center;
    font-size: 1.4rem;
    color: #999999;
    padding: 0.4rem 0;
}

.popularizelist {
    background-color: #f2f3f5;
}

.popularizelist .pagetitle > div {
    font-size: 1.8rem;
    color: #212121;
    font-weight: bold;
    padding: 2rem 1.5rem;
}

.popularizelist .pagetitle a {
    margin-right: 1.6rem;
    width: 7.6rem;
    text-align: center;
    font-size: 1.2rem;
    border-radius: 999px;
    background-color: #ffe6d9;
    padding: 0.4rem 0;
    color: #ff7e3e;
}

.popularizelist .lists {
    padding: 0 1.5rem;
    padding-bottom: 12rem;
}

.popularizelist .lists .listitem {
    padding: 1rem;
    background-color: #fff;
    border-radius: 0.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    margin-top: 2rem;
}

.popularizelist .lists .listitem:nth-child(1) {
    margin-top: 0;
}

.popularizelist .lists .listitem .shareimg {
    width: 4.2rem;
    height: 4.2rem;
    background-color: #fff;
    background-size: cover;
    background-position: center;
    margin-right: 1.5rem;
}

.popularizelist .lists .listitem .shareimg2 {
    width: 4.2rem;
    height: 4.2rem;
    background-color: #fff;
    background-size: cover;
    background-position: center;
    margin-left: 1.5rem;
}

.popularizelist .lists .listitem .sharetitle {
    font-size: 1.4rem;
    color: #212121;
}

.popularizelist .lists .listitem .sharecontent {
    margin-top: 1rem;
    font-size: 1.2rem;
    line-height: 1.5;
    color: #666666;
}

.popularizelist .lists .listitem .sharelink {
    margin-top: 0.5rem;
    word-break: break-all;
}

.popularizelist .lists .listitem .sharelink i {
    color: #ff7e3e;
    font-size: 2rem;
}

.popularizelist .lists .listitem .sharelink span {
    font-size: 1.2rem;
    color: #999999;
    word-break: break-all;
}

.popularizelist .lists .listitem .private {
    font-size: 1.2rem;
    color: #ff7e3e;
    padding-left: 1.8rem;
}

.popularizelist .lists .listitem .subbtngroup {
    margin-top: 1rem;
}

.popularizelist .lists .listitem .subbtngroup button {
    width: 9rem;
    height: 2.6rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    float: right;
    font-size: 1.2rem;
    margin-right: 1rem;
}

.popularizelist .lists .listitem .subbtngroup button:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.popularizelist .lists .listitem .subbtngroup button:nth-child(1) {
    margin: 0;
}

.popularizelist .fixaddbtn {
    position: fixed;
    bottom: 4rem;
    left: 50%;
    width: 28rem;
    height: 4.2rem;
    margin-left: -14rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.toplist {
    background-color: #f2f3f5;
    margin: 1rem 1rem 5rem;
    border-radius: 0.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
}

.toplist .pagetitle {
    position: relative;
    padding: 0.6rem;
    border-top-left-radius: 0.5rem 0.5rem;
    border-top-right-radius: 0.5rem 0.5rem;
    background-image: linear-gradient(#fb9a45, #fc6c36, #fb9543);
}

.toplist .pagetitle .img-banner{
    width: 100%;
}
.toplist .pagetitle .img-title{
    position: absolute;
    top: 17vw;
    left: 12vw;
    width: 73vw;
}

.toplist .pagetitle > div {
    font-size: 1.8rem;
    color: white;
    font-weight: bold;
    padding: 4rem 1.5rem;
}

.toplist .lists {
    background-color: #fff;
    border-bottom-left-radius: 0.5rem 0.5rem;
    border-bottom-right-radius: 0.5rem 0.5rem;
}
.toplist .lists .lists-ol{
    padding: 1rem 0;
}
.toplist .lists .listitem {
    padding: 0 1rem;
}

.toplist .lists .listitem .title-bg {
    padding: 1rem 0;
    border-bottom: 1px solid #f2f2f2;
    display: flex;
    align-items: center;
    min-height: 8rem;
}

.toplist .lists .listitem .title-bg .sharetitle {
    font-size: 1.6rem;
    line-height: 2.4rem;
    color: #1a1a1a;
}


.toplist .lists .listitem:last-child .title-bg {
    border-bottom: 0 solid #f2f2f2;
}

.toplist .lists .listitem .shareimg-box{
    height: 6rem;
    width: 6rem;
    padding: 0.5rem;
    box-sizing: border-box;
    background-color: #ffe5d3;
    margin-left: 1rem;
}
.toplist .lists .listitem .shareimg {
    width: 5rem;
    height: 5rem;
    box-sizing: border-box;
    border-radius: 5px;
    border: 1px solid #bf9272;
}

.popularizelist .fixaddbtn:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.popularizecreate .outpadding {
    padding: 1rem;
}

.popularizecreate .outpadding .createcard {
    background-color: #fff;
    padding: 1.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    padding-bottom: 4rem;
}

.popularizecreate .outpadding .cardtitle {
    padding: 1rem 0;
    text-align: center;
    font-size: 1.8rem;
    color: #333333;
}

.popularizecreate .outpadding .popularizeinput,
.popularizecreate .outpadding .picture {
    padding: 0 1rem;
    margin-top: 1.5rem;
}

.popularizecreate .outpadding .popularizeinput .title,
.popularizecreate .outpadding .picture .title {
    font-size: 1.4rem;
}

.popularizecreate .outpadding .popularizeinput .content,
.popularizecreate .outpadding .picture .content {
    font-size: 1.4rem;
    background-color: #f0f0f0;
    padding: 1rem;
    margin-top: 0.5rem;
}

.popularizecreate .outpadding .popularizeinput .content input,
.popularizecreate .outpadding .picture .content input,
.popularizecreate .outpadding .popularizeinput .content select,
.popularizecreate .outpadding .picture .content select {
    background-color: rgba(0, 0, 0, 0);
    border: none;
    outline: none;
    width: 100%;
}

.popularizecreate .outpadding .popularizeinput .content textarea,
.popularizecreate .outpadding .picture .content textarea {
    width: 100%;
    resize: none;
    background-color: rgba(0, 0, 0, 0);
    border: none;
    outline: none;
}

.popularizecreate .outpadding .popularizeinput .tips,
.popularizecreate .outpadding .picture .tips {
    font-size: 1.2rem;
    color: #ff7e3e;
    margin-top: 0.5rem;
}

.popularizecreate .outpadding .picture .content {
    padding-left: 0;
    background-color: rgba(0, 0, 0, 0);
}

.popularizecreate .outpadding .picture .imguploader {
    width: 4.8rem;
    height: 4.8rem;
    background-size: cover;
    margin-right: 1rem;
    background-position: center;
}

.popularizecreate .outpadding .picture .changepicture {
    width: 8rem;
    height: 2.4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    font-size: 1.2rem;
}

.popularizecreate .outpadding .picture .changepicture:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.popularizecreate .outpadding .subbtn {
    margin-top: 4rem;
}

.popularizecreate .outpadding .subbtn button {
    width: 28rem;
    height: 4.2rem;
    display: block;
    margin: 0 auto;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.popularizecreate .outpadding .subbtn button:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.popularizedetails {
    padding-top: 4rem;
}

.popularizedetails .guide {
    position: fixed;
    left: 0;
    top: 0;
    height: 4rem;
    width: 100%;
    z-index: 1;
    background-color: #fa9050;
}

.popularizedetails .guide .font {
    font-size: 1.4rem;
    color: #fff;
    padding-left: 1.2rem;
}

.popularizedetails .guide .font span {
    margin: 0 0.5rem;
    font-size: 3.2rem;
    vertical-align: -0.5rem;
}

.popularizedetails .guide .iconfont.jt {
    color: #fff;
    font-size: 2.2rem;
    margin-right: 1.6rem;
}

.popularizedetails .outpadding {
    padding: 1rem;
}

.popularizedetails .outpadding .createcard {
    background-color: #fff;
    padding: 1.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    padding-bottom: 4rem;
}

.popularizedetails .outpadding .preview {
    position: relative;
    padding-bottom: 1.4rem;
}

.popularizedetails .outpadding .preview:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.popularizedetails .outpadding .preview .previewfonts {
    font-size: 1.4rem;
}

.popularizedetails .outpadding .preview .views {
    display: block;
    margin: 0 auto;
    margin-top: 1rem;
    background-color: #efefef;
    padding: 1rem;
}

.popularizedetails .outpadding .preview .views .viewcontent {
    background-color: #fff;
    padding: 1rem;
}

.popularizedetails .outpadding .preview .views .viewcontent .title {
    font-size: 1.6rem;
    line-height: 2.4rem;
    max-height: 4.8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #212121;
    padding-right: 1.6rem;
    word-break: break-all;
}

.popularizedetails .outpadding .preview .views .viewcontent .content {
    margin-top: 0.5rem;
    word-break: break-all;
    color: #666666;
    font-size: 1.4rem;
    line-height: 2.1rem;
    max-height: 6.3rem;
    overflow: hidden;
    text-overflow: ellipsis;
}

.popularizedetails .outpadding .preview .views .viewcontent .shareimg {
    width: 5.2rem;
    height: 5.2rem;
    background-size: cover;
    background-position: center;
    margin-left: 1rem;
    margin-right: 1.4rem;
    background-color: #fff;
}

.popularizedetails .outpadding .preview .previewfontsTips {
    font-size: 1.2rem;
    color: #999999;
    margin-top: 1.5rem;
    line-height: 1.5;
}

.popularizedetails .outpadding .preview .backtochange {
    border-radius: 999px;
    padding: 0.6rem 1.5rem;
    margin-right: 0.1rem;
}

.popularizedetails .outpadding .Promotioninfolist {
    font-size: 1.2rem;
    margin-top: 1rem;
    color: #999999;
}

.popularizedetails .outpadding .Promotioninfolist li {
    padding: 0.6rem 0;
    font-size: 1.4rem;
    color: #212121;
    line-height: 1.5;
    word-break: break-all;
}

.popularizedetails .outpadding .Promotioninfolist li .name {
    color: #666666;
    width: 8rem;
}

.popularizedetails .outpadding .Promotioninfolist li .imgshow {
    width: 4.8rem;
    height: 4.8rem;
    margin-right: 1rem;
    background-size: cover;
    background-position: center;
}

.popularizedetails .outpadding .Promotioninfolist li .singlechoice .isopen .radio {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    margin-right: 0.5rem;
    border: 0.2rem solid #ff7f24;
    position: relative;
    top: -0.2rem;
}

.popularizedetails .outpadding .Promotioninfolist li .singlechoice .isopen .radio:before {
    content: '';
    display: none;
    border-radius: 50%;
    position: absolute;
    width: 1rem;
    height: 1rem;
    background-color: #ff7f24;
    left: 50%;
    top: 50%;
    margin-left: -0.5rem;
    margin-top: -0.5rem;
}

.popularizedetails .outpadding .Promotioninfolist li .singlechoice .isopen:nth-child(1) .radio:before {
    display: block;
}

.popularizedetails .outpadding .Promotioninfolist li .singlechoice.two .isopen:nth-child(1) .radio:before {
    display: none;
}

.popularizedetails .outpadding .Promotioninfolist li .singlechoice.two .isopen:nth-child(2) .radio:before {
    display: block;
}

.popularizepreviewtip {
    position: fixed;
    left: 50%;
    top: 50%;
    width: 34rem;
    height: 32rem;
    background-color: #fff;
    margin-left: -17rem;
    margin-top: -22rem;
    padding: 1rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    animation: botshow 0.3s forwards;
    border-radius: 0.6rem;
    overflow: hidden;
    -webkit-animation: botshow 0.3s forwards;
}

.popularizepreviewtip .preview {
    position: relative;
    padding-bottom: 1.4rem;
}

.popularizepreviewtip .preview .previewfonts {
    font-size: 1.4rem;
}

.popularizepreviewtip .preview .views {
    width: 32rem;
    display: block;
    margin: 0 auto;
    margin-top: 1rem;
    background-color: #efefef;
    padding: 1rem;
}

.popularizepreviewtip .preview .views .viewcontent {
    background-color: #fff;
    padding: 1rem;
}

.popularizepreviewtip .preview .views .viewcontent .title {
    font-size: 1.6rem;
    line-height: 2.4rem;
    max-height: 4.8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #212121;
    padding-right: 1.6rem;
    word-break: break-all;
}

.popularizepreviewtip .preview .views .viewcontent .content {
    margin-top: 0.5rem;
    word-break: break-all;
    color: #666666;
    font-size: 1.4rem;
    line-height: 2.1rem;
    max-height: 6.3rem;
    overflow: hidden;
    text-overflow: ellipsis;
}

.popularizepreviewtip .preview .views .viewcontent .shareimg {
    width: 5.2rem;
    height: 5.2rem;
    background-size: cover;
    background-position: center;
    margin-left: 1rem;
    margin-right: 1.4rem;
    background-color: #fff;
}

.popularizepreviewtip .preview .previewfontsTips {
    font-size: 1.2rem;
    color: #999999;
    margin-top: 1.5rem;
    line-height: 1.5;
}

.popularizepreviewtip .btngroup {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
}

.popularizepreviewtip .btngroup:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-top: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.popularizepreviewtip .btngroup > div {
    text-align: center;
    line-height: 3.4;
    font-size: 1.6rem;
}

.popularizepreviewtip .btngroup > div:active {
    background-color: #efefef;
}

.popularizepreviewtip .btngroup > div:nth-child(1) {
    position: relative;
}

.popularizepreviewtip .btngroup > div:nth-child(1):before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-right: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.popularizepreviewtip .btngroup > div:nth-child(2) {
    color: #ff7f24;
}

.createorganization .topbg,
.organizationReview .topbg,
.searchorganization .topbg,
.joinorganization .topbg,
.organizationUnreview .topbg,
.Organizationinfo .topbg,
.orrecharge .topbg,
.Memberreview .topbg,
.orrechargecomplete .topbg {
    height: 22rem;
    background-image: -moz-linear-gradient(top, #ff7f24, #f2f3f5);
    /* Firefox */
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ff7f24), color-stop(1, #f2f3f5));
    /* Saf4+, Chrome */
}

.createorganization .content,
.organizationReview .content,
.searchorganization .content,
.joinorganization .content,
.organizationUnreview .content,
.Organizationinfo .content,
.orrecharge .content,
.Memberreview .content,
.orrechargecomplete .content {
    padding: 0 1rem;
    position: relative;
    margin-top: -20rem;
}

.createorganization .content .center,
.organizationReview .content .center,
.searchorganization .content .center,
.joinorganization .content .center,
.organizationUnreview .content .center,
.Organizationinfo .content .center,
.orrecharge .content .center,
.Memberreview .content .center,
.orrechargecomplete .content .center {
    background-color: #fff;
    padding: 3rem;
    border-radius: 0.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    padding-bottom: 4rem;
}

.createorganization .content .center .centertitle,
.organizationReview .content .center .centertitle,
.searchorganization .content .center .centertitle,
.joinorganization .content .center .centertitle,
.organizationUnreview .content .center .centertitle,
.Organizationinfo .content .center .centertitle,
.orrecharge .content .center .centertitle,
.Memberreview .content .center .centertitle,
.orrechargecomplete .content .center .centertitle {
    font-size: 1.6rem;
    color: #212121;
    font-weight: bold;
    text-align: center;
}

.createorganization .content .center {
    background-color: #fff;
    padding: 3rem;
    border-radius: 0.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    padding-bottom: 4rem;
}

.createorganization .content .center .centertitle {
    font-size: 1.6rem;
    color: #212121;
    font-weight: bold;
    text-align: center;
}

.createorganization .content .center .groupitem {
    position: relative;
    padding: 1rem 0;
    margin-top: 1.5rem;
}

.createorganization .content .center .groupitem .leftname {
    width: 8rem;
    padding-left: 0.2rem;
}

.createorganization .content .center .groupitem input {
    width: 100%;
    border: none;
    outline: none;
    font-size: 1.4rem;
}

.createorganization .content .center .groupitem:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.createorganization .content .picuploader {
    margin-top: 3rem;
}

.createorganization .content .picuploader .uploaderfont {
    font-size: 1.4rem;
    color: #000000;
}

.createorganization .content .picuploader ol li {
    width: 33.3%;
    margin-top: 1.2rem;
}

.createorganization .content .picuploader ol li > div {
    display: block;
    margin: 0 auto;
    width: 9.2rem;
    height: 9.2rem;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #f5f5f5;
    position: relative;
}

.createorganization .content .picuploader ol li > div .closebtn {
    position: absolute;
    right: 0.4rem;
    top: 0.4rem;
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    background-color: #ff7f24;
}

.createorganization .content .picuploader ol li > div .closebtn:before,
.createorganization .content .picuploader ol li > div .closebtn:after {
    width: 1.4rem;
    height: 0.2rem;
    content: '';
    background-color: #fff;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -0.7rem;
    margin-top: -0.1rem;
    border-radius: 999px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.createorganization .content .picuploader ol li > div .closebtn:after {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.createorganization .content .picuploader ol li .photouploader {
    padding-top: 1.4rem;
    background-color: #f5f5f5;
}

.createorganization .content .picuploader ol li .photouploader .photoicon {
    text-align: center;
    font-size: 3.6rem;
    color: #666;
}

.createorganization .content .picuploader ol li .photouploader .font {
    text-align: center;
    color: #666;
}

.createorganization .content .picuploader ol li .photouploader .label {
    display: block;
    width: 100%;
    height: 100%;
}

.createorganization .content .subbtn button {
    display: block;
    margin: 0 auto;
    width: 28rem;
    height: 4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    line-height: 3.8rem;
    margin-top: 6rem;
}

.createorganization .content .subbtn button:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.organizationReview .content .center {
    background-color: #fff;
    padding: 3rem;
    border-radius: 0.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    padding-bottom: 4rem;
}

.organizationReview .content .center .centertitle {
    font-size: 1.6rem;
    color: #212121;
    font-weight: bold;
    text-align: center;
}

.organizationReview .content .center .redfont {
    text-align: center;
    color: #fe2425;
    font-size: 1.4rem;
    margin-top: 1.2rem;
}

.organizationReview .content .center .info {
    font-size: 1.4rem;
    margin-top: 2rem;
}

.organizationReview .content .center .info li {
    margin-top: 1rem;
}

.organizationReview .content .center .info li .left {
    width: 8rem;
}

.organizationReview .content .center .picuploader {
    margin-top: 3rem;
}

.organizationReview .content .center .picuploader .uploaderfont {
    font-size: 1.4rem;
    color: #000000;
}

.organizationReview .content .center .picuploader ol li {
    width: 33.3%;
    margin-top: 1.2rem;
}

.organizationReview .content .center .picuploader ol li > div {
    display: block;
    margin: 0 auto;
    width: 9.2rem;
    height: 9.2rem;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #f5f5f5;
    position: relative;
}

.organizationReview .content .center .picuploader ol li > div .closebtn {
    position: absolute;
    right: 0.4rem;
    top: 0.4rem;
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    background-color: #ff7f24;
}

.organizationReview .content .center .picuploader ol li > div .closebtn:before,
.organizationReview .content .center .picuploader ol li > div .closebtn:after {
    width: 1.4rem;
    height: 0.2rem;
    content: '';
    background-color: #fff;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -0.7rem;
    margin-top: -0.1rem;
    border-radius: 999px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.organizationReview .content .center .picuploader ol li > div .closebtn:after {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.searchorganization .content .center .inputnumber {
    position: relative;
    margin-top: 2rem;
}

.searchorganization .content .center .inputnumber:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.searchorganization .content .center .inputnumber input {
    width: 100%;
    border: none;
    outline: none;
    padding: 0.8rem 0;
    font-size: 1.4rem;
}

.searchorganization .content .center .inputnumber .groupsearchbtn {
    width: 6rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    margin-left: 1rem;
    padding: 0.5rem 0;
    font-size: 1.2rem;
}

.searchorganization .content .center .inputnumber .groupsearchbtn:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.searchorganization .content .center .organizationlist li {
    border-radius: 0.8rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    padding: 0.8rem;
    position: relative;
    margin-top: 1.4rem;
    transition: all 0.3s;
}

.searchorganization .content .center .organizationlist li:active {
    box-shadow: none;
}

.searchorganization .content .center .organizationlist li:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #e0e0e0;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-radius: 0.8rem;
}

.searchorganization .content .center .organizationlist li .card {
    position: relative;
    padding: 1rem 1.5rem;
}

.searchorganization .content .center .organizationlist li .card:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #ffaa6d;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-radius: 0.8rem;
}

.searchorganization .content .center .organizationlist li .card .name {
    font-size: 1.6rem;
    color: #000000;
}

.searchorganization .content .center .organizationlist li .card .number {
    font-size: 1.4rem;
    color: #ff7f24;
    margin-top: 0.6rem;
}

.searchorganization .content .center .organizationlist li .card .admin {
    font-size: 1.4rem;
    margin-top: 0.6rem;
}

.searchorganization .tocreategroup button {
    display: block;
    margin: 0 auto;
    width: 28rem;
    height: 4rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0);
    border: none;
    outline: none;
    position: relative;
    transition: all 0.3s;
    color: #ff7f24;
    line-height: 3.8rem;
    margin-top: 6rem;
}

.searchorganization .tocreategroup button::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #ff7f24;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-radius: 999px;
}

.searchorganization .tocreategroup button:active {
    background-color: #ff7f24;
    color: #fff;
}

.joinorganization .guide {
    height: 4rem;
    width: 100%;
    background-color: #fa9050;
}

.joinorganization .guide .font {
    font-size: 1.4rem;
    color: #fff;
    padding-left: 1.2rem;
}

.joinorganization .guide .dian {
    position: relative;
    display: inline-block;
    margin: 0 1rem;
    top: 0.2rem;
    font-size: 1.8rem;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
}

.joinorganization .guide .iconfont.jt {
    color: #fff;
    font-size: 2.2rem;
    margin-right: 1.6rem;
}

.joinorganization .oname {
    margin-top: 2rem;
    font-size: 1.6rem;
    color: #000;
}

.joinorganization .invitepeople {
    font-size: 1.4rem;
    text-align: center;
    margin-top: 1rem;
}

.joinorganization .info {
    font-size: 1.4rem;
    margin-top: 1rem;
}

.joinorganization .info li {
    margin-top: 1rem;
}

.joinorganization .info li .leftname {
    width: 7rem;
}

.joinorganization .info li .name {
    font-size: 1.6rem;
    color: #000;
}

.joinorganization .groupitem {
    position: relative;
    padding: 1rem 0;
    margin-top: 1.5rem;
}

.joinorganization .groupitem .leftname {
    width: 7rem;
    padding-left: 0.2rem;
}

.joinorganization .groupitem input {
    width: 100%;
    border: none;
    outline: none;
}

.joinorganization .groupitem:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.joinorganization .subbtn button {
    display: block;
    margin: 0 auto;
    width: 28rem;
    height: 4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    font-size: 1.4rem;
    line-height: 3.8rem;
    margin-top: 6rem;
}

.joinorganization .subbtn button:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.organizationUnreview .redfont {
    text-align: center;
    color: #fe2425;
    font-size: 1.4rem;
    margin-top: 1.2rem;
}

.organizationUnreview .oname {
    margin-top: 2rem;
    font-size: 1.6rem;
    color: #000;
}

.organizationUnreview .info {
    font-size: 1.4rem;
    margin-top: 2rem;
    position: relative;
    padding-bottom: 2rem;
}

.organizationUnreview .info:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-bottom: 1px dashed #ccc;
}

.organizationUnreview .info li {
    margin-top: 1rem;
}

.organizationUnreview .info li .leftname {
    width: 7rem;
}

.organizationUnreview .info li .name {
    font-size: 1.6rem;
    color: #000;
}

.organizationUnreview .userinfoitem {
    margin-top: 1rem;
    font-size: 1.4rem;
}

.organizationUnreview .userinfoitem .left {
    width: 7rem;
}

.organizationUnreview .subbtn button {
    display: block;
    margin: 0 auto;
    width: 28rem;
    height: 4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    line-height: 3.8rem;
    margin-top: 6rem;
}

.organizationUnreview .subbtn button:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.Organizationinfo {
    background-color: #f2f3f5;
}

.Organizationinfo .infocard {
    padding: 1rem;
    position: relative;
    top: -21rem;
}

.Organizationinfo .infocard .card {
    background-color: #fff;
    border-radius: 1rem;
    padding: 2rem 0 3rem 0;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    position: relative;
}

.Organizationinfo .infocard .card .change {
    position: absolute;
    right: 1rem;
    top: 1rem;
    background-color: rgba(0, 0, 0, 0);
    width: 8rem;
    font-size: 1.4rem;
}

.Organizationinfo .infocard .card .toptitle {
    font-size: 1.6rem;
    color: #000000;
    text-align: center;
}

.Organizationinfo .infocard .card .balanceinfo-top {
    margin-top: 2rem;
    text-align: center;
    font-size: 1.4rem;
    color: #000000;
}

.Organizationinfo .infocard .card .balanceinfo-mid {
    font-size: 1.4rem;
    color: #000;
    text-align: center;
    font-weight: bold;
    margin-top: 1rem;
    font-size: 2rem;
}

.Organizationinfo .infocard .card .balanceinfobtn {
    border-radius: 999px;
    background: rgba(0, 0, 0, 0);
    border: none;
    outline: none;
    position: relative;
    transition: all 0.3s;
    color: #ff7f24;
    display: block;
    margin: 0 auto;
    width: 10rem;
    padding: 0.8rem 0;
    margin-top: 1.5rem;
    font-size: 1.4rem;
}

.Organizationinfo .infocard .card .balanceinfobtn::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #ff7f24;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-radius: 999px;
}

.Organizationinfo .infocard .card .balanceinfobtn:active {
    background-color: #ff7f24;
    color: #fff;
}

.Organizationinfo .infocard .card.type2 .balanceinfo-mid {
    margin-top: 0.4rem;
}

.Organizationinfo .infocard .card.type2 .quota {
    color: #999999;
    font-size: 1.4rem;
    text-align: center;
}

.Organizationinfo .botlist {
    padding: 0 1rem;
    padding-bottom: 0;
    background-color: #fff;
    position: relative;
    margin-top: -20rem;
}

.Organizationinfo .botlist ol li {
    padding: 1.5rem 0.5rem;
    position: relative;
    transition: all 0.3s;
}

.Organizationinfo .botlist ol li:active {
    background-color: #fafafa;
}

.Organizationinfo .botlist ol li:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Organizationinfo .botlist ol li:nth-last-child(1)::before {
    border: none;
}

.Organizationinfo .botlist ol li .iconleft {
    width: 2.8rem;
    height: 2.8rem;
    background-size: cover;
    margin-right: 0.8rem;
}

.Organizationinfo .botlist ol li .jt {
    color: #999;
}

.Organizationinfo .Invitemembers {
    width: 28rem;
    display: block;
    position: relative;
    top: 5.8rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    margin: 0 auto;
    padding: 1rem 0;
}

.Organizationinfo .Invitemembers:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.Organizationinfo .noog {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

.Organizationinfo .noog .noogimg {
    display: block;
    margin: 0 auto;
    width: 22rem;
    margin-top: 14rem;
}

.Organizationinfo .noog .textcenter {
    font-size: 1.4rem;
    text-align: center;
    color: #666666;
}

.Organizationinfo .noog .tocreateog {
    width: 20rem;
    display: block;
    margin: 0 auto;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    font-size: 1.4rem;
    margin-top: 3rem;
    padding: 1rem 0;
}

.Organizationinfo .noog .tocreateog:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.Organizationlist {
    background-color: #f2f3f5;
}

.Organizationlist ol {
    padding: 0 1rem;
    background-color: #fff;
    margin-bottom: 6rem;
}

.Organizationlist ol li {
    position: relative;
    padding: 1rem;
}

.Organizationlist ol li:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Organizationlist ol li .ogname {
    font-size: 1.6rem;
    color: #000;
}

.Organizationlist ol li .ogNo {
    margin-top: 0.4rem;
}

.Organizationlist ol li .administrators {
    margin-top: 0.8rem;
}

.Organizationlist ol li i {
    position: absolute;
    right: 1rem;
    top: 50%;
    font-size: 2.2rem;
    margin-top: -1.4rem;
    color: #cccccc;
}

.Organizationlist ol li.active i {
    color: #ff7f24;
}

.Organizationmembers ol {
    background-color: #fff;
}

.Organizationmembers ol li {
    padding: 1rem 2rem;
    position: relative;
}

.Organizationmembers ol li:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Organizationmembers ol li:nth-last-child(1):before {
    border: none;
}

.Organizationmembers ol li .radio {
    position: relative;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background-color: #ececec;
    margin-right: 1.5rem;
    text-align: center;
}

.Organizationmembers ol li .radio .iconfont {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    color: #fff;
    font-size: 1.4rem;
    left: 50%;
    top: 50%;
    margin-left: -0.7rem;
    margin-top: -0.8rem;
}

.Organizationmembers ol li .radio.active {
    background-color: #ff7f24;
}

.Organizationmembers ol li .radio.active .iconfont {
    display: block;
}

.Organizationmembers ol li .headbox {
    width: 4.5rem;
    height: 4.5rem;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    margin-right: 1rem;
}

.Organizationmembers ol li .name {
    font-size: 1.4rem;
}

.Organizationmembers ol li .name .tag-admin {
    font-size: 1.2rem;
    background-color: #f5f5f5;
    padding: 0.3rem 0.5rem;
    border-radius: 0.6rem;
    margin-left: 0.6rem;
}

.Organizationmembers ol li .phone {
    margin-top: 0.6rem;
}

.Organizationmembers ol li .toinvitation {
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    font-size: 1.4rem;
    width: 6.8rem;
    padding: 0.5rem 0;
}

.Organizationmembers ol li .toinvitation:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.Organizationmembers ol li .moreicon {
    width: 4rem;
    font-size: 2rem;
    color: #9c9c9c;
    text-align: center;
}

.Organizationmembers ol li .examine {
    border-radius: 999px;
    background: rgba(0, 0, 0, 0);
    border: none;
    outline: none;
    position: relative;
    transition: all 0.3s;
    color: #4c4c4c;
    width: 6.8rem;
    padding: 0.5rem 0;
}

.Organizationmembers ol li .examine.mr {
    margin-right: 1rem;
}

.Organizationmembers ol li .examine::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #cccccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-radius: 999px;
}

.Organizationmembers ol li .examine:active {
    background-color: #eaeaea;
    color: #fff;
}

.Organizationmembers .Invitemembers {
    width: 28rem;
    display: block;
    position: relative;
    top: 5.8rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    margin: 0 auto;
    padding: 1rem 0;
}

.Organizationmembers .Invitemembers:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.Organizationmembers .textbtn {
    width: 28rem;
    display: block;
    position: relative;
    top: 5.8rem;
    text-align: center;
    margin: 0 auto;
    padding: 1rem 0;
    margin-top: 1rem;
}

.Organizationmembers .botstatusselect {
    width: 100%;
    background-color: #fff;
    border-radius: 1.6rem 1.6rem 0 0;
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 50;
    padding-bottom: 2rem;
}

.Organizationmembers .botstatusselect .itembtn {
    padding: 1.8rem 0;
    text-align: center;
    font-size: 1.4rem;
    color: #212121;
    position: relative;
}

.Organizationmembers .botstatusselect .itembtn.red {
    color: #E94033;
}

.Organizationmembers .botstatusselect .itembtn:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Organizationmembers .botstatusselect .itembtn:nth-last-child(1):before {
    display: none;
}

.Memberreview {
    background-color: #f2f3f5;
}

.Memberreview .infocard {
    padding: 1rem;
    position: relative;
    top: -21rem;
}

.Memberreview .infocard .card {
    background-color: #fff;
    border-radius: 1rem;
    padding: 2rem 2rem 3rem 2rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    position: relative;
}

.Memberreview .infocard .card .left {
    width: 7rem;
}

.Memberreview .infocard .card .toptitle {
    font-size: 1.6rem;
    text-align: center;
    font-weight: bold;
}

.Memberreview .infocard .card .name {
    font-size: 1.4rem;
    margin-top: 2rem;
}

.Memberreview .infocard .card .phone {
    margin-top: 1rem;
    font-size: 1.4rem;
}

.Memberreview .btngroup {
    position: relative;
    margin-top: -16rem;
}

.Memberreview .btngroup button {
    font-size: 1.4rem;
    width: 28rem;
    display: block;
    margin: 0 auto;
    position: relative;
    padding: 1rem 0;
}

.Memberreview .btngroup button:nth-child(1) {
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.Memberreview .btngroup button:nth-child(1):active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.Memberreview .btngroup button:nth-child(2) {
    top: 1.2rem;
    background-color: rgba(0, 0, 0, 0);
    width: 24rem;
    color: #000;
}

.orrecharge {
    background-color: #f2f3f5;
}

.orrecharge .infocard {
    padding: 1rem;
    position: relative;
    top: -21rem;
}

.orrecharge .infocard .card {
    background-color: #fff;
    border-radius: 1rem;
    padding: 2rem 2rem 3rem 2rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    position: relative;
}

.orrecharge .infocard .card .balance {
    text-align: center;
    font-size: 1.4rem;
    color: #000;
}

.orrecharge .infocard .card .money {
    text-align: center;
    font-size: 2.6rem;
    font-weight: bold;
    color: #000;
}

.orrecharge .infocard .card .rechargetip {
    margin-top: 3rem;
    font-size: 1.4rem;
    color: #999999;
}

.orrecharge .infocard .card .moneyinput {
    padding: 0.5rem 0;
    position: relative;
}

.orrecharge .infocard .card .moneyinput:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.orrecharge .infocard .card .moneyinput .lefticon {
    font-size: 3rem;
    margin-right: 0.6rem;
}

.orrecharge .infocard .card .moneyinput input {
    width: 100%;
    font-size: 1.6rem;
    border: none;
    outline: none;
    padding: 1rem 0.5rem;
}

.orrecharge .btngroup {
    position: relative;
    margin-top: 3rem;
}

.orrecharge .btngroup button {
    width: 28rem;
    display: block;
    margin: 0 auto;
    position: relative;
    padding: 1rem 0;
}

.orrecharge .btngroup button:nth-child(1) {
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.orrecharge .btngroup button:nth-child(1):active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.orrecharge .btngroup button:nth-child(2) {
    top: 1.2rem;
    background-color: rgba(0, 0, 0, 0);
    width: 24rem;
    color: #000;
}

.ogrecord {
    background-color: #f2f3f5;
}

.ogrecord .tophead {
    padding: 1rem 0;
    background-color: #fff;
    position: relative;
    height: 4.4rem;
    z-index: 40;
}

.ogrecord .tophead:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.ogrecord .tophead .left {
    font-size: 1.2rem;
    margin-left: 1.2rem;
}

.ogrecord .tophead .left .close {
    margin-left: 0.5rem;
    color: #999999;
    padding: 0.5rem;
}

.ogrecord .tophead .rightbtn {
    margin-right: 1rem;
    background-color: rgba(0, 0, 0, 0);
}

.ogrecord .tophead .rightbtn i {
    font-size: 2rem;
    margin-right: 0.5rem;
    vertical-align: -0.2rem;
    color: #999999;
}

.ogrecord .list li {
    padding: 1.4rem 1rem;
    position: relative;
    background-color: #fff;
}

.ogrecord .list li:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.ogrecord .list li .bot {
    margin-top: 0.3rem;
}

.ogrecord .list li .money {
    font-size: 1.8rem;
    font-weight: bold;
    color: #000;
}

.ogrecord .list li .time {
    font-size: 1.4rem;
    color: #000000;
}

.ogrecord .list li .number {
    font-size: 1.4rem;
    color: #999;
}

.ogrecord .nosearch > img {
    display: block;
    margin: 0 auto;
    width: 16rem;
    margin-top: 2rem;
}

.ogrecord .nosearch .nomsg {
    text-align: center;
    color: #666666;
}

.ogrecord .screen {
    width: 100%;
    left: 0;
    top: 4.4rem;
    position: fixed;
    z-index: 31;
}

.ogrecord .screen .top {
    background-color: #fff;
    position: relative;
}

.ogrecord .screen .top:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.ogrecord .screen .top > div {
    padding: 1.4rem 0;
    text-align: center;
    position: relative;
}

.ogrecord .screen .top > div.active:before {
    position: absolute;
    content: '';
    display: block;
    width: 4.2rem;
    left: 50%;
    margin-left: -2.1rem;
    height: 0.3rem;
    bottom: 0;
    background-color: #999999;
}

.ogrecord .screen .time {
    background-color: #fff;
    padding: 2rem;
    border-radius: 0 0 1rem 1rem;
}

.ogrecord .screen .time .midinput {
    padding: 0.8rem 0;
    position: relative;
    margin-top: 1rem;
}

.ogrecord .screen .time .midinput:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.ogrecord .screen .time .midinput input,
.ogrecord .screen .time .midinput select {
    width: 100%;
    border: none;
    outline: none;
    text-align: center;
    background-color: rgba(0, 0, 0, 0);
    font-size: 1.4rem;
}

.ogrecord .screen .time .midinput .select {
    font-size: 1.4rem;
    padding: 0.5rem 0;
}

.ogrecord .screen .peoplelist {
    text-align: center;
}

.ogrecord .btngroup {
    margin-top: 4rem;
}

.ogrecord .btngroup button {
    width: 10rem;
    display: block;
    margin: 0 auto;
    padding: 0.8rem 0;
    border-radius: 999px;
    font-size: 1.4rem;
}

.ogrecord .btngroup button.left {
    border-radius: 999px;
    background: rgba(0, 0, 0, 0);
    border: none;
    outline: none;
    position: relative;
    transition: all 0.3s;
    color: #ff7f24;
}

.ogrecord .btngroup button.left::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #ff7f24;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-radius: 999px;
}

.ogrecord .btngroup button.left:active {
    background-color: #ff7f24;
    color: #fff;
}

.ogrecord .btngroup button.right {
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.ogrecord .btngroup button.right:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.orrechargecomplete .infocard {
    padding: 1rem;
    position: relative;
    top: -21rem;
}

.orrechargecomplete .infocard .card {
    background-color: #fff;
    border-radius: 1rem;
    padding: 2rem 0 3rem 0;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    position: relative;
}

.orrechargecomplete .infocard .card .successicon {
    width: 8rem;
    display: block;
    margin: 0 auto;
}

.orrechargecomplete .infocard .card .succestit {
    font-size: 1.6rem;
    color: #333;
    font-weight: bold;
    text-align: center;
}

.orrechargecomplete .infocard .card .successdec {
    color: #999999;
    font-size: 1.4rem;
    text-align: center;
    margin-top: 0.5rem;
}

.orrechargecomplete .infocard .card .backbtn {
    display: block;
    margin: 0 auto;
    width: 28rem;
    font-size: 1.4rem;
    padding: 1rem 0;
    margin-top: 3rem;
}

.contactus {
    background-color: #f2f3f5;
}

.contactus .corporatename {
    text-align: center;
    font-size: 1.6rem;
    color: #212121;
}

.contactus .contactbtn {
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    font-size: 1.4rem;
    width: 12rem;
    height: 4rem;
    line-height: 4rem;
    text-align: center;
    display: block;
    margin: 0 auto;
    margin-top: 1.5rem;
}

.contactus .contactbtn:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.contactus .bot {
    font-size: 1.4rem;
    color: #212121;
    padding: 2.2rem 1rem;
}

.contactus .bot .botname {
    padding-left: 1.5rem;
    font-size: 1.6rem;
}

.contactus .bot .botname.mt {
    margin-top: 2.4rem;
}

.contactus .bot ol {
    background-color: #fff;
    border-radius: 1rem;
    margin-top: 1rem;
}

.contactus .bot ol li {
    padding: 1.5rem;
    position: relative;
}

.contactus .bot ol li:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.contactus .bot ol li:nth-last-child(1):before {
    border: none;
}

.contactus .bot ol li .name {
    font-size: 1.2rem;
}

.contactus .bot ol li .name .left {
    font-size: 1.2rem;
    color: #212121;
}

.contactus .bot ol li .name .right {
    color: #212121;
}

.contactus .bot ol li .phone,
.contactus .bot ol li .qq {
    margin-top: 0.6rem;
    color: #212121;
}

.contactus .bot ol li .phone i,
.contactus .bot ol li .qq i {
    font-size: 1.8rem;
    color: #cccccc;
}

.contactus .bot .contactHeadquarters {
    height: 6rem;
    background-color: #fff;
    border-radius: 1rem;
    margin-top: 1.4rem;
    font-size: 1.4rem;
    padding: 0 1rem;
}

.contactus .bot .contactHeadquarters i {
    font-size: 2rem;
    color: #999999;
}

.contactustype2 {
    padding: 1rem;
}

.contactustype2 .topselect {
    padding: 1.4rem 1rem;
    background-color: #fff;
    font-size: 1.4rem;
    border-radius: 0.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.1);
}

.contactustype2 .topselect .jt {
    font-size: 1.6rem;
    color: #999999;
}

.contactustype2 .codeewm {
    margin-top: 1rem;
    background-color: #fff;
    border-radius: 0.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.1);
    padding-top: 3rem;
    padding-bottom: 2rem;
}

.contactustype2 .codeewm .centercode {
    width: 16rem;
    background-color: #ff7f24;
    display: block;
    margin: 0 auto;
    border-radius: 0.6rem;
    overflow: hidden;
    padding-top: 0.6rem;
}

.contactustype2 .codeewm .centercode .codebox {
    width: 15rem;
    height: 15rem;
    background-color: #fff;
    display: block;
    margin: 0 auto;
    border-radius: 0.6rem;
    overflow: hidden;
}

.contactustype2 .codeewm .centercode .longtagfont {
    font-size: 1.4rem;
    color: #fff;
    text-align: center;
    padding: 0.6rem 0;
}

.contactustype2 .codeewm .biglist {
    width: 30rem;
    background-color: #fff2e9;
    margin: 0 auto;
    margin-top: 3rem;
    border: 0.1rem solid #ff7f24;
    border-radius: 1rem;
    padding-left: 3rem;
    padding-right: 2rem;
}

.contactustype2 .codeewm .phonelist {
    font-size: 1.6rem;
    padding: 1.5rem 0;
    border-bottom: 0.1rem dashed #ff7f24;
}

.contactustype2 .codeewm .phonelist:nth-last-child(1) {
    border: none;
}

.contactustype2 .codeewm .phonelist .lefticon {
    width: 2rem;
    height: 2rem;
    display: block;
    margin-right: 0.5rem;
}

.contactustype2 .codeewm .phonelist .loc {
    font-size: 1.4rem;
}

.mycoupon {
    background-color: #f2f3f5;
}

.mycoupon .toptitle {
    padding: 1.8rem 1rem;
}

.mycoupon .toptitle .leftfont {
    font-size: 1.8rem;
    color: #000;
}

.mycoupon .toptitle .rightbtn {
    font-size: 1.4rem;
    color: #4c4c4c;
}

.mycoupon .mycoupnlist {
    margin-top: 1rem;
    padding: 0 1rem;
}

.mycoupon .mycoupnlist li {
    margin-bottom: 1rem;
    background-color: #fff;
    border-radius: 0.8rem;
    box-shadow: 0rem 0.2rem 1rem rgba(0, 0, 0, 0.02);
    position: relative;
    overflow: hidden;
}

.mycoupon .mycoupnlist li .top {
    margin-top: 2rem;
}

.mycoupon .mycoupnlist li .money {
    color: #ff7f24;
    margin-right: 1rem;
    margin-left: 2.4rem;
}

.mycoupon .mycoupnlist li .money span:nth-child(1) {
    font-size: 3rem;
}

.mycoupon .mycoupnlist li .money span:nth-child(2) {
    font-size: 1.6rem;
}

.mycoupon .mycoupnlist li .coupnname {
    font-size: 1.6rem;
    line-height: 2rem;
    max-height: 4rem;
    padding-right: 1rem;
    overflow: hidden;
    color: #212121;
    left: 8.6rem;
    top: 2rem;
}

.mycoupon .mycoupnlist li .coupondec {
    font-size: 1.2rem;
    color: #999999;
}

.mycoupon .mycoupnlist li .botrule {
    position: relative;
    margin-top: 1rem;
    width: 100%;
    font-size: 1.2rem;
    color: #999999;
    padding: 0.5rem 2rem;
    border-top: 1px dashed #ccc;
}

.mycoupon .mycoupnlist li .botrule .jt {
    transition: all 0.3s;
}

.mycoupon .mycoupnlist li .botrule .jt.rotate {
    transform: rotate(-180deg);
}

.mycoupon .mycoupnlist li .botrule .declist > div {
    margin-top: 0.4rem;
    word-break: break-all;
}

.mycoupon .mycoupnlist li .botrule:before,
.mycoupon .mycoupnlist li .botrule:after {
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background-color: #f2f3f5;
    position: absolute;
    content: '';
    left: -0.5rem;
    top: -0.5rem;
}

.mycoupon .mycoupnlist li .botrule:after {
    left: auto;
    right: -0.5rem;
}

.mycoupon .mycoupnlist li .jiao {
    width: 8rem;
    height: 8rem;
    position: absolute;
    left: 0;
    top: 0;
    background-color: #ff7f24;
    transform: rotate(-45deg);
    margin-left: -4rem;
    margin-top: -4rem;
}

.mycoupon .mycoupnlist li .jiao > div {
    font-size: 1.2rem;
    color: #fff;
    text-align: center;
    position: absolute;
    bottom: 0.2rem;
    left: 0.1rem;
    width: 100%;
    transform: rotate(0deg);
}

.mycoupon .mycoupnlist li.def .money,
.mycoupon .mycoupnlist li.def .coupnname,
.mycoupon .mycoupnlist li.def .coupondec,
.mycoupon .mycoupnlist li.def .time {
    color: #999999;
}

.mycoupon .mycoupnlist li.def .jiao {
    background-color: #ccc;
}

.Collectcoupons {
    background-color: #feefd1;
    background-image: url(../images/collectcoupons/bg.png);
    background-size: 100%;
    background-repeat: no-repeat;
    display: block;
    margin: 0 auto;
    max-width: 580px;
}

.Claimbutton {
    position: fixed;
    background-color: #fdc02c;
    background-image: url(../images/collectcoupons/btnbg.png);
    background-size: 100% 100%;
    height: 4.8rem;
    width: 24.8rem;
    margin-left: -12.4rem;
    left: 50%;
    margin-top: 52rem;
    background-color: rgba(0, 0, 0, 0);
    border-radius: 999px;
    font-size: 1.8rem;
    font-weight: bold;
    color: #513414;
    box-shadow: 0 6px 0px #c86a2c, 0 8px 4px rgba(116, 46, 0, 0.8);
    transition: all 0.3s;
}

.Claimbutton:active {
    box-shadow: none;
    margin-top: 52.4rem;
}

.Claimbuttongetcoupons {
    position: fixed;
    width: 32rem;
    max-height: 48rem;
    background-color: #fff1e2;
    border-radius: 2rem;
    left: 50%;
    top: 50%;
    margin-left: -16rem;
    margin-top: -18rem;
    z-index: 8;
    animation: botshow 0.3s forwards;
}

.Claimbuttongetcoupons .close {
    position: absolute;
    right: 1.8rem;
    top: 1rem;
    width: 2.6rem;
    height: 2.6rem;
    background-color: #ff7f24;
    border-radius: 50%;
}

.Claimbuttongetcoupons .close::before {
    content: '';
    position: absolute;
    display: block;
    height: 0.2rem;
    width: 1.6rem;
    border-radius: 999px;
    margin-left: -0.8rem;
    margin-top: -0.1rem;
    left: 50%;
    top: 50%;
    background-color: #fff;
    transform: rotate(45deg);
}

.Claimbuttongetcoupons .close::after {
    content: '';
    position: absolute;
    display: block;
    height: 0.2rem;
    width: 1.6rem;
    border-radius: 999px;
    margin-left: -0.8rem;
    margin-top: -0.1rem;
    left: 50%;
    top: 50%;
    background-color: #fff;
    transform: rotate(-45deg);
}

.Claimbuttongetcoupons .center-icon {
    position: absolute;
    width: 11rem;
    left: 50%;
    top: -4.2rem;
    margin-left: -5.5rem;
}

.Claimbuttongetcoupons .couponstitle {
    text-align: center;
    margin-top: 6.2rem;
    color: #ff7f24;
    font-size: 1.8rem;
    font-weight: bold;
}

.Claimbuttongetcoupons .quanlist {
    min-height: 18rem;
    padding: 1rem 2rem;
}

.Claimbuttongetcoupons .quanlist li {
    margin-top: 0.5rem;
    background-color: #fff;
    background-size: 100% 100%;
    border-radius: 0.8rem;
    position: relative;
    padding: 0.4rem;
    box-shadow: 0rem 0.2rem 0.4rem rgba(141, 59, 0, 0.6);
}

.Claimbuttongetcoupons .quanlist li .mainborder {
    border: 0.1rem solid #ff7f24;
    border-radius: 0.4rem;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.Claimbuttongetcoupons .quanlist li .mainborder .right {
    max-width: 19rem;
    margin-left: 1.6rem;
}

.Claimbuttongetcoupons .quanlist li .mainborder > div:nth-child(1) {
    padding: 0.5rem 0;
}

.Claimbuttongetcoupons .quanlist li .moneybig {
    margin-left: 1.6rem;
    color: #ff7f24;
}

.Claimbuttongetcoupons .quanlist li .moneybig > span:nth-child(1) {
    font-size: 1.8rem;
}

.Claimbuttongetcoupons .quanlist li .moneybig > span:nth-child(2) {
    font-size: 3.4rem;
}

.Claimbuttongetcoupons .quanlist li .name {
    font-size: 1.4rem;
    line-height: 2rem;
    max-height: 4rem;
    overflow: hidden;
    color: #212121;
}

.Claimbuttongetcoupons .quanlist li .dec {
    font-size: 1.2rem;
    margin-top: 0.2rem;
    color: #fe2425;
}

.Claimbuttongetcoupons .quanlist li .rightfont {
    position: absolute;
    left: -0.1rem;
    top: -0.1rem;
    width: 0;
    height: 0;
    border-top: 3.6rem solid #ff7f24;
    border-right: 3.6rem solid transparent;
}

.Claimbuttongetcoupons .quanlist li .rightfont > div {
    font-size: 1rem;
    color: #fff;
    position: absolute;
    left: -0.9rem;
    top: -3rem;
    width: 4rem;
    text-align: center;
    transform: rotate(-45deg);
}

.Claimbuttongetcoupons .quanlist li .usetime {
    font-size: 1.2rem;
    color: #999;
    position: relative;
    padding: 0.5rem 1rem;
}

.Claimbuttongetcoupons .quanlist li .usetime > div {
    padding: 0.2rem 0;
}

.Claimbuttongetcoupons .quanlist li .usetime:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-top: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-top: 1px dashed #ccc;
}

.Claimbuttongetcoupons .btngroup {
    height: 8rem;
    box-shadow: 0 -2px 4px rgba(141, 59, 0, 0.1);
}

.Claimbuttongetcoupons .btngroup button {
    display: block;
    margin: 1rem auto;
    width: 20rem;
    height: 4.4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.Claimbuttongetcoupons .btngroup button:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.buycoupons {
    background-color: #b92e2e;
    background-size: 100%;
    background-repeat: no-repeat;
    display: block;
    margin: 0 auto;
    max-width: 580px;
}

.buycoupons .fullimg {
    width: 100%;
    display: block;
}

.buycoupons .midbox {
    position: relative;
}

.buycoupons .buyClaimbutton {
    position: absolute;
    background-color: #fdc02c;
    background-image: url(../images/collectcoupons/11/btnbg.png);
    background-size: 100% 100%;
    height: 4.8rem;
    width: 24.8rem;
    margin-left: -12.4rem;
    left: 50%;
    background-color: rgba(0, 0, 0, 0);
    border-radius: 999px;
    font-size: 1.8rem;
    font-weight: bold;
    color: #513414;
    box-shadow: 0 6px 0px #c86a2c, 0 8px 4px rgba(116, 46, 0, 0.8);
    transition: all 0.3s;
    top: 1.6rem;
}

.buycoupons .buyClaimbutton:active {
    box-shadow: none;
    margin-top: 0.4rem;
}

.buycouponsClaimbuttongetcoupons {
    position: fixed;
    width: 32rem;
    max-height: 48rem;
    background-color: #fff1e2;
    border-radius: 2rem;
    left: 50%;
    top: 50%;
    margin-left: -16rem;
    margin-top: -22rem;
    z-index: 8;
    animation: botshow 0.3s forwards;
    background-image: url(../images/collectcoupons/11/bgbig.png);
    background-size: 100% 100%;
}

.buycouponsClaimbuttongetcoupons .close {
    position: absolute;
    right: 1.8rem;
    top: 1rem;
    width: 2.6rem;
    height: 2.6rem;
    background-color: #e94033;
    border-radius: 50%;
    z-index: 6;
}

.buycouponsClaimbuttongetcoupons .close::before {
    content: '';
    position: absolute;
    display: block;
    height: 0.2rem;
    width: 1.6rem;
    border-radius: 999px;
    margin-left: -0.8rem;
    margin-top: -0.1rem;
    left: 50%;
    top: 50%;
    background-color: #fff;
    transform: rotate(45deg);
}

.buycouponsClaimbuttongetcoupons .close::after {
    content: '';
    position: absolute;
    display: block;
    height: 0.2rem;
    width: 1.6rem;
    border-radius: 999px;
    margin-left: -0.8rem;
    margin-top: -0.1rem;
    left: 50%;
    top: 50%;
    background-color: #fff;
    transform: rotate(-45deg);
}

.buycouponsClaimbuttongetcoupons .center-icon {
    position: absolute;
    width: 11rem;
    left: 50%;
    top: -5.2rem;
    margin-left: -5.5rem;
    z-index: 6;
}

.buycouponsClaimbuttongetcoupons .couponstitle {
    text-align: center;
    margin-top: 5.2rem;
    color: #d7201c;
    line-height: 1.5;
    font-size: 1.6rem;
    font-weight: bold;
}

.buycouponsClaimbuttongetcoupons .quanout {
    max-height: 24rem;
}

.buycouponsClaimbuttongetcoupons .couponsdec {
    text-align: center;
    margin-top: 0.4rem;
    color: #212121;
    font-size: 1.6rem;
    padding-bottom: 0.6rem;
}

.buycouponsClaimbuttongetcoupons .quanlist {
    min-height: 14rem;
    padding: 1rem 2rem;
}

.buycouponsClaimbuttongetcoupons .quanlist li {
    margin-top: 0.5rem;
    background-image: url(../images/collectcoupons/11/quan.png);
    background-size: 100% 100%;
    height: 7.8rem;
    position: relative;
}

.buycouponsClaimbuttongetcoupons .quanlist li .moneybig {
    position: absolute;
    left: 7%;
    top: 50%;
    line-height: 2rem;
    margin-top: -1.8rem;
    color: #e94033;
}

.buycouponsClaimbuttongetcoupons .quanlist li .moneybig > span:nth-child(1) {
    font-size: 1.8rem;
}

.buycouponsClaimbuttongetcoupons .quanlist li .moneybig > span:nth-child(2) {
    font-size: 3.4rem;
}

.buycouponsClaimbuttongetcoupons .quanlist li .name {
    position: absolute;
    font-size: 1.4rem;
    color: #333;
    left: 24%;
    top: 50%;
    margin-top: -2.6rem;
    max-width: 16rem;
}

.buycouponsClaimbuttongetcoupons .quanlist li .dec {
    position: absolute;
    font-size: 1.2rem;
    color: #4c4c4c;
    left: 24%;
    top: 50%;
    color: #999999;
    margin-top: -0.6rem;
    max-width: 16rem;
}

.buycouponsClaimbuttongetcoupons .quanlist li .usertime {
    position: absolute;
    top: 50%;
    font-size: 1.1rem;
    color: #999999;
    margin-top: 1.3rem;
    left: 8%;
}

.buycouponsClaimbuttongetcoupons .quanlist li .rightfont {
    position: absolute;
    right: 6%;
    top: 50%;
    margin-top: -2.4rem;
    line-height: 1.6rem;
    font-size: 1.4rem;
    width: 1rem;
}

.buycouponsClaimbuttongetcoupons .btngroup {
    position: relative;
    z-index: 2;
    height: 8rem;
    background-color: #fcf0df;
    border-radius: 0 0 0.8rem 0.8rem;
    overflow: hidden;
    box-shadow: 0 -2px 4px rgba(141, 59, 0, 0.1);
    background-image: url(../images/collectcoupons/11/quanbotbg.png);
    background-size: 100% 100%;
}

.buycouponsClaimbuttongetcoupons .btngroup .botbg {
    position: absolute;
    width: 100%;
    height: 2.2rem;
    bottom: 0;
    left: 0;
}

.buycouponsClaimbuttongetcoupons .btngroup button {
    display: block;
    margin: 0 auto;
    width: 20rem;
    height: 4.4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #fd683a, #e94033);
    position: relative;
    z-index: 4;
}

.buycouponsClaimbuttongetcoupons .btngroup button:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #fd683a, #e94033);
}

.isReceived {
    position: fixed;
    width: 32rem;
    height: 16rem;
    background-color: #fff1e2;
    border-radius: 2rem;
    left: 50%;
    top: 50%;
    margin-left: -16rem;
    margin-top: -10rem;
    z-index: 8;
    animation: botshow 0.3s forwards;
    background-image: url(../images/collectcoupons/11/bgsm.png);
    background-size: 100%;
}

.isReceived .center-icon {
    position: absolute;
    width: 11rem;
    left: 50%;
    top: -5.2rem;
    margin-left: -5.5rem;
    z-index: 6;
}

.isReceived .bgfixtop {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 2.2rem;
    z-index: 2;
    border-radius: 0.8rem 0.8rem 0 0;
}

.isReceived .bgleft {
    position: absolute;
    left: 0;
    top: 0;
    width: 2rem;
    height: 100%;
}

.isReceived .bgright {
    position: absolute;
    right: 0;
    top: 0;
    width: 2rem;
    height: 100%;
}

.isReceived .couponstitle {
    text-align: center;
    margin-top: 6.2rem;
    color: #d7201c;
    font-size: 1.8rem;
    font-weight: bold;
}

.isReceived .couponsdec {
    text-align: center;
    margin-top: 0.5rem;
    color: #212121;
    font-size: 1.6rem;
    padding-bottom: 1rem;
}

.isReceived .close {
    position: absolute;
    right: 1.8rem;
    top: 1rem;
    width: 2.6rem;
    height: 2.6rem;
    background-color: #e94033;
    border-radius: 50%;
    z-index: 6;
}

.isReceived .close::before {
    content: '';
    position: absolute;
    display: block;
    height: 0.2rem;
    width: 1.6rem;
    border-radius: 999px;
    margin-left: -0.8rem;
    margin-top: -0.1rem;
    left: 50%;
    top: 50%;
    background-color: #fff;
    transform: rotate(45deg);
}

.isReceived .close::after {
    content: '';
    position: absolute;
    display: block;
    height: 0.2rem;
    width: 1.6rem;
    border-radius: 999px;
    margin-left: -0.8rem;
    margin-top: -0.1rem;
    left: 50%;
    top: 50%;
    background-color: #fff;
    transform: rotate(-45deg);
}

.buycouponsgetphonecode {
    position: fixed;
    width: 32rem;
    height: 28rem;
    background-color: #fff1e2;
    border-radius: 2rem;
    left: 50%;
    top: 50%;
    margin-left: -16rem;
    margin-top: -16rem;
    z-index: 8;
    animation: botshow 0.3s forwards;
    background-image: url(../images/collectcoupons/11/getphonebg.png);
    background-size: 100% 100%;
}

.buycouponsgetphonecode .close {
    position: absolute;
    right: 1.8rem;
    top: 1rem;
    width: 2.6rem;
    height: 2.6rem;
    background-color: #e94033;
    border-radius: 50%;
    z-index: 6;
}

.buycouponsgetphonecode .close::before {
    content: '';
    position: absolute;
    display: block;
    height: 0.2rem;
    width: 1.6rem;
    border-radius: 999px;
    margin-left: -0.8rem;
    margin-top: -0.1rem;
    left: 50%;
    top: 50%;
    background-color: #fff;
    transform: rotate(45deg);
}

.buycouponsgetphonecode .close::after {
    content: '';
    position: absolute;
    display: block;
    height: 0.2rem;
    width: 1.6rem;
    border-radius: 999px;
    margin-left: -0.8rem;
    margin-top: -0.1rem;
    left: 50%;
    top: 50%;
    background-color: #fff;
    transform: rotate(-45deg);
}

.buycouponsgetphonecode .toptitle {
    font-size: 1.6rem;
    color: #e94033;
    font-weight: bold;
    text-align: center;
    margin-top: 3rem;
}

.buycouponsgetphonecode .phoneinput,
.buycouponsgetphonecode .phonecode {
    width: 24rem;
    height: 4rem;
    display: block;
    margin: 0 auto;
    position: relative;
    margin-top: 2rem;
}

.buycouponsgetphonecode .phoneinput::before,
.buycouponsgetphonecode .phonecode::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #fd683a;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-radius: 0.8rem;
}

.buycouponsgetphonecode .phoneinput input,
.buycouponsgetphonecode .phonecode input {
    width: 100%;
    height: 4rem;
    line-height: 4rem;
    font-size: 1.4rem;
    padding-left: 1rem;
    outline: none;
    border: none;
    background-color: rgba(0, 0, 0, 0);
}

.buycouponsgetphonecode .phonecode .getcode {
    width: 10rem;
    height: 3.6rem;
    border-radius: 0.4rem;
    margin-right: 0.2rem;
    font-size: 1.2rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    background-image: linear-gradient(to right, #fd683a, #e94033);
    position: relative;
    z-index: 4;
    margin-left: 1rem;
}

.buycouponsgetphonecode .phonecode .getcode:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #fd683a, #e94033);
}

.buycouponsgetphonecode .phonecode .getcode.def {
    background-image: none;
    background-color: #ccc;
    color: #fff;
}

.buycouponsgetphonecode .btngroup {
    position: relative;
    z-index: 2;
    height: 8rem;
    margin-top: 2rem;
}

.buycouponsgetphonecode .btngroup button {
    display: block;
    margin: 0 auto;
    width: 20rem;
    height: 4.4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #fd683a, #e94033);
    position: relative;
    z-index: 4;
}

.buycouponsgetphonecode .btngroup button:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #fd683a, #e94033);
}

.createprintteam .topbg,
.jointeam .topbg {
    height: 22rem;
    background-image: -moz-linear-gradient(top, #ff7f24, #f2f3f5);
    /* Firefox */
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ff7f24), color-stop(1, #f2f3f5));
    /* Saf4+, Chrome */
}

.createprintteam .content,
.jointeam .content {
    padding: 0 1rem;
    position: relative;
    margin-top: -20rem;
}

.createprintteam .content .center,
.jointeam .content .center {
    background-color: #fff;
    padding: 3rem;
    border-radius: 0.4rem;
    box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.08);
    padding-bottom: 4rem;
}

.createprintteam .content .center .centertitle,
.jointeam .content .center .centertitle {
    font-size: 1.6rem;
    color: #212121;
    text-align: center;
}

.createprintteam .content .center .curentstore,
.jointeam .content .center .curentstore {
    font-size: 1.2rem;
    color: #212121;
    margin-top: 2.4rem;
}

.createprintteam .content .center .groupitem,
.jointeam .content .center .groupitem {
    position: relative;
    padding: 1rem 0;
    margin-top: 1.5rem;
}

.createprintteam .content .center .groupitem .leftname,
.jointeam .content .center .groupitem .leftname {
    width: 8rem;
    padding-left: 0.2rem;
}

.createprintteam .content .center .groupitem .leftname .star,
.jointeam .content .center .groupitem .leftname .star {
    color: #ff7f24;
}

.createprintteam .content .center .groupitem input,
.jointeam .content .center .groupitem input {
    width: 100%;
    border: none;
    outline: none;
    font-size: 1.4rem;
}

.createprintteam .content .center .groupitem:before,
.jointeam .content .center .groupitem:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.createprintteam .content .center .groupitem .getcodebtn,
.jointeam .content .center .groupitem .getcodebtn {
    font-size: 1.2rem;
    color: #666666;
    position: relative;
    padding: 0.4rem 1rem;
    margin-left: 1rem;
}

.createprintteam .content .center .groupitem .getcodebtn:before,
.jointeam .content .center .groupitem .getcodebtn:before {
    border-radius: 999px;
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.createprintteam .content .center .subbtn button,
.jointeam .content .center .subbtn button {
    display: block;
    margin: 0 auto;
    width: 28rem;
    height: 4rem;
    border-radius: 999px;
    font-size: 1.6rem;
    color: #fff;
    border: none;
    transition: all 0.1s;
    outline: none;
    box-shadow: 0px 2px 4px rgba(254, 106, 0, 0.3);
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
    line-height: 3.8rem;
    margin-top: 6rem;
}

.createprintteam .content .center .subbtn button:active,
.jointeam .content .center .subbtn button:active {
    box-shadow: none;
    background-image: linear-gradient(to right, #ffa024, #ff7f24);
}

.jointeam .inputtop {
    font-size: 1.4rem;
    color: #212121;
    margin-top: 2.5rem;
}

.jointeam .teamcodeinput {
    margin-top: 2rem;
    font-size: 1.4rem;
    padding: 0.5rem 0;
    position: relative;
}

.jointeam .teamcodeinput::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.jointeam .teamcodeinput input {
    width: 100%;
    border: none;
    outline: none;
}

.jointeam .subbtn {
    margin-top: 7rem;
}

.jointeam .tocreate {
    display: block;
    margin: 0 auto;
    padding: 1rem 0;
    margin-top: 2rem;
    font-size: 1.4rem;
    text-align: center;
}

.jointeam .tocreate > span {
    color: #ff7500;
}

.Teamdetail {
    background-color: #f3edeb;
}

.Teamdetail .top {
    position: relative;
    min-height: 20rem;
    padding-top: 1rem;
    background-image: -moz-linear-gradient(top, #ff7f24, #f3edeb);
    /* Firefox */
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ff7f24), color-stop(0.5, #ff7f24), color-stop(1, #f3edeb));
    /* Saf4+, Chrome */
}

.Teamdetail .top .yuan {
    display: block;
    position: absolute;
    width: 10rem;
    height: 10rem;
    border-radius: 50%;
    background-color: rgba(249, 204, 153, 0.1);
    right: 0;
    bottom: 4.2rem;
    z-index: 1;
}

.Teamdetail .top .name {
    font-size: 1.6rem;
    margin-top: 1rem;
    color: #fff;
    padding: 0 2rem;
}

.Teamdetail .top .teamnum {
    font-size: 1.4rem;
    margin-top: 1rem;
    color: #fff;
    padding: 0 2rem;
}

.Teamdetail .top .teamstore {
    font-size: 1.4rem;
    color: #fff;
    margin-top: 1rem;
    padding: 0 2rem;
}

.Teamdetail .top .teaminfo {
    padding: 0 1rem;
}

.Teamdetail .top .teaminfo > div {
    padding: 0 0.8rem;
}

.Teamdetail .top .teaminfo .centerbox {
    background-color: #fff;
    border-radius: 0.8rem;
    overflow: hidden;
    padding-bottom: 1rem;
    margin-top: 1rem;
    box-shadow: 0 0.2rem 0.6rem rgba(33, 33, 33, 0.15);
}

.Teamdetail .top .teaminfo .centerbox .topinfo {
    font-size: 1.2rem;
    text-align: center;
    background-color: #ffe4d0;
    padding: 0.8rem 0;
}

.Teamdetail .top .teaminfo .centerbox .infotitle {
    margin-top: 1rem;
    color: #212121;
    font-size: 1.4rem;
    text-align: center;
}

.Teamdetail .top .teaminfo .centerbox .infonum {
    font-size: 1.6rem;
    color: #ff7f24;
    margin-top: 0.4rem;
    text-align: center;
}

.Teamdetail .botlist {
    padding: 1rem 1.3rem;
}

.Teamdetail .botlist .listbox {
    background-color: #fff;
    padding: 1rem;
    border-radius: 0.8rem;
    box-shadow: 0 0.2rem 0.6rem rgba(33, 33, 33, 0.15);
}

.Teamdetail .botlist .listbox .leftname {
    font-size: 1.4rem;
    padding-left: 1rem;
}

.Teamdetail .botlist .listbox .rightbtn {
    font-size: 1.2rem;
    color: #fff;
    padding: 0.4rem 1rem;
    margin-right: 1rem;
}

.Teamdetail .botlist .teamlist {
    margin-top: 0.6rem;
}

.Teamdetail .botlist .teamlist li {
    position: relative;
    padding: 1rem 0;
}

.Teamdetail .botlist .teamlist li:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Teamdetail .botlist .teamlist li:nth-last-child(1):before {
    border: none;
}

.Teamdetail .botlist .teamlist .leftheadimg {
    width: 6rem;
    position: relative;
}

.Teamdetail .botlist .teamlist .leftheadimg .head {
    display: block;
    margin: 0 auto;
    width: 5rem;
    height: 5rem;
}

.Teamdetail .botlist .teamlist .leftheadimg .Chief {
    position: absolute;
    bottom: -0.2rem;
    left: 50%;
    margin-left: -1.8rem;
    text-align: center;
    width: 3.6rem;
    height: 1.6rem;
    line-height: 1.6rem;
    font-size: 1rem;
    border-radius: 999rem;
    color: #fff;
    border: 0.1rem solid #fff;
    background-color: #ffb640;
}

.Teamdetail .botlist .teamlist .username {
    font-size: 1.4rem;
    color: #212121;
}

.Teamdetail .botlist .teamlist .jointime {
    font-size: 1.2rem;
    color: #999999;
    position: relative;
    margin-top: 0.2rem;
}

.Teamdetail .botlist .teamlist .jointime .editbtn {
    position: absolute;
    padding: 0.5rem 1.4rem;
    right: 1.2rem;
    bottom: 0rem;
    color: #212121;
    font-size: 1.2rem;
}

.Teamdetail .botlist .teamlist .jointime .editbtn:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #999999;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
    border-radius: 999rem;
}

.Teamdetail .addcodetip {
    position: fixed;
    width: 26rem;
    height: 28rem;
    left: 50%;
    top: 50%;
    margin-left: -13rem;
    margin-top: -18rem;
    z-index: 36;
    animation: botshow 0.4s forwards;
}

.Teamdetail .addcodetip .midbox {
    width: 26rem;
    height: 26rem;
    background-color: #fff;
    border-radius: 1rem;
    padding-top: 2rem;
    overflow: hidden;
    position: relative;
}

.Teamdetail .addcodetip .midbox .midboxtitle {
    font-size: 1.5rem;
    color: #ff7f24;
    text-align: center;
    font-weight: bold;
}

.Teamdetail .addcodetip .midbox .codebox {
    width: 14.8rem;
    height: 14.8rem;
    border: 0.1rem solid #ff7f24;
    border-radius: 1rem;
    margin: 0 auto;
    margin-top: 2rem;
    padding: 1rem;
}

.Teamdetail .addcodetip .midbox .codebox .codeimg {
    width: 100%;
    height: 100%;
}

.Teamdetail .addcodetip .midbox .longtag {
    text-align: center;
    font-size: 1.4rem;
    margin-top: 1.4rem;
}

.Teamdetail .addcodetip .midbox .yuan {
    width: 10rem;
    height: 10rem;
    position: absolute;
    border-radius: 50%;
    background-color: rgba(255, 127, 36, 0.15);
}

.Teamdetail .addcodetip .midbox .yuan-1 {
    left: -2rem;
    top: -5rem;
}

.Teamdetail .addcodetip .midbox .yuan-2 {
    left: -6rem;
    top: 1.5rem;
}

.Teamdetail .addcodetip .midbox .yuan-3 {
    right: -2rem;
    bottom: -5rem;
}

.Teamdetail .addcodetip .midbox .yuan-4 {
    right: -6rem;
    bottom: 1.5rem;
}

.Teamdetail .addcodetip .addtip {
    font-size: 1.4rem;
    text-align: center;
    margin-top: 3rem;
    color: #000;
}

.Teamdetail .addcodetip .addtip i {
    font-size: 1.6rem;
    vertical-align: -0.1rem;
    margin-right: 0.2rem;
}

.Teamdetail .addcodetip .close {
    margin-top: 2rem;
    text-align: center;
    font-size: 2.4rem;
    color: #000;
}

.Perfectinformation {
    position: fixed;
    width: 30rem;
    padding-bottom: 4rem;
    border-radius: 1.2rem;
    background-color: #fff;
    left: 50%;
    top: 50%;
    margin-left: -15rem;
    margin-top: -24rem;
    z-index: 30;
    animation: botshow 0.4s forwards;
    box-shadow: 0 0.2rem 0.6rem rgba(33, 33, 33, 0.15);
}

.Perfectinformation .toptitle {
    margin-top: 2rem;
    text-align: center;
    font-size: 1.6rem;
}

.Perfectinformation .topdec {
    padding: 0 1.5rem;
    font-size: 1.4rem;
    color: #212121;
    margin-top: 1.5rem;
    line-height: 2;
}

.Perfectinformation .inputout {
    padding: 0 1.5rem;
}

.Perfectinformation .inputout .inputbox {
    margin-top: 1.5rem;
    font-size: 1.4rem;
    color: #212121;
    position: relative;
    padding: 1.5rem 0;
}

.Perfectinformation .inputout .inputbox:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Perfectinformation .inputout .inputbox input {
    width: 100%;
    border: none;
    outline: none;
    padding: 0.4rem;
}

.Perfectinformation .inputout .inputbox .leftname {
    margin-right: 1rem;
    font-size: 1.4rem;
    width: 7.4rem;
}

.Perfectinformation .inputout .inputbox .leftname .star {
    color: #ff7f24;
}

.Perfectinformation .subclickbtn {
    width: 20rem;
    font-size: 1.4rem;
    display: block;
    margin: 0 auto;
    margin-top: 6rem;
    line-height: 4rem;
    text-align: center;
}

.Perfectinformation .btngroup {
    position: relative;
    text-align: center;
    font-size: 1.4rem;
    color: #212121;
    line-height: 4.4rem;
}

.Perfectinformation .btngroup:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-top: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.Perfectinformation .codebtn {
    width: 18rem;
    position: relative;
    font-size: 1.2rem;
    padding: 0.5rem;
    text-align: center;
    border-radius: 999px;
}

.Perfectinformation .codebtn:before {
    border-radius: 999rem;
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.uploader {
    background-color: #fff;
}

.uploader .uploaderbox {
    position: fixed;
    width: 28rem;
    padding: 2rem;
    padding-left: 3rem;
    padding-right: 3rem;
    padding-top: 1rem;
    left: 50%;
    top: 50%;
    margin-left: -14rem;
    margin-top: -20rem;
    border-radius: 0.8rem;
    background-color: #fff7f1;
    box-shadow: 0 0.2 0.4rem rgba(255, 247, 241, 0.8);
}

.uploader .uploaderbox .uploadericon {
    position: absolute;
    left: 50%;
    width: 4.8rem;
    height: 4.8rem;
    display: block;
    top: -2.4rem;
    margin-left: -2.4rem;
}

.uploader .uploaderbox .uploadertitle {
    font-size: 1.6rem;
    margin-top: 2rem;
    color: #ff8324;
    text-align: center;
}

.uploader .uploaderbox .uploaderinfo {
    font-size: 1.4rem;
    color: #333333;
    margin-top: 1rem;
    line-height: 2;
}

.file-page-detail {
    font-size: 1.2rem;
    margin-top: 0.5rem;
    color: #999;
    margin-left: 11vw;
}

.file-page-detail span {
    display: inline-block;
    vertical-align: middle;
}

.file-page-detail .max-text {
    max-width: 28vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.file-page-detail .u-m-r-10 {
    margin-right: 0.8rem;
}

.file-page-detail .u-m-l-10 {
    margin-left: 0.8rem;
}
.download-tip {
    position: absolute;
    z-index: 40;
    width: 100%;
    top: 50%;
    transform: translateY(-50%);
}
.download-tip img{
    width: 100%;
}
.orderpricetip {
    position: fixed;
    left: 12.5vw;
    top: 44vw;
    width: 75vw;
    background-color: #fff;
    border-radius: 0.8rem;
    z-index: 40;
}

.orderpricetip .top {
    height: 12vw;
    position: relative;
}

.orderpricetip .top:before {
    box-sizing: border-box;
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid #ccc;
    transform-origin: 0 0;
    transform: scale(0.5, 0.5);
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    box-sizing: border-box;
    left: 0;
    top: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.orderpricetip .top .close {
    position: absolute;
    font-size: 2.2rem;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    right: 1.2rem;
    top: 0.8rem;
    color: #999999;
}

.orderpricetip .pricelist {
    padding: 1rem;
    font-size: 1rem;
    color: #212121;
}

.orderpricetip .pricelist > .row {
    margin-bottom: 1rem;
}