@charset "UTF-8";
/** Created by wenyu on 2017/3/8. */
/** Created by wenyu on 2017/3/13. */
/** Created by wenyu on 2017/3/8. */
/** Created by wenyu on 2017/3/8. */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }

body { margin: 0; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }

audio:not([controls]) { display: none; height: 0; }

[hidden], template { display: none; }

a { background-color: transparent; }

a:active, a:hover { outline: 0; }

abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }

dfn { font-style: italic; }

h1 { font-size: 2em; margin: 0.67em 0; }

mark { background: #ff0; color: #000; }

small { font-size: 80%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

img { border: 0; }

svg:not(:root) { overflow: hidden; }

figure { margin: 1em 40px; }

hr { box-sizing: content-box; height: 0; }

pre { overflow: auto; }

code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }

button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }

button { overflow: visible; }

button, select { text-transform: none; }

button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }

button[disabled], html input[disabled] { cursor: default; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

input { line-height: normal; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }

input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }

input[type="search"] { -webkit-appearance: textfield; box-sizing: content-box; }

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

legend { border: 0; padding: 0; }

textarea { overflow: auto; }

optgroup { font-weight: bold; }

table { border-collapse: collapse; border-spacing: 0; }

td, th { padding: 0; }

/** Created by wenyu on 2017/3/8. */
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-font-smoothing: antialiased; }

body { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 10rem; font-family: "Avenir Light", "PingFangSC-Light", arial, Hiragino Sans GB, \\5b8b体, sans-serif; font-size: 12px; line-height: 1.5; color: #333333; background: #f5f5f5; overflow: hidden; }

a, input, textarea, select, button { outline: 0; }

p { margin: 0; }

ul, li { margin: 0; padding: 0; list-style: none; }

a { color: #525252; text-decoration: none; -webkit-tap-highlight-color: transparent; }

a:active { color: #454545; }

.page { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #f5f5f5; z-index: 2000; }

.content { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; }

.bar-nav ~ .content { top: 1.33333rem; }

.bar-header-secondary ~ .content { top: 2.66667rem; }

.bar-footer ~ .content { bottom: 1.33333rem; }

.bar-footer-secondary ~ .content { bottom: 2.66667rem; }

.bar-tab ~ .content, .bar-tab ~ .page .content { bottom: 1.8rem; }

.tabbar-hidden .bar-tab ~ .content, .tabbar-hidden .bar-tab ~ .page .content { bottom: 0; }

.bar-footer-secondary-tab ~ .content { bottom: 3.13333rem; }

.content-padded { margin: 0.53333rem; }

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

.pull-left { float: left; }

.pull-right { float: right; }

.clearfix:before, .clearfix:after { content: " "; display: table; }

.clearfix:after { clear: both; }

/** Created by wenyu on 2017/3/8. */
/* === Content Block === */
.content-block { margin: 1.75rem 0; padding: 0 0.75rem; color: #6d6d72; }

.content-block-title { position: relative; overflow: hidden; margin: 0; white-space: nowrap; text-overflow: ellipsis; font-size: 0.7rem; text-transform: uppercase; line-height: 1; color: #6d6d72; margin: 1.75rem 0.75rem 0.5rem; }

.content-block-title + .list-block, .content-block-title + .content-block, .content-block-title + .card { margin-top: 0.5rem; }

.content-block-inner { background: #fff; padding: 0.5rem 0.75rem; margin-left: -0.75rem; width: 100%; position: relative; border-top: 1px solid #c8c7cc; border-bottom: 1px solid #c8c7cc; color: #333333; }

.content-block.inset { margin-left: 0.75rem; margin-right: 0.75rem; border-radius: 0.35rem; }

.content-block.inset .content-block-inner { border-right: 0; border-top: 0; border-left: 0; border-bottom: 0; border-radius: 0.35rem; }

@media all and (min-width: 768px) { .content-block.tablet-inset { margin-left: 0.75rem; margin-right: 0.75rem; border-radius: 0.35rem; }
  .content-block.tablet-inset .content-block-inner { border-right: 0; border-top: 0; border-left: 0; border-bottom: 0; border-radius: 0.35rem; } }

/** Created by wenyu on 2017/3/8. */
.bar { position: absolute; right: 0; left: 0; z-index: 10; font-family: "微软雅黑"; height: 1.33333rem; padding-right: 0.53333rem; padding-left: 0.53333rem; background-color: #fff; border-bottom: 1px solid #e8e8e8; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.bar-header-secondary { top: 1.33333rem; }

.bar-footer { bottom: 0; }

.bar-footer-secondary { bottom: 1.33333rem; }

.bar-footer-secondary-tab { bottom: 1.8rem; }

.bar-footer, .bar-footer-secondary, .bar-footer-secondary-tab { border-top: 1px solid #e8e8e8; border-left: 0; border-bottom: 0; }

.bar-nav { top: 0; }

.title { display: block; padding: 0; margin: 0 -0.53333rem; font-size: 0.48rem; font-weight: 500; line-height: 1.33333rem; color: #333333; text-align: center; white-space: nowrap; }

.title a { color: inherit; }

.bar-tab { bottom: 0; width: 100%; height: 1.8rem; padding: 0; table-layout: fixed; border-top: 1px solid #d9d9d9; border-left: 0; border-bottom: 0; z-index: 9000; transition-duration: 400ms; }

.bar-tab .tab-item { position: relative; display: table-cell; width: 1%; height: 1.8rem; color: #676767; text-align: center; vertical-align: middle; }

.bar-tab .tab-item.active, .bar-tab .tab-item:active { color: #fc5454; }

.bar-tab .tab-item .badge { position: absolute; top: .1rem; left: 50%; z-index: 100; height: 15px; line-height: 15px; min-width: 15px; text-align: center; font-size: 0.16rem; color: white; vertical-align: middle; background: #fc5454; border-radius: 15px; margin-left: .1rem; font-weight: 700; }

.bar-tab .tab-item .icon { width: 0.53333rem; height: 0.53333rem; font-size: 0.6rem; padding-top: 0; padding-bottom: 0; }

.bar-tab .tab-item .icon ~ .tab-label { display: block; font-size: 0.39733rem; position: relative; top: -0.10667rem; }

.tabbar-hidden .bar-tab { transform: translate3d(0, 110%, 0); }

.bar .button { position: relative; top: 0.35rem; z-index: 20; margin-top: 0; font-weight: 400; }

.bar .button.pull-right { margin-left: 0.53333rem; }

.bar .button.pull-left { margin-right: 0.53333rem; }

.bar .button-link { top: 0; padding: 0; font-size: 0.37333rem; line-height: 1.33333rem; height: 1.33333rem; color: #9a9a9a; border: 0; }

.bar .button-link:active, .bar .button-link.active { color: #818181; }

.bar .button-block { top: 0.35rem; font-size: 0.8rem; width: 100%; }

.bar .button-nav.pull-left { margin-left: -0.25rem; }

.bar .button-nav.pull-left .icon-left-nav { margin-right: -0.15rem; }

.bar .button-nav.pull-right { margin-right: -0.25rem; }

.bar .button-nav.pull-right .icon-right-nav { margin-left: -0.15rem; }

.bar .icon { position: relative; z-index: 20; padding: 0; }

.bar .button .icon { padding: 0; }

.bar .title .icon { padding: 0; }

.bar .title .icon.icon-caret { top: 0.2rem; margin-left: -0.25rem; }

.bar-footer .icon { font-size: 1.2rem; line-height: 1.2rem; }

.bar input[type="search"] { height: 1.45rem; margin: 0.3rem 0; }

/** Created by wenyu on 2017/3/8. */
/* === Swiper === */
.swiper-container { margin: 0 auto; position: relative; overflow: hidden; /* Fix of Webkit flickering */ z-index: 1; }

.swiper-container-no-flexbox .swiper-slide { float: left; }

.swiper-container-vertical > .swiper-wrapper { -webkit-box-orient: vertical; -moz-box-orient: vertical; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; }

.swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; -o-transition-property: -o-transform; -ms-transition-property: -ms-transform; transition-property: transform; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; }

.swiper-container-android .swiper-slide, .swiper-wrapper { -webkit-transform: translate3d(0px, 0, 0); -moz-transform: translate3d(0px, 0, 0); -o-transform: translate(0px, 0px); -ms-transform: translate3d(0px, 0, 0); transform: translate3d(0px, 0, 0); }

.swiper-container-multirow > .swiper-wrapper { -webkit-box-lines: multiple; -moz-box-lines: multiple; -ms-fles-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; }

.swiper-container-free-mode > .swiper-wrapper { -webkit-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; -ms-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; margin: 0 auto; }

.swiper-slide { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0; width: 100%; height: 100%; position: relative; }

/* a11y */
.swiper-container .swiper-notification { position: absolute; left: 0; top: 0; pointer-events: none; opacity: 0; z-index: -1000; }

/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal { -ms-touch-action: pan-y; touch-action: pan-y; }

.swiper-wp8-vertical { -ms-touch-action: pan-x; touch-action: pan-x; }

/* Arrows */
.swiper-button-prev, .swiper-button-next { position: absolute; top: 50%; width: 27px; height: 44px; margin-top: -22px; z-index: 10; cursor: pointer; -moz-background-size: 27px 44px; -webkit-background-size: 27px 44px; background-size: 27px 44px; background-position: center; background-repeat: no-repeat; }

.swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled { opacity: 0.35; cursor: auto; pointer-events: none; }

.swiper-button-prev, .swiper-container-rtl .swiper-button-next { background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20x%3D'0px'%20y%3D'0px'%20viewBox%3D'0%200%2012%209'%20xml%3Aspace%3D'preserve'><polygon%20fill%3D'%23ffffff'%20points%3D'12%2C0.7%2011.3%2C0%203.9%2C7.4%200.7%2C4.2%200%2C4.9%203.9%2C8.8%203.9%2C8.8%203.9%2C8.8%20'%2F><%2Fsvg>"); left: 10px; right: auto; }

.swiper-button-next, .swiper-container-rtl .swiper-button-prev { background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20x%3D'0px'%20y%3D'0px'%20viewBox%3D'0%200%2012%209'%20xml%3Aspace%3D'preserve'><polygon%20fill%3D'%23ffffff'%20points%3D'12%2C0.7%2011.3%2C0%203.9%2C7.4%200.7%2C4.2%200%2C4.9%203.9%2C8.8%203.9%2C8.8%203.9%2C8.8%20'%2F><%2Fsvg>"); right: 10px; left: auto; }

/* Pagination Styles */
.swiper-pagination { position: absolute; text-align: center; -webkit-transition: 300ms; -moz-transition: 300ms; -o-transition: 300ms; transition: 300ms; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); z-index: 10; }

.swiper-pagination.swiper-pagination-hidden { opacity: 0; }

.swiper-pagination-bullet { width: 0.21333rem; height: 0.21333rem; display: inline-block; border-radius: 100%; background: #fff; opacity: 0.5; }

.swiper-pagination-bullet-active { opacity: 1; background: #fff; }

.swiper-container-vertical > .swiper-pagination { right: 10px; top: 50%; -webkit-transform: translate3d(0px, -50%, 0); -moz-transform: translate3d(0px, -50%, 0); -o-transform: translate(0px, -50%); -ms-transform: translate3d(0px, -50%, 0); transform: translate3d(0px, -50%, 0); }

.swiper-container-vertical > .swiper-pagination .swiper-pagination-bullet { margin: 5px 0; display: block; }

.swiper-container-horizontal > .swiper-pagination { bottom: 10px; left: 0; width: 100%; }

.swiper-container-horizontal > .swiper-pagination .swiper-pagination-bullet { margin: 0 0.06667rem; }

/* 3D Container */
.swiper-container-3d { -webkit-perspective: 1200px; -moz-perspective: 1200px; -o-perspective: 1200px; perspective: 1200px; }

.swiper-container-3d .swiper-wrapper, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-cube-shadow { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; }

.swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-slide-shadow-bottom { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; }

.swiper-container-3d .swiper-slide-shadow-left { background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(transparent)); /* Safari 4+, Chrome */ background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), transparent); /* Chrome 10+, Safari 5.1+, iOS 5+ */ background-image: -moz-linear-gradient(right, rgba(0, 0, 0, 0.5), transparent); /* Firefox 3.6-15 */ background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), transparent); /* Opera 11.10-12.00 */ background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), transparent); /* Firefox 16+, IE10, Opera 12.50+ */ }

.swiper-container-3d .swiper-slide-shadow-right { background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(transparent)); /* Safari 4+, Chrome */ background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), transparent); /* Chrome 10+, Safari 5.1+, iOS 5+ */ background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5), transparent); /* Firefox 3.6-15 */ background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), transparent); /* Opera 11.10-12.00 */ background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), transparent); /* Firefox 16+, IE10, Opera 12.50+ */ }

.swiper-container-3d .swiper-slide-shadow-top { background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(transparent)); /* Safari 4+, Chrome */ background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), transparent); /* Chrome 10+, Safari 5.1+, iOS 5+ */ background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.5), transparent); /* Firefox 3.6-15 */ background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), transparent); /* Opera 11.10-12.00 */ background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent); /* Firefox 16+, IE10, Opera 12.50+ */ }

.swiper-container-3d .swiper-slide-shadow-bottom { background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(transparent)); /* Safari 4+, Chrome */ background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent); /* Chrome 10+, Safari 5.1+, iOS 5+ */ background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent); /* Firefox 3.6-15 */ background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent); /* Opera 11.10-12.00 */ background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), transparent); /* Firefox 16+, IE10, Opera 12.50+ */ }

/* Coverflow */
.swiper-container-coverflow .swiper-wrapper { /* Windows 8 IE 10 fix */ -ms-perspective: 1200px; }

/* Fade */
.swiper-container-fade.swiper-container-free-mode .swiper-slide { -webkit-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; -ms-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; }

.swiper-container-fade .swiper-slide { pointer-events: none; }

.swiper-container-fade .swiper-slide-active { pointer-events: auto; }

/* Cube */
.swiper-container-cube { overflow: visible; }

.swiper-container-cube .swiper-slide { pointer-events: none; visibility: hidden; -webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; width: 100%; height: 100%; }

.swiper-container-cube.swiper-container-rtl .swiper-slide { -webkit-transform-origin: 100% 0; -moz-transform-origin: 100% 0; -ms-transform-origin: 100% 0; transform-origin: 100% 0; }

.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-prev, .swiper-container-cube .swiper-slide-next + .swiper-slide { pointer-events: auto; visibility: visible; }

.swiper-container-cube .swiper-cube-shadow { position: absolute; left: 0; bottom: 0px; width: 100%; height: 100%; background: #000; opacity: 0.6; -webkit-filter: blur(50px); filter: blur(50px); }

.swiper-container-cube.swiper-container-vertical .swiper-cube-shadow { z-index: 0; }

/* Scrollbar */
.swiper-scrollbar { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0, 0, 0, 0.1); }

.swiper-container-horizontal > .swiper-scrollbar { position: absolute; left: 1%; bottom: 3px; z-index: 50; height: 5px; width: 98%; }

.swiper-container-vertical > .swiper-scrollbar { position: absolute; right: 3px; top: 1%; z-index: 50; width: 5px; height: 98%; }

.swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0, 0, 0, 0.5); border-radius: 10px; left: 0; top: 0; }

.swiper-scrollbar-cursor-drag { cursor: move; }

/* Preloader */
.swiper-slide .preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; }

.swiper-slide img { display: block; }

/** Created by wenyu on 2017/3/8. */
/* === Search Bar === */
.searchbar { height: 0.86667rem; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }

.searchbar .searchbar-cancel { margin-right: -3rem; width: 2.2rem; float: right; height: 0.86667rem; line-height: 0.86667rem; text-align: center; transition: all .3s; opacity: 0; transform: translate3d(0, 0, 0); }

.searchbar .search-input { transform: translate3d(0, 0, 0); margin-right: 0; transition: all .3s; border-radius: 0.13333rem; }

.searchbar .search-input input { margin: 0; height: 0.86667rem; }

.searchbar.searchbar-active .searchbar-cancel { margin-right: 0; opacity: 1; }

.searchbar.searchbar-active .searchbar-cancel + .search-input { margin-right: 2.5rem; }

.search-input { position: relative; }

.search-input input { box-sizing: border-box; width: 100%; height: 0.86667rem; display: block; border: none; appearance: none; font-family: inherit; color: #333333; font-size: 0.37333rem; font-weight: normal; padding: 0 0.29333rem; background-color: #fff; border: 1px solid transparent; }

.search-input input::-webkit-input-placeholder { color: #ccc; opacity: 1; }

.search-input .icon { position: absolute; font-size: 0.53333rem; color: transparent; left: 0.13333rem; top: 0.10667rem; }

.search-input label + input { padding-left: 0.29333rem; }

.bar .searchbar .search-input input { border: 0; }

.bar .searchbar .searchbar-cancel { color: #5f646e; }

/** Created by wenyu on 2017/3/8. */
/* === Pages === */
.page { box-sizing: border-box; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #efeff4; background: #fff; display: none; }

.page.page-current, .page.page-from-center-to-left, .page.page-from-center-to-right, .page.page-from-right-to-center, .page.page-from-left-to-center { display: block; }

.page-left { opacity: 0.5; transform: translate3d(-20%); }

.page-right { transform: translate3d(100%); }

.page-transitioning, .page-transitioning .swipeback-page-shadow { transition: 400ms; }

.page-from-right-to-center { animation: pageFromRightToCenter 400ms forwards; z-index: 2002; }

.page-from-center-to-right { animation: pageFromCenterToRight 400ms forwards; z-index: 2002; }

@keyframes pageFromRightToCenter { from { transform: translate3d(100%, 0, 0);
    opacity: .9; }
  to { transform: translate3d(0, 0, 0);
    opacity: 1; } }

@keyframes pageFromCenterToRight { from { transform: translate3d(0, 0, 0);
    opacity: 1; }
  to { transform: translate3d(100%, 0, 0);
    opacity: .9; } }

.page-from-center-to-left { animation: pageFromCenterToLeft 400ms forwards; }

.page-from-left-to-center { animation: pageFromLeftToCenter 400ms forwards; }

@keyframes pageFromCenterToLeft { from { opacity: 1;
    transform: translate3d(0, 0, 0); }
  to { opacity: 0.5;
    transform: translate3d(-20%, 0, 0); } }

@keyframes pageFromLeftToCenter { from { opacity: .5;
    transform: translate3d(-20%, 0, 0); }
  to { opacity: 1;
    transform: translate3d(0, 0, 0); } }

.page-group { display: block; }

/** Created by wenyu on 2017/3/10. */
/* === Forms === */
.list-block input[type="text"], .list-block input[type="password"], .list-block input[type="search"], .list-block input[type="email"], .list-block input[type="tel"], .list-block input[type="url"], .list-block input[type="date"], .list-block input[type="datetime-local"], .list-block input[type="time"], .list-block input[type="number"], .list-block select, .list-block textarea { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; box-sizing: border-box; border: none; background: none; border-radius: 0 0 0 0; box-shadow: none; display: block; padding: 0 0 0 0.25rem; margin: 0; width: 100%; color: #333333; font-family: inherit; }

.list-block input[type="date"], .list-block input[type="datetime-local"] { line-height: 2.2rem; }

.list-block select { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; }

.list-block .label { vertical-align: top; }

.list-block textarea { height: 5rem; resize: none; line-height: 1.4; padding-top: 0.4rem; padding-bottom: 0.35rem; }

.label-switch { display: inline-block; vertical-align: middle; width: 2.6rem; border-radius: 0.8rem; box-sizing: border-box; height: 1.6rem; position: relative; cursor: pointer; -ms-flex-item-align: center; -webkit-align-self: center; align-self: center; }

.label-switch .checkbox { width: 2.6rem; border-radius: 0.8rem; box-sizing: border-box; height: 1.6rem; background: #e5e5e5; z-index: 0; margin: 0; padding: 0; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; border: none; cursor: pointer; position: relative; transition-duration: 300ms; }

.label-switch .checkbox:before { content: ' '; position: absolute; left: 0.1rem; top: 0.1rem; width: 2.4rem; border-radius: 0.8rem; box-sizing: border-box; height: 1.4rem; background: #fff; z-index: 1; transition-duration: 300ms; transform: scale(1); }

.label-switch .checkbox:after { content: ' '; height: 1.4rem; width: 1.4rem; border-radius: 1.4rem; background: #fff; position: absolute; z-index: 2; top: 0.1rem; left: 0.1rem; box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.4); transform: translateX(0px); transition-duration: 300ms; }

.label-switch input[type="checkbox"] { opacity: 0; position: absolute; width: 2.6rem; height: 1.6rem; z-index: 1; }

.label-switch input[type="checkbox"]:checked + .checkbox { background: #4cd964; }

.label-switch input[type="checkbox"]:checked + .checkbox:before { transform: scale(0); }

.label-switch input[type="checkbox"]:checked + .checkbox:after { transform: translateX(1.1rem); }

html.android .label-switch input[type="checkbox"] + .checkbox { transition-duration: 0; }

html.android .label-switch input[type="checkbox"] + .checkbox:after, html.android .label-switch input[type="checkbox"] + .checkbox:before { transition-duration: 0; }

.range-slider { width: 100%; position: relative; overflow: hidden; padding-left: 0.15rem; padding-right: 0.15rem; margin-left: -1px; -ms-flex-item-align: center; -webkit-align-self: center; align-self: center; }

.range-slider input[type="range"] { position: relative; height: 1.4rem; width: 100%; margin: 0.2rem 0 0.25rem 0; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; background: -webkit-gradient(linear, 50% 0, 50% 100%, color-stop(0, #b7b8b7), color-stop(100%, #b7b8b7)); background: linear-gradient(to right, #b7b8b7 0, #b7b8b7 100%); background-position: center; background-size: 100% 0.1rem; background-repeat: no-repeat; outline: 0; }

.range-slider input[type="range"]:after { height: 0.1rem; background: #fff; content: ' '; width: 0.25rem; top: 50%; margin-top: -1px; left: -0.25rem; z-index: 1; position: absolute; }

.range-slider input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; border: none; height: 1.4rem; width: 1.4rem; position: relative; background: none; }

.range-slider input[type="range"]::-webkit-slider-thumb:after { height: 1.4rem; width: 1.4rem; border-radius: 1.4rem; background: #fff; z-index: 10; box-shadow: 0 0.1rem 0.2rem rgba(0, 0, 0, 0.4); position: absolute; left: 0; top: 0; content: ' '; }

.range-slider input[type="range"]::-webkit-slider-thumb:before { position: absolute; top: 50%; right: 100%; width: 100rem; height: 0.1rem; margin-top: -1px; z-index: 1; background: #9a9a9a; content: ' '; }

label.label-checkbox { cursor: pointer; }

label.label-checkbox i.icon-form-checkbox { width: 0.53333rem; height: 0.53333rem; position: relative; border-radius: 0.53333rem; border: 1px solid #c7c7cc; box-sizing: border-box; }

label.label-checkbox i.icon-form-checkbox:after { content: ' '; position: absolute; left: 50%; margin-left: -0.3rem; top: 50%; margin-top: -0.2rem; width: 0.6rem; height: 0.45rem; }

label.label-checkbox input[type="checkbox"], label.label-checkbox input[type="radio"] { display: none; }

label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox, label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox { border: none; background-color: #9a9a9a; }

label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox:after, label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox:after { background: no-repeat center; background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20x%3D'0px'%20y%3D'0px'%20viewBox%3D'0%200%2012%209'%20xml%3Aspace%3D'preserve'><polygon%20fill%3D'%23ffffff'%20points%3D'12%2C0.7%2011.3%2C0%203.9%2C7.4%200.7%2C4.2%200%2C4.9%203.9%2C8.8%203.9%2C8.8%203.9%2C8.8%20'%2F><%2Fsvg>"); -webkit-background-size: 0.26667rem 0.26667rem; background-size: 0.26667rem 0.26667rem; }

label.label-checkbox { transition-duration: 300ms; }

html:not(.watch-active-state) label.label-checkbox:active, label.label-checkbox.active-state { transition: 0ms; background-color: #d9d9d9; }

html:not(.watch-active-state) label.label-checkbox:active .item-inner, label.label-checkbox.active-state .item-inner { border-right-color: transparent; border-bottom-color: transparent; }

.smart-select select { display: none; }

/** Created by wenyu on 2017/3/10. */
/* === Lists === */
.list-block { font-size: 0.33333rem; }

.list-block ul { background: #fff; list-style: none; padding: 0; margin: 0; position: relative; }

.list-block ul ul { border-right: 0; border-top: 0; border-left: 0; border-bottom: 0; padding-left: 2.25rem; }

.list-block .align-top, .list-block .align-top .item-content, .list-block .align-top .item-inner { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; align-items: flex-start; }

.list-block .insetext, .list-block .list-block.inset { margin-left: 0.75rem; margin-right: 0.75rem; border-radius: 0.35rem; }

.list-block .insetext .content-block-title, .list-block .list-block.inset .content-block-title { margin-left: 0; margin-right: 0; }

.list-block .insetext ul, .list-block .list-block.inset ul { border-radius: 0.35rem; border-right: 0; border-top: 0; border-left: 0; border-bottom: 0; }

.list-block .insetext li:first-child > a, .list-block .list-block.inset li:first-child > a { border-radius: 0.35rem 0.35rem 0 0; }

.list-block .insetext li:last-child > a, .list-block .list-block.inset li:last-child > a { border-radius: 0 0 0.35rem 0.35rem; }

.list-block .insetext li:first-child:last-child > a, .list-block .list-block.inset li:first-child:last-child > a { border-radius: 0.35rem; }

@media all and (min-width: 768px) { .list-block.tablet-inset { margin-left: 0.75rem; margin-right: 0.75rem; border-radius: 0.35rem; }
  .list-block.tablet-inset .content-block-title { margin-left: 0; margin-right: 0; }
  .list-block.tablet-inset ul { border-radius: 0.35rem; border-right: 0; border-top: 0; border-left: 0; border-bottom: 0; }
  .list-block.tablet-inset li:first-child > a { border-radius: 0.35rem 0.35rem 0 0; }
  .list-block.tablet-inset li:last-child > a { border-radius: 0 0 0.35rem 0.35rem; }
  .list-block.tablet-inset li:first-child:last-child > a { border-radius: 0.35rem; } }

.list-block li { box-sizing: border-box; position: relative; }

.list-block .item-media { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0; -webkit-box-lines: single; -moz-box-lines: single; -webkit-flex-wrap: nowrap; -ms-flex-wrap: none; -ms-flex-wrap: nowrap; flex-wrap: nowrap; box-sizing: border-box; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; padding-top: 0.35rem; padding-bottom: 0.4rem; }

.list-block .item-media i + i { margin-left: 0.25rem; }

.list-block .item-media i + img { margin-left: 0.25rem; }

.list-block .item-media + .item-inner { margin-left: 0.75rem; }

.list-block .item-inner { padding-right: 0; position: relative; width: 100%; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-flex: 1; -ms-flex: 1; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }

.list-block .item-title { -webkit-flex-shrink: 1; -ms-flex: 0 1 auto; flex-shrink: 1; white-space: nowrap; position: relative; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }

.list-block .item-title.label { width: 35%; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0; margin: 4px 0; }

.list-block .item-input { width: 100%; margin-top: -0.4rem; margin-bottom: -0.35rem; -webkit-box-flex: 1; -ms-flex: 1; -webkit-flex-shrink: 1; -ms-flex: 0 1 auto; flex-shrink: 1; }

.list-block .item-after { white-space: nowrap; color: #5f646e; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0; margin-left: 0.25rem; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; max-height: 1.4rem; }

.list-block .smart-select .item-after { max-width: 70%; overflow: hidden; text-overflow: ellipsis; position: relative; }

.list-block .item-link { transition-duration: 300ms; display: block; color: inherit; }

.list-block .item-link .item-inner { padding-right: 1.5rem; background-image: url("${imgBaseUrl}/i-list-chevron-right.png"); background-size: 0.7rem; background-repeat: no-repeat; background-position: 97% center; background-position: -webkit-calc("100% - .5rem") center; background-position: calc("100% - .5rem") center; }

html:not(.watch-active-state) .list-block .item-link:active, .list-block .item-link.active-state { transition-duration: 0ms; background-color: #d9d9d9; }

html:not(.watch-active-state) .list-block .item-link:active .item-inner, .list-block .item-link.active-state .item-inner { border-right-color: transparent; border-bottom-color: transparent; }

.list-block .item-link.list-button { padding: 0 0.75rem; text-align: center; color: #9a9a9a; display: block; border-bottom: 1px solid #e8e8e8; line-height: 2.15rem; }

.list-block .item-content { box-sizing: border-box; padding-left: 0; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; border-bottom: 1px solid #e8e8e8; }

.list-block .list-block-label { margin: 0.5rem 0 1.75rem; padding: 0 0.75rem; font-size: 0.7rem; color: #5f646e; }

.list-block .swipeout { overflow: hidden; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; }

.list-block .swipeout.deleting { transition-duration: 300ms; }

.list-block .swipeout.deleting .swipeout-content { transform: translateX(-100%); }

.list-block .swipeout.transitioning .swipeout-content, .list-block .swipeout.transitioning .swipeout-actions-right a, .list-block .swipeout.transitioning .swipeout-actions-left a, .list-block .swipeout.transitioning .swipeout-overswipe { -webkit-transition: 300ms; transition: 300ms; }

.list-block .swipeout-content { position: relative; z-index: 10; }

.list-block .swipeout-overswipe { -webkit-transition: 200ms left; transition: 200ms left; }

.list-block .swipeout-actions-left, .list-block .swipeout-actions-right { position: absolute; top: 0; height: 100%; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; }

.list-block .swipeout-actions-left a, .list-block .swipeout-actions-right a { padding: 0 1.5rem; color: #fff; background: #c7c7cc; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; position: relative; left: 0; }

.list-block .swipeout-actions-left a:after, .list-block .swipeout-actions-right a:after { content: ''; position: absolute; top: 0; width: 600%; height: 100%; background: inherit; z-index: -1; }

.list-block .swipeout-actions-left a.swipeout-delete, .list-block .swipeout-actions-right a.swipeout-delete { background: #f6383a; }

.list-block .swipeout-actions-right { right: 0%; transform: translateX(100%); }

.list-block .swipeout-actions-right a:after { left: 100%; margin-left: -1px; }

.list-block .swipeout-actions-left { left: 0%; transform: translateX(-100%); }

.list-block .swipeout-actions-left a:after { right: 100%; margin-right: -1px; }

.list-block .item-subtitle { font-size: 0.33333rem; position: relative; overflow: hidden; white-space: nowrap; max-width: 100%; text-overflow: ellipsis; }

.list-block .item-text { font-size: 0.33333rem; color: #5f646e; line-height: 1.05rem; position: relative; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; }

.list-block.media-list .item-title, .list-block li.media-item .item-title { font-weight: 500; }

.list-block.media-list .item-inner, .list-block li.media-item .item-inner { display: block; padding-bottom: 0.74667rem; -ms-flex-item-align: stretch; -webkit-align-self: stretch; align-self: stretch; }

.list-block.media-list .item-media, .list-block li.media-item .item-media { padding-top: 0.45rem; padding-bottom: 0.5rem; }

.list-block.media-list .item-media img, .list-block li.media-item .item-media img { display: block; }

.list-block.media-list .item-title-row, .list-block li.media-item .item-title-row { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; }

.list-block .list-group ul:after, .list-block .list-group ul:before { z-index: 11; }

.list-block .list-group + .list-group ul { border-right: 0; border-top: 0; }

.list-block .item-divider, .list-block .list-group-title { background: #F7F7F7; border-top: 1px solid #e8e8e8; margin-top: -1px; padding: 0.2rem 0.75rem; white-space: nowrap; position: relative; max-width: 100%; text-overflow: ellipsis; overflow: hidden; color: #e8e8e8; }

.list-block .list-group-title { position: relative; position: -webkit-sticky; position: -moz-sticky; position: sticky; top: 0; z-index: 20; margin-top: 0; border-right: 0; border-top: 0; }

.list-block .sortable-handler { position: absolute; right: 0; top: 0; bottom: 1px; z-index: 10; background-repeat: no-repeat; background-size: 0.9rem 0.6rem; background-image: url("${imgBaseUrl}/i-sortable-handler.png"); background-position: center; width: 1.75rem; opacity: 0; visibility: hidden; right: 0; }

.list-block.sortable .item-inner { transition-duration: 300ms; }

.list-block.sortable-opened .sortable-handler { visibility: visible; opacity: 1; }

.list-block.sortable-opened .item-inner, .list-block.sortable-opened .item-link .item-inner { padding-right: 1.5rem; }

.list-block.sortable-opened .item-link .item-inner, .list-block.sortable-opened .item-link .item-title-row { background-image: none; }

.list-block.sortable-sorting li { transition-duration: 300ms; }

.list-block li.sorting { z-index: 50; background: rgba(255, 255, 255, 0.8); box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.6); transition-duration: 0ms; }

.list-block li.sorting .item-inner { border-left: 0; border-bottom: 0; }

.list-block li:last-child .list-button { border-left: 0; border-bottom: 0; }

.list-block li:last-child .item-inner, .list-block li:last-child li:last-child .item-inner { border-left: 0; border-bottom: 0; }

.list-block li li:last-child .item-inner, .list-block li:last-child li .item-inner { border-bottom: 1px solid #e8e8e8; }

/** Created by wenyu on 2017/3/10. */
.button { border: 1px solid #9a9a9a; color: #9a9a9a; text-decoration: none; text-align: center; display: block; border-radius: 0.25rem; line-height: 1.25rem; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; background: none; padding: 0 0.5rem; margin: 0; height: 1.35rem; white-space: nowrap; position: relative; text-overflow: ellipsis; font-size: 0.7rem; font-family: inherit; cursor: pointer; }

.button:input[type="submit"], .button:input[type="button"] { width: 100%; }

.button:active { color: #0a8ddf; border-color: #0a8ddf; }

.button.button-round { border-radius: 1.25rem; }

.button.active, .button.active:active { color: #0a8ddf; border-color: #0a8ddf; }

.button.button-big { font-size: 0.85rem; height: 2.4rem; line-height: 2.3rem; }

.button.button-fill { color: #fff; background: #9a9a9a; border: none; line-height: 1.35rem; }

.button.button-fill.active, .button.button-fill:active { background: #0a8ddf; }

.button.button-fill.button-big { line-height: 2.4rem; }

.button .button-link { padding-top: 0.3rem; padding-bottom: 0.3rem; color: #9a9a9a; background-color: transparent; border: 0; }

.button i.icon:first-child { margin-right: 0.5rem; }

.button i.icon:last-child { margin-left: 0.5rem; }

.button i.icon:first-child:last-child { margin-left: 0; margin-right: 0; }

.button-themes.button-light { border-color: #ccc; color: #ccc; color: #5f646e; }

.button-themes.button-light:active { border-color: #0a8ddf; color: #0a8ddf; }

.button-themes.button-light.button-fill { color: white; background-color: #ccc; }

.button-themes.button-light.button-fill:active { background-color: #0a8ddf; }

.button-themes.button-dark { border-color: #6e727b; color: #6e727b; color: #5f646e; }

.button-themes.button-dark:active { border-color: #0a8ddf; color: #0a8ddf; }

.button-themes.button-dark.button-fill { color: white; background-color: #6e727b; }

.button-themes.button-dark.button-fill:active { background-color: #0a8ddf; }

.button-themes.button-success { border-color: #4cd964; color: #4cd964; }

.button-themes.button-success:active { border-color: #2ac845; color: #2ac845; }

.button-themes.button-success.button-fill { color: white; background-color: #4cd964; }

.button-themes.button-success.button-fill:active { background-color: #2ac845; }

.button-themes.button-danger { border-color: #f6383a; color: #f6383a; }

.button-themes.button-danger:active { border-color: #f00b0d; color: #f00b0d; }

.button-themes.button-danger.button-fill { color: white; background-color: #f6383a; }

.button-themes.button-danger.button-fill:active { background-color: #f00b0d; }

.button-themes.button-warning { border-color: #f60; color: #f60; }

.button-themes.button-warning:active { border-color: #cc5200; color: #cc5200; }

.button-themes.button-warning.button-fill { color: white; background-color: #f60; }

.button-themes.button-warning.button-fill:active { background-color: #cc5200; }

.button.disabled, .button.button-primary.disabled, .button.button-success.disabled, .button.button-danger.disabled, .button.button-warning.disabled { border-color: #c8c9cb; color: #c8c9cb; cursor: not-allowed; }

.button.disabled:active, .button.button-primary.disabled:active, .button.button-success.disabled:active, .button.button-danger.disabled:active, .button.button-warning.disabled:active { border-color: #c8c9cb; color: #c8c9cb; }

.button.disabled.button-fill, .button.button-primary.disabled.button-fill, .button.button-success.disabled.button-fill, .button.button-danger.disabled.button-fill, .button.button-warning.disabled.button-fill { color: white; background-color: #c8c9cb; }

.button.disabled.button-fill:active, .button.button-primary.disabled.button-fill:active, .button.button-success.disabled.button-fill:active, .button.button-danger.disabled.button-fill:active, .button.button-warning.disabled.button-fill:active { background-color: #c8c9cb; }

.buttons-row, .buttons-tab { z-index: 10; -ms-flex-item-align: center; -webkit-align-self: center; align-self: center; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-lines: single; -moz-box-lines: single; -webkit-flex-wrap: nowrap; -ms-flex-wrap: none; -ms-flex-wrap: nowrap; flex-wrap: nowrap; }

.buttons-row .button { border-radius: 0 0 0 0; margin-left: -1px; width: 100%; -webkit-box-flex: 1; -ms-flex: 1; border-color: #9a9a9a; color: #9a9a9a; }

.buttons-row .button.active { background-color: #9a9a9a; color: white; z-index: 100; }

.buttons-row .button:first-child { border-radius: 0.25rem 0 0 0.25rem; margin-left: 0; border-left-width: 1px; border-left-style: solid; }

.buttons-row .button:last-child { border-radius: 0 0.25rem 0.25rem 0; }

.buttons-row .button.button-round:first-child { border-radius: 1.35rem 0 0 1.35rem; }

.buttons-row .button.button-round:last-child { border-radius: 0 1.35rem 1.35rem 0; }

.buttons-tab { background: white; position: relative; border-bottom: 1px solid #d0d0d0; }

.buttons-tab .button { color: #5f646e; font-size: 0.8rem; width: 100%; height: 2rem; line-height: 2rem; -webkit-box-flex: 1; -ms-flex: 1; border: 0; border-bottom: 2px solid transparent; border-radius: 0; bottom: -1px; }

.buttons-tab .button.active { color: #9a9a9a; border-color: #9a9a9a; z-index: 100; }

/** Created by wenyu on 2017/3/10. */
/* === Modals === */
.modal-overlay, .preloader-indicator-overlay, .popup-overlay { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); z-index: 10600; visibility: hidden; opacity: 0; transition-duration: 400ms; }

.modal-overlay.modal-overlay-visible, .preloader-indicator-overlay.modal-overlay-visible, .popup-overlay.modal-overlay-visible { visibility: visible; opacity: 1; }

.popup-overlay { z-index: 10200; }

.modal { width: 7.73333rem; position: absolute; z-index: 11000; left: 50%; top: 50%; text-align: center; border-radius: 0.35rem; opacity: 0; transform: translate3d(-50%, -50%, 0) scale(1.185); transition-property: transform, opacity; color: #333333; display: none; }

.modal.modal-in { opacity: 1; transition-duration: 400ms; transform: translate3d(-50%, -50%, 0) scale(1); margin-top: 0 !important; }

.modal.modal-out { opacity: 0; z-index: 10999; transition-duration: 400ms; transform: translate3d(-50%, -50%, 0) scale(0.815); margin-top: 0 !important; }

.modal-inner { padding: 0.75rem; border-bottom: 1px solid #b5b5b5; border-radius: 0.35rem 0.35rem 0 0; position: relative; background: #e8e8e8; }

.modal-title { font-weight: 500; font-size: 0.56rem; text-align: center; }

.modal-title + .modal-text { margin-top: 0.25rem; }

.modal-buttons { height: auto; overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; }

.modal-buttons.modal-buttons-vertical { display: block; height: auto; }

.modal-button { width: 100%; padding: 0 0.25rem; height: 1.5rem; font-size: 0.48rem; line-height: 1.5rem; text-align: center; color: #9a9a9a; background: #e8e8e8; display: block; position: relative; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; cursor: pointer; box-sizing: border-box; border-right: 1px solid #b5b5b5; -webkit-box-flex: 1; -ms-flex: 1; }

.modal-button:first-child { border-radius: 0 0 0 0.35rem; }

.modal-button:last-child { border-left: 0; border-bottom: 0; border-radius: 0 0 0.35rem 0; color: #007AFF; }

.modal-button:first-child:last-child { border-radius: 0 0 0.35rem 0.35rem; }

.modal-button.modal-button-bold { font-weight: 500; }

html:not(.watch-active-state) .modal-button:active, .modal-button.active-state { background: #d4d4d4; }

.modal-buttons-vertical .modal-button { border-left: 0; border-bottom: 0; border-right: 0; border-top: 0; border-bottom: 1px solid #b5b5b5; border-radius: 0; }

.modal-buttons-vertical .modal-button:last-child { border-radius: 0 0 0.35rem 0.35rem; border-left: 0; border-bottom: 0; }

.modal-no-buttons .modal-inner { border-radius: 0.35rem; border-left: 0; border-bottom: 0; }

.modal-no-buttons .modal-buttons { display: none; }

.actions-modal { position: absolute; left: 0; bottom: 0; z-index: 11000; width: 100%; transform: translate3d(0, 100%, 0); }

.actions-modal.modal-in { transition-duration: 300ms; transform: translate3d(0, 0, 0); }

.actions-modal.modal-out { z-index: 10999; transition-duration: 300ms; transform: translate3d(0, 100%, 0); }

.actions-modal-group { margin: 0.4rem; }

.actions-modal-button, .actions-modal-label { width: 100%; text-align: center; font-weight: normal; margin: 0; background: rgba(243, 243, 243, 0.95); box-sizing: border-box; display: block; position: relative; border-bottom: 1px solid #d2d2d6; }

.actions-modal-button a, .actions-modal-label a { text-decoration: none; color: inherit; }

.actions-modal-button b, .actions-modal-label b { font-weight: 500; }

.actions-modal-button.actions-modal-button-bold, .actions-modal-label.actions-modal-button-bold { font-weight: 500; }

.actions-modal-button.actions-modal-button-danger, .actions-modal-label.actions-modal-button-danger { color: #f6383a; }

.actions-modal-button.color-danger, .actions-modal-label.color-danger { color: #f6383a; }

.actions-modal-button.bg-danger, .actions-modal-label.bg-danger { background: #f6383a; color: white; }

.actions-modal-button.bg-danger:active, .actions-modal-label.bg-danger:active { background: #f00b0d; }

.actions-modal-button:first-child, .actions-modal-label:first-child { border-radius: 0.2rem 0.2rem 0 0; }

.actions-modal-button:last-child, .actions-modal-label:last-child { border-left: 0; border-bottom: 0; border-radius: 0 0 0.2rem 0.2rem; }

.actions-modal-button:first-child:last-child, .actions-modal-label:first-child:last-child { border-radius: 0.2rem; }

.actions-modal-button.disabled, .actions-modal-label.disabled { opacity: 0.95; color: #8e8e93; }

.actions-modal-button { cursor: pointer; line-height: 2.15rem; font-size: 1rem; color: #9a9a9a; }

.actions-modal-button:active, .actions-modal-button.active-state { background: #dcdcdc; }

.actions-modal-label { font-size: 0.7rem; line-height: 1.3; min-height: 2.2rem; padding: 0.4rem 0.5rem; color: #5f646e; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }

input.modal-text-input { box-sizing: border-box; height: 1.5rem; background: #fff; margin: 0; margin-top: 0.75rem; padding: 0 0.25rem; border: 1px solid #a0a0a0; border-radius: 0.25rem; width: 100%; font-size: 0.7rem; font-family: inherit; display: block; box-shadow: 0 0 0 transparent; appearance: none; }

input.modal-text-input + input.modal-text-input { margin-top: 0.25rem; }

input.modal-text-input.modal-text-input-double { border-radius: 0.25rem 0.25rem 0 0; }

input.modal-text-input.modal-text-input-double + input.modal-text-input { margin-top: 0; border-top: 0; border-radius: 0 0 0.25rem 0.25rem; }

.popover { min-width: 8rem; background: rgba(255, 255, 255, 0.95); z-index: 11000; margin: 0; top: 0; opacity: 0; left: 0; border-radius: 0.35rem; position: absolute; display: none; transform: none; transition-property: opacity; }

.popover.modal-in { transition-duration: 300ms; opacity: 1; }

.popover .list-block { margin: 0; }

.popover .list-block ul { background: none; }

.popover .list-block:first-child ul { border-right: 0; border-top: 0; border-radius: 0.35rem 0.35rem 0 0; }

.popover .list-block:first-child li:first-child a { border-radius: 0.35rem 0.35rem 0 0; }

.popover .list-block:last-child ul { border-left: 0; border-bottom: 0; border-radius: 0 0 0.35rem 0.35rem; }

.popover .list-block:last-child li:last-child a { border-radius: 0 0 0.35rem 0.35rem; }

.popover .list-block:first-child:last-child li:first-child:last-child a, .popover .list-block:first-child:last-child ul:first-child:last-child { border-radius: 0.35rem; }

.popover .list-block + .list-block { margin-top: 1.75rem; }

.popover-angle { width: 1.3rem; height: 1.3rem; position: absolute; left: -1.3rem; top: 0; z-index: 100; overflow: hidden; }

.popover-angle:after { content: ' '; background: rgba(255, 255, 255, 0.95); width: 1.3rem; height: 1.3rem; position: absolute; left: 0; top: 0; border-radius: 0; transform: rotate(45deg); }

.popover-angle.on-left { left: -1.3rem; }

.popover-angle.on-left:after { left: 0.95rem; top: 0; }

.popover-angle.on-right { left: 100%; }

.popover-angle.on-right:after { left: -0.95rem; top: 0; }

.popover-angle.on-top { left: 0; top: -1.3rem; }

.popover-angle.on-top:after { left: 0; top: 0.95rem; }

.popover-angle.on-bottom { left: 0; top: 100%; }

.popover-angle.on-bottom:after { left: 0; top: -0.95rem; }

.popover-inner { overflow: auto; -webkit-overflow-scrolling: touch; }

.actions-popover .list-block + .list-block { margin-top: 1rem; }

.actions-popover .list-block ul { background: #fff; }

.actions-popover-label { padding: 0.4rem 0.5rem; color: #5f646e; font-size: 0.65rem; line-height: 1.3; text-align: center; position: relative; border-bottom: 1px solid #d2d2d6; }

.actions-popover-label:last-child { border-left: 0; border-bottom: 0; }

.popup, .login-screen { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 10400; background: #fff; box-sizing: border-box; display: none; overflow: auto; -webkit-overflow-scrolling: touch; transition-property: transform; transform: translate3d(0, 100%, 0); }

.popup.modal-in, .popup.modal-out, .login-screen.modal-in, .login-screen.modal-out { transition-duration: 400ms; }

.popup.modal-in, .login-screen.modal-in { transform: translate3d(0, 0, 0); }

.popup.modal-out, .login-screen.modal-out { transform: translate3d(0, 100%, 0); }

.login-screen.modal-in, .login-screen.modal-out { display: block; }

html.with-statusbar-overlay .popup { height: "-webkit-calc(100% -1rem)"; height: "calc(100% - 1rem)"; top: 1rem; }

html.with-statusbar-overlay .popup-overlay { z-index: 9800; }

@media all and (max-width: 629px), (max-height: 629px) { html.with-statusbar-overlay .popup { height: "-webkit-calc(100% - 1rem)"; height: "calc(100% - 1rem)"; top: 1rem; }
  html.with-statusbar-overlay .popup-overlay { z-index: 9800; } }

html.with-statusbar-overlay .login-screen, html.with-statusbar-overlay .popup.tablet-fullscreen { height: "-webkit-calc(100% - 1rem)"; height: "calc(100% - 1rem)"; top: 1rem; }

.modal .preloader { width: 1.7rem; height: 1.7rem; }

.preloader-indicator-overlay { visibility: visible; opacity: 0; background: none; }

.preloader-indicator-modal { position: absolute; left: 50%; top: 50%; padding: 0.4rem; margin-left: -1.25rem; margin-top: -1.25rem; background: rgba(0, 0, 0, 0.8); z-index: 11000; border-radius: 0.25rem; }

.preloader-indicator-modal .preloader { display: block; width: 1.7rem; height: 1.7rem; }

.picker-modal { position: absolute; left: 0; bottom: 0; width: 100%; height: 13rem; z-index: 11500; display: none; transition-property: transform; background: #cfd5da; transform: translate3d(0, 100%, 0); }

.picker-modal.modal-in, .picker-modal.modal-out { transition-duration: 400ms; }

.picker-modal.modal-in { transform: translate3d(0, 0, 0); }

.picker-modal.modal-out { transform: translate3d(0, 100%, 0); }

.picker-modal .picker-modal-inner { height: 100%; position: relative; }

.picker-modal .toolbar { border-top: 1px solid #999; position: relative; width: 100%; }

.picker-modal .toolbar + .picker-modal-inner { height: "-webkit-calc(100% - 2.2rem)"; height: "-moz-calc(100% - 2.2rem)"; height: "calc(100% - 2.2rem)"; }

.picker-modal.picker-modal-inline, .popover .picker-modal { display: block; position: relative; background: none; z-index: inherit; transform: translate3d(0, 0, 0); }

.picker-modal.picker-modal-inline .toolbar, .popover .picker-modal .toolbar { border-right: 0; border-top: 0; border-bottom: 1px solid #999; }

.popover .picker-modal { width: auto; }

.popover .picker-modal .toolbar { background: none; }

.toast { background: rgba(0, 0, 0, 0.6); border-radius: 1rem; color: white; padding: 0 0.53333rem; height: 0.8rem; line-height: 0.8rem; font-size: 0.34667rem; width: auto; margin-top: 0 !important; margin-left: 0 !important; }

/** Created by wenyu on 2017/3/23. */
.gearArea { font-family: Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 10px; background-color: rgba(0, 0, 0, 0.2); display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9900; overflow: hidden; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

.area_ctrl { vertical-align: middle; background-color: #d5d8df; color: #000; margin: 0; height: auto; width: 100%; position: absolute; left: 0; bottom: 0; z-index: 9901; overflow: hidden; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slideInUp { -webkit-animation: slideInUp .3s; animation: slideInUp .3s; }

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

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

.area_roll { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; height: auto; overflow: hidden; background-color: transparent; -webkit-mask: -webkit-gradient(linear, 0% 50%, 0% 100%, from(#debb47), to(rgba(36, 142, 36, 0))); -webkit-mask: -webkit-linear-gradient(top, #debb47 50%, rgba(36, 142, 36, 0)); }

.area_roll > div { font-size: 1.6em; height: 10em; float: left; background-color: transparent; position: relative; overflow: hidden; -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; }

.area_roll > div .gear { width: 100%; float: left; position: absolute; z-index: 9902; margin-top: 4em; }

.area_roll_mask { -webkit-mask: -webkit-gradient(linear, 0% 40%, 0% 0%, from(#debb47), to(rgba(36, 142, 36, 0))); -webkit-mask: -webkit-linear-gradient(bottom, #debb47 50%, rgba(36, 142, 36, 0)); padding: 0; }

.area_grid { position: relative; top: 4em; width: 100%; height: 2em; margin: 0; box-sizing: border-box; z-index: 0; border-top: 1px solid #abaeb5; border-bottom: 1px solid #abaeb5; }

.area_roll > div:nth-child(3) .area_grid > div { left: 42%; }

.area_btn { color: #0575f2; font-size: 1.6em; line-height: 1em; text-align: center; padding: .8em 1em; }

.area_btn_box:before, .area_btn_box:after { content: ''; position: absolute; height: 1px; width: 100%; display: block; background-color: #96979b; z-index: 15; -webkit-transform: scaleY(0.33); transform: scaleY(0.33); }

.area_btn_box { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; background-color: #f1f2f4; position: relative; }

.area_btn_box:before { left: 0; top: 0; -webkit-transform-origin: 50% 20%; transform-origin: 50% 20%; }

.area_btn_box:after { left: 0; bottom: 0; -webkit-transform-origin: 50% 70%; transform-origin: 50% 70%; }

.tooth { height: 2em; line-height: 2em; text-align: center; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; line-clamp: 1; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; overflow: hidden; }

.actions-modal .actions-modal-button { font-weight: 400; line-height: 1.33333rem; font-size: 0.48rem; color: #333; }

.picker-modal { border-top: 1px solid #ddd; height: auto; }

.psl-picker { background: #f1f1f1 !important; }

.picker-items { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; width: 100%; padding: 0; font-size: 1.2rem; text-align: right; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-mask-box-image: -webkit-linear-gradient(bottom, transparent, transparent 5%, white 20%, white 80%, transparent 95%, transparent); -webkit-mask-box-image: linear-gradient(to top, transparent, transparent 5%, white 20%, white 80%, transparent 95%, transparent); }

.picker-modal .picker-modal-inner { position: relative; height: 100%; }

.bar + .picker-items { height: 6rem; }

.picker-items-col.picker-items-col-center { text-align: center; }

.picker-items-col { position: relative; max-height: 100%; overflow: hidden; width: 100%; }

.picker-items-col-wrapper { -webkit-transition: 300ms; -o-transition: 300ms; transition: 300ms; -webkit-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; }

.picker-item { position: relative; top: 0; left: 0; width: 100%; height: 36px; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0 10px; overflow: hidden; line-height: 36px; color: #999; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: 300ms; -o-transition: 300ms; transition: 300ms; font-size: 0.37333rem; }

.picker-item.picker-selected { font-size: 0.42667rem; color: #3d4145; background: #eaeaea; -webkit-transform: translate3d(0, 0, 0); -webkit-transform: rotateX(0deg); transform: translate3d(0, 0, 0); transform: rotateX(0deg); background-color: rgba(255, 255, 255, 0.3); }

.layui-m-layer { position: relative; z-index: 19891014; }

.layui-m-layer * { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; }

.layui-m-layermain, .layui-m-layershade { position: fixed; left: 0; top: 0; width: 100%; height: 100%; }

.layui-m-layershade { background-color: rgba(0, 0, 0, 0.7); pointer-events: auto; }

.layui-m-layermain { display: table; font-family: Helvetica, arial, sans-serif; pointer-events: none; }

.layui-m-layermain .layui-m-layersection { display: table-cell; vertical-align: middle; text-align: center; }

.layui-m-layerchild { position: relative; display: inline-block; text-align: left; background-color: #fff; font-size: 14px; border-radius: 5px; box-shadow: 0 0 8px rgba(0, 0, 0, 0.1); pointer-events: auto; -webkit-overflow-scrolling: touch; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration: .2s; animation-duration: .2s; }

@-webkit-keyframes layui-m-anim-scale { 0% { opacity: 0;
    -webkit-transform: scale(0.5);
    transform: scale(0.5); }
  100% { opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1); } }

@keyframes layui-m-anim-scale { 0% { opacity: 0;
    -webkit-transform: scale(0.5);
    transform: scale(0.5); }
  100% { opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1); } }

.layui-m-anim-scale { animation-name: layui-m-anim-scale; -webkit-animation-name: layui-m-anim-scale; }

@-webkit-keyframes layui-m-anim-up { 0% { opacity: 0;
    -webkit-transform: translateY(800px);
    transform: translateY(800px); }
  100% { opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0); } }

@keyframes layui-m-anim-up { 0% { opacity: 0;
    -webkit-transform: translateY(800px);
    transform: translateY(800px); }
  100% { opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0); } }

.layui-m-anim-up { -webkit-animation-name: layui-m-anim-up; animation-name: layui-m-anim-up; }

.layui-m-layer0 .layui-m-layerchild { width: 90%; max-width: 640px; }

.layui-m-layer1 .layui-m-layerchild { border: none; border-radius: 0; }

.layui-m-layer2 .layui-m-layerchild { width: auto; max-width: 260px; min-width: 40px; border: none; background: 0 0; box-shadow: none; color: #fff; }

.layui-m-layerchild h3 { padding: 0 10px; height: 60px; line-height: 60px; font-size: 16px; font-weight: 400; border-radius: 5px 5px 0 0; text-align: center; }

.layui-m-layerbtn span, .layui-m-layerchild h3 { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }

.layui-m-layercont { padding: 50px 30px; line-height: 22px; text-align: center; }

.layui-m-layer1 .layui-m-layercont { padding: 0; text-align: left; }

.layui-m-layer2 .layui-m-layercont { text-align: center; padding: 0; line-height: 0; }

.layui-m-layer2 .layui-m-layercont i { width: 25px; height: 25px; margin-left: 8px; display: inline-block; background-color: #fff; border-radius: 100%; -webkit-animation: layui-m-anim-loading 1.4s infinite ease-in-out; animation: layui-m-anim-loading 1.4s infinite ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

.layui-m-layerbtn, .layui-m-layerbtn span { position: relative; text-align: center; border-radius: 0 0 5px 5px; }

.layui-m-layer2 .layui-m-layercont p { margin-top: 20px; }

@-webkit-keyframes layui-m-anim-loading { 0%, 100%, 80% { transform: scale(0);
    -webkit-transform: scale(0); }
  40% { transform: scale(1);
    -webkit-transform: scale(1); } }

@keyframes layui-m-anim-loading { 0%, 100%, 80% { transform: scale(0);
    -webkit-transform: scale(0); }
  40% { transform: scale(1);
    -webkit-transform: scale(1); } }

.layui-m-layer2 .layui-m-layercont i:first-child { margin-left: 0; -webkit-animation-delay: -.32s; animation-delay: -.32s; }

.layui-m-layer2 .layui-m-layercont i.layui-m-layerload { -webkit-animation-delay: -.16s; animation-delay: -.16s; }

.layui-m-layer2 .layui-m-layercont > div { line-height: 22px; padding-top: 7px; margin-bottom: 20px; font-size: 14px; }

.layui-m-layerbtn { display: box; display: -moz-box; display: -webkit-box; width: 100%; height: 50px; line-height: 50px; font-size: 0; border-top: 1px solid #D0D0D0; background-color: #F2F2F2; }

.layui-m-layerbtn span { display: block; -moz-box-flex: 1; box-flex: 1; -webkit-box-flex: 1; font-size: 14px; cursor: pointer; }

.layui-m-layerbtn span[yes] { color: #40AFFE; }

.layui-m-layerbtn span[no] { border-right: 1px solid #D0D0D0; border-radius: 0 0 0 5px; }

.layui-m-layerbtn span:active { background-color: #F6F6F6; }

.layui-m-layerend { position: absolute; right: 7px; top: 10px; width: 30px; height: 30px; border: 0; font-weight: 400; background: 0 0; cursor: pointer; -webkit-appearance: none; font-size: 30px; }

.layui-m-layerend::after, .layui-m-layerend::before { position: absolute; left: 5px; top: 15px; content: ''; width: 18px; height: 1px; background-color: #999; transform: rotate(45deg); -webkit-transform: rotate(45deg); border-radius: 3px; }

.layui-m-layerend::after { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); }

body .layui-m-layer .layui-m-layer-footer { position: fixed; width: 95%; max-width: 100%; margin: 0 auto; left: 0; right: 0; bottom: 10px; background: 0 0; }

.layui-m-layer-footer .layui-m-layercont { padding: 20px; border-radius: 5px 5px 0 0; background-color: rgba(255, 255, 255, 0.8); }

.layui-m-layer-footer .layui-m-layerbtn { display: block; height: auto; background: 0 0; border-top: none; }

.layui-m-layer-footer .layui-m-layerbtn span { background-color: rgba(255, 255, 255, 0.8); }

.layui-m-layer-footer .layui-m-layerbtn span[no] { color: #FD482C; border-top: 1px solid #c2c2c2; border-radius: 0 0 5px 5px; }

.layui-m-layer-footer .layui-m-layerbtn span[yes] { margin-top: 10px; border-radius: 5px; }

body .layui-m-layer .layui-m-layer-msg { width: auto; max-width: 90%; margin: 0 auto; bottom: -150px; background-color: rgba(0, 0, 0, 0.7); color: #fff; }

.layui-m-layer-msg .layui-m-layercont { padding: 10px 20px; }

.m-index { position: absolute; width: 100%; height: 100%; overflow: hidden; }

.m-index .index-bg { position: absolute; height: 100%; bottom: 0; top: auto; left: 0; width: 100%; transition: bottom .5s ease; }

.m-index .index-bg .bg { position: absolute; width: 100%; left: 0; bottom: 0; }

.m-index .index-bg .m-bd { position: absolute; width: 100%; top: 2.06667rem; text-align: center; }

.m-index .index-bg .m-bd img { width: 8.8rem; display: block; margin: auto; }

.m-index .index-bg .m-bd .time { width: 3.98667rem; height: 5.21333rem; margin: auto; background: url(../images/number-bg.png) no-repeat; background-size: cover; }

.m-index .index-bg .m-bd .time img { width: 3.98667rem; height: 5.21333rem; }

.m-index .u-progressbar { width: 6.66667rem; height: 0.53333rem; position: absolute; left: 50%; top: 1.13333rem; margin-left: -2.93333rem; }

.m-index .u-progressbar img { position: absolute; left: -1rem; top: -0.46667rem; width: 1.46667rem !important; }

.m-index .u-progressbar ._line { width: 6.66667rem; height: 0.53333rem; background: rgba(0, 0, 0, 0.5); border-radius: 20px; }

.m-index .u-progressbar ._line span { position: absolute; display: block; height: 100%; left: 0; top: 0; width: 0.26667rem; border-radius: 20px; background-image: linear-gradient(#fffaaa 50%, #ffec0b 50%); }

.m-index .u-progressbar ._line .active { animation: 10s linear; animation-name: line; }

.m-index .comedown { bottom: -3.733333rem; }

.m-index .comedown .hd-tit { top: -1.5rem; opacity: 1; }

.m-index .comedown .hd-tit img { width: 100%; }

.m-index .hd-tit { position: absolute; width: 5.8rem; left: 50%; margin-left: -2.9rem; top: 0; z-index: 1; opacity: 0; transition: all .5 ease; }

.m-index .btn-rain { position: absolute; bottom: 1.6rem; left: 50%; margin-left: -2.2rem; width: 4.4rem; }

.m-index .btn-rain img { display: block; width: 100%; }

.m-index .rule { position: absolute; bottom: 0.733333rem; left: 0; width: 100%; text-align: center; }

.m-index .rule a { display: block; margin: auto; width: 1.6rem; height: 0.66667rem; }

.layui-m-layer0 .layui-m-layerchild { background: none; }

.layer-carRule .layui-m-layercont { padding: 0; background: none; }

.layer-carRule img { display: block; width: 100%; }

.layer-carRule .con { position: absolute; height: 9.53333rem; padding: 0 0.26667rem; top: 1.8rem; overflow: auto; line-height: 2; text-align: left; font-size: 0.37333rem; color: #000; }

.layer-carRule .con b { font-size: 0.37333rem; }

.layer-carRule .con p { padding-left: 0.26667rem; position: relative; font-size: 0.34667rem; }

.layer-carRule .con p span { position: absolute; left: 0; top: 0; }

.layer-carRule .btn-close { position: absolute; width: 1.6rem; height: 1.6rem; bottom: 0; left: 50%; margin-left: -0.8rem; }

.layer-prize .layui-m-layercont { padding: 0; position: relative; }

.layer-prize img { display: block; max-width: 100%; max-height: 100%; }

.layer-prize .btns { display: flex; justify-content: space-between; position: absolute; bottom: 0.8rem; width: 100%; }

.layer-prize a { display: block; width: 50%; height: 0.93333rem; }

.layer-prize .btn-close { display: block; position: absolute; width: 1.33333rem; height: 1.33333rem; bottom: 0; left: 50%; margin-left: -0.66667rem; }

#petalbox { position: absolute; width: 100%; height: 100%; }

@keyframes line { 0% { width: 100%; }
  100% { width: 0.26667rem; } }

.m-signUpMess .hd { height: 1.06667rem; line-height: 1.06667rem; color: #ff8774; font-size: 0.34667rem; background: #fffced; padding: 0 0.46667rem; }

.m-signUpMess .fd { font-size: 0.26667rem; color: #585858; padding: 0.4rem; }

.m-signUpMess .btn-submit { width: 9.06667rem; height: 0.86667rem; line-height: 0.86667rem; border-radius: 0.2rem; text-align: center; font-size: 0.37333rem; color: #fff; letter-spacing: 0.13333rem; background: #ffd33c; border: none; margin: 20px auto; display: block; }

.m-signUpMess ul { padding: 0.8rem 0.46667rem 0 0.46667rem; }

.m-signUpMess ul li { margin-bottom: 0.53333rem; display: flex; justify-content: space-between; }

.m-signUpMess ul label { width: 1.6rem; text-align: justify; text-align-last: justify; font-size: 0.32rem; line-height: 0.8rem; color: #000; }

.m-signUpMess ul .right { height: 0.8rem; }

.m-signUpMess ul .right input, .m-signUpMess ul .right select { width: 7rem; height: 0.8rem; border: 1px solid #a0a0a0; background-color: #eeeeee; padding: 0 0.26667rem; color: #000; font-size: 0.32rem; }

.m-signUpMess ul select { appearance: none; -moz-appearance: none; -webkit-appearance: none; padding-right: 0.93333rem; background: url("../images/arrow.png") no-repeat scroll right center transparent; background-size: auto 100%; }

.m-signUpMess ul select select::-ms-expand { display: none; }

@keyframes swing { 20% { transform: rotate(15deg); }
  40% { transform: rotate(-10deg); }
  60% { transform: rotate(5deg); }
  80% { transform: rotate(-5deg); }
  100% { transform: rotate(0); } }

.m-main .bg { position: relative; }

.m-main .bg img { width: 100%; display: block; }

.m-main .con { position: absolute; height: 100%; width: 100%; top: 0; left: 0; }

.m-main .date { color: #e62138; text-align: center; width: 100%; font-size: 0.29333rem; position: absolute; left: 0; letter-spacing: 0.04rem; text-shadow: 0 0 10px #fff; }

.m-main .btn { display: block; width: 9.17333rem; height: 4rem; position: absolute; left: 50%; transform: translateX(-50%); }

.m-main .btn-more { display: block; width: 2.93333rem; height: 0.93333rem; margin: auto; position: absolute; left: 50%; margin-left: -1.46667rem; }

.m-main .m-mainForm { position: absolute; left: 1.33333rem; right: 1.33333rem; top: 28.42667rem; padding-top: 2.93333rem; }

.m-main .m-mainForm li { margin-top: 0.37333rem; position: relative; }

.m-main .m-mainForm li label { position: absolute; right: 0.2rem; top: 0.17333rem; border: 1px solid #367f36; font-size: 0.34667rem; padding: 0 0.2rem; border-radius: 0.26667rem; min-width: 2.49333rem; height: 0.58667rem; line-height: 0.58667rem; color: #367f36; text-align: center; }

.m-main .m-mainForm li.j-select { cursor: pointer; }

.m-main .m-mainForm input { width: 100%; height: 0.90667rem; background: none; padding-left: 0.93333rem; font-size: 0.36rem; color: #367f36; border: none; font-family: "PingFang Regular"; }

.m-main .m-mainForm input::-webkit-input-placeholder { /* placeholder颜色  */ color: #367f36; }

.m-main .m-mainForm .btn-submit { display: block; margin: 0.69333rem auto; width: 7.33333rem; height: 1.06667rem; }

.m-main .m-mainForm dl { position: absolute; top: 0.90667rem; left: 0; right: 0; z-index: 11; background: #f5f4d6; margin: 0; display: none; max-height: 4rem; overflow: auto; padding: 0.2rem 0; }

.m-main .m-mainForm dl dd { height: 0.74667rem; line-height: 0.74667rem; font-size: 0.34667rem; color: #367f36; }

.m-main .m-mainForm .active dl { display: block; }

header { display: flex; justify-content: space-between; padding: 0 !important; }

header span { padding: 0 0.4rem; }

header img { width: 0.2rem; margin-top: 0.4rem; }

.m-reform .m-banner img { display: block; width: 100%; }

.m-reform .form { margin: 0; padding: 0; display: block; background: url(../../../images/carRepalce618/formbg.jpg); background-size: 100% auto; }

.m-reform form { padding: 0.78667rem 1.13333rem; }

.m-reform form li { margin-bottom: 0.37333rem; position: relative; }

.m-reform form li label { position: absolute; right: 0.2rem; top: 0.17333rem; border: 1px solid #E32020; font-size: 0.34667rem; padding: 0 0.2rem; border-radius: 0.26667rem; min-width: 2.49333rem; height: 0.58667rem; line-height: 0.58667rem; color: #E32020; text-align: center; }

.m-reform form li.j-select { cursor: pointer; }

.m-reform form input { width: 100%; height: 0.90667rem; background: none; padding-left: 1.06667rem; font-size: 0.36rem; color: #333; border: none; font-family: "PingFang Regular"; }

.m-reform form input::-webkit-input-placeholder { /* placeholder颜色  */ color: #333; }

.m-reform form .btn-submit { display: block; margin: 1.04rem auto; width: 100%; height: 1.06667rem; }

.m-reform form dl { position: absolute; top: 0.90667rem; left: 0; right: 0; z-index: 11; background: #f5f5f5; margin: 0; display: none; max-height: 4rem; overflow: auto; padding: 0.2rem 0; }

.m-reform form dl dd { height: 0.74667rem; line-height: 0.74667rem; font-size: 0.34667rem; color: #333;overflow: hidden}

.m-reform form .active dl { display: block; }

.icon-ball { width: 0.8rem !important; position: absolute; left: 1.78667rem; top: 3.12rem; animation: circle 3s infinite linear; }

@keyframes circle { 0% { transform: rotate(0); }
  100% { transform: rotate(360deg); } }

/*petalbox*/
#petalbox { position: absolute; top: 0; left: 0; width: 100%; z-index: 98; }

#petalbox > div { position: absolute; -webkit-animation-iteration-count: 1, 1; -webkit-animation-direction: normal, normal; -webkit-animation-timing-function: linear, ease-in; -webkit-backface-visibility: hidden; animation-iteration-count: 1, 1; animation-direction: normal, normal; animation-timing-function: linear, ease-in; backface-visibility: hidden; }

#petalbox > div > img { position: absolute; -webkit-animation-iteration-count: infinite; -webkit-animation-direction: alternate; -webkit-animation-timing-function: linear; -webkit-backface-visibility: hidden; animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: linear; backface-visibility: hidden; }

.per1 { width: 2rem; height: 2rem; line-height: 2rem; text-align: center; color: #fff; font-size: .4rem; font-weight: bold; position: absolute; top: -1rem; left: 0; z-index: 11; background: url(../images/bg-boom.png); background-size: 100% 100%; }

.per2 { width: 2rem; height: 2rem; line-height: 2rem; text-align: center; color: #feeaae; font-size: .4rem; font-weight: bold; position: absolute; top: -1rem; left: 0; z-index: 11; }

@-webkit-keyframes fade { 0%, 90% { opacity: 1; }
  100% { opacity: 0; } }

@keyframes fade { 0%, 90% { opacity: 1; }
  100% { opacity: 0; } }

@-webkit-keyframes drop { 0% { -webkit-transform: translate3d(0, 0, 0); }
  100% { -webkit-transform: translate3d(0, 30rem, 0); } }

@keyframes drop { 0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(0, 30rem, 0); } }

@-webkit-keyframes clockwiseSpin { 0% { -webkit-transform: none; }
  100% { -webkit-transform: rotate(480deg); } }

@keyframes clockwiseSpin { 0% { transform: none; }
  100% { transform: rotate(480deg); } }

@-webkit-keyframes counterclockwiseSpinAndFlip { 0% { -webkit-transform: none; }
  100% { -webkit-transform: rotate(-480deg); } }

@keyframes counterclockwiseSpinAndFlip { 0% { transform: none; }
  100% { transform: rotate(-480deg); } }

/*animation*/
.timenav .time_list .time1 { -webkit-animation: lantern_shake1 3s linear both; -webkit-transform-origin: center top; animation: lantern_shake1 3s linear both; transform-origin: center top; }

@-webkit-keyframes lantern_shake1 { 0%, 50% { -webkit-transform: none; }
  25% { -webkit-transform: rotate(-4deg); }
  75% { -webkit-transform: rotate(4deg); } }

@keyframes lantern_shake1 { 0%, 50% { transform: none; }
  25% { transform: rotate(-4deg); }
  75% { transform: rotate(4deg); } }

.timenav .time_list .time2 { -webkit-animation: lantern_shake2 3s linear both; -webkit-transform-origin: center top; -webkit-backface-visibility: hidden; animation: lantern_shake2 3s linear both; transform-origin: center top; }

@-webkit-keyframes lantern_shake2 { 0%, 50% { -webkit-transform: none; }
  25% { -webkit-transform: rotate(-6deg) translate3d(5px, 0, 0); }
  75% { -webkit-transform: rotate(6deg) translate3d(-5px, 0, 0); } }

@keyframes lantern_shake2 { 0%, 50% { transform: none; }
  25% { transform: rotate(-6deg) translate3d(5px, 0, 0); }
  75% { transform: rotate(6deg) translate3d(-5px, 0, 0); } }

.timenav .time_list .time3 { -webkit-animation: lantern_shake3 3s linear both; -webkit-transform-origin: center top; -webkit-backface-visibility: hidden; animation: lantern_shake3 3s linear both; transform-origin: center top; }

@-webkit-keyframes lantern_shake3 { 0%, 50% { -webkit-transform: none; }
  25% { -webkit-transform: rotate(-8deg) translate3d(14px, 0, 0); }
  75% { -webkit-transform: rotate(8deg) translate3d(-14px, 0, 0); } }

@keyframes lantern_shake3 { 0%, 50% { transform: none; }
  25% { transform: rotate(-8deg) translate3d(14px, 0, 0); }
  75% { transform: rotate(8deg) translate3d(-14px, 0, 0); } }

.timenav .time_list:hover a { -webkit-animation: none; animation: none; }

.banner_tit, .banner_subtit { -webkit-animation: bounceInDown 0.8s both; animation: bounceInDown 0.8s both; }

.banner_subtit { -webkit-animation-delay: 0.4s; animation-delay: 0.4s; }

@-webkit-keyframes bounceInDown { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0); }
  60% { -webkit-transform: translate3d(0, 25px, 0); }
  75% { -webkit-transform: translate3d(0, -10px, 0); }
  90% { -webkit-transform: translate3d(0, 5px, 0); }
  to { -webkit-transform: none;
    opacity: 1; } }

@keyframes bounceInDown { from, 60%, 75%, 90%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0;
    transform: translate3d(0, -3000px, 0); }
  60% { transform: translate3d(0, 25px, 0); }
  75% { transform: translate3d(0, -10px, 0); }
  90% { transform: translate3d(0, 5px, 0); }
  to { transform: none;
    opacity: 1; } }

.banner_time { -webkit-animation: fadeIn 1s 1.2s both; animation: fadeIn 1s 1.2s both; }

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

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

.fireworks i { -webkit-animation: fireworkani 1.6s .2s ease both; -webkit-animation-iteration-count: 2; animation: fireworkani 1.6s .2s ease both; animation-iteration-count: 2; }

.fireworks .f2 { -webkit-animation-delay: .6s; animation-delay: .6s; }

.fireworks .f3 { -webkit-animation-delay: .3s; animation-delay: .3s; }

.fireworks .f4 { -webkit-animation-delay: .8s; animation-delay: .8s; }

@-webkit-keyframes fireworkani { 0%, 9% { -webkit-transform: scale(0.1);
    opacity: 0; }
  10% { -webkit-transform: scale(0.1);
    opacity: 1; }
  95% { -webkit-transform: scale(1.5);
    opacity: .1; }
  100% { -webkit-transform: scale(1.5);
    opacity: 0; } }

@keyframes fireworkani { 0%, 9% { transform: scale(0.1);
    opacity: 0; }
  10% { transform: scale(0.1);
    opacity: 1; }
  95% { transform: scale(1.5);
    opacity: .1; }
  100% { transform: scale(1.5);
    opacity: 0; } }

.main_before, .main_after, .main_cont { -webkit-animation: contfadein 1s .5s both; animation: contfadein 1s .5s both; }

@-webkit-keyframes contfadein { 0% { -webkit-transform: translate3d(0, 100px, 0);
    opacity: 0; }
  100% { -webkit-transform: none;
    opacity: 1; } }

@keyframes contfadein { 0% { transform: translate3d(0, 100px, 0);
    opacity: 0; }
  100% { transform: none;
    opacity: 1; } }

/*media*/
.small_window .timenav { left: 20px; margin-left: 0; }

/*# sourceMappingURL=qwui_ui.css.map */