@charset "utf-8";
body,ul,li,h6,dl,dd,dt,a,h1,h2,h3,h4,h5,h6,div,p,strong,i,a,img{
    margin:0px;
    padding: 0px;
    border:0px;
    font-family: aril;
    font-family: "Microsoft Yahei", "HanHei SC", "PingHei", "PingFang SC", "STHeitiSC-Light", "Helvetica Neue", "Helvetica";
/*    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;*/
    box-sizing: border-box;
}

html { font-size:100px; height: 100%; }
body { font: normal 100% Microsoft Yahei, Helvetica, Arial, sans-serif; color: #333; background: #F4F5FA; -webkit-font-smoothing: inherit; height: 100%;}
*{ margin: 0px;padding: 0px;font-family: "微软雅黑";}
a{text-decoration: none; color: #0B85FF;}
textarea { font-size: .14rem }
.fl { float: left; }
.fr { float: right; }
.clear { clear: both; }
.ml20 { margin-left: .2rem; }
.ml10 { margin-left: .1rem; }
.ml5 { margin-left: .05rem; }
.ml3 { margin-left: .03rem; }
.mr20 { margin-right: .2rem; }
.mr10 { margin-right: .1rem; }
.mr5 { margin-right: .05rem; }
.mr3 { margin-right: .03rem; }
.mt5 { margin-top: .05rem; }
.mt10 { margin-top: .1rem; }
.mt20 { margin-top: .2rem; }
.mb15 { margin-bottom: .15rem; }
.pr { position: relative; }
.pa { position: absolute; }
.fz14 { font-size: .14rem; }
.fz16 { font-size: .16rem; }
.fz18 { font-size: .18rem; }
.fz20 { font-size: .2rem; }
.fz30 { font-size: .3rem; }
.fs-normal { font-style: normal;}
.normal {font-weight: normal; }
.bold { font-weight: bold; }
.bold-force { font-weight: bold !important; }
.normal-force { font-weight: normal !important; }
.h10 { height: .1rem }
.lh10 { line-height: .1rem }
.va-middle { vertical-align: middle; }
.va-top { vertical-align: top; }
.ta-left { text-align: left; }
.ta-center { text-align: center; }
.ta-left-force { text-align: left !important; }
.p5 { padding: .05rem; }
.pointer { cursor: pointer; }
.block {display: block; }
.colorRed { color: #ff5651; }
.colorBlue { color: #4777e9; }
.color333 { color: #333; }
.color666 { color: #666; }
.color999 { color: #999999; }
.color666-force { color: #666 !important; }
.colorGreen { color: #33cbcc; }
.colorOrange { color: #FE6B50; }
.colorYellow { color: #FF9900; }
.colorGreenLight { color: #36CC66; }
.bt1 {border-top: 1px solid #eef2fc;}
.ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.no-hover { cursor: initial !important; }
.btn-green-bg{background: #00CC99; color: #fff;}
.btn-green-bg:hover{background: #07BE90; color: #fff;}


input { line-height: .35rem; -webkit-border-radius: .05rem; -ms-border-radius: .05rem; -o-border-radius: .05rem; -moz-border-radius: .05rem; border-radius: .05rem; border: 1px solid #D7D7D7; padding-left: .1rem; box-sizing: border-box; }
textarea { line-height: .25rem; -webkit-border-radius: .05rem; -ms-border-radius: .05rem; -o-border-radius: .05rem; -moz-border-radius: .05rem; border-radius: .05rem; border: 1px solid #D7D7D7; padding: .05rem .1rem; box-sizing: border-box; resize: none;}
input[type="text"]:focus, textarea:focus, input[type="password"]:focus, .filterBox div:hover { outline: none; border: 1px solid #3775ff !important; box-shadow: 0 0 3px 1px #3775ff; }
input[type="text"].error, textarea.error, input[type="password"].error { outline: none; border: 1px solid #ff6a66 !important; box-shadow: 0 0 3px 1px #ff6a66; }

.vue-body { font-size: .14rem; height: 100%;}

/* 公共按钮样式 */
.btn-common { display: inline-block; padding: 0 .15rem; line-height: .3rem; height: .3rem; -webkit-border-radius: .03rem; -ms-border-radius: .03rem; -o-border-radius: .03rem; -moz-border-radius: .03rem; border-radius: .03rem; vertical-align: middle; cursor: pointer; box-sizing: border-box;}
.btn-big {line-height: .4rem; height: .4rem; padding: 0 .35rem;}
.radius15 { -webkit-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;}
.btn-red-bg { background: #ff6a66; color: #FFFFFF; }
.btn-red-bg:hover { background: #ff5651; }
.btn-red-no-bg { color: #ff6a66; }
.btn-red-no-bg:hover { color: #ff5651; }
.btn-red-bd { border: 1px solid #ff6a66; color: #ff6a66;}
.btn-red-bd:hover { border: 1px solid #ff5651;  color: #ff5651;}
.btn-blue-no-bg { color: #4777e9; }
.btn-blue-no-bg:hover { color: #0066ff; }
.btn-blue-bg { background: #4777e9; color: #FFFFFF; }
.btn-blue-bg:hover { background: #0066ff; color: #FFFFFF; }
.btn-blue-bd {border: 1px solid #4777e9; color: #4777e9;}
.btn-blue-bd:hover {border: 1px solid #0066ff; color: #0066ff;}
.btn-blue-bd-dashed {border: 1px dashed #4777e9; color: #4777e9;}
.btn-blue-bd-dashed:hover {border: 1px dashed #0066ff; color: #0066ff;}
.btn-light-blue-bg {background: #ECF3FE; color: #0066ff;}
.btn-light-blue-bg:hover { background: #DEEBFE; }
.btn-blue-bd-with-light-blue-bg { border: 1px dashed #4777e9; color: #4777e9; background: #ECF3FE; }
.btn-blue-bd-with-light-blue-bg:hover, .btn-blue-bd-with-light-blue-bg.current { border: 1px dashed #0066ff; color: #0066ff; background: #DEEBFE; }
.btn-grey-bg { background: #999999; color: #FFFFFF; }
.btn-grey-bg:hover { background: #7b7b7b; }
.btn-grey-no-bg { color: #D7D7D7; }
.btn-grey-no-bg:hover { color: #666666; }
.btn-grey-bd { border: 1px solid #D7D7D7; }
.btn-grey-bd:hover { border: 1px solid #999999; }
.btn-grey-bd-with-white-bg { border: 1px solid #797979; background: #FFFFFF; }
.btn-grey-bd-with-white-bg:hover { background: #F2F2F2; }
.btn-orange-no-bg { color: #f39203; }
.btn-orange-no-bg:hover { color: #ff9800; }
.btn-orange-bg { background: #f39203; color: #FFFFFF; }
.btn-orange-bg:hover { background: #ff9800; color: #FFFFFF; }
.btn-green-no-bg { color: #52c8ca; }
.btn-green-no-bg:hover { color: #33cbcc; }
.btn-green-bg { background: #52c8ca; color: #FFFFFF; }
.btn-green-bg:hover { background: #33cbcc; color: #FFFFFF; }
.btn-green-light-bg { background: #04CC99; color: #FFFFFF; }
.btn-green-light-bg:hover { background: #04DDA6; color: #FFFFFF; }
.btn-yellow-bg { background: #FB9B09; color: #FFFFFF; }
.btn-yellow-bg:hover { background: #FB9B09; }
.btn-yellow-bd { border: 1px solid #FF9900; color: #FF9900; }
.btn-yellow-bd:hovey { border: 1px solid #FB9B09; color: #FB9B09; }
.btn-refuse { background: #FE6B50; color: #FFFFFF; }
.btn-refuse:hover { background: #ec5d42; }
.btn-height-40 { line-height: .4rem; height: .4rem; box-sizing: border-box; }
.btn-width140 { width: 1.4rem; padding: 0; }
.btn-otor-no-bg { color: #F99a78; }
.btn-otor-no-bg:hover { color: #FF6B50; }
.btn-giveup { background: #001E3C; color: #FFFFFF; }
.btn-giveup:hover { background: #003a73; color: #FFFFFF; }

/* 各种标记块 */
.span-block {width: .2rem; height: .2rem; line-height: .2rem; text-align: center; display: inline-block;}
.red {background: #ff6a66; color: #FFFFFF;}

/* checkbox 样式 */
.appearance { width: .2rem; height: .2rem; display: inline-block; vertical-align: middle; line-height: .2rem; }
.appearance input[type=checkbox]{ position: relative; appearance: none; -webkit-appearance: none; width: .2rem; height: .2rem; outline: none; border: 1px solid #085BFF; background-color: #fff; -webkit-border-radius: .03rem; -ms-border-radius: .03rem; -o-border-radius: .03rem; -moz-border-radius: .03rem; border-radius: .03rem; margin:0;  display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; cursor: pointer;}
.appearance.light-blue input[type=checkbox] { border-color: #BAD0EA; }
.appearance input[type=checkbox]:checked{ border-color: #085BFF; background: #085BFF;}
.appearance input[type=checkbox]:checked::after{ transform: translate(-50%,-50%) scale(1);}
.appearance input[type=checkbox]::after{ display: inline-block; content: "\f00c"; color: #FFFFFF; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) scale(0); transition: transform .15s ease-in;}
.appearance input[type=radio]{ position: relative; appearance: none; -webkit-appearance: none; width: .2rem; height: .2rem; outline: none; border: 2px solid #085BFF; background-color: #fff; -webkit-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; -moz-border-radius: 50%; border-radius:50%; margin:0;  display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; cursor: pointer;}
.appearance.light-blue input[type=radio] { border-color: #BAD0EA; }
.appearance input[type=radio]:checked{ border-color: #085BFF; background: #FFFFFF;}
.appearance input[type=radio]:checked::after{ transform: translate(-50%,-50%) scale(1);}
.appearance input[type=radio]::after{ display: inline-block; content: "\f111"; color: #085BFF; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) scale(0); transition: transform .15s ease-in;}
.appearance.mr10 { margin-right: .1rem }
/* 文本颜色 */
.color-red { color: #ff6a66; }

/* 右侧内容区域外层容器样式 */
.vue-page { width: 100%; float: left; }
.filter-bar { margin-bottom: .1rem; background: #FFFFFF; padding: 10px; box-shadow: 0 0 0.1rem 0.01rem #ccccff }
.content-area { background: #FFFFFF; box-shadow: 0 0 0.1rem 0.01rem #ccccff; padding: .15rem; min-height: 5rem; }


/*下拉框样式*/
.filterBox{ min-width: 1.1rem; margin-left: .1rem; font-size: .14rem; position: relative; float: left; -webkit-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; cursor: pointer; background: #FFFFFF;}
.filterBox div { height: .3rem; border: 1px solid #D7D7D7; color: #AEAEAE; -webkit-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; box-sizing: border-box; cursor: pointer;}
.filterBox div.selected { color: #333; }
.filterBox span { display: inline-block; text-align: left; padding-left: .1rem; line-height: .3rem; float: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: .7rem;}
.filterBox i { font-size: .26rem; line-height: .28rem; width: .26rem; display: inline-block; text-align: center; float: right; color: #A1A1A1;}
.filterBox ul { max-height: 2.1rem; list-style-type: none; padding: 0rem; margin: 0rem; text-align: left; background: #FFFFFF; border-top: 0rem; overflow: auto !important; height: 0rem; box-sizing: border-box; position: absolute; width: 100%; z-index: 999;}
.filterBox ul li { padding-left: .1rem; line-height: .3rem; cursor: pointer;}
.filterBox ul li:hover { background: #D7D7D7;}
.filterBox ul li.selected { background: #D7D7D7;}

/* 提醒效果 */
@keyframes fade-in {
    0% {opacity: 0;}
    20% {opacity: .2;}
    40% {opacity: .4;}
    60% {opacity: .6;}
    80% {opacity: .8;}
    100% {opacity: 1;}
}

@-webkit-keyframes fade-in {/*针对webkit内核*/
    0% {opacity: 0;}
    20% {opacity: .2;}
    40% {opacity: .4;}
    60% {opacity: .6;}
    80% {opacity: .8;}
    100% {opacity: 1;}
}

/* 询问框 */
.confirm-dialog { position: absolute; top: 50%; left: 50%; font-size: .14rem;background: #FFFFFF; width: 4rem; -webkit-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.confirm-dialog .confirm-title {line-height: .5rem; border-bottom: 1px solid #E4E4E4; padding: 0 .15rem; font-size: .16rem}
.confirm-dialog .confirm-title .close { height: .25rem; width: .25rem; margin-top: .125rem;}
.confirm-dialog .confirm-content { text-align: center; padding: .25rem .35rem;}
.confirm-dialog .btn-list {text-align: center; margin-bottom: .15rem}
.confirm-dialog .btn-list span.btn1 { padding: .025rem .35rem; margin-right: .25rem; height: auto}
.confirm-dialog .confirm-content .textarea {width: 100%; resize: none; border: 1px solid #D7D7D7; -webkit-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; height: .8rem; padding: .1rem; box-sizing: border-box;}

/* 阴影遮罩 */
.shadow {position: fixed; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0, 0, 0, .3);}

.popup_box li { list-style-type: none; }
.hidden { display: none; }
.padding0 {padding: 0px;}

/* 分页组件 */
.vue-pager { margin: 0 auto; text-align: center; font-size: 14px; line-height: 28px; background: #FFFFFF; padding: 15px 0;}
.clear:after { content: ''; display: block; clear: both;}
.vue-pager span { margin: 0 5px;}
.vue-pager span.page, .vue-pager span.prev, .vue-pager span.next, .vue-pager span.first, .vue-pager span.end {cursor: pointer; display: inline-block; border: 1px solid #333333; padding: 0px 5px; box-sizing: border-box; -webkit-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; min-width: 32px;}
.vue-pager span.page:hover { color: #0266FF; border: 1px solid #0266FF;}
.vue-pager span.page.active { color: #0266FF; border: 1px solid #0266FF; cursor: default;}
.vue-pager span.prev.disabled, .vue-pager span.next.disabled { color: #cccccc; cursor: not-allowed;}
.vue-pager input[type='text'] { padding: 2px; box-sizing: border-box; border: 1px solid #333333; -webkit-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; width: 40px; height: 30px; line-height: 30px; text-align: center; outline: none; transition: .2s all; margin: 0px 5px;}
.vue-pager input[type='text']:focus { border-color: #409eff;}
.vue-pager .total {margin-right: 15px;}
.vue-pager .jump {margin-left: 15px;}


input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #999999;}
input:-moz-placeholder, textarea:-moz-placeholder { color: #999999;}
input::-moz-placeholder, textarea::-moz-placeholder { color: #999999;}
input:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #999999;}
.radius5 { -webkit-border-radius: .05rem; -ms-border-radius: .05rem; -o-border-radius: .05rem; -moz-border-radius: .05rem; border-radius: .05rem;}
.radius8 { -webkit-border-radius: .08rem; -ms-border-radius: .08rem; -o-border-radius: .08rem; -moz-border-radius: .08rem; border-radius: .08rem;}
.radius3 { -webkit-border-radius: .03rem; -ms-border-radius: .03rem; -o-border-radius: .03rem; -moz-border-radius: .03rem; border-radius: .03rem;}

/* 手机号地区选择 */
.phone-area-code {
    min-width: .75rem;
    margin-left: 0;
}

.filterBox.phone-area-code input {
    line-height: .35rem;
    width: 0.45rem !important;
    padding: 0;
    border: 0px !important;
    box-shadow: none !important;
}

.filterBox.phone-area-code ul {
    width:  2.2rem;
}

.filterBox.phone-area-code div.selected {
    height: 0.37rem;
    border-right: 0;
    border-radius: 0.05rem;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    width: 1rem;
}

.filterBox.phone-area-code i {
    line-height: .35rem;
}