﻿@charset 'UTF-8';
blockquote,
body,
dd,
dl,
figure,
form,
h1,
h2,
h3,
h4,
h5,
h6,
ol,
p,
ul {
    margin: 0
}
ol,
ul {
    padding: 0;
    list-style: none
}
a {
    text-decoration: none;
    color: inherit;
    outline: 0
}
a[href]:active,
button:active {
    background-image: -webkit-linear-gradient(to top,rgba(0,0,0,.05),rgba(0,0,0,.05));
    background-image: linear-gradient(to top,rgba(0,0,0,.05),rgba(0,0,0,.05))
}
body.iphone a[href]:active,
body.iphone button:active {
    background-image: none
}
em {
    font-style: normal
}
h1,
h2,
h3,
h4,
h5,
h6,
input,
select,
textarea {
    font-size: 100%
}
input,
select,
textarea {
    font-family: inherit;
    box-sizing: border-box
}
img {
    display: inline-block
}
p {
    word-break: break-all
}
main {
    display: block
}
output {
    speak: digits
}
html {
    font-size: 16px
}
@media screen and (min-width:375px) {
    html {
        font-size: calc(100% + 2 * (100vw - 375px)/ 39);
        font-size: calc(16px + 2 * (100vw - 375px)/ 39)
    }
}
@media screen and (min-width:414px) {
    html {
        font-size: calc(112.5% + 4 * (100vw - 414px)/ 586);
        font-size: calc(18px + 4 * (100vw - 414px)/ 586)
    }
}
@media screen and (min-width:600px) {
    html {
        font-size: calc(125% + 4 * (100vw - 600px)/ 400);
        font-size: calc(20px + 4 * (100vw - 600px)/ 400)
    }
}
@media screen and (min-width:1000px) {
    html {
        font-size: calc(137.5% + 6 * (100vw - 1000px)/ 1000);
        font-size: calc(22px + 6 * (100vw - 1000px)/ 1000)
    }
}
body {
    font-family: sans-serif;
    line-height: 1.5;
    -webkit-user-select: none;
    color: #33373d;
    fill: currentColor;
    -webkit-tap-highlight-color: transparent;
    -webkit-text-size-adjust: none;
    -webkit-touch-callout: none
}
.noscroll,
.noscroll body {
    overflow: hidden
}
.noscroll body {
    position: relative
}
body {
    background-color: #f6f7f9
}
.page {
    background-color: #fff;
    box-shadow: 0 200px #fff
}
.page.unlogin,
.unlogin .page {
    min-height: 500px;
    min-height: calc(100vh - 8.75rem)
}
.login .page,
.page.login {
    min-height: 556px;
    min-height: calc(100vh - (84rem / 16))
}
.content {
    padding-bottom: .1px;
    background-color: #f6f7f9
}
.aside,
.aside-overlay,
.footer-backtop-circle svg,
.full,
.guide-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}
.module {
    margin: .75rem 0;
    background-color: #fff
}
.header {
    position: relative;
    box-sizing: border-box;
    height: 2.75rem;
    padding-top: .6875rem;
    padding-bottom: .625rem;
    border-bottom: 1px solid #f0f1f2;
    background-color: #fff
}
.header .btn-group-small {
    margin-top: -2px
}
.page .header[open] {
    background-color: #fff
}
.header-index {
    border-bottom: none;
    background-color: transparent
}
.logo-a {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 5.625rem;
    padding: 0 1rem
}
.logo {
    font-size: 1rem;
    position: absolute;
    top: 0;
    bottom: 0;
    width: inherit;
    height: 1.125rem;
    margin: auto;
    color: transparent;
    background: url(/qdm/img/logo-qdm.02fc8.svg) no-repeat center;
    background-size: 100%
}
.logo.logo-female {
    background: url(/qdm/img/logo-qdm-f.59a7a.svg) no-repeat center;
    background-size: 100%
}
.header-back {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    padding: .625rem .8125rem .625rem .875rem
}
.header-back .header-back-title {
    font-size: .875rem;
    font-weight: 400;
    margin-left: .6875rem
}
.header-back + .header-back-title {
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.375rem;
    position: absolute;
    left: 2.6875rem;
    overflow: hidden;
    max-width: 60%;
    white-space: nowrap;
    text-overflow: ellipsis
}
.header-title {
    text-align: center
}
.header-operate {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    padding: .25rem .375rem
}
.header-operate > .icon,
.header-operate-a {
    float: left;
    overflow: hidden;
    width: 2.25rem;
    height: 2.25rem
}
.header-operate svg {
    display: block;
    margin: .625rem auto
}
.header-avatar {
    display: block;
    width: 1.25rem;
    height: 1.25rem;
    margin: .5rem auto;
    border-radius: 1rem
}
.header-operate-a {
    font-size: .875rem;
    line-height: 2.25rem;
    padding: 0 .25rem;
    text-align: center
}
.header-opt-a-l,
.header-opt-a-r {
    font-size: .875rem;
    line-height: 2.75rem;
    position: absolute;
    top: 0;
    bottom: 0;
    padding: 0 1rem
}
.header-opt-a-l {
    left: 0
}
.header-opt-a-r {
    right: 0
}
a.icon-more:empty {
    position: relative;
    width: 2.25rem;
    height: 2.25rem
}
a.icon-more:empty::after,
a.icon-more:empty::before {
    position: absolute;
    top: 1.125rem;
    left: 50%;
    width: 1.125rem;
    margin-top: -1px;
    margin-left: -.5625rem;
    content: '';
    -webkit-transition: all .15s;
    transition: transform .15s;
    border-top: 1px solid
}
a.icon-more:empty::before {
    height: 4px;
    -webkit-transform-origin: top center;
    transform-origin: top center;
    border-bottom: 1px solid
}
a.icon-more:empty::after {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px)
}
a.icon-more.active::before {
    height: 0;
    -webkit-transform: translateY(0) rotate(45deg);
    transform: translateY(0) rotate(45deg);
    border-bottom: 0
}
a.icon-more.active::after {
    -webkit-transform: translateY(0) rotate(-45deg);
    transform: translateY(0) rotate(-45deg)
}
.module-header {
    height: 1.75rem;
    padding: 0 1rem;
    border-top: 1rem solid transparent
}
.module-header::after {
    display: table;
    clear: both;
    content: ''
}
.module-header-l {
    float: left
}
.module-header-r {
    position: relative;
    float: right;
    min-width: 4rem
}
.module-title {
    font-size: 1rem;
    font-family: FZZCYSK;
    font-weight: 400;
    display: inline;
    color: #33373d
}
.module-title::before {
    display: inline-block;
    box-sizing: border-box;
    width: .625rem;
    height: 1em;
    content: '';
    vertical-align: -.22ex;
    color: transparent;
    border-left: 2px solid #ed424b
}
.module-title-desc {
    font-size: .8125rem;
    margin-left: .5rem;
    color: #969ba3
}
.module-header-btn {
    font-size: .875rem;
    line-height: 1.5rem;
    position: absolute;
    top: -.5rem;
    right: -.75rem;
    padding: .5rem .5rem .5rem .75rem;
    white-space: nowrap;
    color: #969ba3
}
.module-header-btn .icon-arrow-r {
    margin-left: .25rem
}
.module-header-btn .icon-refresh {
    margin-right: .25rem
}
.loading .icon-refresh {
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite
}
.module-filter-header {
    position: relative;
    z-index: 1;
    right: 0;
    left: 0;
    padding: .6875rem 1rem
}
.module-filter-header[style*=fixed] {
    border-bottom: 1px solid #f0f1f2;
    background-color: #fff
}
.module-filter-icon {
    position: absolute;
    top: .4rem;
    right: .75rem;
    padding: 0 .25rem .0625rem;
    color: #ed424b
}
.module-filter-icon > svg {
    font-size: 20px;
    display: block;
    margin: auto
}
.module-filter-icon > h3 {
    font: 400 12px/1 a;
    transform: scale(.8333);
    transform-origin: center top
}
.module-time-range {
    font: bold .75rem/1.5rem a;
    line-height: 40px;
    position: relative;
    padding: .75rem 1rem 0;
    text-align: center;
    color: #969ba3
}
.module-tab {
    margin: .4375rem 1rem
}
.module-tab ~ .module-tab::before {
    position: relative;
    top: -.4375rem;
    display: block;
    padding-top: .6875rem;
    content: '';
    border-top: 1px solid #f0f1f2
}
.module-bar {
    font-size: .8125rem;
    line-height: 2.75rem;
    text-align: center;
    color: #969ba3;
    background-color: #f6f7f9
}
.module-ad {
    position: relative;
    display: block;
    overflow: hidden;
    margin: .75rem 0;
    padding: 7.575757% 50%
}
.module-ad::after {
    font-size: 12px;
    line-height: 1;
    position: absolute;
    right: 0;
    bottom: -1px;
    padding: 1px;
    content: '骞垮憡';
    -webkit-transform: translateY(-3px) scale(.75);
    transform: translateY(-3px) scale(.75);
    opacity: .6;
    color: #fff;
    border: 1px solid;
    background-color: rgba(0,0,0,.3)
}
.module-ad-downloadapp::after {
    content: none
}
.module-ad > img:only-child {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}
.module-loading {
    overflow: hidden;
    height: 200px
}
.module-loading > .gray:only-child {
    font-size: 12px;
    line-height: 200px;
    display: block;
    text-align: center
}
.book-layout {
    position: relative;
    display: block;
    overflow: hidden;
    padding: 1rem;
    -webkit-transition: padding-left .15s;
    transition: padding-left .15s
}
.book-layout mark {
    color: #ed424b;
    background-color: transparent
}
.book-layout > .icon-arrow-r {
    position: absolute;
    top: 0;
    right: 1rem;
    bottom: 0;
    margin: auto;
    color: #969ba3
}
.book-layout-wrap {
    overflow: hidden;
    padding: .75rem;
    border-radius: .25rem;
    background-color: #f6f7f9
}
.book-layout-wrap .book-author {
    max-width: 8.5em;
    max-width: calc(100vw - 3.5rem - (176rem / 16))
}
.book-layout-corner {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 1.5rem;
    height: 1.5rem;
    background: -webkit-linear-gradient(135deg,transparent,transparent 50%,#f6f7f9 50%,#f6f7f9);
    background: linear-gradient(135deg,transparent,transparent 50%,#f6f7f9 50%,#f6f7f9)
}
.book-layout-corner > svg {
    font-size: .75rem;
    position: absolute;
    right: 0;
    bottom: .125rem;
    color: #969ba3
}
.book-layout-wrap .book-cover {
    width: 2.625rem;
    height: 3.5rem
}
.book-layout-wrap .book-title {
    font-size: .875rem
}
.book-layout-wrap .book-desc {
    margin: .125rem 0
}
.book-li > .radio {
    left: .5rem;
    margin-top: 2.25rem
}
.enabled > li > .book-layout {
    padding-left: 3rem
}
.enabled span > li > .book-layout {
    padding-left: 3rem
}
.book-li::after {
    display: block;
    margin-top: -1px;
    margin-left: 1rem;
    content: '';
    -webkit-transition: margin-left .15s;
    transition: margin-left .15s;
    /*border-bottom: 1px solid #f0f1f2*/
}
.book-ol-author .book-li::after {
    margin-left: 4.75rem
}
.enabled > .book-li::after {
    margin-left: 3rem
}
.book-li:last-child::after {
    display: none
}
.book-title-x {
    display: block;
    overflow: hidden
}
.book-ol + .book-title-x {
    padding: .625rem 1rem
}
.book-title {
    line-height: 1.4;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}
.book-title > .tag-solid {
    margin-left: .25rem
}
.book-title > .tag-small-group {
    position: absolute;
    margin-left: .25rem;
    -webkit-transform-origin: left center;
    transform-origin: left center
}
.book-cover {
    font-size: 0;
    float: left;
    /*width: 4.125rem;*/
    /*height: 5.5rem;*/
    width: 5.125rem;
    height: 6.5rem;
    margin-right: .5rem;
    box-shadow: 0 1px 3px rgba(0,0,0,.3)
}
.book-cover > img {
    width: 1.3125rem;
    height: 1.875rem;
    margin: .25rem 0 0 .25rem;
    -webkit-transition: opacity .15s;
    transition: opacity .15s
}
.book-cover:not(img) {
    background-color: #f6f7f9
}
.enabled .book-cover > img {
    opacity: .5
}
.book-cell {
    overflow: hidden
}
.book-desc {
    font-size: .875rem;
    line-height: 1.125rem;
    overflow: hidden;
    margin: .375rem 0;
    color: #969ba3
}
.book-ol-normal .book-desc,
.book-ol-time .book-desc {
    line-height: 1.1875rem;
    display: -webkit-box;
    height: 2.25rem;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}
.book-ol-author .book-desc {
    white-space: nowrap;
    text-overflow: ellipsis
}
.book-ol-author .book-desc:last-child {
    margin-right: 1.5rem
}
.book-ol-author .icon-arrow-r {
    font-size: .875rem
}
.book-meta {
    font-size: .75rem;
    overflow: hidden
}
.book-meta .icon-human {
    margin-right: .1875rem
}
.book-meta-l {
    float: left
}
.book-meta-l:only-child {
    float: none
}
.book-meta-r {
    position: relative;
    float: right
}
.book-meta-r:first-child {
    margin-left: .5rem
}
.book-author {
    font-size: .8125rem;
    display: block;
    overflow: hidden;
    max-width: 10em;
    max-width: calc(100vw - 2rem - (176rem / 16));
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #969ba3
}
.book-author .icon-human {
    font-size: .75rem;
    margin-right: .1875rem;
    vertical-align: -.15ex
}
.book-author-vv {
    position: relative;
    float: left;
    width: 3rem;
    height: 3rem;
    margin-right: .75rem
}
.book-author-avatar {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    box-shadow: 0 0 1px rgba(0,0,0,.1)
}
.book-author-data {
    font-size: .875rem;
    position: relative;
    bottom: -.25rem;
    color: #ed424b
}
.book-author-vv .tag-honor,
.rel > .tag-honor {
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -1.25rem
}
.book-meta-r .tag-small-group {
    position: absolute;
    top: -.375rem;
    right: 0;
    white-space: nowrap
}
.book-quote {
    font-size: .875rem;
    margin-top: .875rem;
    text-indent: 1.6em
}
.book-quote .icon-quot {
    font-size: 1rem;
    position: absolute;
    margin-top: .125rem;
    color: #d8dde6
}
.book-quote > p:empty::before {
    content: '鏆傛棤鍐呭';
    color: #969ba3
}
.book-ol-rank {
    padding-left: 3.125rem;
    counter-reset: bookrank
}
.book-ol-rank .null-x {
    margin-left: -3.125rem
}
.book-ol-rank .book-li {
    position: relative
}
.book-ol-rank .book-li::before {
    font: bold 1em/1.5em 'DIN Alternate';
    position: absolute;
    top: 0;
    bottom: 0;
    left: -2.125rem;
    height: 1.5em;
    margin: auto;
    content: counter(bookrank) '.';
    counter-increment: bookrank
}
.book-ol-rank .book-li::after {
    margin-left: 0
}
.book-ol-rank .book-layout {
    margin-left: -3.125rem;
    padding-left: 3.125rem
}
.book-title-r {
    font-size: .8125rem;
    line-height: 1.5rem;
    float: right;
    margin-left: .5rem;
    color: #969ba3
}
.book-title-r:first-child {
    margin-left: .5rem
}
.book-title-r .icon-arrow-r {
    position: relative;
    right: -.125rem
}
.book-ol-rank .book-desc {
    white-space: nowrap;
    text-overflow: ellipsis
}
.book-tags {
    font-size: .8125rem;
    margin: .125rem 0;
    color: #969ba3
}
.book-tags > dot::before {
    content: '路'
}
.book-tags + .book-desc {
    margin: .125rem 0 .3125rem
}
.book-toplist {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 7.5rem
}
.book-toplist-cover {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover
}
.book-toplist + .book-ol {
    overflow: hidden;
    margin-left: 7.5rem;
    padding-left: 2.125rem
}
.book-toplist + .book-ol .book-layout {
    font-size: .875rem;
    line-height: 1.5rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    margin-left: -2.125rem;
    padding: .375rem 1rem .375rem 2.375rem;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between
}
.book-toplist + .book-ol .book-li {
    box-shadow: 0 1px #f0f1f2
}
.book-toplist + .book-ol .book-li:last-child {
    box-shadow: none
}
.book-toplist + .book-ol .book-title {
    line-height: inherit
}
.book-toplist + .book-ol .book-author {
    overflow: visible;
    margin-left: 5px
}
.book-toplist + .book-ol .book-author svg {
    font-size: .75rem
}
.book-toplist + .book-ol .book-li::before {
    left: -1.125rem
}
.book-toplist + .book-ol .book-li::after {
    display: none
}
.book-toplist-title {
    font: normal 1.75rem/1.375rem KUHEI;
    position: absolute;
    right: 0;
    bottom: 6rem;
    left: 0;
    -webkit-transform: scaleY(1.2);
    transform: scaleY(1.2);
    text-align: center;
    color: #fff
}
.book-progress {
    font-size: .875rem;
    float: left;
    overflow: hidden;
    width: 7.75rem;
    width: calc(100% - (92rem / 16));
    white-space: nowrap;
    text-overflow: ellipsis
}
.book-ol-progress .book-layout > .corner {
    margin-left: -moz-calc(-4.125rem + 0rem)
}
.book-ol-progress .book-meta {
    font-size: .875rem;
    color: #969ba3
}
.book-ol-progress .book-cover {
    width: 3.375rem;
    height: 4.5rem;
    margin-right: .75rem
}
.book-ol-progress .book-cover + .book-cell .book-meta {
    margin: .25rem 0
}
.book-li-more {
    font-size: .8125rem;
    line-height: 2.75rem;
    display: block;
    text-align: center;
    color: #969ba3
}
.book-li-more[href] {
    color: #4284ed
}
.book-ol ~ .book-li-more::before {
    display: block;
    margin-top: -1px;
    margin-left: 1rem;
    content: '';
    border-top: 1px solid #f0f1f2
}
.book-ol-time {
    position: relative
}
.book-ol-time::before {
    position: absolute;
    top: 1.5rem;
    bottom: 1rem;
    left: .5rem;
    content: '';
    border-right: 1px solid #f0f1f2
}
.book-time {
    font-size: .75rem;
    line-height: 1.5rem;
    position: relative;
    display: block;
    padding: .75rem 1rem 0;
    color: #969ba3
}
.book-time::before {
    position: absolute;
    bottom: .7rem;
    left: 6px;
    left: calc(.5rem - 2px);
    width: 5px;
    height: 5px;
    content: '';
    border-radius: 15px;
    background-color: #ed424b
}
.book-time + .book-layout {
    padding-top: .375rem
}
.book-ol-more {
    font-size: .8125rem;
    line-height: 2.75rem;
    display: block;
    text-align: center;
    color: #c0c5cc;
    border-top: 1px solid #f0f1f2
}
.book-ol-more .icon-arrow-r {
    font-size: .75rem;
    margin-left: .25rem;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}
.book-ol-more.loading .icon-arrow-r {
    visibility: hidden
}
.book-meta-comment {
    font-size: .8125rem;
    line-height: 1.5rem;
    color: #969ba3
}
.book-meta-comment .star-group {
    height: 15px;
    margin-left: .25rem;
    -webkit-transform: scale(.76923);
    transform: scale(.76923);
    -webkit-transform-origin: left center;
    transform-origin: left center;
    vertical-align: -2px
}
.book-meta-comment .book-meta-r {
    font-size: .75rem
}
.book-meta-comment a.book-meta-r {
    position: absolute;
    right: .5rem;
    margin-top: -.25rem;
    padding: .25rem .5rem
}
.book-meta-comment .book-meta-r > .icon {
    font-size: 1rem;
    margin-left: .25rem
}
.book-meta-comment::after {
    display: block;
    clear: both;
    content: ''
}
.book-comment-time {
    font-size: .75rem;
    display: block;
    clear: both;
    margin-top: -.125rem;
    -webkit-transform: scale(.83333);
    transform: scale(.83333);
    -webkit-transform-origin: left top;
    transform-origin: left top;
    color: #969ba3
}
.book-ol-comment .book-author-vv {
    width: 2.625rem;
    height: 2.625rem
}
.book-comment-p {
    font-size: .875rem;
    display: -webkit-box;
    overflow: hidden;
    max-height: 2.5625rem;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}
.book-comment-p[rows] {
    position: relative;
    display: block
}
.book-comment-p[rows='2'] {
    max-height: 2.625rem
}
.book-comment-p[rows='3'] {
    max-height: 3.9375rem
}
.book-comment-p[rows='4'] {
    max-height: 5.25rem
}
.book-comment-p[open] {
    max-height: 30em;
    -webkit-transition: max-height .25s;
    transition: max-height .25s
}
.book-comment-more {
    position: absolute;
    right: 0;
    bottom: 0;
    display: none;
    width: 2em;
    height: 1.5em;
    background: -webkit-linear-gradient(left,rgba(255,255,255,0),#fff 1rem);
    background: linear-gradient(to right,rgba(255,255,255,0),#fff 1rem)
}
.enabled > .book-comment-more {
    display: block
}
.book-comment-more .icon-arrow-r {
    float: right;
    margin-top: .3em;
    -webkit-transition: -webkit-transform .15s;
    transition: transform .15s;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    color: #969ba3
}
[open] > .book-comment-more .icon-arrow-r {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg)
}
.book-ol-comment .book-li::after {
    margin-left: 4.375rem
}
.book-ol-comment ~ .book-li-more::before {
    margin-left: 0
}
.module-slide-ol {
    position: relative;
    display: none;
    overflow-x: auto;
    overflow-y: hidden;
    min-height: 10.75rem;
    padding-left: .5rem;
    white-space: nowrap
}
.module-slide-ol::-webkit-scrollbar {
    display: none
}
.module-slide-ol:not(.WX) {
    -webkit-overflow-scrolling: touch
}
.module-slide > .active,
.module-slide-ol:only-child {
    display: block
}
.module-slide-li {
    display: inline-block;
    vertical-align: top;
    white-space: normal
}
.module-slide-li:nth-of-type(10) .corner-rank > em {
    letter-spacing: -1px
}
.module-slide-a {
    display: block;
    /*width: 4.125rem;*/
    width: 5.125rem;
    padding: .75rem .5rem .5rem
}
.module-slide-img {
    display: block;
    width: inherit;
    /*height: 5.5rem;*/
    height: 9rem;
    box-shadow: 0 1px 3px rgba(0,0,0,.3)
}
.module-slide-caption {
    font-size: .8125rem;
    line-height: 1.25;
    overflow: hidden;
    max-height: 2.125rem;
    margin: .5rem 0 .125rem
}
.module-slide-author {
    font-size: .75rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #969ba3
}
.module-merge {
    margin: 0
}
.module-merge .book-li:last-child::after {
    display: block
}
.module-field {
    overflow: hidden;
    padding: .5rem
}
.module-field-cell {
    float: left;
    box-sizing: border-box;
    width: 50%;
    padding: .5rem
}
.module-field-img {
    display: block;
    width: 100%;
    height: calc(66rem / 16);
    object-fit: cover
}
.module-field-img[data-src] {
    object-fit: contain
}
.module-toplist {
    position: relative;
    overflow: hidden
}
.module-filter-list .module-header,
.module-history .module-header {
    text-align: center
}
.module-filter-list .module-title::before,
.module-history .module-title::before {
    display: none
}
.module-footer {
    padding: 1rem;
    text-align: center
}
.module-footer-txt {
    font-size: .75rem;
    margin: .375rem 0 0;
    color: #969ba3
}
.aside .module-footer {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0
}
.aside .module-footer .btn-primary:only-child {
    margin-bottom: .75rem
}
.aside .module-header {
    position: absolute;
    top: 0;
    right: 0;
    left: 0
}
.aside .module-filter-list,
.aside .module-history {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0
}
.aside .module-main {
    position: absolute;
    top: 2.75rem;
    right: 0;
    bottom: 5.75rem;
    left: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch
}
.aside .scrollable {
    overflow: auto;
    -webkit-overflow-scrolling: touch
}
.footer {
    background-color: #fff
}
.module:not(.module-merge) + .footer {
    margin-top: -.75rem
}
.footer-backtop {
    display: table;
    width: 100%;
    text-align: center
}
.footer-backtop-circle {
    position: fixed;
    z-index: 1;
    right: 1rem;
    bottom: 1rem;
    width: 2.75rem;
    height: 2.75rem;
    -webkit-transition: opacity .25s,visibility .25s;
    transition: opacity .25s,visibility .25s;
    opacity: 0;
    color: #fff;
    border-radius: 99px;
    background-color: rgba(0,0,0,.6)
}
.footer-backtop-circle svg {
    margin: auto
}
.footer-backtop-cell {
    font-size: .875rem;
    line-height: 3.4375rem;
    display: table-cell;
    padding: 0 1rem;
    border-bottom: 1px solid #f0f1f2
}
.footer-backtop-cell + .footer-backtop-cell {
    padding-left: 0;
    text-align: right
}
.footer-backtop-cell .icon-backtop {
    margin-right: .25rem
}
.footer-backtop-a {
    position: relative;
    padding: 1rem 0
}
.footer-link {
    font-size: .875rem;
    display: flex;
    display: -webkit-box;
    display: box;
    padding: .5625rem 1.1875rem 0;
    text-align: center;
    color: #969ba3;
    justify-content: space-between;
    -webkit-box-pack: justify;
    box-pack: justify
}
.footer-link-a {
    display: block;
    padding: .5rem 0;
    -webkit-box-flex: 1;
    box-flex: 1
}
.footer-copy {
    font-size: .75rem;
    font-weight: 300;
    padding-top: .25rem;
    padding-bottom: 1rem;
    text-align: center;
    color: #969ba3
}
.footer-copy::first-letter {
    text-transform: uppercase
}
.footer-app {
    position: relative;
    display: block;
    box-sizing: border-box;
    height: 3.75rem;
    padding: .75rem 6rem 0 4rem;
    background-color: #f6f7f9
}
.footer-app .icon-app-logo {
    position: absolute;
    top: .75rem;
    left: 1rem
}
.footer-app .btn-primary-small {
    position: absolute;
    top: 0;
    right: 1rem;
    bottom: 0;
    height: 1.625rem;
    margin: auto
}
.footer-app-h {
    font-size: .875rem
}
.footer-app-p {
    font-size: .75rem;
    color: #969ba3
}
.aside {
    position: fixed;
    z-index: 3;
    visibility: hidden;
    overflow: hidden;
    -webkit-transition: visibility .25s;
    transition: visibility .25s
}
.aside.active {
    visibility: visible;
    -webkit-transition: none;
    transition: none
}
.aside.active ~ .page {
    pointer-events: none
}
.aside-overlay,
.guide-overlay {
    -webkit-transition: opacity .25s;
    transition: opacity .25s;
    opacity: 0;
    background-color: #000
}
.active > .aside-overlay,
.active > .guide-overlay {
    opacity: .6
}
.aside-content,
.aside-popup {
    position: absolute;
    right: 0;
    bottom: 0;
    -webkit-transition: -webkit-transform .15s;
    transition: transform .15s;
    background-color: #fff
}
.active > .aside-content,
.active > .aside-popup {
    -webkit-transform: translate(0,0);
    transform: translate(0,0)
}
.aside-content {
    top: 0;
    left: 2.5rem;
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
}
.aside-popup {
    position: absolute;
    left: 0;
    -webkit-transform: translateY(100%);
    transform: translateY(100%)
}
.guide {
    position: fixed;
    z-index: 3;
    top: 2.5rem;
    right: 0;
    bottom: 0;
    left: 0;
    visibility: hidden;
    overflow: hidden;
    transition: visibility .25s;
    -wekit-transition: visibility .25s
}
.active.guide {
    visibility: visible;
    transition: none;
    -wekit-transition: none
}
.guide-content {
    position: relative;
    overflow: hidden;
    padding: 0 1rem;
    -webkit-transition: -webkit-transform .15s;
    transition: transform .15s;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    background-color: #fff
}
.active > .guide-content {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}
.guide-nav {
    font-size: 0;
    text-align: justify
}
.guide-nav::after {
    display: inline-block;
    width: 100%;
    height: 0;
    content: '';
    vertical-align: top
}
.guide-nav-a {
    font-size: .75rem;
    position: relative;
    display: inline-block;
    width: 3.5rem;
    height: 3.625rem;
    text-align: center
}
.guide-nav-a > .icon {
    position: absolute;
    right: 0;
    bottom: 1.625rem;
    left: 0;
    margin: auto
}
.guide-nav-h {
    position: absolute;
    right: 0;
    bottom: .1875rem;
    left: 0
}
.guide-nav .guide-nav-a {
    margin: .75rem 1.5rem
}
@media screen and (max-width:320px) {
    .guide-nav .guide-nav-a {
        margin-right: 1rem;
        margin-left: 1rem
    }
}
@media screen and (max-height:284px) {
    .guide-nav .guide-nav-a {
        margin-top: .5rem;
        margin-right: .5rem
    }
}
.guide-footer {
    margin-top: 1rem;
    margin-bottom: 1.5rem;
    text-align: center
}
.module-filter-list .sort-li-detail {
    text-align: left
}
.module-filter-list .btn-tag {
    font-family: 'pingfang sc';
    margin-top: .5625rem
}
.module-filter-list .btn-tag.active {
    color: #fff;
    background-color: #ed424b
}
.module-filter-list .btn-tag.active::after {
    display: inline-block;
    width: .5rem;
    height: .5rem;
    margin-left: .375rem;
    content: '';
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOCIgaGVpZ2h0PSI4IiB2aWV3Qm94PSIwIDAgOCA4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxnIHN0cm9rZT0iI0ZGRiIgZmlsbD0ibm9uZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIj48cGF0aCBkPSJNNy41LjVsLTcgN00uNS41bDcgNyIvPjwvZz48L3N2Zz4K) no-repeat center;
    background-size: 100%
}
.module-filter-list .module-main {
    bottom: 3.375rem
}
.module-filter-list .module-footer {
    padding: 0
}
.center,
.icon-app-logo .icon,
.panel-container,
.radio > svg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto
}
.btn-primary,
.btn-primary-small {
    font-size: .875rem;
    line-height: 2.25rem;
    display: inline-block;
    padding-right: 1em;
    padding-right: 2ch;
    padding-left: 1em;
    padding-left: 2ch;
    text-align: center;
    color: #fff;
    border-radius: 99px;
    background-color: #ed424b
}
.btn-primary-small {
    line-height: 1.625rem
}
.btn-primary-circle {
    font-size: .75rem;
    line-height: 1.16667;
    display: inline-block;
    box-sizing: border-box;
    width: 2.75rem;
    height: 2.75rem;
    padding: .5rem;
    text-align: center;
    color: #fff;
    border-radius: 99px;
    background-color: #ed424b
}
.btn-line,
.btn-line-gray,
.btn-line-gray ~ i:empty,
.btn-tag {
    font-size: .8125rem;
    line-height: 1.6875rem;
    display: inline-block;
    padding: 0 .625rem;
    text-align: center;
    border: 1px solid;
    border-radius: 99px
}
.btn-line,
.btn-line-gray ~ i.active:empty,
.btn-line-gray.active,
.btn-tag.active {
    color: #ed424b
}
.btn-line-gray,
.btn-line-gray ~ i:empty,
.btn-tag {
    color: #969ba3
}
.btn-tag {
    line-height: 1.25rem;
    padding: 0 .625rem;
    border-color: transparent
}
.btn-tag.active {
    border-color: #ed424b
}
.btn-line-gray ~ i:empty,
.btn-line-gray ~ i:empty ~ i:empty {
    visibility: hidden;
    overflow: hidden;
    height: 0;
    vertical-align: top;
    border-width: 0 1px
}
.btn-tab {
    font-size: .8125rem;
    line-height: 1.6875rem;
    display: block;
    padding: 0 .5rem;
    text-align: center;
    color: #ed424b;
    border: 1px solid #ed424b
}
.active > .btn-tab,
.btn-tab.active {
    color: #fff;
    background-color: #ed424b
}
.btn-normal {
    font-size: .8125rem;
    line-height: 1.875rem;
    display: inline-block;
    padding: 0 1rem;
    text-align: center;
    border-radius: .125rem;
    background-color: currentColor
}
.btn-normal::first-line {
    color: #fff
}
.btn-normal.white {
    box-shadow: inset 1px 0 #e3e4e6,inset 0 1px #e3e4e6,inset 0 -1px #e3e4e6,inset -1px 0 #e3e4e6
}
.btn-normal.white::first-line {
    color: #33373d
}
.btn-normal.white.loading::before {
    color: #33373d
}
.btn-normal.loading::before {
    color: #fff
}
.btn-blank {
    line-height: 2.5rem;
    display: block;
    text-align: center
}
.btn-reset,
.btn-submit {
    line-height: 2.75rem;
    display: block
}
.btn-reset {
    color: #33373d;
    background-color: #f6f7f9
}
.btn-submit {
    color: #fff;
    background-color: #ed424b
}
.btn-group {
    display: table;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    table-layout: fixed
}
.btn-group-cell {
    font-size: 100%;
    font-weight: 400;
    display: table-cell
}
.btn-group .btn-line {
    display: block;
    margin: 0 .5625rem
}
.btn-group-cell:first-child > .btn-line {
    margin-left: 0
}
.btn-group-cell:last-child > .btn-line {
    margin-right: 0
}
.btn-group-cell + .btn-group-cell > .btn-tab {
    border-left: 0
}
.btn-group-cell:first-child > .btn-tab {
    border-radius: 4px 0 0 4px
}
.btn-group-cell:last-child > .btn-tab {
    border-radius: 0 4px 4px 0
}
.btn-group-small {
    width: auto
}
.btn-group-small .btn-tab {
    line-height: 1.5rem;
    padding: 0 .75rem
}
.btn-group-cell > .btn-normal {
    display: block;
    width: calc(100% - .6667rem);
    margin-left: .3333rem;
    padding: 0
}
.btn-group-cell:first-child > .btn-normal {
    margin-left: 0
}
.btn-group-cell:last-child > .btn-normal {
    margin-left: .6667rem
}
.btn-group-tab {
    position: relative;
    background-color: #fff
}
.btn-group-tab .btn-blank {
    font-size: .875rem;
    line-height: 2.75rem;
    -webkit-transition: color .15s;
    transition: color .15s;
    color: #969ba3;
    border-bottom: 1px solid #e3e4e6;
    -webkit-tap-highlight-color: transparent
}
.btn-group-tab .btn-blank:active {
    background-image: none
}
.btn-group-tab > line {
    position: absolute;
    bottom: 0;
    display: table-caption;
    -webkit-transition: all .15s;
    transition: all .15s;
    border-top: 1px solid #ed424b
}
line ~ .btn-group .active {
    border-bottom-color: #e3e4e6
}
.btn-group-tab .active {
    color: #ed424b;
    border-bottom-color: #ed424b
}
a[class*=btn-].loading,
label[class*=btn-].loading {
    position: relative
}
a[class*=btn-].loading::first-line,
label[class*=btn-].loading::first-line {
    color: transparent
}
a[class*=btn-].loading::before,
label[class*=btn-].loading::before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 4px;
    height: 4px;
    margin: auto;
    content: '';
    -webkit-animation: spinZoom 1s steps(8) infinite;
    animation: spinZoom 1s steps(8) infinite;
    border-radius: 100%;
    box-shadow: 0 -10px 0 1px currentColor,10px 0 currentColor,0 10px currentColor,-10px 0 currentColor,-7px -7px 0 .5px currentColor,7px -7px 0 1.5px currentColor,7px 7px currentColor,-7px 7px currentColor
}
.tag-small,
.tag-solid {
    font-size: 1.25rem;
    line-height: 1.5;
    display: inline-block;
    margin: 0 .15em;
    padding: 0 .25em;
    -webkit-transform: scale(1);
    transform: scale(1);
    vertical-align: bottom
}
.tag-small:empty,
.tag-solid:empty {
    display: none
}
.tag-small::before,
.tag-solid::before {
    position: absolute;
    z-index: -1;
    top: -1px;
    right: 0;
    bottom: 1px;
    left: 0;
    content: '';
    opacity: .5;
    border: 1px solid;
    border-radius: .11111em
}
.tag-small-group > .tag-small:first-child,
.tag-small-group > .tag-solid:first-child {
    margin-left: 0
}
.tag-small-group > .tag-small:last-child,
.tag-small-group > .tag-solid:last-child {
    margin-right: 0
}
.tag-solid {
    position: absolute;
    margin-top: -3px;
    margin-top: calc((1.5rem - 1.5em) * .5);
    -webkit-transform-origin: left center;
    transform-origin: left center;
    border-radius: 2px;
    background-color: currentColor
}
.tag-solid::before {
    border-color: transparent
}
.tag-solid::first-line {
    color: #fff
}
.tag-small-group .tag-solid {
    position: static;
    margin-top: -6px;
    margin-top: calc((1.5rem - 1.5em));
    margin-left: .25rem
}
.tag-small-group,
:not(.tag-small-group) > .tag-small,
:not(.tag-small-group) > .tag-solid {
    -webkit-transform: scale(.5);
    transform: scale(.5)
}
.origin-right,
.origin-right .tag-small,
.origin-right .tag-solid {
    -webkit-transform-origin: right center;
    transform-origin: right center
}
.origin-left,
.origin-left .tag-small,
.origin-left .tag-solid {
    -webkit-transform-origin: left center;
    transform-origin: left center
}
.tag-small-group {
    display: inline-block
}
.tag-honor {
    font-family: youyuan,'pingfang sc';
    font-size: .75rem;
    line-height: 14px;
    line-height: calc(1rem - 2px);
    display: inline-block;
    box-sizing: border-box;
    min-width: 2.5rem;
    height: 1rem;
    text-align: center;
    white-space: nowrap;
    border: 1px solid #fff;
    border-radius: 40px;
    background-color: currentColor;
    background-image: -webkit-linear-gradient(top,rgba(255,255,255,.2),rgba(255,255,255,.2) 50%,rgba(255,255,255,0) 50%);
    background-image: linear-gradient(to bottom,rgba(255,255,255,.2),rgba(255,255,255,.2) 50%,rgba(255,255,255,0) 50%)
}
.tag-honor::first-line {
    color: #fff
}
.tag-line {
    font-size: .75rem;
    line-height: 1.125rem;
    display: inline-block;
    padding: 0 .5rem;
    padding: 0 calc(.5rem - 1px);
    border: 1px solid;
    border-radius: 1rem;
    background-color: #fff
}
.tag-hot {
    font-size: 10px;
    font-weight: 300;
    line-height: 16px;
    position: absolute;
    z-index: 1;
    right: 0;
    height: 16px;
    padding: 0 .5rem 0 3px;
    color: #fff;
    background-color: #ed424b
}
.tag-hot::before {
    position: absolute;
    top: 0;
    left: -12px;
    content: '';
    border-width: 8px 6px;
    border-style: solid;
    border-color: #ed424b #ed424b transparent transparent
}
.star-group,
.star-score {
    background: 0 center repeat-x;
    background-size: 18px 13px
}
.star-group {
    display: inline-block;
    overflow: hidden;
    width: 86px;
    height: 13px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTMiIHZpZXdCb3g9IjAgMCAxOCAxMyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOC44ODEgMy4yMjZjLjIyLjQzNi42NDguNzM4IDEuMTQxLjgwOGwzLjMyMi40N2EuNTI4LjUyOCAwIDAgMSAuMzAzLjkwNmwtMi40MDQgMi4yOGMtLjM1Ny4zNC0uNTIuODI4LS40MzYgMS4zMDdsLjU2NyAzLjIyYy4wNzcuNDM1LS4zOTEuNzY2LS43OTIuNTYxbC0yLjk3LTEuNTJhMS41NTMgMS41NTMgMCAwIDAtMS40MTIgMGwtMi45NyAxLjUyYy0uNC4yMDUtLjg2OS0uMTI2LS43OTItLjU2bC41NjctMy4yMkExLjQ1MiAxLjQ1MiAwIDAgMCAyLjU3IDcuNjlMLjE2NSA1LjQxYS41MjguNTI4IDAgMCAxIC4zMDMtLjkwNmwzLjMyMS0uNDdjLjQ5NC0uMDcuOTIxLS4zNzIgMS4xNDItLjgwOEw2LjQxNy4yOTZhLjU1My41NTMgMCAwIDEgLjk3OCAwbDEuNDg2IDIuOTN6IiBmaWxsPSJyZ2JhKDAsMCwwLC4yKSIvPjwvc3ZnPg==)
}
.star-score {
    font-size: 12px;
    display: block;
    height: inherit;
    color: transparent;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTMiIHZpZXdCb3g9IjAgMCAxOCAxMyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOC44ODEgMy4yMjZjLjIyLjQzNi42NDguNzM4IDEuMTQxLjgwOGwzLjMyMi40N2EuNTI4LjUyOCAwIDAgMSAuMzAzLjkwNmwtMi40MDQgMi4yOGMtLjM1Ny4zNC0uNTIuODI4LS40MzYgMS4zMDdsLjU2NyAzLjIyYy4wNzcuNDM1LS4zOTEuNzY2LS43OTIuNTYxbC0yLjk3LTEuNTJhMS41NTMgMS41NTMgMCAwIDAtMS40MTIgMGwtMi45NyAxLjUyYy0uNC4yMDUtLjg2OS0uMTI2LS43OTItLjU2bC41NjctMy4yMkExLjQ1MiAxLjQ1MiAwIDAgMCAyLjU3IDcuNjlMLjE2NSA1LjQxYS41MjguNTI4IDAgMCAxIC4zMDMtLjkwNmwzLjMyMS0uNDdjLjQ5NC0uMDcuOTIxLS4zNzIgMS4xNDItLjgwOEw2LjQxNy4yOTZhLjU1My41NTMgMCAwIDEgLjk3OCAwbDEuNDg2IDIuOTN6IiBmaWxsPSIjRjBDNTNBIi8+PC9zdmc+)
}
.star-score[data-score='0'],
.star-score[data-score='0.0'] {
    width: 0
}
.star-score[data-score='.5'],
.star-score[data-score='0.5'] {
    width: 7px
}
.star-score[data-score='1'],
.star-score[data-score='1.0'] {
    width: 14px
}
.star-score[data-score='1.5'] {
    width: 25px
}
.star-score[data-score='2'],
.star-score[data-score='2.0'] {
    width: 32px
}
.star-score[data-score='2.5'] {
    width: 43px
}
.star-score[data-score='3'],
.star-score[data-score='3.0'] {
    width: 50px
}
.star-score[data-score='3.5'] {
    width: 61px
}
.star-score[data-score='4'],
.star-score[data-score='4.0'] {
    width: 68px
}
.star-score[data-score='4.5'] {
    width: 79px
}
.corner,
.corner-rank {
    font-size: 10px;
    position: absolute;
    overflow: hidden;
    width: 30px;
    height: 30px;
    text-align: center
}
.corner > em,
.corner-rank > em {
    font-size: 10px;
    line-height: 11px;
    position: absolute;
    right: -12px;
    bottom: 0;
    left: 0;
    padding-top: 1px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    color: inherit;
    background-color: currentColor
}
.corner > em::first-line,
.corner-rank > em::first-line {
    color: #fff
}
.corner-rank > em {
    font-size: 9px;
    font-weight: 700;
    line-height: 10px;
    padding-top: 14px;
    text-transform: uppercase;
    font-familly: 'DIN Alternate'
}
.corner-rank::after {
    position: absolute;
    top: 0;
    left: 0;
    width: 10px;
    height: 9px;
    content: '';
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEwIDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGc+PHBhdGggZD0iTTIuMDcgMi40ODdjLS4wMzktLjI3LjE2LS40NTQuNDE3LS40MTdMNS41IDIuNSA1Ljg3OS45ODRjLjA2Ny0uMjY3LjI3OC0uMzI3LjQ3LS4xMzZMOCAyLjUgMi41IDggLjg0OCA2LjM0OGMtLjE5Mi0uMTkyLS4xMzQtLjQwMi4xMzYtLjQ2OUwyLjUgNS41bC0uNDMtMy4wMTN6IiBmaWxsPSIjRkZGIi8+PHBhdGggZD0iTTMuNSA5TDkgMy41IiBzdHJva2U9IiNGRkYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPjwvZz48L3N2Zz4K) no-repeat center;
    background-size: 100%
}
.select-a {
    font-size: .8125rem;
    display: inline-block;
    color: #4284ed
}
.select-ul {
    display: inline-block
}
.select-ul + .icon {
    margin-left: .25rem
}
.select-tri {
    display: inline-block;
    margin-left: .25ch;
    border: 4px solid transparent;
    border-top-color: currentColor
}
.select-select {
    max-height: 90vh;
    max-height: calc(100vh - 5.5rem)
}
.select-option {
    display: none
}
.select-option.selected {
    display: block
}
.aside-popup .select-option {
    font-size: .875rem;
    line-height: 2.75rem;
    position: relative;
    display: block;
    padding-left: 1rem
}
.aside-popup .select-option + .select-option::before {
    display: block;
    content: '';
    border-top: 1px solid #f0f1f2
}
.aside-popup .select-option.selected::after {
    position: absolute;
    top: 0;
    right: 1rem;
    bottom: 0;
    width: 15px;
    height: 10px;
    margin: auto;
    content: '';
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTAiIHZpZXdCb3g9IjAgMCAxNSAxMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNNC45NyA5LjUzYS43NS43NSAwIDAgMCAxLjA2IDBsOC04QS43NS43NSAwIDAgMCAxMi45Ny40N2wtOCA4aDEuMDZsLTQuNS00LjVBLjc1Ljc1IDAgMSAwIC40NyA1LjAzbDQuNSA0LjV6IiBmaWxsPSIjRUU0MjRCIi8+PC9zdmc+Cg==) no-repeat center
}
.panel-container {
    position: fixed;
    z-index: 49;
    -webkit-animation: fadein .25s both;
    animation: fadein .25s both;
    text-align: center;
    opacity: 0;
    background-color: rgba(0,0,0,.6)
}
.panel-container::after {
    display: inline-block;
    height: 100%;
    content: '';
    vertical-align: middle
}
.panel-dialog {
    position: static;
    display: inline-block;
    width: 17.5rem;
    height: auto;
    padding: 0;
    vertical-align: middle;
    color: #33373d;
    border: 0;
    border-radius: .5rem;
    background-color: #fff
}
.panel-main {
    padding: 1.75rem 1rem
}
.panel-main > h6 {
    font-weight: 700
}
.panel-main > h6 + p {
    margin-top: .25rem
}
.panel-main output {
    marin: 0 .5ch
}
.panel-footer::before {
    display: table-caption;
    margin: 0 1rem;
    content: '';
    border-top: 1px solid #f0f1f2
}
.panel-footer:empty {
    display: none
}
.panel-footer {
    display: table;
    width: 100%;
    table-layout: fixed
}
.panel-footer .btn-blank {
    line-height: 2.75rem;
    display: table-cell
}
body > .tips {
    line-height: 1.25rem;
    position: fixed;
    z-index: 29;
    top: 50%;
    left: 50%;
    max-width: 90%;
    max-width: calc(100% - 2rem);
    padding: .75rem 1rem;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    white-space: nowrap;
    color: #fff;
    border-radius: 3rem;
    background-color: rgba(0,0,0,.8)
}
.tips.fadein {
    -webkit-animation: fadein .15s;
    animation: fadein .15s
}
.tips.fadeout {
    -webkit-animation: fadeout .15s;
    animation: fadeout .35s
}
.loading-x {
    position: relative;
    min-height: 1.5rem
}
body > .loading-x {
    position: fixed;
    z-index: 99;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}
.loading-icon {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 1.5rem;
    height: 1.5rem;
    margin: auto;
    padding: .75rem;
    border-radius: .5rem;
    background-color: rgba(0,0,0,.8)
}
span.loading-icon {
    font-size: .75rem;
    width: auto;
    text-align: center;
    color: #969ba3;
    background: 0 0
}
.loading-icon > svg {
    width: inherit;
    height: inherit
}
.loading-svg-animate {
    position: absolute;
    z-index: 1
}
.loading-icon path {
    stroke-linecap: round;
    stroke-width: 2px;
    fill: none
}
.loading-svg {
    -webkit-animation: fadeout 2s infinite both;
    animation: fadeout 2s infinite both;
    stroke-dasharray: 0;
    stroke-dashoffset: 0;
    stroke: #474747
}
.loading-svg-animate path {
    -webkit-animation: dash 2s infinite,fadein .25s both;
    animation: dash 2s infinite,fadein .25s both;
    stroke-dasharray: 160;
    stroke-dashoffset: 166;
    stroke: #fff
}
.loading-svg-animate .path3 {
    -webkit-animation: dash2 2s infinite,fadein .25s both;
    animation: dash2 2s infinite,fadein .25s both
}
.loading-svg circle {
    fill: #474747
}
.loading-svg-animate circle {
    -webkit-animation: fill 2s infinite;
    animation: fill 2s infinite;
    opacity: 1;
    fill: #fff
}
@-webkit-keyframes dash {
    to {
        stroke-dashoffset: 0
    }
}
@keyframes dash {
    to {
        stroke-dashoffset: 0
    }
}
@-webkit-keyframes dash2 {
    100%,
    56% {
        stroke-dashoffset: 0
    }
}
@keyframes dash2 {
    100%,
    56% {
        stroke-dashoffset: 0
    }
}
@-webkit-keyframes fill {
    0%,
    25% {
        opacity: 0
    }
    100%,
    30% {
        opacity: 1
    }
}
@keyframes fill {
    0%,
    20% {
        opacity: 0
    }
    100%,
    30% {
        opacity: 1
    }
}
dot {
    line-height: 1;
    display: inline-block;
    overflow: hidden;
    height: 1em;
    text-align: left;
    vertical-align: -.25em
}
dot::before {
    display: block;
    content: '...\A..\A.';
    -webkit-animation: dot 3s infinite step-start both;
    animation: dot 3s infinite step-start both;
    white-space: pre
}
@-webkit-keyframes dot {
    33% {
        transform: translateY(-2em)
    }
    66% {
        transform: translateY(-1em)
    }
}
@keyframes dot {
    33% {
        transform: translateY(-2em)
    }
    66% {
        transform: translateY(-1em)
    }
}
.dot {
    font-size: 0;
    position: absolute;
    overflow: hidden;
    width: 4px;
    height: 4px;
    margin-top: 8px;
    margin-left: -8px;
    border-radius: 15px;
    background-color: currentColor
}
.radio {
    font-size: 1rem;
    position: absolute;
    box-sizing: border-box;
    width: 2rem;
    height: 2rem;
    -webkit-transition: background-color .15s,border-color .15s;
    transition: background-color .15s,border-color .15s;
    -webkit-transform: scale(.5);
    transform: scale(.5);
    color: #fff;
    border: 1px solid #c0c5cc;
    border-radius: 2rem;
    background-color: #fff
}
.checked + .radio,
.checked > .radio,
:checked + .radio {
    border-color: transparent;
    background-color: #ed424b
}
.radio-full {
    position: relative;
    display: block
}
.radio-full > input {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0
}
.switch {
    position: absolute;
    width: 1.75rem;
    height: .625rem;
    padding: .1875rem;
    -webkit-transition: background-color .15s;
    transition: background-color .15s;
    border-radius: 3rem;
    background-color: #d8d8d8;
    background-clip: content-box
}
.switch::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 1rem;
    height: 1rem;
    content: '';
    -webkit-transition: -webkit-transform .15s;
    transition: transform .15s;
    border-radius: 2rem;
    background-color: #fff
}
:checked ~ .switch {
    border-color: #ed424b;
    background-color: #ed424b
}
:checked ~ .switch::before {
    -webkit-transform: translateX(1.25rem);
    transform: translateX(1.25rem)
}
:disabled ~ .switch {
    opacity: .5
}
.switch-light {
    box-sizing: border-box;
    width: 2.875rem;
    height: 1.5rem;
    padding: 0;
    border: 1px solid #c0c5cc;
    background-color: #f6f7f9
}
.switch-light::before {
    top: -1px;
    left: -1px;
    width: 1.375rem;
    height: 1.375rem;
    border: 1px solid #c0c5cc
}
:checked ~ .switch-light::before {
    -webkit-transform: translateX(1.375rem);
    transform: translateX(1.375rem)
}
.range {
    position: absolute;
    display: inline;
    height: 14px
}
.range-track {
    height: 2px;
    margin-top: 6px;
    text-align: left;
    border-left: 0 solid #ed424b;
    border-radius: 10px;
    background-color: rgba(255,255,255,.2)
}
.range-thumb {
    position: absolute;
    width: 12px;
    height: 12px;
    margin: -11px 0 0 -12px;
    -webkit-transition: border-color .15s,background-color .15s;
    transition: border-color .15s,background-color .15s;
    border: 6px solid transparent;
    border-radius: 20px;
    background-color: #ed424b;
    background-clip: content-box
}
.range-thumb::after,
.range-thumb::before {
    position: absolute;
    left: 50%;
    display: none;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}
.range-thumb::before {
    font-size: 14px;
    line-height: 20px;
    bottom: 26px;
    min-width: 20px;
    padding: 1px 5px 0;
    content: attr(data-tips);
    text-align: center;
    color: #fff;
    border-radius: 3px;
    background-color: rgba(0,0,0,.9)
}
.range-thumb::after {
    bottom: 17px;
    content: '';
    opacity: .9;
    border: 5px solid transparent;
    border-top-color: #000
}
.range-thumb.active {
    background-color: #fff
}
.range-shadow {
    position: absolute;
    display: none;
    width: 12px;
    height: 12px;
    margin-top: 1px;
    margin-left: -6px;
    opacity: .6;
    border-radius: 20px;
    background-color: #ed424b
}
.range-shadow[data-value] {
    display: block
}
.icon-app-logo {
    font-size: 1.5rem;
    position: relative;
    display: inline-block;
    width: 2.25rem;
    height: 2.25rem;
    color: #fff;
    border-radius: .375rem;
    background-color: #d23e3b
}
.icon-nice-comment {
    font-size: 0;
    position: absolute;
    width: 1.75rem;
    height: 1.75rem;
    margin: -.125rem 0 0 -2.5rem;
    color: transparent;
    background: url(/qdm/img/icon-nice-comment.c3c90.png) no-repeat center;
    background-size: 100%
}
[data-size] {
    box-sizing: border-box
}
[data-size=''] {
    display: block
}
[data-size='1'] {
    width: 1.25rem
}
[data-size='2'] {
    width: 2.5rem
}
[data-size='3'] {
    width: 3.75rem
}
[data-size='4'] {
    width: 5rem
}
[data-size='5'] {
    width: 6.25rem
}
[data-size='6'] {
    width: 7.5rem
}
[data-size='7'] {
    width: 8.75rem
}
[data-size='8'] {
    width: 10rem
}
[data-size='9'] {
    width: 11.25rem
}
[data-size='10'] {
    width: 12.5rem
}
[data-size='11'] {
    width: 13.75rem
}
[data-size='12'] {
    width: 15rem
}
[data-size='13'] {
    width: 16.25rem
}
[data-size='14'] {
    width: 17.5rem
}
.dark {
    color: #33373d
}
.gray {
    color: #969ba3
}
.blue {
    color: #4284ed
}
.green {
    color: #7ed321
}
.orange {
    color: #f0643a
}
.yellow {
    color: #f0c53a
}
.purple {
    color: #a091ff
}
.red {
    color: #ed424b
}
.white {
    color: #fff
}
@-webkit-keyframes fadein {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}
@keyframes fadein {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}
@-webkit-keyframes fadeout {
    from {
        opacity: 1
    }
    to {
        opacity: 0
    }
}
@keyframes fadeout {
    from {
        opacity: 1
    }
    to {
        opacity: 0
    }
}
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(360deg)
    }
}
@keyframes spin {
    0% {
        transform: rotate(0)
    }
    100% {
        transform: rotate(360deg)
    }
}
@-webkit-keyframes spinZoom {
    0% {
        -webkit-transform: scale(.75) rotate(0)
    }
    100% {
        -webkit-transform: scale(.75) rotate(360deg)
    }
}
@keyframes spinZoom {
    0% {
        transform: scale(.75) rotate(0)
    }
    100% {
        transform: scale(.75) rotate(360deg)
    }
}
.search-popup {
    position: fixed;
    z-index: 20;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #fff
}
.search-area {
    position: absolute;
    top: 0;
    right: 3.75rem;
    bottom: 0;
    left: 1rem;
    height: 2rem;
    margin: auto;
    border-radius: .25rem;
    background-color: #f6f7f9
}
.search-area .icon-search {
    position: absolute;
    top: 0;
    bottom: 0;
    left: .5rem;
    margin: auto;
    color: #969ba3
}
.search-cancel {
    font-size: .875rem;
    line-height: 2rem;
    position: absolute;
    top: 0;
    right: .25rem;
    bottom: 0;
    width: 3.25rem;
    height: 2rem;
    margin: auto;
    text-align: center;
    background-color: #fff
}
.search-input {
    font-size: .875rem;
    width: 100%;
    height: inherit;
    padding: 0 2rem;
    border: 0 none;
    background: 0 0
}
.search-input::-webkit-search-cancel-button {
    -webkit-appearance: none
}
.search-reset {
    position: absolute;
    top: 0;
    right: 0;
    width: 2rem;
    height: inherit;
    padding: 0;
    -webkit-animation: fadein .15s;
    animation: fadein .15s;
    border: 0 none;
    background: 0 0
}
.search-reset .icon-clear {
    display: inline-block;
    width: .875rem;
    height: .875rem;
    vertical-align: -.125rem;
    color: #fff;
    border-radius: 1rem;
    background-color: #969ba3
}
.search-reset .icon-clear > svg {
    display: block;
    width: .375rem;
    height: .375rem;
    margin: .25rem auto 0
}
.search-popular {
    overflow: hidden;
    height: 0
}
.search-title-bar {
    line-height: 1.8125rem;
    overflow: hidden;
    padding: .9375rem 1rem 0;
    background-color: rgba(0,0,0,.03)
}
.search-title-bar + .module {
    margin-top: 0
}
.search-title {
    font-size: 13px;
    font-weight: 400;
    float: left;
    color: #969ba3
}
.search-title > output {
    margin: 0 .5ch
}
.search-operate {
    font-size: 13px;
    float: right
}
.search-operate-a {
    display: inline-block;
    margin: 0 -.5rem;
    padding: 0 .5rem
}
.search-operate-a > .icon {
    margin-right: .1875rem
}
.search-tags {
    padding: .25rem .5rem .75rem 1rem
}
.search-tags .btn-line-gray,
.search-tags .btn-line-gray ~ i:empty {
    margin: .5rem .5rem 0 0
}
.search-list-ul {
    padding-left: 1rem
}
.search-list-li {
    box-sizing: border-box;
    height: 3rem;
    border-bottom: 1px solid #f0f1f2
}
.search-list-a {
    line-height: 22.4px;
    line-height: 1.4rem;
    display: block;
    margin-left: -1rem;
    padding: .8rem 1rem 11px;
    padding: .8rem 1rem calc(.8rem - 1px)
}
.search-list-a::after {
    display: table;
    clear: both;
    content: ''
}
.search-list-l {
    float: left
}
.search-list-l .icon {
    margin-right: 1rem;
    color: #969ba3
}
.search-list-r {
    float: right
}
.search-value {
    font-size: .875rem;
    margin-right: .1875rem
}
.search-label {
    font-size: .8125rem;
    color: #969ba3
}
.search-filter {
    height: 3rem
}
.search-catalog {
    position: relative;
    overflow: hidden
}
.search-catalog .book-desc {
    margin-right: 5rem
}
.search-catalog .icon-catalog-img {
    position: absolute;
    right: 0;
    bottom: -.5rem;
    opacity: .05
}
[hidden] {
    display: none
}
.icon > svg,
svg.icon {
    width: 1em;
    height: 1em;
    vertical-align: -.25ex;
    fill: currentColor
}
.clip,
aria {
    position: absolute;
    clip: rect(0 0 0 0)
}
aria {
    font-size: 0
}
.ell {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}
.cell {
    display: table-cell;
    width: 1920px;
    width: 101vw
}
.null-x {
    position: relative;
    height: 400px;
    height: 100vw
}
small.null-x {
    display: block;
    height: 200px
}
.pull-left {
    float: left
}
.pull-right {
    float: right
}
.null {
    font-size: .8125rem;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    max-width: 50%;
    height: 4.875rem;
    margin: auto;
    text-align: center;
    color: #969ba3
}
.null::before {
    display: block;
    width: 2.25rem;
    height: 3rem;
    margin: 0 auto .75rem;
    content: '';
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCAzNiA0OCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+R3JvdXAgMzM8L3RpdGxlPjxnIHN0cm9rZT0iI0MwQzVDQyIgc3Ryb2tlLXdpZHRoPSIyIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0yIDQ3Yy0uNTUzIDAtMS0uNDU1LTEtMS4wMDRWMi4wMDRDMSAxLjQ0OSAxLjQ0NyAxIDIgMWgyM2wxMCAxMHYzNWMwIC41NTItLjQ1NSAxLTEgMUgyeiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTI1IDF2OS4wMDVjMCAuNTUuNDU2Ljk5NS45OTUuOTk1SDM1Ii8+PHBhdGggZD0iTTcgMThoMTJNNyAyNmgyMk03IDM0aDIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz48L2c+PC9zdmc+) no-repeat center;
    background-size: 100% 100%
}
.unlogin-full {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    margin-top: -3rem;
    text-align: center
}
.unlogin-full > .gray {
    font-size: .875rem;
    margin-top: .75rem
}
.unlogin-follow {
    font-size: .8125rem;
    line-height: 2.75rem;
    text-align: center
}
.char-dot,
.char-pipe {
    font-family: Georgia,Helvetica,Arial;
    padding: 0 .5ch
}
img[data-src] {
    background-color: #f6f7f9;
    object-fit: contain
}
