/* form */

.weui-form {
    padding: 56px 0 0;
    padding: calc(56px + constant(safe-area-inset-top)) constant(safe-area-inset-right) constant(safe-area-inset-bottom) constant(safe-area-inset-left);
    padding: calc(56px + env(safe-area-inset-top)) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    flex-direction: column;
    line-height: 1.4;
    min-height: 100%;
    box-sizing: border-box;
    background-color: #fff;
    background-color: var(--weui-BG-2);
}

.weui-form .weui-footer,.weui-form .weui-footer__link {
    font-size: 14px;
}

.weui-form .weui-agree {
    padding: 0;
}

.weui-form__text-area {
    padding: 0 32px;
    color: rgba(0,0,0,0.9);
    color: var(--weui-FG-0);
    text-align: center;
}

.weui-form__control-area {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
    margin: 48px 0;
}

.weui-form__tips-area {
    overflow: hidden;
}

.weui-form__tips-area,.weui-form__extra-area {
    margin-bottom: 24px;
    text-align: center;
}

.weui-form__opr-area {
    margin-bottom: 64px;
}

.weui-form__opr-area:last-child {
    margin-bottom: 96px;
}

.weui-form__title {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.36;
}

.weui-form__desc {
    font-size: 17px;
    margin-top: 16px;
}

.weui-form__tips {
    color: rgba(0,0,0,0.5);
    color: var(--weui-FG-1);
    font-size: 14px;
}

.weui-form__tips a,.weui-form__tips navigator {
    color: #576b95;
    color: var(--weui-LINK);
}

.weui-form__tips navigator {
    display: inline;
}

.weui-form-preview {
    position: relative;
    background-color: #fff;
    background-color: var(--weui-BG-2);
}

.weui-form-preview:before {
    content: " ";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    height: 1px;
    border-top: 1px solid rgba(0,0,0,0.1);
    border-top: 1px solid var(--weui-FG-3);
    color: rgba(0,0,0,0.1);
    color: var(--weui-FG-3);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
}

.weui-form-preview:after {
    content: " ";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    height: 1px;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    border-bottom: 1px solid var(--weui-FG-3);
    color: rgba(0,0,0,0.1);
    color: var(--weui-FG-3);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
}

.weui-form-preview__hd {
    position: relative;
    padding: 16px;
    text-align: right;
    line-height: 2.5em;
}

.weui-form-preview__hd:after {
    content: " ";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    height: 1px;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    border-bottom: 1px solid var(--weui-FG-3);
    color: rgba(0,0,0,0.1);
    color: var(--weui-FG-3);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
    left: 16px;
}

.weui-form-preview__hd .weui-form-preview__value {
    font-style: normal;
    font-size: 1.6em;
}

.weui-form-preview__bd {
    padding: 16px;
    font-size: 0.9em;
    text-align: right;
    color: rgba(0,0,0,0.5);
    color: var(--weui-FG-1);
    line-height: 2;
}

.weui-form-preview__ft {
    position: relative;
    line-height: 50px;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
}

.weui-form-preview__ft:before {
    content: " ";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    height: 1px;
    border-top: 1px solid rgba(0,0,0,0.1);
    border-top: 1px solid var(--weui-DIALOG-LINE-COLOR);
    color: rgba(0,0,0,0.1);
    color: var(--weui-DIALOG-LINE-COLOR);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
}

.weui-form-preview__item {
    overflow: hidden;
}

.weui-form-preview__label {
    float: left;
    margin-right: 1em;
    min-width: 4em;
    color: rgba(0,0,0,0.5);
    color: var(--weui-FG-1);
    text-align: justify;
    text-align-last: justify;
}

.weui-form-preview__value {
    display: block;
    overflow: hidden;
    word-break: normal;
    word-wrap: break-word;
    color: rgba(0,0,0,0.9);
    color: var(--weui-FG-0);
}

.weui-form-preview__btn {
    position: relative;
    display: block;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
    color: #576b95;
    color: var(--weui-LINK);
    text-align: center;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

button.weui-form-preview__btn {
    background-color: transparent;
    border: 0;
    outline: 0;
    line-height: inherit;
    font-size: inherit;
}

.weui-form-preview__btn:active {
    background-color: #ececec;
    background-color: var(--weui-BG-COLOR-ACTIVE);
}

.weui-form-preview__btn:after {
    content: " ";
    position: absolute;
    left: 0;
    top: 0;
    width: 1px;
    bottom: 0;
    border-left: 1px solid rgba(0,0,0,0.1);
    border-left: 1px solid var(--weui-DIALOG-LINE-COLOR);
    color: rgba(0,0,0,0.1);
    color: var(--weui-DIALOG-LINE-COLOR);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scaleX(0.5);
    transform: scaleX(0.5);
}

.weui-form-preview__btn:first-child:after {
    display: none;
}

.weui-form-preview__btn_default {
    color: rgba(0,0,0,0.9);
    color: var(--weui-FG-HALF);
}

.weui-form-preview__btn_primary {
    color: #576b95;
    color: var(--weui-LINK);
}  

/* seletc */

.weui-select {
    -webkit-appearance: none;
    border: 0;
    outline: 0;
    background-color: transparent;
    width: 100%;
    font-size: inherit;
    height: 56px;
    line-height: 56px;
    position: relative;
    z-index: 1;
    padding-left: 16px;
    color: rgba(0,0,0,0.9);
    color: var(--weui-FG-0);
}

/* textarea */

.weui-textarea {
    display: block;
    border: 0;
    resize: none;
    background: transparent;
    width: 100%;
    color: inherit;
    font-size: 1em;
    line-height: inherit;
    outline: 0;
}

.weui-textarea-counter {
    color: rgba(0,0,0,0.3);
    color: var(--weui-FG-2);
    text-align: right;
    font-size: 14px;
}

/* input */

.weui-input {
    width: 100%;
    border: 0;
    outline: 0;
    -webkit-appearance: none;
    background-color: transparent;
    font-size: inherit;
    color: inherit;
    height: 1.41176471em;
    line-height: 1.41176471;
}

.weui-input::-webkit-outer-spin-button,.weui-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.weui-input:focus:not(:placeholder-shown)+.weui-btn_input-clear {
    display: inline;
}

.weui-input::-webkit-input-placeholder,.weui-input__placeholder {
    color: rgba(0,0,0,0.3);
    color: var(--weui-FG-2);
}

.weui-input::placeholder,.weui-input__placeholder {
    color: rgba(0,0,0,0.3);
    color: var(--weui-FG-2);
}

/* vcode */

.weui-vcode-img {
    margin-left: 5px;
    height: 45px;
    vertical-align: middle;
}

.weui-vcode-btn {
    display: inline-block;
    height: 56px;
    margin-left: 5px;
    padding: 0 0.6em 0 0.7em;
    line-height: 56px;
    vertical-align: middle;
    font-size: 17px;
    color: #576b95;
    color: var(--weui-LINK);
    position: relative;
}

.weui-vcode-btn:before {
    content: " ";
    position: absolute;
    left: 0;
    top: 0;
    width: 1px;
    bottom: 0;
    border-left: 1px solid rgba(0,0,0,0.1);
    border-left: 1px solid var(--weui-FG-3);
    color: rgba(0,0,0,0.1);
    color: var(--weui-FG-3);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scaleX(0.5);
    transform: scaleX(0.5);
}

button.weui-vcode-btn {
    background-color: transparent;
    border: 0;
    outline: 0;
}

.weui-vcode-btn:active {
    color: #767676;
}

.weui-cell_readonly .weui-input:disabled,.weui-cell_disabled .weui-input:disabled,.weui-cell_readonly .weui-textarea:disabled,.weui-cell_disabled .weui-textarea:disabled {
    opacity: 1;
    -webkit-text-fill-color: rgba(0,0,0,0.5);
    -webkit-text-fill-color: var(--weui-FG-1);
}

.weui-cell_readonly .weui-input[disabled],.weui-cell_disabled .weui-input[disabled],.weui-cell_readonly .weui-textarea[disabled],.weui-cell_disabled .weui-textarea[disabled],.weui-cell_readonly .weui-input[readonly],.weui-cell_disabled .weui-input[readonly],.weui-cell_readonly .weui-textarea[readonly],.weui-cell_disabled .weui-textarea[readonly] {
    color: rgba(0,0,0,0.5);
    color: var(--weui-FG-1);
}

/* switch */

.weui-switch {
    -webkit-appearance: none;
    appearance: none;
}

.weui-switch,.weui-switch-cp__box {
    position: relative;
    width: 52px;
    height: 32px;
    border: 2px solid rgba(0,0,0,0.1);
    border: 2px solid var(--weui-FG-3);
    outline: 0;
    border-radius: 16px;
    box-sizing: border-box;
    -webkit-transition: background-color 0.1s,border 0.1s;
    transition: background-color 0.1s,border 0.1s;
}

.weui-switch:before,.weui-switch-cp__box:before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    border-radius: 15px;
    background-color: #f7f7f7;
    background-color: var(--weui-BG-3);
    -webkit-transition: -webkit-transform 0.35s cubic-bezier(0.45,1,0.4,1);
    transition: -webkit-transform 0.35s cubic-bezier(0.45,1,0.4,1);
    transition: transform 0.35s cubic-bezier(0.45,1,0.4,1);
    transition: transform 0.35s cubic-bezier(0.45,1,0.4,1),-webkit-transform 0.35s cubic-bezier(0.45,1,0.4,1);
}

.weui-switch:after,.weui-switch-cp__box:after {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 28px;
    height: 28px;
    border-radius: 15px;
    background-color: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.4);
    -webkit-transition: -webkit-transform 0.35s cubic-bezier(0.4,0.4,0.25,1.35);
    transition: -webkit-transform 0.35s cubic-bezier(0.4,0.4,0.25,1.35);
    transition: transform 0.35s cubic-bezier(0.4,0.4,0.25,1.35);
    transition: transform 0.35s cubic-bezier(0.4,0.4,0.25,1.35),-webkit-transform 0.35s cubic-bezier(0.4,0.4,0.25,1.35);
}

.weui-switch:checked,.weui-switch-cp__input:checked+.weui-switch-cp__box,.weui-switch-cp__input[aria-checked="true"]+.weui-switch-cp__box {
    border-color: #07c160;
    border-color: var(--weui-BRAND);
    background-color: #07c160;
    background-color: var(--weui-BRAND);
}

.weui-switch:checked:before,.weui-switch-cp__input:checked+.weui-switch-cp__box:before,.weui-switch-cp__input[aria-checked="true"]+.weui-switch-cp__box:before {
    -webkit-transform: scale(0);
    transform: scale(0);
}

.weui-switch:checked:after,.weui-switch-cp__input:checked+.weui-switch-cp__box:after,.weui-switch-cp__input[aria-checked="true"]+.weui-switch-cp__box:after {
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
}

.weui-switch-cp__input {
    position: absolute;
    left: -9999px;
}

.weui-switch-cp__box {
    display: block;
}
/* check */
.weui-check__label {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

.weui-check__label:active {
    background-color: #ececec;
    background-color: var(--weui-BG-COLOR-ACTIVE);
}

.weui-check {
    position: absolute;
    left: -9999px;
}
.weui-agree {
    display: block;
    padding: 8px 15px 0;
    font-size: 14px;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

.weui-agree a,.weui-agree navigator {
    color: #576b95;
    color: var(--weui-LINK);
}

.weui-agree navigator {
    display: inline;
}

.weui-agree__text {
    color: rgba(0,0,0,0.5);
    color: var(--weui-FG-1);
    margin-left: 2px;
}

.weui-agree__checkbox {
    -webkit-appearance: none;
    appearance: none;
    display: inline-block;
    border: 0;
    outline: 0;
    vertical-align: middle;
    background-color: currentColor;
    -webkit-mask-position: 0 0;
    mask-position: 0 0;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    -webkit-mask-image: url(data:image/svg+xml,%3Csvg%20width%3D%221000%22%20height%3D%221000%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M500%20916.667C269.881%20916.667%2083.333%20730.119%2083.333%20500%2083.333%20269.881%20269.881%2083.333%20500%2083.333c230.119%200%20416.667%20186.548%20416.667%20416.667%200%20230.119-186.548%20416.667-416.667%20416.667zm0-50c202.504%200%20366.667-164.163%20366.667-366.667%200-202.504-164.163-366.667-366.667-366.667-202.504%200-366.667%20164.163-366.667%20366.667%200%20202.504%20164.163%20366.667%20366.667%20366.667z%22%20fill-rule%3D%22evenodd%22%20fill-opacity%3D%22.9%22%2F%3E%3C%2Fsvg%3E);
    mask-image: url(data:image/svg+xml,%3Csvg%20width%3D%221000%22%20height%3D%221000%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M500%20916.667C269.881%20916.667%2083.333%20730.119%2083.333%20500%2083.333%20269.881%20269.881%2083.333%20500%2083.333c230.119%200%20416.667%20186.548%20416.667%20416.667%200%20230.119-186.548%20416.667-416.667%20416.667zm0-50c202.504%200%20366.667-164.163%20366.667-366.667%200-202.504-164.163-366.667-366.667-366.667-202.504%200-366.667%20164.163-366.667%20366.667%200%20202.504%20164.163%20366.667%20366.667%20366.667z%22%20fill-rule%3D%22evenodd%22%20fill-opacity%3D%22.9%22%2F%3E%3C%2Fsvg%3E);
    color: rgba(0,0,0,0.3);
    color: var(--weui-FG-2);
    width: 1em;
    height: 1em;
    font-size: 17px;
    margin-top: -0.2em;
}

.weui-agree__checkbox-check {
    position: absolute;
    left: -9999px;
}

.weui-agree__checkbox:checked,.weui-agree__checkbox-check[aria-checked="true"]+.weui-agree__checkbox {
    -webkit-mask-image: url(data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M12%2022C6.477%2022%202%2017.523%202%2012S6.477%202%2012%202s10%204.477%2010%2010-4.477%2010-10%2010zm-1.177-7.86l-2.765-2.767L7%2012.431l3.119%203.121a1%201%200%20001.414%200l5.952-5.95-1.062-1.062-5.6%205.6z%22%2F%3E%3C%2Fsvg%3E);
    mask-image: url(data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M12%2022C6.477%2022%202%2017.523%202%2012S6.477%202%2012%202s10%204.477%2010%2010-4.477%2010-10%2010zm-1.177-7.86l-2.765-2.767L7%2012.431l3.119%203.121a1%201%200%20001.414%200l5.952-5.95-1.062-1.062-5.6%205.6z%22%2F%3E%3C%2Fsvg%3E);
    color: #07c160;
    color: var(--weui-BRAND);
}

.weui-agree_animate {
    -webkit-animation: weuiAgree 0.3s 1;
    animation: weuiAgree 0.3s 1;
}

@-webkit-keyframes weuiAgree {
    0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    }

    16% {
    -webkit-transform: translateX(-8px);
    transform: translateX(-8px);
    }

    28% {
    -webkit-transform: translateX(-16px);
    transform: translateX(-16px);
    }

    44% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    }

    59% {
    -webkit-transform: translateX(-16px);
    transform: translateX(-16px);
    }

    73% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    }

    82% {
    -webkit-transform: translateX(16px);
    transform: translateX(16px);
    }

    94% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
    }

    100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    }
}

@keyframes weuiAgree {
    0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    }

    16% {
    -webkit-transform: translateX(-8px);
    transform: translateX(-8px);
    }

    28% {
    -webkit-transform: translateX(-16px);
    transform: translateX(-16px);
    }

    44% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    }

    59% {
    -webkit-transform: translateX(-16px);
    transform: translateX(-16px);
    }

    73% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    }

    82% {
    -webkit-transform: translateX(16px);
    transform: translateX(16px);
    }

    94% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
    }

    100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    }
}