@charset "utf-8";

/*import font-icon*/
@font-face {
    font-family: 'ui-icon';
    src: url('../fonts/ui-icon/ui-icon.eot?-9uki6c');
    src: url('../fonts/ui-icon/ui-icon.eot?#iefix-9uki6c') format('embedded-opentype'), url('../fonts/ui-icon/ui-icon.ttf?-9uki6c') format('truetype'), url('../fonts/ui-icon/ui-icon.svg?-9uki6c#Pe-icon-7-stroke') format('svg');
    font-style: normal;
}

/* 鍩虹鏍峰紡 */

/* reset */
* {
    box-sizing: border-box;
}

html {
    font-size: 100px;
}

body, p, h1, h2, h3, h4, h5, h6, ul, li, ol, dl, dt, dd {
    margin: 0;
    padding: 0;
}

body {
    font: 0.32rem/1.6 normal Helvetica;
    color: #444;
    background-color: #f4f4f4;
}

a {
    color: #04adc6;
    text-decoration: none;
}

ul, li, ol, li {
    list-style: none;
}

img, a img {
    border: none;
}

a, input, select, button, textarea {
    -webkit-tap-highlight-color: transparent;
    font-family: Helvetica;
}

div, p {
    max-height: 1000rem;
}

/* base */
.float-left {
    float: left !important;
}

.fl {
    float: left !important;
}

.float-right {
    float: right !important;
}

.fr {
    float: right !important;
}

.float-none {
    float: none !important;
}

.cf:before, .cf:after {
    content: "";
    display: table;
    clear: both;
}

.text-left {
    text-align: left !important;
}

.tl {
    text-align: left !important;
}

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

.tr {
    text-align: right !important;
}

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

.text-justify {
    text-align: justify !important;
}

.ver-top {
    vertical-align: top !important;
}

.ver-middle {
    vertical-align: middle !important;
}

.vm {
    vertical-align: middle !important;
}

.ver-bottom {
    vertical-align: bottom !important;
}

.ver-base {
    vertical-align: -50% !important;
}

.ui-icon {
    font-family: 'ui-icon' !important;
    font-size: 1.3em;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-user-select: none;
    user-select: none;
}

.ui-icon-circle {
    display: inline-block;
    text-align: center;
    background-color: #04adc6;
    border-radius: 100%;
    color: #fff;
    height: .94rem;
    width: .94rem;
    line-height: .94rem;
    font-size: .40rem;
}

.rel {
    position: relative !important;
}

.abs {
    position: absolute;
}

.cur-pointer {
    cursor: pointer;
}

.nop {
    white-space: nowrap;
}

.hide {
    display: none;
}

.inline {
    display: inline-block !important;
    width: auto !important;
}

.inline-block {
    display: inline-block !important;
    width: auto;
}

.block {
    display: block !important;
}

.dis-inline {
    display: inline-block;
}

.of-hidden {
    overflow: hidden;
}

.clear-both {
    clear: both;
}

.none {
    display: none;
}

/* color */
.color-lighter {
    color: #f4f4f4 !important;
}

.color-main {
    color: #04adc6 !important;
}

.color-dark {
    color: #444 !important;
}

.color-gray {
    color: #727272 !important;
}

.color-gray2 {
    color: #9d9d9d !important;
}

.color-gray3 {
    color: #c8c8c8 !important;
}

.color-black {
    color: #000000 !important;
}

.color-white {
    color: #ffffff !important;
}

.color-red {
    color: #e50012 !important;
}

.color-blue {
    color: #036eb7 !important;
}

.color-blues {
    color: #140e3e !important;
}

.color-orange {
    color: #ff8202 !important;
}

.color-green {
    color: #28d276 !important;
}

.color-purple {
    color: #623a00 !important;
}

.color-9a {
    color: #9a9a9a;
}

.color-27 {
    color: #272727;
}

.color-b0 {
    color: #b0b0b0;
}

.color-cof {
    color: #513212;
}

.color-666 {
    color: #666 !important;
}

.color-999 {
    color: #999 !important;
}

.bgc-lighter {
    background-color: #f8f8f8 !important;
}

.bgc-main {
    background-color: #04adc6 !important;
}

.bgc-gray {
    background-color: #f4f4f4 !important;
}

.bgc-black {
    background-color: #000000 !important;
}

.bgc-white {
    background-color: #ffffff !important;
}

.bgc-red {
    background-color: #ff5001 !important;
}

.bgc-orange {
    background-color: #ff8202 !important;
}

.bgc-green {
    background-color: #80C532 !important;
}

.bgc-purple {
    background-color: #afaaff !important;
}

.bgc-trans {
    background-color: transparent !important;
}

.bgc-bluec {
    background-color: #628ddb !important;
}

.bgc-blued {
    background-color: #cce6ff !important;
}

.bgc-bluee {
    background-color: #66c3fa !important;
}

.bgc-8c {
    background-color: #8c8c8c !important;
}

.bg-none {
    background: none !important;
}

/*font*/
.font-xs {
    font-size: .24rem !important;
}

.font-sm {
    font-size: .28rem !important;
}

.font-md {
    font-size: .32rem !important;
}

.font-bg {
    font-size: .36rem !important;
}

.font-bgs {
    font-size: .4rem !important;
}

.font-lg {
    font-size: .48rem !important;
}

.font-lgs {
    font-size: .54rem !important;
}

.font-hg {
    font-size: .74rem !important;
}

.font-wn {
    font-weight: normal !important;
}

.fs-blod {
    font-weight: bold !important;
}

/*line-height*/
.lh-xs {
    line-height: 1.2 !important;
}

.lh-sm {
    line-height: 1.4 !important;
}

.lh-md {
    line-height: 1.6 !important;
}

.lh-bg {
    line-height: 1.8 !important;
}

.lh-lg {
    line-height: 2.4 !important;
}

.lh-hg {
    line-height: 3.0 !important;
}

.h-100 {
    height: 100%;
}

/*padding*/
.pd-0 {
    padding: 0 !important;
}

.pd-xs {
    padding: .1rem !important;
}

.pd-sms {
    padding: .15rem !important;
}

.pd-sm {
    padding: .2rem !important;
}

.pd-md {
    padding: .3rem !important;
}

.pd-mds {
    padding: .35rem !important;
}

.pd-bg {
    padding: .4rem !important;
}

.pd-lg {
    padding: .6rem !important;
}

.pd-hg {
    padding: 1rem !important;
}

.pdl-0 {
    padding-left: 0 !important;
}

.pdl-xs {
    padding-left: .1rem !important;
}

.pdl-sm {
    padding-left: .2rem !important;
}

.pdl-md {
    padding-left: .3rem !important;
}

.pdl-bg {
    padding-left: .4rem !important;
}

.pdl-lg {
    padding-left: .6rem !important;
}

.pdl-lgs {
    padding-left: .7rem !important;
}

.pdl-hg {
    padding-left: 1rem !important;
}

.pdr-0 {
    padding-right: 0 !important;
}

.pdr-xs {
    padding-right: .1rem !important;
}

.pdr-sm {
    padding-right: .2rem !important;
}

.pdr-md {
    padding-right: .3rem !important;
}

.pdr-bg {
    padding-right: .4rem !important;
}

.pdr-lg {
    padding-right: .6rem !important;
}

.pdr-lgs {
    padding-right: .7rem !important;
}

.pdr-hg {
    padding-right: 1rem !important;
}

.pdt-0 {
    padding-top: 0 !important;
}

.pdt-s {
    padding-top: 0.05rem !important;
}

.pdt-xs {
    padding-top: .1rem !important;
}

.pdt-sm {
    padding-top: .2rem !important;
}

.pdt-md {
    padding-top: .3rem !important;
}

.pdt-bg {
    padding-top: .4rem !important;
}

.pdt-lg {
    padding-top: .6rem !important;
}

.pdt-lgs {
    padding-top: .7rem !important;
}

.pdt-hg {
    padding-top: 1rem !important;
}

.pdb-0 {
    padding-bottom: 0 !important;
}

.pdb-xs {
    padding-bottom: .1rem !important;
}

.pdb-sm {
    padding-bottom: .2rem !important;
}

.pdb-md {
    padding-bottom: .3rem !important;
}

.pdb-bg {
    padding-bottom: .4rem !important;
}

.pdb-lg {
    padding-bottom: .6rem !important;
}

.pdb-hg {
    padding-bottom: 1rem !important;
}

.pdl-35 {
    padding-left: 0.46667rem;
}

.pdr-35 {
    padding-right: 0.46667rem;
}

/*margin*/
.mg-at {
    margin-left: auto !important;
    margin-right: auto !important;
}

.mg-0 {
    margin: 0 !important;
}

.mg-xs {
    margin: .1rem !important;
}

.mg-sm {
    margin: .2rem !important;
}

.mg-md {
    margin: .3rem !important;
}

.mg-bg {
    margin: .4rem !important;
}

.mg-lg {
    margin: .6rem !important;
}

.mg-hg {
    margin: 1rem !important;
}

.mgl-0 {
    margin-left: 0 !important;
}

.mgl-xs {
    margin-left: .1rem !important;
}

.mgl-sm {
    margin-left: .2rem !important;
}

.mgl-md {
    margin-left: .3rem !important;
}

.mgl-bg {
    margin-left: .4rem !important;
}

.mgl-lg {
    margin-left: .6rem !important;
}

.mgl-hg {
    margin-left: 1rem !important;
}

.mgr-0 {
    margin-right: 0 !important;
}

.mgr-xs {
    margin-right: .1rem !important;
}

.mgr-sm {
    margin-right: .2rem !important;
}

.mgr-md {
    margin-right: .3rem !important;
}

.mgr-bg {
    margin-right: .4rem !important;
}

.mgr-lg {
    margin-right: .6rem !important;
}

.mgr-hg {
    margin-right: 1rem !important;
}

.mgt-0 {
    margin-top: 0 !important;
}

.mgt-xs {
    margin-top: .1rem !important;
}

.mgt-sm {
    margin-top: .2rem !important;
}

.mgt-md {
    margin-top: .3rem !important;
}

.mgt-bg {
    margin-top: .4rem !important;
}

.mgt-lg {
    margin-top: .6rem !important;
}

.mgt-hg {
    margin-top: 1rem !important;
}

.mgb-0 {
    margin-bottom: 0 !important;
}

.mgb-xs {
    margin-bottom: .1rem !important;
}

.mgb-sm {
    margin-bottom: .2rem !important;
}

.mgb-md {
    margin-bottom: .3rem !important;
}

.mgb-bg {
    margin-bottom: .4rem !important;
}

.mgb-lg {
    margin-bottom: .6rem !important;
}

.mgb-hg {
    margin-bottom: 1rem !important;
}

/*border*/
.bd-1 {
    border: 1px solid #e4e4e4 !important;
}

.bdt-1 {
    border-top: 1px solid #e4e4e4 !important;
}

.bdb-1 {
    border-bottom: 1px solid #e4e4e4 !important;
}

.bdl-1 {
    border-left: 1px solid #036eb7 !important;
}

.bdr-1 {
    border-right: 1px solid #e4e4e4 !important;
}

.bdr-2 {
    border-right: 1px solid #ffad38 !important;
}

.bdr-3 {
    border-right: 1px solid #fff !important;
}

.bdtb-1 {
    border-top: 1px solid #e4e4e4 !important;
    border-bottom: 1px solid #e4e4e4 !important;
}

.bdlr-1 {
    border-left: 1px solid #e4e4e4 !important;
    border-right: 1px solid #e4e4e4 !important;
}

.bd-0 {
    border: none !important;
}

.bdt-0 {
    border-top: none !important;
}

.bdb-0 {
    border-bottom: none !important;
}

.bdl-0 {
    border-left: none !important;
}

.bdr-0 {
    border-right: none !important;
}

/*ui-row 鍒犳牸鍖栧竷灞€*/
.ui-row:before, .ui-row:after, .ui-form:after, .ui-form:after, .panel-body:after, .container:after, .app-con:after, .app-location:after, .tab-body:after, .tab-head:after, .tab-item:after {
    content: "";
    display: table;
    clear: both;
}

.ui-row [class*="col-"], .ui-form [class*="col-"] {
    float: left;
    min-height: .4rem;
}

.col-1 {
    width: 8.33333333%;
}

.col-2 {
    width: 16.66666667%;
}

.col-3 {
    width: 25%;
}

.col-4 {
    width: 33.33333333%;
}

.col-5 {
    width: 41.66666667%;
}

.col-6 {
    width: 50%;
}

.col-7 {
    width: 58.33333333%;
}

.col-8 {
    width: 66.66666667%;
}

.col-9 {
    width: 75%;
}

.col-10 {
    width: 83.33333333%;
}

.col-11 {
    width: 91.66666667%;
}

.col-12 {
    width: 100%;
}

.col-2-4 {
    width: 20%;
}

/*ui-choose*/
.ui-choose {
    border: 1px solid transparent;
    border-right: none;
    border-bottom: none;
    margin: 0;
    padding: 0;
    list-style: none;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: -webkit-flex;
    display: -webkit-box;
    display: flex;
    background-color: #fff;
}

.ui-choose:after {
    content: '';
    display: table;
    clear: both;
}

.ui-choose > li {
    border: 1px solid #04adc6;
    height: .74rem;
    line-height: .72rem;
    margin: -1px 0 0 -1px;
    padding: 0 .28rem;
    cursor: pointer;
    position: relative;
    z-index: 1;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
    color: #04adc6;
}

.ui-choose > li:first-child {
    border-radius: .1rem 0 0 .1rem;
}

.ui-choose > li:last-child {
    border-radius: 0 .1rem .1rem 0;
}

.ui-choose > li.selected {
    z-index: 3;
    border-color: #04adc6;
    background-color: #04adc6;
    color: #fff;
}

.ui-choose > li.disabled {
    z-index: 2;
    background-color: #f2f2f2;
    color: #aaa;
    cursor: not-allowed;
}

.ui-choose > li.disabled:hover {
    border-color: #aaa;
}

.ui-choose > li.selected.disabled {
    z-index: 2;
    background-color: #8FC7FF;
    color: #fff;
    cursor: not-allowed;
    border-color: #8FC7FF;
}

.choose-type-right > li.selected {
    color: #04adc6;
    position: relative;
    overflow: hidden;
    background: transparent url(../images/icon/ui-choose-selected.png) no-repeat right bottom;
    background-size: .4rem;
}

/* ui-btn */
.ui-btn {
    display: block;
    text-align: center;
    -webkit-appearance: none;
    width: 100%;
    height: .88rem;
    line-height: .86rem;
    background-color: #ffbe4c;
    outline: none;
    color: #fff;
    font-weight: normal;
    border: 1px solid #ffbe4c;
    padding: 0 .24rem;
    border-radius: .1rem;
    font-size: .32rem;
}

.btn-default {
    background-color: #fff;
    color: #04adc6;
    border-color: #cecece;
}

.ui-btn[disabled] {
    background: #ccc;
    color: #fff;
    box-shadow: 0 0.02rem 0.04rem #555;
}

.btn-inline {
    display: inline-block;
    width: auto;
}

.btn-link {
    text-decoration: underline;
    background-color: transparent;
    color: #04adc6;
    border-color: transparent;
}

.btn-link:active {
    background-color: #f4f4f4;
    border-color: #cecece;
}

.btn-black {
    background-color: #000;
    border-color: #000;
    color: #fff;
}

.btn-green {
    background-color: #80C532;
    border-color: #80C532;
}

.btn-orange {
    background-color: #f0af18;
    border-color: #f0af18;
}

.btn-outline {
    background-color: #fff2db;
    color: #FFBE4C;
    border-color: #FFBE4C;
}

.btn-green.btn-outline {
    color: #80C532;
}

.btn-orange.btn-outline {
    color: #f0af18;
}

.btn-black.btn-outline {
    color: #000;
}

.btn-sm {
    display: inline-block;
    height: .6rem;
    font-size: .26rem;
    line-height: .6rem;
    width: 1.4rem;
    background-color: #FFBE4C;
    color: #fff;
    text-align: center
}

.btn-bg1 {
    background: url("../images/bg/btn-bg1.png") center center no-repeat;
}

.btn-bg2 {
    background: url("../images/bg/btn-bg2.png") center center no-repeat;
}

.btn-bg3 {
    background: url("../images/bg/btn-bg3.png") center center no-repeat;
}

.btn-bg4 {
    background: url("../images/bg/btn-bg4.png") center center no-repeat;
}

.btn-no-radius {
    -webkit-border-radius: 0;
    border-radius: 0;
}

/* form */
.ui-input {
    height: .88rem;
    border: 1px solid #cecece;
    border-radius: .1rem;
    font-size: .32rem;
    padding: .14rem .24rem;
    line-height: 1.3;
    -webkit-appearance: none;
    outline: none;
    display: block;
    width: 100%;
    vertical-align: top;
}

.input-group {
    width: 100%;
    display: table;
    border-collapse: separate;
    border: 1px solid #cecece; /* border-radius: .1rem;*/
    background-color: #fff;
    height: .88rem;
}

.input-group > .group-addon {
    display: table-cell;
    vertical-align: top;
    text-align: center;
    position: relative;
    width: 1%;
    white-space: nowrap;
    cursor: pointer
}

.group-addon > .ui-icon {
    font-size: .52rem;
}

.input-group > .group-addon:after {
    content: '';
    position: absolute;
    right: 0px;
    top: 20%;
    width: 1px;
    height: 60%; /*background-color: #cecece;*/
}

.input-group > .ui-input {
    display: table-cell;
    border: none;
    height: .86rem;
}

input::-webkit-input-placeholder {
    color: #bdbdbd;
}

.input-group > .ui-clear {
    display: table-cell;
    color: #87BEFF;
    padding: 0 .24rem;
    cursor: pointer;
    opacity: 0;
}

.input-search {
    position: relative;
}

.input-search > .group-addon {
    padding: 0;
    padding-left: .2rem;
    color: #727272;
}

.input-search > .group-addon > .ui-icon {
    font-size: .38rem;
    line-height: .86rem;
}

.input-search > .group-addon:after {
    display: none;
}

.group-del {
    position: absolute;
    display: block;
    width: .4rem;
    height: .4rem;
    line-height: .4rem;
    font-weight: lighter;
    border-radius: 100%;
    background-color: #ccc;
    text-align: center;
    color: #fff;
    right: .2rem;
    top: 50%;
    margin-top: -0.2rem;
}

.group-del:after {
    content: "脳";
}

.ui-required {
    font-style: normal;
    color: #ff0000;
    vertical-align: middle;
    margin-right: .1rem;
}

.ui-required:before {
    content: '*';
}

select.ui-input {
    background: #fdfdfd url("../images/icon/select-arrow.png") no-repeat right .3rem center;
    background-size: .51rem;
    padding-right: .8rem;
}

textarea.ui-input {
    height: auto;
}

.input-inline {
    display: inline-block;
    width: auto;
}

.input-sm {
    height: .58rem;
    font-size: .24rem;
    line-height: .56rem;
    padding: 0 .24rem;
    border-radius: .06rem;
}

.ui-tag {
    display: inline-block;
    height: .4rem;
    padding: 0 .24rem;
    border-radius: .4rem;
    line-height: .4rem;
    color: #fff;
    font-size: .24rem;
    text-align: center;
    white-space: nowrap;
    background-color: #70e2c9;
}

.ui-condition {
    display: -webkit-flex;
    display: -webkit-box;
    display: flex;
    height: .88rem;
    border-bottom: 1px solid #cecece;
}

.ui-condition > li {
    -webkit-flex: 1;
    -webkit-box-flex: 1;
    flex: 1;
    line-height: .87rem;
    text-align: center;
    position: relative;
}

.ui-condition > li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    height: 100%;
    width: 0;
    border-left: 1px solid #cecece;
}

.ui-condition > li:first-child:before {
    display: none;
}

.ui-condition > li > span {
    position: relative;
    display: inline-block;
    height: .4rem;
    padding-right: .4rem;
}

.ui-condition > li > span:before, .ui-condition > li > span:after {
    content: "";
    border: .1rem solid transparent;
    border-bottom-color: #cecece;
    position: absolute;
    right: 0;
    top: .2rem;
}

.ui-condition > li > span:after {
    border-bottom-color: transparent;
    border-top-color: #cecece;
    top: .48rem;
}

.ui-condition > li.active {
    color: #04adc6;
}

.ui-condition > li.active > span:before {
    border-bottom-color: #04adc6;
}

.ui-condition > li.active > span:after {
    border-top-color: #04adc6;
}

/* checkbox radio */
.ui-checkbox, .ui-radio {
    display: block;
    height: .74rem;
    line-height: .74rem;
    width: 100%;
}

.ui-checkbox > input, .ui-radio > input {
    margin: 0;
    margin-right: .12rem;
    vertical-align: -70%;
    -webkit-appearance: none;
    width: .4rem;
    height: .4rem;
    background-color: #fff;
    border: 1px solid #cecece;
    border-radius: .08rem;
    background-size: .27rem;
    background-repeat: no-repeat;
    background-position: center center;
    outline: none;
}

.ui-checkbox > input:checked {
    border-color: #ffad38;
    background-image: url("../images/icon/checked.png");
}

.ui-radio > input {
    border-radius: 100%;
    position: relative;
}

.ui-radio > input:checked {
    border-color: #ffad38;
}

.ui-radio > input:checked:after {
    content: "";
    display: inline-block;
    width: 50%;
    height: 50%;
    background-color: #ffad38;
    position: absolute;
    border-radius: 100%;
    left: 25%;
    top: 25%;
}

.radio-pay > img {
    width: .5rem;
    height: .5rem;
    vertical-align: middle;
    margin-right: .2rem;
}

.radio-pay > input {
    float: right;
    margin: .2rem 0 0 0;
}

.radio-pay > input:checked {
    background: #04adc6 url("../images/icon/checked-2.png") no-repeat center center;
    background-size: .26rem;
}

.radio-pay > input:checked:after, .radio-type > input:checked:after {
    display: none;
}

.radio-type > input:checked {
    border-color: #04adc6;
    background: #04adc6 url(../images/icon/checked-2.png) no-repeat center center;
    background-size: .27rem;
}

.checkbox-sm {
    width: 0.3rem;
    height: 0.3rem;
    vertical-align: middle;
}

/* ui-switch 寮€鍏� */
.ui-switch {
    height: .74rem;
    line-height: .74rem;
    display: block;
    width: 100%;
    position: relative;
}

.ui-switch > input {
    width: .8rem;
    height: .6rem;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    margin-right: -0.8rem;
    position: relative;
    z-index: 1;
    opacity: 0;
}

.ui-switch > span {
    display: inline-block;
    position: relative;
    border: 1px solid #ccc;
    background-color: #fff;
    height: .6rem;
    width: .8rem;
    border-radius: .37rem;
    vertical-align: middle;
    cursor: pointer;
    outline: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: background-color .15s ease-out;
    transition: background-color .15s ease-out;
    margin-right: .12rem;
}

.ui-switch > span:after {
    content: "";
    display: block;
    width: .58rem;
    height: .58rem;
    border-radius: 100%;
    background-color: #fff;
    box-shadow: 0 0.5px 2px 0.5px rgba(0, 0, 0, 0.38);
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-transition: -webkit-transform .15s ease-out;
    transition: transform .15s ease;
}

.ui-switch > input:checked + span {
    border-color: #80C532;
    background-color: #80C532;
}

.ui-switch > input:checked + span:after {
    background-color: #fff;
    border-color: #fff;
    -webkit-transform: translate(.2rem, 0);
    transform: translate(.2rem, 0);
}

.ui-switch > input + span {
    border-color: #cecece;
    cursor: not-allowed;
    background-color: #fff;
}

.ui-switch > input + span:after {
    background-color: #fff;
}

.ui-switch > input:disabled:checked + span {
    border-color: #80C532;
    cursor: not-allowed;
    background-color: #80C532;
    opacity: .8;
}

.ui-switch > input:disabled:checked + span:after {
    background-color: #fafafa;
}

/* panel */
.panel {
    background-color: #fff; /*border-top: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4; padding: .2rem; */
    margin-bottom: .2rem;
}

.pub-header + .panel {
    border-top: none;
}

.panel:after {
    content: '';
    display: table;
    clear: both;
}

.panel-title {
    border-left: .08rem solid #ffad38;
    font-size: .32rem;
    margin-left: -0.2rem;
    font-weight: normal;
    padding-left: .15rem;
    height: .36rem;
    line-height: .36rem;
}

.panel-body {
    padding: .2rem;
}

.panel-header {
    position: relative;
    padding: .2rem;
}

.panel-header.close-right > .close:after {
    position: absolute;
    top: 50%;
    display: inline-block;
    font-family: ui-icon;
    font-size: 0.48rem;
    line-height: 1;
    color: #bbb;
    text-decoration: none;
    -webkit-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
    -webkit-font-smoothing: antialiased;
    right: 0.3rem;
    content: '\e680';
    cursor: pointer;
}

.panel .more-link {
    display: inline-block;
    position: absolute;
    right: 0.1rem;
    top: 50%;
    transform: translateY(-50%);
    color: #888;
    font-size: 0.24rem;
}

/*ui-tab*/
.tab-head {
    display: -webkit-flex;
    display: -webkit-box;
    display: flex;
    background-color: #f4f4f4;
}

.tab-head:after, .tab-item:after {
    content: "";
    display: table;
    clear: both;
}

.tab-item {
    padding-top: .2rem;
    padding-bottom: .2rem;
}

.tab-head > li {
    position: relative;
    padding: 0 .24rem;
    height: 1rem;
    line-height: 1rem;
    text-align: center;
    -webkit-flex: 1;
    -webkit-box-flex: 1;
    flex: 1;
}

.tab-head > li > span {
    position: relative;
    display: inline-block;
}

.tab-head > li.active > span {
    color: #ffad38;
}

.tab-head > li.active > span:after {
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -0.3rem;
    display: inline-block;
    width: 0.6rem;
    height: 0.07rem;
    border-radius: 0.07rem;
    background-color: #ffad38;
    content: '';
}

.tab-body > .tab-item {
    display: none;
}

.tab-body > .tab-item.active {
    display: block;
}

.scroll-tab-head {
    height: 1rem;
    width: 200%;
    overflow: hidden
}

.scroll-tab-head > li {
    height: 1rem;
    line-height: 1rem;
    display: inline-block;
    padding: 0 0.3rem;
}

.scroll-tab-head > li > a {
    position: relative;
    display: inline-block;
    color: #444
}

.scroll-tab-head > li.active > a {
    color: #ffad38;
}

.scroll-tab-head > li.active > a:after {
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -0.3rem;
    display: inline-block;
    width: 0.6rem;
    height: 0.07rem;
    border-radius: 0.07rem;
    background-color: #ffad38;
    content: '';
}

/*ui-flow*/
.ui-flow {
    font-size: .28rem;
    text-align: center;
}

.ui-flow > div {
    position: relative;
    padding-top: .2rem;
    padding-bottom: .2rem;
    overflow: hidden;
    height: 1.8rem;
    overflow: hidden;
}

.ui-flow p {
    color: #727272;
    font-size: .24rem;
}

.flow-arrow {
    position: relative;
    z-index: 3;
    text-align: center;
    color: #fff;
    background-color: #fff;
    display: inline-block;
    width: .4rem;
    height: .4rem;
    border-radius: 100%;
    border: 1px solid #cecece;
    line-height: .4rem;
    font-weight: 100;
    font-size: .40rem;
    overflow: hidden;
}

.ui-flow > div:before, .ui-flow > div:after {
    position: absolute;
    content: "";
    display: block;
    height: 0;
    border-bottom: .03rem dashed #eee;
    width: 50%;
    top: .4rem;
}

.ui-flow > div:after {
    right: 0;
    left: 50%;
}

.flow-arrow.checked {
    border-color: #04adc6;
    background: #04adc6 url("../images/icon/checked-2.png") no-repeat center center;
    background-size: .27rem;
}

.flow-arrow.error {
    background-color: #eb7e67;
    border-color: #eb7e67;
}

.flow-arrow.error:before {
    content: "脳";
}

/* ui-tick */
.ui-tick {
    display: block;
    text-align: center;
    color: #fff;
    font-size: .24rem;
    line-height: .4rem;
}

.ui-tick > li {
    display: inline-block;
    background-color: #727272;
    width: .36rem;
    height: .42rem;
    border-radius: .06rem;
}

.ui-tick > li.split {
    color: #000;
    background-color: transparent;
    margin-left: -0.1rem;
    margin-right: -0.1rem;
}

.scroll-more {
    display: block;
    width: 100%;
    padding: .2rem;
    text-align: center;
    font-size: .24rem;
    color: #727272;
    display: none;
}

/* header footer */
.pub-header {
    position: relative;
    height: .88rem;
    background-color: #ffbe4c;
    color: #fff;
    line-height: .88rem;
    text-align: center;
}

.pub-header > h1 {
    font-size: .36rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pub-header > a {
    color: #fff;
    position: absolute;
    display: block;
}

.header-back {
    display: block;
    width: .88rem;
    height: .88rem;
    background: url("../images/icon/head-back.png") no-repeat center center;
    background-size: .22rem;
}

.bgc-white .header-back {
    background: url(../images/icon/head-back2.png) no-repeat center center;
}

.header-left, .header-right {
    position: absolute;
    height: .88rem;
    line-height: .88rem;
    overflow: hidden;
    text-align: center;
    top: 0;
    padding: 0 .1rem;
}

.header-right {
    right: 0;
    top: 0;
}

.header-left > .ui-icon, .header-right > .ui-icon {
    height: .88rem;
    line-height: .88rem;
    padding: 0 .1rem;
    display: inline-block;
    float: left;
}

.pub-fixed-top {
    height: .88rem;
}

.fixed-con {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
}

.pub-bar {
    height: .98rem;
}

.bar-fixed {
    position: fixed;
    z-index: 99;
    left: 0;
    bottom: 0;
    width: 100%;
    height: .98rem;
    display: -webkit-flex;
    display: -webkit-box;
    display: flex;
    background-color: #fafafa;
    border-top: 1px solid #cecece;
    text-align: center;
}

.bar-fixed > li {
    -webkit-flex: 1;
    -webkit-box-flex: 1;
    flex: 1;
    font-size: .24rem;
    line-height: 1.3;
    color: #727272;
}

.bar-fixed > li > .ui-icon {
    font-size: 2em;
}

.bar-fixed > li > span {
    display: block;
}

.bar-fixed > li.active {
    font-weight: bolder;
    color: #04adc6;
}

.bbs-header {
    background: url("../images/bg/bbs-header.png") no-repeat center top;
    height: 2.3rem;
    position: relative;
    overflow: hidden;
    line-height: 1.4;
    background-size: 7.5rem;
}

.bbs-user {
    width: 1.1rem;
    height: 1.1rem;
    display: inline-block;
    border-radius: 100%;
    border: .1rem solid #67c4f0;
    text-align: center;
    overflow: hidden;
    background: #6ad3fe;
}

.bbs-user > img {
    width: .9rem;
    height: .9rem;
}

.pub-action {
    height: .9rem;
}

.pub-action > .ui-row {
    position: fixed;
    z-index: 99;
    left: 0;
    bottom: 0;
    width: 100%;
    height: .9rem;
    line-height: .9rem;
    text-align: center;
    color: #fff;
    background-color: #fcba5d;
}

/* header tip and footer actions */
.ui-tip {
    -webkit-animation: tibMove .8s ease;
    position: fixed;
    top: .7rem;
    right: 0;
    width: 2rem;
    padding-left: .2rem;
    padding-right: .1rem;
    overflow: hidden;
    height: .48rem;
    line-height: .48rem;
    background-color: #ff8202;
    color: #fff;
    font-size: .24rem;
    border-top-left-radius: .5rem;
    border-bottom-left-radius: .5rem;
    z-index: 99;
}

.ui-tip.tip-move {
    opacity: .5;
}

@-webkit-keyframes tibMove {
    from {
        opacity: 0;
        -webkit-transform: translateX(100%);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

.ui-tip-list {
    transition: -webkit-transform .3s ease;
}

.ui-tip-list > li {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.app-ctrl {
    position: fixed;
    bottom: 1.2rem;
    right: .35rem;
    z-index: 99;
    width: .9rem;
    height: .9rem;
}

.app-ctrl > span {
    position: absolute;
    z-index: 1;
    right: 0;
    bottom: 0;
    display: block;
    width: .9rem;
    height: .9rem;
    line-height: .9rem;
    border: 1px solid #04adc6;
    border-radius: 100%;
    background-color: #04adc6;
    color: #fff;
    overflow: hidden;
    text-align: center;
}

span.ctrl-center {
    width: .72rem;
    height: .72rem;
    line-height: .72rem;
    z-index: 2;
    -webkit-transform: rotate(45deg);
    -webkit-transition: -webkit-transform .4s ease, background-color .4s, color .43s;
}

.app-ctrl.open > span.ctrl-center {
    background-color: #fff;
    color: #04adc6;
    border: 1px solid #04adc6;
    -webkit-transform: rotate(90deg);
}

.app-ctrl > span.ctrl-item {
    opacity: 0;
    -webkit-transition: -webkit-transform .4s ease, opacity .4s ease .15s;
}

.app-ctrl > span.ctrl-single {
    opacity: 1;
}

.app-ctrl.open > .ctrl-item:nth-of-type(2) {
    opacity: 1;
    -webkit-transform: translate3d(-1rem, 0, 0);
}

.app-ctrl.open > .ctrl-item:nth-of-type(3) {
    opacity: 1;
    -webkit-transform: translate3d(0, -1rem, 0);
}

.ui-chart {
    width: 100%;
    height: 3.6rem;
}

/*w-*/
.w-240 {
    width: 2.4rem !important;
}

.w-280 {
    width: 2.8rem !important;
}

/*select*/
.ui-select {
    height: 0.88rem;
    border: 1px solid #cecece;
    padding-left: 0.24rem;
    padding-right: 0.24rem;
    background-color: #fff;
    position: relative;
}

.ui-select > input {
    width: 100%;
    height: 0.86rem;
    border: 0 none;
    outline: none;
    padding-right: 0.2rem;
    outline: 0;
    -webkit-appearance: none;
    appearance: none;
    color: #444;
    font-size: 0.32rem;
}

.ui-select > select {
    width: 100%;
    height: 0.86rem;
    border: 0 none;
    outline: none;
    padding-right: 0.2rem;
    outline: 0;
    -webkit-appearance: none;
    appearance: none;
    color: #444;
    font-size: 0.32rem;
}

.ui-select.placeholder select {
    color: #bdbdbd;
}

.ui-select-org {
    border: none
}

.ui-select:after {
    position: absolute;
    top: 0.44rem;
    display: inline-block;
    right: 0.3rem;
    font-family: ui-icon;
    font-size: 0.48rem;
    line-height: 1;
    color: #bbb;
    text-decoration: none;
    -webkit-transform: translate(50%, -50%);
    -ms-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
    -webkit-font-smoothing: antialiased;
    content: '\e688';
}

.ui-select-org:after {
    color: #fdc872;
    font-size: 0.64rem;
}

.a-underline {
    text-decoration: underline;
}