@font-face {
    font-family: iconfont;
    src: url(//qidian.gtimg.com/lbf/1.0.3/ui/theme/default/lbfUI/fonts/iconfont.eot);
    src: url(//qidian.gtimg.com/lbf/1.0.3/ui/theme/default/lbfUI/fonts/iconfont.eot?#iefix) format('embedded-opentype'), url(//qidian.gtimg.com/lbf/1.0.3/ui/theme/default/lbfUI/fonts/iconfont.woff) format('woff'), url(//qidian.gtimg.com/lbf/1.0.3/ui/theme/default/lbfUI/fonts/iconfont.ttf) format('truetype'), url(//qidian.gtimg.com/lbf/1.0.3/ui/theme/default/lbfUI/fonts/iconfont.svg#iconfont) format('svg')
}

.lbf-icon {
    font-family: iconfont !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: .2px;
    -moz-osx-font-smoothing: grayscale
}

.lbf-icon-down:before {
    content: '\e704'
}

.lbf-icon-close:before {
    content: '\e6c3'
}

.lbf-icon-add:before {
    content: '\e6bf'
}

.lbf-icon-move:before {
    content: '\e6c6'
}

.lbf-icon-radioboxfill:before {
    content: '\e6c9'
}

.lbf-icon-radiobox:before {
    content: '\e6ca'
}

.lbf-icon-roundcheckfill:before {
    content: '\e6cb'
}

.lbf-icon-roundcheck:before {
    content: '\e6cc'
}

.lbf-icon-round:before {
    content: '\e6cd'
}

.lbf-icon-squarecheckfill:before {
    content: '\e6d0'
}

.lbf-icon-square:before {
    content: '\e6d2'
}

.lbf-icon-squarecheck:before {
    content: '\e6d1'
}

 
@font-face {
    font-family: qd_iconfont;
    src: url(../fonts/qd_iconfont.51f86.eot);
    src: url(../fonts/qd_iconfont.51f86.eot?#iefix) format('embedded-opentype'),
    url(../fonts/qd_iconfont.f9a3f.woff) format('woff'),
    url(../fonts/qd_iconfont.0a60d.ttf) format('truetype'),
    url(../fonts/qd_iconfont.8a95f.svg#iconfont) format('svg')
}

@font-face {
    font-family: FZZCYSK;
    font-weight: 400;
    font-style: normal;
    src: url(../fonts/FZZCYSK.dcf78.eot);
    src: url(../fonts/FZZCYSK.dcf78.eot?#iefix) format('embedded-opentype'),
    url(../fonts/FZZCYSK.e0f31.woff) format('woff'),
    url(../fonts/FZZCYSK.88409.ttf) format('truetype'),
    url(../fonts/FZZCYSK.8c2c4.svg#FZZCYSK) format('svg')
}

.lang {
    font-family: FZZCYSK;
    font-weight: 400
}

.iconfont {
    font-family: qd_iconfont !important;
    font-size: 14px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: .1px;
    -moz-osx-font-smoothing: grayscale
}

.icon-dushi:before {
    content: '\e600'
}

.icon-jingji:before {
    content: '\e601'
}

.icon-junshi:before {
    content: '\e602'
}

.icon-kehuan:before {
    content: '\e603'
}

.icon-kehuduan:before {
    content: '\e604'
}

.icon-lingyi:before {
    content: '\e606'
}

.icon-nvshengwang:before {
    content: '\e607'
}

.icon-pinglun:before {
    content: '\e608'
}

.icon-qihuan:before {
    content: '\e609'
}

.icon-shijian:before {
    content: '\e60a'
}

.icon-shouyou:before {
    content: '\e60b'
}

.icon-shujia:before {
    content: '\e60c'
}

.icon-sousuo:before {
    content: '\e60d'
}

.icon-tongzhi:before {
    content: '\e62a'
}

.icon-wuxia:before {
    content: '\e60f'
}

.icon-xianxia:before {
    content: '\e610'
}

.icon-xuanhuan:before {
    content: '\e611'
}

.icon-youxi:before {
    content: '\e612'
}

.icon-youxi1:before {
    content: '\e613'
}

.icon-zhichang:before {
    content: '\e614'
}

.icon-erciyuan:before {
    content: '\e617'
}

.icon-lishi:before {
    content: '\e616'
}

.icon-tuliebiao:before {
    content: '\e618'
}

.icon-tuwen:before {
    content: '\e62b'
}

.icon-wenziliebiao:before {
    content: '\e61a'
}

.icon-shangyinhao:before {
    content: '\e61b'
}

.icon-xiayinhao:before {
    content: '\e61c'
}

.icon-chenggong:before {
    content: '\e61d'
}

.icon-cuowu:before {
    content: '\e61e'
}

.icon-guanbi:before {
    content: '\e61f'
}

.icon-youjiantou:before {
    content: '\e621'
}

.icon-zuojiantou:before {
    content: '\e628'
}

.icon-shangjiantou:before {
    content: '\e622'
}

.icon-xiajiantou:before {
    content: '\e623'
}

.icon-jiangxu:before {
    content: '\e625'
}

.icon-shengxu:before {
    content: '\e626'
}

.icon-weipaixu:before {
    content: '\e627'
}

.icon-yiwen:before {
    content: '\e620'
}

.icon-gift:before {
    content: '\e629'
}

.icon-dushi1:before {
    content: '\e62c'
}

.icon-lishi2:before {
    content: '\e62d'
}

.icon-lingyi1:before {
    content: '\e62e'
}

.icon-qihuan1:before {
    content: '\e62f'
}

.icon-shouyou1:before {
    content: '\e630'
}

.icon-tiyu:before {
    content: '\e631'
}

.icon-wuxia1:before {
    content: '\e632'
}

.icon-youxi3:before {
    content: '\e634'
}

.icon-dashang:before {
    content: '\e635'
}

.icon-dingyue:before {
    content: '\e636'
}

.icon-gaibiandianying:before {
    content: '\e637'
}

.icon-gaibiandongman:before {
    content: '\e638'
}

.icon-gaibianyingshi:before {
    content: '\e639'
}

.icon-gaibianyouxi:before {
    content: '\e63a'
}

.icon-shoujiyuedu:before {
    content: '\e63b'
}

.icon-suo:before {
    content: '\e63c'
}

.icon-taolun:before {
    content: '\e63d'
}

.icon-tuijianpiao:before {
    content: '\e63e'
}

.icon-yuepiao:before {
    content: '\e63f'
}

.icon-zan:before {
    content: '\e640'
}

.icon-lingyi2:before {
    content: '\e641'
}

.icon-xuanhuan1:before {
    content: '\e642'
}

.icon-add:before {
    content: '\e643'
}

.icon-xiazai:before {
    content: '\e644'
}

.icon-anquan:before {
    content: '\e646'
}

.icon-bianjipinglun:before {
    content: '\e64d'
}

.icon-danyefan:before {
    content: '\e64e'
}

.icon-shangxiafanye:before {
    content: '\e65a'
}

.icon-zishu:before {
    content: '\e64f'
}

.icon-zuozhe:before {
    content: '\e650'
}

.icon-fanhuidingbu:before {
    content: '\e651'
}

.icon-fanhuishuye:before {
    content: '\e652'
}

.icon-gengxinshijian:before {
    content: '\e653'
}

.icon-jiarushuji:before {
    content: '\e654'
}

.icon-jianxiaokuandu:before {
    content: '\e655'
}

.icon-jianxiaozihao:before {
    content: '\e656'
}

.icon-zengdakuandu:before {
    content: '\e65f'
}

.icon-zengdazihao:before {
    content: '\e660'
}

.icon-jinggao:before {
    content: '\e657'
}

.icon-pinglun1:before {
    content: '\e658'
}

.icon-shanchu:before {
    content: '\e659'
}

.icon-shezhi:before {
    content: '\e65b'
}

.icon-shouji:before {
    content: '\e65c'
}

.icon-toupiao:before {
    content: '\e65d'
}

.icon-youxi2:before {
    content: '\e65e'
}

.icon-baidu:before {
    content: '\e649'
}

.icon-xinlang:before {
    content: '\e645'
}

.icon-android:before {
    content: '\e64a'
}

.icon-pingguo:before {
    content: '\e64c'
}

.icon-zhifubao:before {
    content: '\e647'
}

.icon-xiaogougou:before {
    content: '\e64b'
}

.icon-liebiao:before {
    content: '\e661'
}

.icon-wenjian:before {
    content: '\e663'
}

.icon-huidaodingbu:before {
    content: '\e66b'
}

.icon-gou:before {
    content: '\e664'
}

.icon-moon:before {
    content: '\e665'
}

.icon-cry:before {
    content: '\e662'
}

.icon-shuaxin:before {
    content: '\e667'
}

.icon-look-lishi:before {
    content: '\e666'
}

.icon-putonghongbao:before {
    content: '\e668'
}

.icon-tuijianpiaohongbao:before {
    content: '\e669'
}

.icon-yuepiaohongbao:before {
    content: '\e66a'
}

.icon-key:before {
    content: '\e67e'
}

.icon-bell:before {
    content: '\e67f'
}

.icon-money:before {
    content: '\e680'
}

.error, .success {
    margin-right: 5px
}

.success {
    color: #8ccd0a
}

.error {
    color: #ed4259
}

body {
    font-family: Roboto;
    font-size: 14px;
    line-height:1.5 ;
    color: #666;
}

.main-nav li.web .game-dropdown .lately dd {
    overflow: hidden
}

.main-nav li.web .game-dropdown .lately {
    border-bottom: 1px solid #ebebeb
}

.top-nav {
    height: 35px;
    border-bottom: 1px solid #e5e5e5;
    background: #f7f7f7
}

.top-nav .box-center {
    border-bottom: 1px solid #e5e5e5;
    background: #f7f7f7
}

.top-nav a, .top-nav em {
    float: left
}

.top-nav a {
    font: 12px/35px Arial, '-apple-system', Simsun;
    overflow: hidden;
    height: 35px;
    color: grey
}

.top-nav a.black {
    color: #262626
}

.top-nav a:hover {
    color: #ed4259
}

.top-nav a.act {
    position: relative;
    width: 80px;
    max-width: 80px;
    height: 36px;
    margin-right: 10px;
    margin-bottom: -1px;
    text-align: center;
    color: #575757;
    border-right: 1px solid #e5e5e5;
    border-left: 1px solid #e5e5e5;
    background: #fff
}

.top-nav a.act:hover {
    color: #ed4259
}

.top-nav em {
    font: 12px/35px Arial;
    margin: 0 10px;
    color: #d9d9d9
}

.top-nav .login-box span {
    font: 12px/35px Arial, '-apple-system', Simsun;
    float: left;
    color: #a6a6a6
}

.top-nav .login-box a {
    color: #a6a6a6
}

.top-nav .login-box a.black {
    color: #262626
}

.top-nav .login-box a i, .top-nav .login-box a:hover {
    color: #ed4259
}

.top-nav .sign-in i.black {
    color: #262626
}

.top-nav a:hover i.black {
    color: #ed4259
}

.top-nav .sign-in .new-user {
    display: none;
    overflow: visible
}

.top-nav .sign-in .new-user .gift {
    font-size: 16px;
    font-weight: 400;
    display: inline-block;
    margin: -2px 5px 0 0;
    animation: bounce 1s infinite;
    vertical-align: middle;
    color: #bf2c24
}

.top-nav .sign-in .new-user i {
    color: #bf2c24
}

.top-nav .sign-in .new-user em {
    display: inline-block;
    float: none;
    margin-top: -2px;
    vertical-align: middle
}

.logo-wrap {
    overflow: hidden;
    width: 100%;
    height: 84px
}

.logo-wrap .box-center {
    position: relative
}

.logo-wrap .left-link {
    left: 224px;
    width: 174px
}

.logo-wrap .right-link {
    right: 124px;
    width: 282px
}

.logo-wrap .left-link, .logo-wrap .right-link {
    position: absolute;
    height: 84px
}

.logo-wrap .logo {
    width: 219px;
    height: 52px;
    margin: 16px 184px 0 0
}

.logo-wrap .logo a {
    display: block;
    width: 219px;
    height: 52px;
    background: url(../images/logo-web.png) no-repeat;
    background-size: 100%;
}

.logo-wrap .book-shelf, .logo-wrap .search-wrap {
    margin-top: 22px;
    position: relative;
}

.logo-wrap .search-wrap {
    width: 390px;
}

.logo-wrap .book-shelf p, .logo-wrap .search-wrap p {
    float: left;
    margin: 0;
    overflow: hidden;
    width: 348px;
    height: 38px;
    border: 1px solid #dbdbdb;
    border-right: none
}

.logo-wrap .book-shelf p:hover, .logo-wrap .search-wrap p:hover {
    border-color: #c9c9c9
}

.logo-wrap .book-shelf .search-box, .logo-wrap .search-wrap .search-box {
    font: 14px/38px Arial, '-apple-system', Simsun;
    width: 326px;
    height: 38px;
    padding: 0 11px;
    border: 0;
    outline: 0;
}

.logo-wrap .book-shelf .search-box.placeholder, .logo-wrap .search-wrap .search-box.placeholder {
    color: #ccc
}

.logo-wrap .book-shelf .search-btn, .logo-wrap .search-wrap .search-btn {
    float: left;
    width: 40px;
    height: 40px;
    text-align: center;
    background-color: #3e98a1;
    line-height: 1;
}

.logo-wrap .book-shelf .search-btn:hover, .logo-wrap .search-wrap .search-btn:hover {
    background-color: #ed4259
}

.logo-wrap .book-shelf .search-btn em, .logo-wrap .search-wrap .search-btn em {
    font-size: 18px;
    display: block;
    margin-top: 10px;
    color: #fff
}

.logo-wrap .book-shelf {
    overflow: hidden;
    width: 170px;
    height: 40px;
    background: #fff
}

.logo-wrap .book-shelf a, .logo-wrap .book-shelf em, .logo-wrap .book-shelf i, .logo-wrap .book-shelf span {
    display: inline-block;
    vertical-align: middle
}

.logo-wrap .book-shelf i {
    line-height: 38px;
    overflow: hidden;
    height: 38px;
    margin-right: 3px
}

.logo-wrap .book-shelf a {
    font: 14px/1 Arial, '-apple-system', Simsun;
    display: block;
    width: 118px;
    height: 38px;
    text-align: center;
    border: 1px solid #e6e6e6;
    float: left;
    position: relative;
}
.logo-wrap .book-shelf a i span {
    color: #fff;
    border: 1px solid #bf2e1e;
    width: 16px;
    height: 16px;
    line-height: 16px;
    background: #d63f2e;
    border-radius: 5px;
    position: absolute;
    top: 2px;
    right: 2px;
    text-align: center;
    -webkit-font-smoothing: auto;
    font-smoothing: auto;
    font-size: 12px;
}
.logo-wrap .book-shelf a#logout-header{
    float: right;
    width: 40px;
    background: transparent;
    border: 1px solid #e6e6e6;
}
.logo-wrap .book-shelf a#logout-header img{
    width: 20px;
    margin-top: 10px;
}

.logo-wrap .book-shelf a:hover {
    color: #fff;
    border: 1px solid #ed4259;
    background: #ed4259
}

.logo-wrap .book-shelf a:hover span {
    color: #ed4259;
    background: #fff
}

.logo-wrap .book-shelf em {
    font-size: 16px;
    line-height: 20px;
    overflow: hidden;
    width: 16px;
    margin-right: 5px
}

@-moz-document url-prefix() {
    .logo-wrap .book-shelf em {
        margin-top: 4px
    }
}

.main-nav-wrap {
    position: relative;
    z-index: 30;
    margin-bottom: 10px;
    background-color: #2798A1
}

.main-nav-wrap .main-nav {
    position: relative;
    height: 40px;
    background-color: #2798A1
}

.main-nav-wrap .main-nav li {
    float: left
}

.main-nav-wrap .main-nav li b {
    font-weight: 400
}

.main-nav-wrap .main-nav li b.client, .main-nav-wrap .main-nav li b.webgame {
    font-size: 16px;
    float: left;
    min-width: 16px;
    margin: 1px 5px 0 0;
    opacity: .8
}

.main-nav-wrap .main-nav li a {
    font: 14px/38px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    float: left;
    height: 38px;
    padding: 0 32px;
    color: #fff;
    border-bottom: 2px solid #2798A1
}

.main-nav-wrap .main-nav li.nav-li a.act {
    color: #fff;
    border-bottom: 2px solid #ed4259;
    background-color: #ed4259
}

.main-nav-wrap .main-nav li.nav-li a.act:hover {
    line-height: 38px;
    height: 38px;
    border-top: none;
    border-bottom: 2px solid #ed4259;
    background: #ed4259
}

.main-nav-wrap .main-nav li.nav-li a:hover {
    line-height: 34px;
    height: 36px;
    transition: none;
    border-top: 2px solid #bf2d27;
    border-bottom: 2px solid #077c86;
    background-color: #077c86
}

.main-nav-wrap .main-nav li.first {
    position: relative;
    width: 282px;
    height: 40px;
    margin-right: 30px;
    cursor: pointer;
    background-color: #077c86
}

.main-nav-wrap .main-nav li.first b {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 0;
    height: 0;
    margin-left: -5px;
    transition: all .5s;
    border-top: 5px solid #a6a6a6;
    border-right: 5px solid transparent;
    border-bottom: 0 none;
    border-left: 5px solid transparent
}

.main-nav-wrap .main-nav li.first b strong {
    position: absolute;
    top: -7px;
    right: -5px;
    width: 0;
    height: 0;
    border-top: 5px solid #333;
    border-right: 5px solid transparent;
    border-bottom: 0 none;
    border-left: 5px solid transparent
}

.main-nav-wrap .main-nav li.first:hover span {
    background-color: #077c86
}

.main-nav-wrap .main-nav li.first:hover b {
    -webkit-transform: rotateX(-180deg);
    -moz-transform: rotateX(-180deg);
    transform: rotateX(-180deg)
}

.main-nav-wrap .main-nav li.first:hover b strong {
    border-top: 5px solid #252428
}

.main-nav-wrap .main-nav li.first span {
    font: 14px/38px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    display: block;
    padding: 0 0 0 18px;
    transition: all .5s;
    color: #fff;
    background-color: #077c86
}

.main-nav-wrap .main-nav li.first span em {
    float: left;
    width: 16px;
    height: 14px;
    margin: 13px 8px 0 0;
    vertical-align: middle
}

.main-nav-wrap .main-nav li.first span em i {
    display: block;
    width: 16px;
    height: 2px;
    margin-bottom: 4px;
    background: #d5d5d6
}

.main-nav-wrap .main-nav li.game {
    position: relative;
    float: right;
    margin-right: 0
}

.main-nav-wrap .main-nav li.game a {
    padding: 0;
    background: 0 0
}

.main-nav-wrap .main-nav li.game a:hover {
    color: #ffeea8;
    border-bottom: none
}

.main-nav-wrap .main-nav li.game a.web-game {
    margin-right: 20px
}

.main-nav-wrap .main-nav li.game b {
    font-size: 16px;
    min-width: 16px;
    margin-right: 5px;
    opacity: .8
}

.main-nav-wrap .main-nav li.game b:hover {
    color: #ffeea8
}

.main-nav-wrap .main-nav li.game b, .main-nav-wrap .main-nav li.game cite {
    float: left
}

.main-nav-wrap .main-nav li.game cite {
    margin: 8px 5px 0;
    color: #fff
}

.main-nav-wrap .main-nav li.game em {
    float: left;
    width: 16px;
    height: 14px;
    margin: 13px 6px 0 0;
    vertical-align: middle;
    background: #666
}

.main-nav li .game-dropdown {
    position: absolute;
    z-index: 21;
    top: 40px;
    width: 216px;
    height: 420px;
    animation: .15s ease-out;
    animation-name: fadeinT;
    background: #fff;
    box-shadow: 0 3px 5px #ccc
}

.main-nav li .game-dropdown cite {
    position: absolute;
    top: -15px;
    width: 0;
    height: 0;
    border-top: 0 none;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #fff;
    border-left: 7px solid transparent
}

.main-nav li .game-dropdown dl {
    padding: 15px 12px 0
}

.main-nav li .game-dropdown dl a {
    line-height: 18px;
    float: none;
    height: auto;
    color: inherit;
    border: none
}

.main-nav li .game-dropdown dl dt {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    margin-bottom: 8px;
    color: #bf2c24
}

.main-nav li .game-dropdown dl dd h3 {
    font-weight: 400;
    line-height: 18px;
    overflow: hidden;
    height: 18px
}

.main-nav li .game-dropdown dl dd span {
    font: 12px/12px Arial, '-apple-system', Simsun;
    height: 12px;
    padding: 0 2px;
    text-align: center;
    color: #fff;
    background: #fc6c28
}

.main-nav li .game-dropdown dl dd a {
    color: #222
}

.main-nav li .game-dropdown .bottom {
    width: 192px;
    margin: 0 auto;
    padding-top: 12px;
    border-top: 1px solid #e6e6e6
}

.main-nav li .game-dropdown .bottom h4 {
    font: 12px/18px Arial, '-apple-system', Simsun;
    margin-bottom: 5px;
    color: #bf2c24
}

.main-nav li .game-dropdown .bottom a {
    position: relative;
    z-index: 1
}

.main-nav li .game-dropdown .bottom a, .main-nav li .game-dropdown .bottom img {
    display: block;
    width: 192px;
    height: 86px;
    border: none
}

.main-nav li.web .game-dropdown {
    left: -90px
}

.main-nav li.web .game-dropdown cite {
    left: 107px
}

.main-nav li.web .game-dropdown .lately {
    display: none;
    overflow: hidden;
    width: 192px;
    height: 70px;
    margin: 0 auto;
    padding: 10px 0 5px
}

.main-nav li.web .game-dropdown .lately dd {
    display: none;
    margin-bottom: 5px
}

.main-nav li.web .game-dropdown .lately dd .name {
    font: 14px/18px Arial, '-apple-system', Simsun;
    float: left;
    overflow: hidden;
    width: 90px;
    height: 18px;
    margin-right: 10px;
    white-space: normal;
    text-overflow: ellipsis
}

.main-nav li.web .game-dropdown .lately dd .name:hover {
    color: #ed4259
}

.main-nav li.web .game-dropdown .lately dd strong {
    font: 12px/18px Arial, '-apple-system', Simsun;
    font-weight: 400;
    float: left;
    color: #666
}

.main-nav li.web .game-dropdown .lately dd .link {
    font: 12px/18px Arial, '-apple-system', Simsun;
    float: right;
    color: #3f5a93
}

.main-nav li.web .game-dropdown .lately dd .link:hover {
    color: #2972cc
}

.main-nav li.web .game-dropdown .lately dd .link i {
    font-family: simsun;
    font-weight: 700;
    margin-left: 5px
}

.main-nav li.web .game-dropdown .web-list dd p {
    position: relative;
    z-index: 1;
    display: none
}

.main-nav li.web .game-dropdown .web-list dd.act p {
    display: block
}

.main-nav li.web .game-dropdown .web-list dd.act p .op-tag {
    right: 2px;
    bottom: 6px
}

.main-nav li.web .game-dropdown .web-list dd h3 {
    margin-bottom: 10px
}

.main-nav li.web .game-dropdown .web-list dd h3 span {
    float: right;
    width: 22px;
    height: 12px;
    margin-top: 3px;
    background: url(/qd/images/common/tag.7a994.png) no-repeat 0 -12px
}

.main-nav li.web .game-dropdown .web-list dd h3 a {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 14px;
    float: left;
    overflow: hidden;
    overflow: hidden;
    width: 84px;
    height: 18px;
    margin-right: 6px;
    white-space: nowrap;
    text-overflow: ellipsis
}

.main-nav li.web .game-dropdown .web-list dd h3 a:hover {
    color: #ed4259
}

.main-nav li.web .game-dropdown .web-list dd h3 i {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    float: left;
    margin-right: 8px;
    color: #a6a6a6
}

.main-nav li.web .game-dropdown .web-list dd h3 strong {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    font-weight: 400;
    float: left;
    min-width: 30px;
    max-width: 30px;
    text-align: right;
    color: #666
}

.main-nav li.web .game-dropdown .web-list dd img {
    width: 192px;
    height: 46px
}

.main-nav li.web .game-dropdown .web-list dd p {
    margin-bottom: 5px
}

.main-nav li.web .game-dropdown .web-list.hide {
    overflow: hidden;
    height: 172px;
    margin-bottom: 10px;
    padding-bottom: 10px
}

.main-nav li.phone .game-dropdown {
    left: -163px
}

.main-nav li.phone .game-dropdown cite {
    right: 12px
}

.main-nav li.phone .game-dropdown .phone-list dd h3 {
    margin-bottom: 5px
}

.main-nav li.phone .game-dropdown .phone-list dd span {
    float: left;
    width: 22px;
    height: 12px;
    margin-top: 3px;
    background: url(/qd/images/common/tag.7a994.png) no-repeat 0 -12px
}

.main-nav li.phone .game-dropdown .phone-list dd a {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 14px;
    margin-right: 5px
}

.main-nav li.phone .game-dropdown .phone-list dd a:hover {
    color: #ed4259
}

.main-nav li.phone .game-dropdown .phone-list dd i {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    vertical-align: middle;
    color: #666
}

.main-nav li.phone .game-dropdown .phone-list dd i.op-tag {
    right: 2px;
    bottom: 6px
}

.main-nav li.phone .game-dropdown .phone-list dd p {
    position: relative;
    z-index: 1;
    margin-bottom: 5px
}

.main-nav li.phone .game-dropdown .phone-list dd p img {
    width: 192px;
    height: 58px
}

@-webkit-keyframes bounce {
    0%, 100%, 20%, 53%, 80% {
        -webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(.215, .61, .355, 1);
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    40%, 43% {
        -webkit-transition-timing-function: cubic-bezier(.755, .05, .855, .06);
        transition-timing-function: cubic-bezier(.755, .05, .855, .06);
        -webkit-transform: translate3d(0, -2px, 0);
        transform: translate3d(0, -2px, 0)
    }
    70% {
        -webkit-transition-timing-function: cubic-bezier(.755, .05, .855, .06);
        transition-timing-function: cubic-bezier(.755, .05, .855, .06);
        -webkit-transform: translate3d(0, -3px, 0);
        transform: translate3d(0, -3px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -2px, 0);
        transform: translate3d(0, -2px, 0)
    }
}

@keyframes bounce {
    0%, 100%, 20%, 53%, 80% {
        -webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(.215, .61, .355, 1);
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    40%, 43% {
        -webkit-transition-timing-function: cubic-bezier(.755, .05, .855, .06);
        transition-timing-function: cubic-bezier(.755, .05, .855, .06);
        -webkit-transform: translate3d(0, -2px, 0);
        transform: translate3d(0, -2px, 0)
    }
    70% {
        -webkit-transition-timing-function: cubic-bezier(.755, .05, .855, .06);
        transition-timing-function: cubic-bezier(.755, .05, .855, .06);
        -webkit-transform: translate3d(0, -3px, 0);
        transform: translate3d(0, -3px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -2px, 0);
        transform: translate3d(0, -2px, 0)
    }
}

.bounce {
    transform-origin: center bottom;
    animation-name: bounce
}


 
.book-list-wrap .book-list li, .classify-list dd {
    overflow: hidden
}

h3.wrap-title {
    font-family: arial;
    border-bottom: 1px solid #666
}

.error, .success {
    margin-right: 5px
}

.success {
    color: #8ccd0a
}

.error {
    color: #ed4259
}

.red {
    color: #bf2c24
}

.pink {
    color: #ed4259
}

.blue {
    color: #3f5a93
}

.blue:hover {
    color: #2972cc
}

.gray {
    color: #a6a6a6
}

.gray:hover {
    color: #a6a6a6
}

.lbf-textarea-placeholder {
    font-size: 12px;
    position: absolute;
    top: 8px !important;
    left: 12px !important;
    color: #999
}

.qd-checkbox {
    width: 12px;
    height: 12px;
    vertical-align: middle;
    background: url(/qd/images/ico/qd_checkbox.4e604.png) no-repeat
}

.qd-checkbox.disabled {
    background-position: 0 0
}

.qd-checkbox.disabled:hover {
    background-position: 0 0
}

.qd-checkbox:hover {
    background-position: 0 -12px
}

.qd-checkbox.checked {
    background-position: 0 -24px
}

.lbf-checkbox {
    display: inline-block;
    width: 12px;
    height: 12px;
    vertical-align: middle;
    background: url(/qd/images/ico/qd_checkbox.4e604.png) no-repeat
}

.lbf-checkbox.lbf-checkbox-hover {
    background-position: 0 -12px
}

.lbf-checkbox.lbf-checkbox-checked {
    background-position: 0 -24px
}

.lbf-checkbox + label {
    font: 12px/17px Arial, '-apple-system', Simsun;
    display: inline-block;
    vertical-align: middle;
    color: #666
}

.lbf-checkbox + label:hover {
    color: #1a1a1a
}

.lbf-radio {
    position: relative;
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-right: 8px;
    cursor: pointer;
    vertical-align: -1px;
    border: none;
    background: url(/qd/images/ico/qd_radio.54397.png) no-repeat;
    background-position: 0 -24px
}

.lbf-radio.lbf-radio-hover {
    background-position: 0 -12px
}

.lbf-radio.lbf-radio-checked {
    background-position: 0 0
}

.lbf-radio + label {
    display: inline-block
}

.op-tag {
    position: absolute;
    z-index: 5;
    right: 4px;
    bottom: 4px;
    width: 24px;
    height: 14px;
    background: url(/qd/images/common/op_tag.e4c83.png) no-repeat
}

.share-img {
    overflow: hidden;
    width: 0;
    height: 0;
    margin: 0 auto
}
img{max-width:100%;}
embed.embed-fix {
    position: absolute;
    z-index: 2;
    top: -9999em;
    left: -9999em;
    width: 398px;
    height: 298px
}

.pin-nav-wrap.need-search .min-user li:first-child {
    display: block
}

.pin-nav-wrap.need-search .min-user li:first-child + li.line {
    display: block
}

.submit-input {
    position: absolute;
    clip: rect(0 0 0 0)
}

.pin-nav-wrap {
    position: fixed;
    z-index: 100000;
    top: -50px;
    left: 0;
    width: 100%;
    height: 42px;
    transition: .5s all;
    transform: translateZ(10px);
    background: #3e3d43;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .4)
}

.pin-nav-wrap.show {
    top: 0
}

.pin-nav-wrap .nav-list {
    height: 42px;
    margin-left: -10px
}

.pin-nav-wrap .nav-list li {
    float: left
}

.pin-nav-wrap .nav-list li.act a {
    line-height: 38px;
    height: 40px;
    transition: none;
    border-top: 2px solid #ed4259;
    background: #2b2a2e
}

.pin-nav-wrap .nav-list li.act a span {
    top: 17px;
    -webkit-transform: rotateX(-180deg);
    -moz-transform: rotateX(-180deg);
    transform: rotateX(-180deg)
}

.pin-nav-wrap .nav-list li.act .dropdown {
    display: block;
    animation: .15s ease-out;
    animation-name: fadeinT;
    background: #2b2a2e
}

.pin-nav-wrap .nav-list li.site {
    width: 95px;
    margin-right: 28px
}

.pin-nav-wrap .nav-list li.site a {
    width: 95px;
    color: #fff
}

.pin-nav-wrap .nav-list li.site a.pin-logo {
    display: block;
    width: 95px;
    height: 42px;
    /*background-image: url(/qd/images/pin_logo_1x.6068b.png);*/
    background-repeat: no-repeat;
    background-position: 10px 48%
}

.pin-nav-wrap .nav-list li.site .dropdown {
    width: 125px
}

.pin-nav-wrap .nav-list li.site.act a {
    height: 38px
}

.pin-nav-wrap .nav-list li a {
    font: 14px/42px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    position: relative;
    display: block;
    overflow: hidden;
    height: 42px;
    padding: 0 15px;
    color: #ccc
}

.pin-nav-wrap .nav-list li a:hover {
    color: #fff
}

.pin-nav-wrap .nav-list li a span {
    position: absolute;
    top: 19px;
    right: 10px;
    width: 0;
    height: 0;
    transition: all .2s;
    border-top: 4px solid #ccc;
    border-right: 4px solid transparent;
    border-bottom: 0 none;
    border-left: 4px solid transparent
}

.pin-nav-wrap .nav-list li .dropdown {
    position: relative;
    display: none;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .2)
}

.pin-nav-wrap .nav-list li .dropdown a {
    font: 14px/38px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    height: auto;
    padding: 2px 15px;
    color: #ccc;
    border-top: none
}

.pin-nav-wrap .nav-list li .dropdown a:hover {
    color: #fff;
    background: #000
}

.pin-nav-wrap .nav-list li.more a {
    width: 46px
}

.pin-nav-wrap .nav-list li.more a span {
    right: 15px
}

.pin-nav-wrap .nav-list li.more .dropdown a {
    width: 56px;
    padding: 0 10px
}

.pin-nav-wrap .min-user .iconfont {
    font-size: 17px;
    display: inline-block;
    vertical-align: middle;
    color: #fff
}

.pin-nav-wrap .min-user .iconfont:hover {
    background: 0 0
}

.pin-nav-wrap .min-user li {
    position: relative;
    z-index: 11
}

.pin-nav-wrap .min-user li:first-child {
    display: none
}

.pin-nav-wrap .min-user li:first-child + li.line {
    display: none
}

.pin-nav-wrap .min-user li .pin-input {
    font-family: Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    font-size: 14px;
    position: absolute;
    z-index: 1;
    top: 8px;
    right: 42px;
    width: 150px;
    height: 26px;
    transition: color .3s, border .3s;
    opacity: 1;
    color: #e6e6e6;
    color: rgba(255, 255, 255, .7);
    border-bottom: 1px solid #aaa;
    background: #3e3d43
}

.pin-nav-wrap .min-user li .pin-input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #3e3d43 inset;
    -webkit-text-fill-color: #e6e6e6;
    -webkit-text-fill-color: rgba(255, 255, 255, .7)
}

.pin-nav-wrap .min-user li .pin-input:focus {
    color: #fff;
    border-bottom: 2px solid #fff
}

.pin-nav-wrap .min-user li.book-shelf a:hover {
    background: #2b2a2e
}

.pin-nav-wrap .min-user li.book-shelf i {
    margin-left: 5px
}

.pin-nav-wrap .min-user li.book-shelf cite {
    font-family: Arial;
    font-size: 11px;
    line-height: 1.4;
    display: inline-block;
    margin: -2px 0 0 4px;
    padding: 0 4px;
    vertical-align: middle;
    color: #fff;
    border-radius: 4px;
    background: #ed4259
}

.pin-nav-wrap .min-user li.book-shelf cite strong {
    font-weight: 400
}

.pin-nav-wrap .min-user li.book-shelf em {
    margin-top: -2px
}

.pin-nav-wrap .min-user li a {
    position: relative;
    z-index: 10;
    margin-right: 0;
    color: #fff;
    background: 0 0
}

.pin-nav-wrap .min-user li label#pin-search {
    line-height: 42px;
    display: block;
    height: 42px;
    margin-right: 10px
}

.pin-nav-wrap .min-user li.line {
    height: 24px;
    margin: 10px 0 0;
    border-right: 1px solid #515056
}

.pin-nav-wrap .min-user li.sign-out {
    position: relative;
    padding: 0 6px 0 15px
}

.pin-nav-wrap .min-user li.sign-out a {
    display: inline;
    margin-right: 8px;
    padding: 0;
    color: #ccc
}

.pin-nav-wrap .min-user li.sign-out a:hover {
    color: #fff
}

.pin-nav-wrap .min-user li.sign-in a {
    overflow: hidden;
    min-width: 80px;
    max-width: 156px;
    padding: 0 20px 0 10px;
    white-space: nowrap;
    text-overflow: ellipsis
}

.pin-nav-wrap .min-user li.sign-in a i {
    padding-right: 5px
}

.pin-nav-wrap .min-user li.sign-in .dropdown {
    position: absolute;
    top: 42px;
    right: 0;
    width: 100%
}

.pin-nav-wrap .min-user li.sign-in .dropdown a {
    text-align: left
}

.pin-nav-wrap .min-user li.sign-in .dropdown a.pin-user-name {
    overflow: hidden;
    height: 32px
}

.pin-nav-wrap .min-user li.sign-in .dropdown a i {
    padding-right: 0
}

#type-hover .classify-list {
    position: absolute;
    z-index: 100;
    top: 40px;
    display: none;
    animation: .15s ease-out;
    animation-name: fadeinT;
    box-shadow: 0 3px 5px #ccc
}

.classify-list {
    position: relative;
    top: -11px;
    width: 280px;
    height: 420px;
    border: 1px solid #e6e6e6;
    border-top: none
}

.classify-list dd {
    float: left;
    width: 50%;
    height: 60px;
    background: #f7f6f2
}

.classify-list dd a {
    display: block;
    color: #333
}

.classify-list dd a cite {
    position: relative;
    display: block;
    overflow: hidden;
    height: 43px;
    padding-top: 17px;
    padding-left: 17px
}

.classify-list dd a cite .rec {
    display: inline-block;
    width: 8px;
    height: 10px;
    margin-top: -4px;
    margin-left: 3px;
    vertical-align: middle;
    background: url(/qd/images/index/rec.23462.png) no-repeat
}

.classify-list dd a cite .info {
    float: left;
    max-width: 42px
}

.classify-list dd a cite .info b, .classify-list dd a cite .info i {
    display: block;
    cursor: pointer;
    text-align: left
}

.classify-list dd a cite .info i {
    font: 14px/1 Arial, '-apple-system', Simsun;
    white-space: nowrap
}

.classify-list dd a cite .info b {
    font: 12px/1.5 Arial;
    transition: color .2s;
    color: #999
}

.classify-list dd a cite em {
    float: left;
    width: 24px;
    height: 24px;
    margin: 2px 8px 0 0;
    transition: margin ease-out .3s;
    font-size: 24px;
    line-height: 1;
}

.classify-list dd a cite em.lingyi {
    margin-top: 0
}

.classify-list dd a cite em.erciyuan, .classify-list dd a cite em.jingji {
    margin-top: 1px
}

.classify-list dd a:hover {
    color: #ed4259
}

.classify-list dd a:hover cite em {
    margin: 2px 11px 0 -3px
}

.classify-list dd a:hover cite em.lingyi {
    margin: 0 11px 0 -3px
}

.classify-list dd a:hover cite em.erciyuan, .classify-list dd a:hover cite em.jingji {
    margin: 1px 11px 0 -3px
}

.classify-list dd a:hover cite b {
    color: #ed4259
}

.classify-list dd.even {
    background: #fcfcfa
}

h3.wrap-title {
    font-size: 18px;
    font-weight: 400;
    line-height: 25px;
    overflow: hidden;
    height: 24px;
    padding-bottom: 4px;
    color: #1a1a1a
}

h3.wrap-title span {
    margin-left: 5px
}

h3.wrap-title a {
    float: right;
    font: 12px/16px Arial, '-apple-system', Simsun;
    color: #a6a6a6;
}

h3.wrap-title a:hover {
    color: #2972cc
}

h3.wrap-title i {
    font-family: Arail, Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    margin: 0 5px
}

h3.wrap-title .more {
    display: inline;
    margin-left: 5px;
    transition: ease-in-out .2s;
    opacity: 0
}

h3.wrap-title .more em.iconfont {
    font-size: 12px;
    display: inline-block;
    vertical-align: middle
}

.book-list-wrap:hover .more {
    opacity: 100
}

.book-list-wrap {
    width: 216px
}

.book-list-wrap .book-list li {
    height: 32px;
    border-top: 1px solid #e6e6e6
}

.book-list-wrap .book-list li:first-child {
    border-top: none
}

.book-list-wrap .book-list li a {
    font: 14px/32px Arial, '-apple-system', Simsun;
    float: left
}

.book-list-wrap .book-list li a.channel {
    overflow: hidden;
    min-width: 56px;
    height: 32px;
    margin-left: -8px;
    color: grey
}

.book-list-wrap .book-list li a.channel em {
    font-family: Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    font-size: 13px
}

.book-list-wrap .book-list li a.name {
    overflow: hidden;
    max-width: 100%;
    margin-left: -3px;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #1a1a1a
}

.book-list-wrap .book-list li a:hover {
    color: #ed4259
}

.book-list-wrap .book-list li.str3 .channel {
    width: 68px
}

.book-list-wrap .book-list li.str3 .name {
    max-width: 84px
}

.book-list-wrap .book-list li .author, .book-list-wrap .book-list li .rec {
    font: 12px/32px Arial, '-apple-system', Simsun;
    float: right;
    overflow: hidden;
    width: 64px;
    text-align: right;
    white-space: normal;
    text-overflow: ellipsis;
    color: #b3b3b3
}

.book-list-wrap .book-list li.color-type_1 a {
    color: #bf2c24
}

.book-list-wrap .book-list li.color-type_1 a:hover {
    color: #ed4259
}

.book-list-wrap .book-list li.color-type_1 .author {
    color: #a6a6a6
}

.book-list-wrap .book-list li.color-type_1 .author:hover {
    color: #ed4259
}

.book-list-wrap .book-list li.bd0 {
    border-bottom: none
}

.book-list-wrap .book-list li.bd0 .name {
    overflow: hidden;
    width: 140px;
    white-space: normal;
    text-overflow: ellipsis
}

.book-list-wrap .book-list li.bd0 span {
    width: 26px
}

.book-wrap {
    padding: 15px 0
}

.book-wrap .book-info {
    width: 132px
}
.rank-list .book-wrap .book-info {
    width: 212px
}
.book-wrap .book-info h3 {
    font: 700 14px/18px Arial;
    width: 36px;
    height: 18px;
    margin-bottom: 3px;
    text-align: center;
    color: #fff;
    background: #bf2c24
}

.book-wrap .book-info h4 {
    font: 16px/24px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    overflow: hidden;
    height: 24px;
    color: #1a1a1a
}

.book-wrap .book-info p.digital {
    font-family: Arial;
    font-size: 12px;
    overflow: hidden;
    height: 24px;
    margin-bottom: 4px;
    padding: 3px 0 0;
    color: #bf2c24
}

.book-wrap .book-info p.digital em {
    font-family: Arial;
    font-size: 18px;
    margin-right: 3px
}

.book-wrap .book-info p.digital.f16 {
    font-size: 16px
}

.book-wrap .book-info p.author {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    overflow: hidden;
    height: 16px
}

.book-wrap .book-info p.author i {
    font-family: Arial;
    margin: 0 5px
}

.book-wrap .book-info p.author a {
    color: #a6a6a6
}

.book-wrap .book-info p.author a.type:hover {
    color: #ed4259
}

.book-wrap .book-info p.author a.writer:hover {
    color: #000
}

.book-wrap .book-info .tag {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    line-height: 18px;
    display: block;
    overflow: hidden;
    width: 50px;
    height: 18px;
    margin-bottom: 2px;
    padding: 0 3px;
    text-align: center;
    color: #bf2c24;
    border: 1px solid #df9591
}

.book-wrap .book-info .desc {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    overflow: hidden;
    height: 16px;
    color: #666
}

.book-wrap .book-cover {
    position: relative;
    z-index: 4;
    float: right;
    width: 52px;
    height: 91px;
    margin-top: -3px;
    margin-right: 8px;
    text-align: center
}

.book-wrap .book-cover.fl {
    float: left
}

.book-wrap .book-cover .link {
    position: relative;
    z-index: 10;
    display: inline-block;
    transform: translateZ(50px)
}

.book-wrap .book-cover img {
    width: 60px;
    height: 87px;
    outline: 1px solid transparent
}

.book-wrap .book-cover span {
    position: absolute;
    z-index: 1
}

:root .book-cover {
    -webkit-transform: perspective(60px) rotateY(-10deg);
    -moz-transform: perspective(60px) rotateY(-10deg);
    transform: perspective(60px) rotateY(-10deg)
}

:root .book-cover:before {
    position: absolute;
    z-index: 3;
    top: 3%;
    left: 10%;
    width: 100%;
    height: 90%;
    background-color: #999
}

:root .book-cover:after {
    position: absolute;
    z-index: 2;
    top: 2%;
    left: 100%;
    width: 10%;
    height: 92%;
    content: ' ';
    -webkit-transform: perspective(60px) rotateY(30deg);
    -moz-transform: perspective(60px) rotateY(30deg);
    transform: perspective(60px) rotateY(30deg);
    background-color: #efefef;
    box-shadow: inset 0 0 5px #333
}

:root .book-cover span {
    position: absolute;
    z-index: 1;
    top: 84.1%;
    left: 7px;
    width: 20px;
    height: 10px;
    content: '';
    -webkit-transform: perspective(74px) rotateX(-70deg) rotateY(-5deg);
    -moz-transform: perspective(74px) rotateX(-70deg) rotateY(-5deg);
    -ms-transform: scale(0);
    transform: perspective(74px) rotateX(-70deg) rotateY(-5deg);
    box-shadow: 25px 0 5px 5px #adadad
}

:root .book-cover img {
    width: 52px;
    height: 87px
}

.book-img {
    width: 72px;
    height: 96px;
    margin-right: 12px
}

.book-img a {
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
    height: 100%;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .35), 0 0 5px #f9f2e9 inset
}

.book-img a img {
    width: 100%;
    height: 100%;
    -webkit-transition: -webkit-transform .3s ease-out;
    -moz-transition: -moz-transform .3s ease-out;
    -ms-transition: -ms-transform .3s ease-out;
    transition: transform .3s ease-out;
    color: #fcfcfa
}

.book-img a img:hover {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1)
}

.book-img a span {
    font: 12px/18px Arial;
    position: absolute;
    bottom: 0;
    left: 0;
    height: 17px;
    padding: 0 3px 0 2px;
    text-align: center;
    color: #fff;
    border-radius: 0 5px 0 0;
    background: #ed4259
}

.rank-list {
    position: relative;
    z-index: 1;
    float: left;
    width: 278px;
    margin-right: 30px
}

.rank-list .mr0 {
    margin-right: 0
}

.rank-list:hover .more {
    opacity: 100
}

.rank-list .book-list li {
    clear: both;
    height: 31px
}

.rank-list .book-list li:hover .name-box .arrow-up {
    background: #ed4259
}

.rank-list .book-list li.bd0 .name-box, .rank-list .book-list li:last-of-type .name-box {
    border-bottom: none
}

.rank-list .book-list li.unfold {
    zoom: 1;
    height: 114px;
    margin-bottom: -1px
}

.rank-list .book-list li.unfold i {
    color: #a6a6a6
}

.rank-list .book-list li.unfold:after, .rank-list .book-list li.unfold:before {
    display: table;
    content: ''
}

.rank-list .book-list li.unfold:after {
    clear: both
}

.rank-list .book-list li .num-box {
    float: left;
    width: 28px;
    height: 32px
}

.rank-list .book-list li .num-box span {
    font: 400 14px/16px Arial;
    display: block;
    overflow: hidden;
    width: 16px;
    height: 16px;
    margin-top: 8px;
    text-align: center;
    letter-spacing: -1px;
    color: #666;
    background: #ededed
}

.rank-list .book-list li .num-box span.num1 {
    color: #fff;
    background: #bf2c24
}

.rank-list .book-list li .num-box span.num2 {
    color: #fff;
    background: #e67225
}

.rank-list .book-list li .num-box span.num3 {
    color: #fff;
    background: #e6bf25
}

.rank-list .book-list li .name-box {
    position: relative;
    float: left;
    height: 30px;
    border-top: 1px solid #e6e6e6;
    width: calc(100% - 28px);
}

.rank-list .book-list li .name-box:first-child {
    border-top: none
}

.rank-list .book-list li .name-box a {
    font: 14px/31px Arial, '-apple-system', Simsun;
    float: left;
    width: calc(100% - 42px);
}

.rank-list .book-list li .name-box a.name {
    overflow: hidden;
    overflow: hidden;
    height: 31px;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #1a1a1a
}

.rank-list .book-list li .name-box a:hover {
    color: #ed4259
}

.rank-list .book-list li .name-box.rec a {
    color: #bf2c24
}

.rank-list .book-list li .name-box.rec .author {
    color: #b3b3b3
}

.rank-list .book-list li .name-box.rec .author:hover {
    color: #ed4259
}

.rank-list .book-list li .name-box.bd0 {
    border-bottom: none
}

.rank-list .book-list li .name-box i.total {
    font: 12px/32px Arial, '-apple-system', Simsun;
    float: right;
    overflow: hidden;
    width: 42px;
    text-align: right;
    white-space: normal;
    text-overflow: ellipsis;
    color: #b3b3b3
}

.rank-list .book-list li .name-box span {
    font: 12px/31px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    position: absolute;
    right: 0;
    text-align: right;
    color: #bfbfbf
}

.rank-list .book-list li .name-box span.up {
    color: #666
}

.sort-list .book-list li .name-box a.name {
    overflow: hidden;
    width: 178px;
    padding-right: 10px;
    white-space: normal;
    text-overflow: ellipsis
}

.roundabout-holder {
    width: 156px;
    height: 112px
}

.roundabout-holder img {
    width: 100%
}

.roundabout {
    position: relative;
    display: none
}

.roundabout li {
    position: absolute;
    width: 84px;
    height: 112px;
    cursor: pointer;
    box-shadow: 0 1px 8px #7f7f7f
}

.roundabout li img {
    height: 100%
}

.roundabout li.book1 {
    z-index: 280;
    top: -13px;
    left: 18px
}

.roundabout li.book2 {
    z-index: 145;
    top: -1px;
    left: 75px
}

.roundabout li.book3 {
    z-index: 145;
    top: -1px;
    left: -20px
}

.info-text {
    width: 192px;
    margin: 0 auto;
    text-align: center
}

.info-text h3 {
    font: 700 16px/24px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    overflow: hidden;
    height: 24px;
    margin-bottom: 5px
}

.info-text h3 a {
    color: #1a1a1a
}

.info-text h3 a:hover {
    color: #ed4259
}

.info-text .author {
    font: 12px/16px Arial, '-apple-system', Simsun;
    padding: 3px 0 5px;
    color: #bf2c24
}

.info-text .author a {
    color: #bf2c24
}

.info-text .author a:hover {
    color: #ed4259
}

.info-text .author em {
    font-family: Arial;
    margin: 0 5px
}

.info-text .total {
    font: 12px/18px Arial, '-apple-system', Simsun;
    margin-bottom: 10px
}

.info-text .total b {
    font-family: Arial;
    font-size: 18px;
    margin-right: 3px;
    vertical-align: middle
}

.info-text .total span {
    vertical-align: middle
}

.info-text .intro {
    font: 12px/20px Arial, '-apple-system', Simsun;
    overflow: hidden;
    height: 70px;
    margin-bottom: 00px;
    text-align: left;
    color: #626260
}

.page-box {
    min-height: 25px;
    padding: 40px 0
}

.page-box .pagination {
    overflow: hidden
}

.page-box .pagination ul {
    float: left
}

.page-box .pagination li {
    float: left;
    margin-right: 10px;
    text-align: center
}

.page-box .pagination li a {
    font: 14px/22px Arial;
    float: left;
    height: 22px;
    padding: 0 7px;
    transition: color .3s, border .3s;
    border: 1px solid #fff
}

.page-box .pagination li a:hover {
    border: 1px solid #ed4259
}

.page-box .pagination .lbf-pagination-next, .page-box .pagination .lbf-pagination-prev {
    font-family: simsun;
    line-height: 24px
}

.page-box .pagination .lbf-pagination-current {
    color: #fff;
    border: 1px solid #ed4259;
    background: #ed4259
}

.page-box .pagination .lbf-pagination-disabled {
    cursor: default;
    color: #ccc
}

.page-box .pagination .lbf-pagination-disabled:hover {
    border: 1px solid #fff;
    background: 0 0
}

.page-box .pagination .lbf-pagination-jump {
    float: left
}

.page-box .pagination .lbf-pagination-jump input {
    font: 12px/22px Arial;
    display: inline-block;
    width: 40px;
    height: 22px;
    margin-right: 10px;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #f2f2f2
}

.page-box .pagination .lbf-pagination-jump input:focus {
    border: 1px solid #bbdaff
}

.page-box .pagination .lbf-pagination-jump .lbf-pagination-go {
    font: 12px/22px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    display: inline-block;
    width: 34px;
    height: 22px;
    transition: color .3s, border .3s;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #f2f2f2
}

.page-box .pagination .lbf-pagination-jump .lbf-pagination-go:hover {
    border: 1px solid #ed4259
}

.simple-tips {
    width: 240px;
    margin: 0 auto;
    padding: 11px 0
}

.banner-wrap {
    position: relative;
    z-index: 1;
    overflow: hidden;
    height: 100px
}

.banner-wrap .op-tag {
    right: 4px
}

.banner-wrap a {
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;
    display: none;
    width: 1200px;
    height: 100px
}

.banner-wrap img {
    display: block;
    width: 1200px;
    height: 100px
}

.banner-wrap embed.embed-fix.fix {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 1200px;
    height: 100px
}

.banner-wrap .la-ball-pulse {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    margin: -5px 0 0 -20px
}

.auto-login {
    position: absolute;
    top: -9999em;
    left: -9999em;
    width: 0;
    height: 0
}

.user-photo {
    position: relative;
    z-index: 1;
    width: 44px;
    height: 44px;
    margin: 8px 8px 0 10px
}

.user-photo a, .user-photo img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 100%
}

.user-photo .user-level {
    position: absolute;
    z-index: 1;
    bottom: -2px;
    left: 50%;
    margin-left: -15px;
    text-indent: -9999em
}

.level {
    font: 12px/16px Arial, '-apple-system', Simsun;
    display: inline-block;
    width: 30px;
    height: 16px;
    text-align: center;
    vertical-align: 0;
    color: #fff
}

.level.zhangmen {
    background: #bf2c24
}

.level.xuetu {
    background: #e7c100
}

.top-op-box {
    height: 60px
}

.top-game-op {
    position: relative;
    z-index: 1;
    display: none;
    overflow: hidden;
    height: 60px
}

.top-game-op img {
    display: block;
    width: 1200px;
    height: 60px
}

.top-game-op .game-wrap {
    position: relative;
    z-index: 1;
    width: 1200px;
    margin: 0 auto
}

.top-game-op .game-wrap .la-ball-pulse {
    position: absolute;
    z-index: 1;
    top: 24px;
    left: 50%;
    margin-left: -22px
}

.top-game-op a:first-child {
    position: absolute;
    z-index: 2;
    top: 17px;
    right: 0;
    width: 20px;
    height: 20px;
    background: #666;
    background: rgba(0, 0, 0, .3)
}

.top-game-op a:first-child em {
    font-size: 16px;
    position: absolute;
    top: 2px;
    left: 2px;
    color: #fff
}

.top-game-op a + a {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 50%;
    width: 1200px;
    height: 60px;
    margin-left: -600px
}

.la-ball-spin-clockwise, .la-ball-spin-clockwise > i {
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.la-ball-spin-clockwise {
    font-size: 0;
    display: block;
    width: 16px;
    height: 16px;
    color: #fff
}

.la-ball-spin-clockwise.la-dark {
    color: #333
}

.la-ball-spin-clockwise > i {
    display: inline-block;
    float: none;
    border: 0 solid currentColor;
    background-color: currentColor
}

.la-ball-spin-clockwise > i {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 4px;
    height: 4px;
    margin-top: -2px;
    margin-left: -2px;
    -webkit-animation: ball-spin-clockwise 1s infinite ease-in-out;
    -moz-animation: ball-spin-clockwise 1s infinite ease-in-out;
    -o-animation: ball-spin-clockwise 1s infinite ease-in-out;
    animation: ball-spin-clockwise 1s infinite ease-in-out;
    border-radius: 100%
}

.la-ball-spin-clockwise > i:nth-child(1) {
    top: 5%;
    left: 50%;
    -webkit-animation-delay: -.875s;
    -moz-animation-delay: -.875s;
    -o-animation-delay: -.875s;
    animation-delay: -.875s
}

.la-ball-spin-clockwise > i:nth-child(2) {
    top: 18.1801948466%;
    left: 81.8198051534%;
    -webkit-animation-delay: -.75s;
    -moz-animation-delay: -.75s;
    -o-animation-delay: -.75s;
    animation-delay: -.75s
}

.la-ball-spin-clockwise > i:nth-child(3) {
    top: 50%;
    left: 95%;
    -webkit-animation-delay: -.625s;
    -moz-animation-delay: -.625s;
    -o-animation-delay: -.625s;
    animation-delay: -.625s
}

.la-ball-spin-clockwise > i:nth-child(4) {
    top: 81.8198051534%;
    left: 81.8198051534%;
    -webkit-animation-delay: -.5s;
    -moz-animation-delay: -.5s;
    -o-animation-delay: -.5s;
    animation-delay: -.5s
}

.la-ball-spin-clockwise > i:nth-child(5) {
    top: 94.9999999966%;
    left: 50.0000000005%;
    -webkit-animation-delay: -.375s;
    -moz-animation-delay: -.375s;
    -o-animation-delay: -.375s;
    animation-delay: -.375s
}

.la-ball-spin-clockwise > i:nth-child(6) {
    top: 81.8198046966%;
    left: 18.1801949248%;
    -webkit-animation-delay: -.25s;
    -moz-animation-delay: -.25s;
    -o-animation-delay: -.25s;
    animation-delay: -.25s
}

.la-ball-spin-clockwise > i:nth-child(7) {
    top: 49.9999750815%;
    left: 5.0000051215%;
    -webkit-animation-delay: -.125s;
    -moz-animation-delay: -.125s;
    -o-animation-delay: -.125s;
    animation-delay: -.125s
}

.la-ball-spin-clockwise > i:nth-child(8) {
    top: 18.179464974%;
    left: 18.1803700518%;
    -webkit-animation-delay: 0s;
    -moz-animation-delay: 0s;
    -o-animation-delay: 0s;
    animation-delay: 0s
}

.la-ball-spin-clockwise.la-sm {
    width: 16px;
    height: 16px
}

.la-ball-spin-clockwise.la-sm > i {
    width: 4px;
    height: 4px;
    margin-top: -2px;
    margin-left: -2px
}

.la-ball-spin-clockwise.la-2x {
    width: 64px;
    height: 64px
}

.la-ball-spin-clockwise.la-2x > i {
    width: 16px;
    height: 16px;
    margin-top: -8px;
    margin-left: -8px
}

.la-ball-spin-clockwise.la-3x {
    width: 96px;
    height: 96px
}

.la-ball-spin-clockwise.la-3x > i {
    width: 24px;
    height: 24px;
    margin-top: -12px;
    margin-left: -12px
}

@-webkit-keyframes ball-spin-clockwise {
    0%, 100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
    20% {
        opacity: 1
    }
    80% {
        -webkit-transform: scale(0);
        transform: scale(0);
        opacity: 0
    }
}

@-moz-keyframes ball-spin-clockwise {
    0%, 100% {
        -moz-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
    20% {
        opacity: 1
    }
    80% {
        -moz-transform: scale(0);
        transform: scale(0);
        opacity: 0
    }
}

@-o-keyframes ball-spin-clockwise {
    0%, 100% {
        -o-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
    20% {
        opacity: 1
    }
    80% {
        -o-transform: scale(0);
        transform: scale(0);
        opacity: 0
    }
}

@keyframes ball-spin-clockwise {
    0%, 100% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
    20% {
        opacity: 1
    }
    80% {
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        -o-transform: scale(0);
        transform: scale(0);
        opacity: 0
    }
}

:root .la-ball-pulse {
    font-size: 0;
    text-align: center
}

:root .la-ball-pulse span {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0 8px 0 0;
    animation: ball-pulse 1s ease infinite;
    border-radius: 100%;
    background: #666
}

:root .la-ball-pulse span:nth-child(1) {
    animation-delay: -.2s
}

:root .la-ball-pulse span:nth-child(2) {
    animation-delay: -.1s
}

:root .la-ball-pulse span:nth-child(3) {
    animation-delay: 0s
}

@-webkit-keyframes ball-pulse {
    0%, 100%, 60% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
    30% {
        -webkit-transform: scale(.01);
        transform: scale(.01);
        opacity: .1
    }
}

@-moz-keyframes ball-pulse {
    0%, 100%, 60% {
        -moz-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
    30% {
        -moz-transform: scale(.01);
        transform: scale(.01);
        opacity: .1
    }
}

@-o-keyframes ball-pulse {
    0%, 100%, 60% {
        -o-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
    30% {
        -o-transform: scale(.01);
        transform: scale(.01);
        opacity: .1
    }
}

@keyframes ball-pulse {
    0%, 100%, 60% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
    30% {
        -webkit-transform: scale(.01);
        -moz-transform: scale(.01);
        -o-transform: scale(.01);
        transform: scale(.01);
        opacity: .1
    }
}

@-webkit-keyframes flipInX {
    0% {
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0
    }
    40% {
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg)
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
    }
    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

@keyframes flipInX {
    0% {
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0
    }
    40% {
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg)
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
    }
    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

.flipInX {
    -webkit-animation-name: flipInX;
    animation-name: flipInX;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important
}

@-webkit-keyframes bounceIn {
    0%, 100%, 20%, 40%, 60%, 80% {
        -webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3);
        opacity: 0
    }
    20% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05)
    }
    40% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    60% {
        -webkit-transform: scale3d(1.01, 1.01, 1.01);
        transform: scale3d(1.01, 1.01, 1.01);
        opacity: 1
    }
    80% {
        -webkit-transform: scale3d(.97, .97, .97);
        transform: scale3d(.97, .97, .97)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
        opacity: 1
    }
}

@keyframes bounceIn {
    0%, 100%, 20%, 40%, 60%, 80% {
        -webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3);
        opacity: 0
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    40% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    60% {
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03);
        opacity: 1
    }
    80% {
        -webkit-transform: scale3d(.97, .97, .97);
        transform: scale3d(.97, .97, .97)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
        opacity: 1
    }
}

.bounceIn {
    animation-name: bounceIn;
    animation-duration: 1s
}

@-webkit-keyframes fadeinT {
    0% {
        -webkit-transform: translateY(-10px);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        opacity: 1
    }
}

@-moz-keyframes fadeinT {
    0% {
        -moz-transform: translateY(-10px);
        opacity: 0
    }
    100% {
        -moz-transform: translateY(0);
        opacity: 1
    }
}

@-ms-keyframes fadeinT {
    0% {
        -ms-transform: translateY(-10px);
        opacity: 0
    }
    100% {
        -ms-transform: translateY(0);
        opacity: 1
    }
}

@keyframes fadeinT {
    0% {
        transform: translateY(-10px);
        opacity: 0
    }
    100% {
        transform: translateY(0);
        opacity: 1
    }
}

@-webkit-keyframes tinydown {
    0%, 5% {
        -webkit-transform: translateY(-10px);
        opacity: 0
    }
    10% {
        -webkit-transform: translateY(-10px);
        opacity: 1
    }
    to {
        -webkit-transform: translateY(0)
    }
}

@keyframes tinydown {
    0%, 5% {
        transform: translateY(-10px);
        opacity: 0
    }
    10% {
        transform: translateY(-10px);
        opacity: 1
    }
    to {
        transform: translateY(0)
    }
}

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

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

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

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

.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown
}

.pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse;
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}

@keyframes pulse {
    0% {
        transform: scale(.9);
        opacity: .9
    }
    50% {
        transform: scale(1);
        opacity: 1
    }
    100% {
        transform: scale(.9);
        opacity: .9
    }
}

@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scale(.95);
        opacity: .9
    }
    50% {
        -webkit-transform: scale(1);
        opacity: 1
    }
    100% {
        -webkit-transform: scale(.95);
        opacity: .9
    }
}

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

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

.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft
}

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

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

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight
}

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

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

.fadeOutRight {
    -webkit-animation-name: fadeOutRight;
    animation-name: fadeOutRight
}

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

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

.fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft
}

.lbf-autocomplete-suggestions {
    transform: translateZ(10px) !important
}

.edit-rec-wrap .edit-rec-list, .focus-wrap .notice-wrap .attention, .hot-classify-wrap .hot-book-list dd, .score-list li {
    overflow: hidden
}

.update-wrap .update-list-wrap .update-tab {
    border-bottom: 1px solid #666
}

.edit-rec-wrap .edit-rec p.line, .hot-classify-wrap li .book-wrap.bd, .update-wrap .update-list-wrap .update-list table td {
    border-bottom: 1px solid #ebebeb
}

.center-book-list .line, .edit-rec-wrap .focus-today, .update-wrap .god-wrap .god-list ul li, .update-wrap .update-rec-list ul li {
    border-bottom: 1px solid #e6e6e6
}

body {
    background-repeat: no-repeat;
    background-position: 50% 36px
}

.top-op-box {
    height: auto !important
}

.index .pin-nav-wrap {
    z-index: 99;
    visibility: hidden
}

.index .pin-nav-wrap.show {
    visibility: visible
}

.focus-wrap {
    position: relative;
    z-index: 1;
    height: 410px
}

.focus-wrap .focus-box {
    width: 683px;
    padding-left: 10px
}

.focus-wrap .focus-box .focus-slider {
    width: 100%;
    height: 280px
}

.focus-wrap .focus-box .focus-slider .lbf-slides {
    position: relative;
    z-index: 1;
    overflow: hidden;
    width: 100%;
    height: 279px
}

.focus-wrap .focus-box .focus-slider .lbf-slides .more {
    position: absolute;
    z-index: 3;
    right: 0;
    bottom: 0;
    width: 36px;
    height: 36px;
    padding: 0;
    border-right: none;
    background: #333;
    background: rgba(0, 0, 0, .7)
}

.focus-wrap .focus-box .focus-slider .lbf-slides .more i {
    display: block;
    padding: 6px 0 0 9px
}

.focus-wrap .focus-box .focus-slider .lbf-slides .more em {
    display: inline-block;
    width: 4px;
    height: 4px;
    margin-left: 2px;
    vertical-align: middle;
    border-radius: 100%;
    background: #fff
}

.focus-wrap .focus-box .focus-slider .lbf-slides .la-ball-pulse {
    position: absolute;
    top: 100px;
    left: 50%;
    margin-left: -20px
}

.focus-wrap .focus-box .focus-slider .lbf-slides li {
    position: absolute;
    z-index: 1;
    top: -49px;
    left: 0;
    display: none;
    transition-timing-function: ease-in-out !important;
    transition-duration: .5s !important
}

.focus-wrap .focus-box .focus-slider .lbf-slides li a, .focus-wrap .focus-box .focus-slider .lbf-slides li img {
    display: block;
    width: 748px
}

.focus-wrap .focus-box .focus-slider .lbf-slides li#item1 {
    display: block
}

.focus-wrap .focus-box .focus-slider .lbf-slides li .op-tag {
    bottom: 38px
}

.focus-wrap .focus-box .focus-slider .lbf-slides .thumb {
    position: absolute;
    z-index: 2;
    bottom: 0;
    left: -1px;
    width: 102%
}

.focus-wrap .focus-box .focus-slider .lbf-slides .thumb a {
    font: 14px/33px Arial, '-apple-system', Simsun;
    zoom: 1;
    width: 18.24%;
    height: 32px;
    padding: 0 5px;
    text-align: center;
    white-space: normal;
    color: #fff;
    border: none;
    border-right: 1px solid #aaa;
    border-right: 1px solid rgba(255, 255, 255, .4);
    border-left: 1px solid #aaa;
    border-left: 1px solid rgba(255, 255, 255, .4);
    background: #333;
    background: rgba(0, 0, 0, .7)
}

.focus-wrap .focus-box .focus-slider .lbf-slides .thumb a.active {
    font-weight: 700;
    background: #ed4259
}

.focus-wrap .focus-box .focus-slider .lbf-slides .thumb a .yxtd {
    font-size: 16px;
    display: inline-block;
    min-width: 16px;
    margin: -3px 5px 0 0;
    vertical-align: middle;
    opacity: .9;
    color: #ffeea8;
    -webkit-text-stroke-width: 0
}

.focus-wrap .focus-box .focus-slider .lbf-slides .thumb a.game-link {
    color: #ffeea8
}

.focus-wrap .focus-box .focus-img li {
    position: relative;
    z-index: 1;
    float: left;
    overflow: hidden;
    width: 33.33%;
    height: 160px;
    transition: box-shadow .5s;
    text-align: center;
}

.focus-wrap .focus-box .focus-img li img {
    display: block;
    margin: 20px auto 0
}

.focus-wrap .focus-box .focus-img li:hover {
    z-index: 2;
    box-shadow: 0 5px 16px #d9d4c7
}

.focus-wrap .notice-wrap .notice {
    overflow: hidden;
    position: relative;
    width: 214px;
    margin-bottom: 10px;
    text-align: center;
    border: 1px solid #e6e6e6;
    background: #fcfcfa
}

.focus-wrap .notice-wrap .notice .more {
    position: absolute;
    top: 0;
    right: 0;
    overflow: hidden;
    width: 25px;
    height: 25px;
    background: #a6a6a6
}

.focus-wrap .notice-wrap .notice .more em {
    padding: 11px 0 0 3px
}

.focus-wrap .notice-wrap .notice h3 {
    font: 700 16px/1 Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    overflow: hidden;
    width: 160px;
    height: 16px;
    margin: 0 auto 10px;
    padding-top: 10px
}

.focus-wrap .notice-wrap .notice .notice-list {
}

.focus-wrap .notice-wrap .notice .notice-list li {
    padding: 7px 5px 7px 10px;
    font: 14px/25px Arial, '-apple-system', Simsun;
    list-style: disc;
    list-style-position: inside;
    text-align: left;
    float: left;
    width: 100%;
    box-sizing: border-box;
}

.focus-wrap .notice-wrap .notice .notice-list li.odd {
    background: #f7f6f2;
}

.focus-wrap .notice-wrap .notice .notice-list li.hot-notice {
    margin-bottom: 0;
    list-style: none;
}

.focus-wrap .notice-wrap .notice .notice-list li.hot-notice span {
    float: left;
    margin-right: 6px;
    color: #bf2c24;
    font-size: 15px;
    margin-left: -4px;
}

.focus-wrap .notice-wrap .notice .notice-list li a {
    margin-left: -6px;
    color: #262626;
    width: 100%;
    white-space: normal;
    text-overflow: ellipsis;
    padding-left: 19px;
    margin-top: -25px;
    display: inline-block;
    float: left;
    box-sizing: border-box;
}

.focus-wrap .notice-wrap .notice .notice-list li.hot-notice a {
    margin-left: 0 -3px;
}

.focus-wrap .notice-wrap .notice .notice-list li a:hover {
    color: #ed4259;
}

.loaded a {
    transition: color .3s, background-color .3s;
}

.focus-wrap .notice-wrap .notice .notice-list li a i {
    font-family: Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif
}

.focus-wrap .notice-wrap .notice .notice-list li a em {
    font: 12px/18px Arial, '-apple-system', Simsun;
    display: inline-block;
    width: 38px;
    height: 18px;
    margin: -2px 10px 0 8px;
    text-align: center;
    vertical-align: middle;
    color: #fff;
    background: #bf2c24
}

.focus-wrap .notice-wrap .notice .notice-list li.color-type_1 a {
    color: #bf2c24
}

.focus-wrap .notice-wrap .notice .notice-list li.color-type_1 a:hover {
    color: #ed4259
}

.focus-wrap .notice-wrap .attention .word_slide {
    line-height: 22px;
    position: relative;
    overflow: hidden;
    height: 22px;
    color: #666
}

.focus-wrap .notice-wrap .attention .word_slide li {
    position: absolute;
    left: 33px;
    display: none
}

.focus-wrap .notice-wrap .attention em {
    font-size: 16px;
    position: absolute;
    top: 0;
    left: 12px;
    width: 16px;
    height: 16px;
    color: #bf2c24
}

.focus-wrap .notice-wrap .attention a {
    font: 14px/22px Arial, '-apple-system', Simsun;
    float: left;
    overflow: hidden;
    width: 170px;
    height: 22px;
    text-align: left
}

.focus-wrap .notice-wrap .attention a:hover {
    color: #ed4259
}

.focus-wrap .notice-banner {
    position: relative;
    width: 216px;
    height: 150px
}

.focus-wrap .notice-banner .la-ball-pulse {
    position: absolute;
    top: 68px;
    left: 85px
}

.focus-wrap .notice-banner a, .focus-wrap .notice-banner img {
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;
    width: 216px;
    height: 150px
}

.focus-wrap .notice-banner a {
    display: none
}

.focus-wrap .notice-banner embed.embed-fix.fix {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 216px;
    height: 150px
}

.focus-wrap .focus-game-wrap {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 226px;
    display: none;
    width: 748px;
    height: 410px
}

.focus-wrap .focus-game-wrap .game-link {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.focus-wrap .focus-game-wrap embed.embed-fix.fix {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 748px;
    height: 410px
}

.focus-wrap .focus-game-wrap p {
    font: 14px/30px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    position: absolute;
    z-index: 3;
    top: 0;
    right: 0;
    overflow: hidden;
    color: #fff
}

.focus-wrap .focus-game-wrap p em {
    float: left;
    padding: 0 10px;
    background: #26292b;
    background: rgba(0, 0, 0, .3)
}

.focus-wrap .focus-game-wrap p em i {
    font-family: Arial;
    margin: 0 5px;
    color: red
}

.focus-wrap .focus-game-wrap p a {
    float: right;
    padding: 0 8px;
    text-align: center;
    color: #fff;
    background: #666;
    background: rgba(0, 0, 0, .6)
}

:root .notice .more i {
    position: absolute;
    top: -15px;
    right: -15px;
    width: 50px;
    height: 50px;
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
    background: #fcfcfa;
    -webkiet-transform: rotate(45deg)
}


.index-two-wrap .book-list ul {
    overflow: hidden;
}

.index-two-wrap .book-list-wrap .book-list li strong {
    position: relative;
    float: left;
    width: 134px;
    margin-left: -3px;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #1a1a1a
}

.index-two-wrap .book-list-wrap .book-list li .rec {
    width: 84px;
}

.index-two-wrap .book-list-wrap .book-list li strong .name {
    margin-left: 5px;
}

.index-two-wrap .book-list-wrap .book-list li strong .hot {
    position: absolute;
    top: 2px;
    right: -20px;
    width: 17px;
    height: 9px;
    background: url(/qd/images/common/tag.7a994.png) 0 -24px no-repeat
}

.edit-rec-wrap {
    width: 708px
}

.edit-rec-wrap h3 {
    width: 100%
}

.edit-rec-wrap .edit-rec {
    overflow: hidden;
    width: 736px;
}

.edit-rec-wrap .edit-rec .rel {
    position: relative
}

.edit-rec-wrap .edit-rec p.line {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 708px
}

.edit-rec-wrap .focus-today {
    height: 137px;
    padding: 30px 0
}

.edit-rec-wrap .focus-today .slider-wrap {
    position: relative;
    width: 277px;
    height: 124px
}

.edit-rec-wrap .focus-today .slider-wrap:hover .nextButton, .edit-rec-wrap .focus-today .slider-wrap:hover .prevButton {
    opacity: 1
}

.edit-rec-wrap .focus-today .carousel {
    position: relative;
    padding-left: 20px;
    padding-right: 13px;
}

.edit-rec-wrap .focus-today .carousel .la-ball-pulse {
    position: absolute;
    z-index: 300;
    top: 52px;
    left: 130px
}

.edit-rec-wrap .focus-today .carousel .shadow {
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: 0;
    overflow: hidden;
    width: 93px
}

.edit-rec-wrap .focus-today .carousel .slides {
    position: relative;
    width: 272px;
    height: 124px;
    margin-left: 5px;
    overflow: hidden;
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem {
    position: absolute;
    overflow: visible;
    cursor: pointer
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem img {
    height: 100%;
    box-shadow: 0 1px 3px #999
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem a {
    display: block
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item1 {
    z-index: 6;
    top: 0;
    right: 0;
    width: 93px;
    height: 136.4px;
    opacity: 1
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item1 img {
    width: 93px;
    height: 124px
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item2 {
    z-index: 5;
    top: 12.4px;
    right: -44.64px;
    width: 74.4px;
    height: 109.12px;
    opacity: 1
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item2 img {
    display: inline-block;
    width: 74.4px;
    height: 99.2px
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item3 {
    z-index: 4;
    top: 22.32px;
    right: -80.352px;
    width: 59.52px;
    height: 87.296px;
    opacity: 1
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item3 img {
    width: 59.52px;
    height: 79.36px
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item4 {
    z-index: 3;
    top: 30.256px;
    right: -108.922px;
    display: none;
    width: 47.616px;
    height: 69.8368px;
    opacity: 0
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item4 img {
    width: 47.616px;
    height: 63.488px
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item5 {
    z-index: 3;
    top: 30.256px;
    right: 154.306px;
    display: none;
    width: 47.616px;
    height: 69.8368px;
    opacity: 0
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item5 img {
    width: 47.616px;
    height: 63.488px
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item6 {
    z-index: 4;
    top: 22.32px;
    right: 113.832px;
    width: 59.52px;
    height: 87.296px;
    opacity: 1
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item6 img {
    width: 59.52px;
    height: 79.36px
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item7 {
    z-index: 5;
    top: 12.4px;
    right: 63.24px;
    width: 74.4px;
    height: 109.12px;
    opacity: 1
}

.edit-rec-wrap .focus-today .carousel .slides .slideItem.item7 img {
    width: 74.4px;
    height: 99.2px
}

.edit-rec-wrap .focus-today .carousel .buttonNav {
    position: absolute;
    z-index: 10;
    top: 142px;
    left: 98px
}

.edit-rec-wrap .focus-today .carousel .buttonNav .bullet {
    float: left;
    width: 8px;
    height: 8px;
    margin: 0 7px 0 0;
    cursor: pointer;
    border-radius: 100%;
    background: #ddd
}

.edit-rec-wrap .focus-today .carousel .buttonNav .bulletActive {
    margin-top: -2px;
    border: 2px solid #ed4259;
    background: 0 0
}

.edit-rec-wrap .focus-today .carousel .nextButton, .edit-rec-wrap .focus-today .carousel .prevButton {
    position: absolute;
    z-index: 10;
    top: 48px;
    cursor: pointer;
    transition: all .5s;
    opacity: 0;
    color: #a6a6a6
}

.edit-rec-wrap .focus-today .carousel .nextButton:hover, .edit-rec-wrap .focus-today .carousel .prevButton:hover {
    color: #1a1a1a
}

.edit-rec-wrap .focus-today .carousel .nextButton {
    right: -20px
}

.edit-rec-wrap .focus-today .carousel .prevButton {
    left: -5px
}

.edit-rec-wrap .focus-today .description {
    position: absolute;
    top: 10px;
    left: 328px;
    width: 390px
}

.edit-rec-wrap .focus-today .description h3 {
    font-size: 18px;
    overflow: hidden;
    overflow: hidden;
    width: 380px;
    height: 24px;
    margin-top: -3px;
    margin-bottom: 9px;
    white-space: nowrap;
    text-overflow: ellipsis
}

.edit-rec-wrap .focus-today .description h3 a {
    color: #1a1a1a
}

.edit-rec-wrap .focus-today .description h3 a:hover {
    color: #ed4259
}

.edit-rec-wrap .focus-today .description p {
    font: 14px/24px Arial, '-apple-system', Simsun;
    overflow: hidden;
    height: 48px;
    margin-bottom: 14px;
    color: #666
}

.edit-rec-wrap .focus-today .description .desc-wrap .read-btn{
    color: #fff;
}

.edit-rec-wrap .focus-today .description .desc-wrap.act, .edit-rec-wrap .focus-today .description .desc-wrap.item1 {
    display: block
}

.edit-rec-wrap .edit-rec-list {
    padding: 27px 0 28px
}

.edit-rec-wrap .edit-rec-list li {
    float: left;
    width: 216px;
    margin-left: 30px
}

.edit-rec-wrap .edit-rec-list li:first-child {
    margin-left: 0
}

.edit-rec-wrap .edit-rec-list li h3 {
    overflow: hidden;
    height: 20px
}

.edit-rec-wrap .edit-rec-list li h3 a {
    font: 16px/20px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    color: #1a1a1a
}

.edit-rec-wrap .edit-rec-list li h3 a:hover {
    color: #ed4259
}

.edit-rec-wrap .edit-rec-list li h3 b {
    font: 14px/20px Arial, '-apple-system', Simsun;
    display: inline-block;
    overflow: hidden;
    max-width: 124px;
    vertical-align: middle;
    white-space: nowrap;
    text-overflow: ellipsis
}

.edit-rec-wrap .edit-rec-list li em {
    display: block;
    overflow: hidden;
    height: 21px;
    padding: 2px 0 4px;
    color: #bf2c24
}

.edit-rec-wrap .edit-rec-list li em cite {
    font-family: Arial;
    font-size: 16px;
    font-weight: 700;
    margin-right: 3px;
    vertical-align: middle
}

.edit-rec-wrap .edit-rec-list li em i {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    vertical-align: middle
}

.edit-rec-wrap .edit-rec-list li p {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    line-height: 20px;
    overflow: hidden;
    height: 36px;
    color: #666
}

.edit-rec-img-list li {
    float: left;
    overflow: hidden;
    width: 339px;
    height: 100px;
    background: #f7f6f2
}

.edit-rec-img-list li .hover-box {
    position: absolute;
    z-index: 1;
    width: 339px;
    height: 94px;
    transition: box-shadow .5s
}

.edit-rec-img-list li .hover-box:hover {
    box-shadow: 0 5px 16px #d9d4c7
}

.edit-rec-img-list li .book-info {
    float: left;
    width: 228px;
    margin: 14px 0 0 14px
}

.edit-rec-img-list li .book-info h3 {
    overflow: hidden;
    height: 21px;
    margin-bottom: 5px
}

.edit-rec-img-list li .book-info h3 a {
    font: 700 16px/21px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    color: #0060bf
}

.edit-rec-img-list li .book-info h3 a:hover {
    color: #ed4259
}

.edit-rec-img-list li .book-info p {
    font: 12px/20px Arial, '-apple-system', Simsun;
    overflow: hidden;
    height: 38px
}

.edit-rec-img-list li .book-img {
    float: right;
    width: 51px;
    height: 68px;
    margin: 12px 14px 0 0
}

.edit-rec-img-list li .book-img a {
    display: block;
    width: 51px;
    height: 68px
}

.edit-rec-img-list li:first-child {
    margin-right: 30px
}

.edit-rec-img-list li:first-child h3 a {
    color: #fc6c28
}

.edit-rec-img-list li:first-child h3 a:hover {
    color: #ed4259
}

.rank-list-row {
    overflow: hidden;
    width: 101%;
    height: 423px
}

.rank-wrap .load-more {
    font: 14px/1 Arial, '-apple-system', Simsun;
    position: relative;
    display: block;
    width: 70px;
    height: 19px;
    margin-right: auto;
    margin-bottom: 20px;
    margin-left: auto;
    color: #3f5a93
}

.rank-wrap .load-more span {
    position: absolute;
    top: 5px;
    right: -3px;
    width: 0;
    height: 0;
    border-top: 5px solid #3f5a93;
    border-right: 5px solid transparent;
    border-bottom: 0 none;
    border-left: 5px solid transparent
}

.rank-wrap .load-more span i {
    position: absolute;
    top: -7px;
    right: -5px;
    width: 0;
    height: 0;
    border-top: 5px solid #fff;
    border-right: 5px solid transparent;
    border-bottom: 0 none;
    border-left: 5px solid transparent
}

.rank-wrap .load-more span.up {
    border-top: 0 none;
    border-bottom: 5px solid #3f5a93
}

.rank-wrap .load-more span.up i {
    top: 2px;
    border-top: 0 none;
    border-bottom: 5px solid #fff
}

.rank-wrap .load-more:hover {
    color: #2972cc
}

.rank-wrap .load-more:hover span {
    border-top: 5px solid #2972cc
}

.rank-wrap .load-more:hover span.up {
    border-top: none;
    border-bottom: 5px solid #2972cc
}

.hot-work-box {
    width: 216px;
    margin-right: 30px
}

.hot-work-box h3.wrap-title {
    font-family: arial;
    font-size: 22px;
    line-height: 30px;
    overflow: hidden;
    padding-bottom: 8px
}

.hot-work-box .hot-work-info {
    overflow: hidden;
    height: 395px;
    background: #f7f5f0
}

.hot-work-box .read-btn {
    margin: 0 auto
}

.hot-work-box .hot-work-slide {
    margin-bottom: 185px;
    padding: 24px 0
}

.hot-classify-wrap {
    width: 954px;
    height: 391px;
    padding-top: 4px
}

.hot-classify-wrap li {
    position: relative;
    z-index: 1;
    float: left;
    width: 216px;
    margin: 0 30px 45px 0
}

.hot-classify-wrap li .book-wrap {
    padding: 0 0 5px
}

.hot-classify-wrap li .book-wrap.bd {
    margin-bottom: 13px
}

.hot-classify-wrap li .book-wrap .book-info {
    width: 144px
}

.hot-classify-wrap li .book-wrap .book-info .digital {
    height: auto
}

.hot-classify-wrap li .book-wrap .book-info .digital em {
    font-size: 14px
}

.hot-classify-wrap li.erciyuan .hot-book-list dd a.classify {
    width: 70px
}

.hot-classify-wrap li.erciyuan .hot-book-list dd a.name {
    max-width: 150px
}

.hot-classify-wrap li.mr0 {
    margin-right: 0
}

.hot-classify-wrap h3.wrap-title {
    position: relative;
    overflow: visible;
    margin-bottom: 5px
}

.hot-classify-wrap h3.wrap-title .icon-tag {
    position: absolute;
    top: -10px;
    right: -1px;
    overflow: hidden;
    background-image: url(/qd/images/index/hot-classify-tag_1x.bc44f.png)
}

.hot-classify-wrap h3.wrap-title .icon-tag.ds {
    top: -8px;
    right: -2px;
    width: 46px;
    height: 36px;
    background-position: 0 0
}

.hot-classify-wrap h3.wrap-title .icon-tag.ecy {
    top: -8px;
    right: 0;
    width: 52px;
    height: 40px;
    background-position: 0 -36px
}

.hot-classify-wrap h3.wrap-title .icon-tag.jsls {
    top: -8px;
    width: 47px;
    height: 43px;
    background-position: 0 -76px
}

.hot-classify-wrap h3.wrap-title .icon-tag.khly {
    top: -7px;
    width: 57px;
    height: 46px;
    background-position: 0 -119px
}

.hot-classify-wrap h3.wrap-title .icon-tag.wxxx {
    right: -2px;
    width: 45px;
    height: 39px;
    background-position: 0 -167px
}

.hot-classify-wrap h3.wrap-title .icon-tag.xhqh {
    width: 41px;
    height: 39px;
    background-position: 0 -206px
}

.hot-classify-wrap h3.wrap-title .icon-tag.yxjj {
    top: -5px;
    right: -6px;
    width: 52px;
    height: 42px;
    background-position: 0 -245px
}

.hot-classify-wrap .hot-book-list dd a {
    font: 14px/32px Arial, '-apple-system', Simsun;
    float: left;
    margin-left: -8px;
    color: #1a1a1a
}

.hot-classify-wrap .hot-book-list dd a:hover {
    color: #ed4259
}

.hot-classify-wrap .hot-book-list dd a.classify {
    overflow: hidden;
    width: 56px;
    height: 32px;
    margin-right: 5px;
    color: grey
}

.hot-classify-wrap .hot-book-list dd a.classify:hover {
    color: #ed4259
}

.hot-classify-wrap .hot-book-list dd a.classify em {
    font-family: Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    font-size: 13px
}

.hot-classify-wrap .hot-book-list dd a.name {
    overflow: hidden;
    max-width: 168px;
    height: 32px
}

.left-wrap {
    width: 100%
}

.left-wrap .wrap-title {
    margin-top: -2px;
    padding-bottom: 6px
}

.left-wrap .wrap-title span {
    font: 12px/20px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    display: inline-block;
    margin-top: 4px;
    margin-left: 8px;
    vertical-align: middle;
    color: #3f5a93
}

.left-wrap .wrap-title span {
    color: #666
}

.left-wrap:hover .more {
    display: inline
}

.left-wrap .left-info {
    overflow: hidden;
    width: 216px;
    height: 395px;
    background: #f7f5f0
}

.left-wrap .left-info .read-btn {
    margin: 0 auto
}

.left-wrap .left-info .slide-box {
    position: relative;
    z-index: 1;
    height: auto;
    padding: 20px 30px 0
}

.left-wrap .left-info .slide-box a img {
    max-width: 100%;
    max-height: 210px;
}
.left-wrap .left-info .slide-box li{
    text-align: center;
}

.left-wrap .left-info .slide-box .la-ball-pulse {
    position: absolute;
    z-index: 300;
    top: 70px;
    left: 88px
}

.info-text dd {
    display: none
}

.info-text dd:first-child {
    display: block
}

.finish-book-wrap:hover .more {
    opacity: 100
}

.finish-book-wrap h3.wrap-title span {
    margin-right: 10px
}

.center-book-list {
    position: relative;
    width: calc(100% - 216px)
}

.center-book-list .line {
    position: absolute;
    left: 30px;
    width: calc(100% - 30px)
}

.center-book-list .line.line1 {
    top: 138px
}

.center-book-list .line.line2 {
    top: 276px
}

.center-book-list ul {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 395px;
    padding: 20px 0 0 30px;
    box-sizing: border-box
}

.center-book-list ul li {
    float: left;
    width: 305px;
    height: 96px;
    margin: 0 15px 43px 0
}

.center-book-list ul li.fl-right {
    margin-right: 0;
}

.center-book-list ul li.mr0 {
    margin-right: 0
}

.center-book-list ul li.mb0 {
    margin-bottom: 0
}

.center-book-list ul li .book-img, .center-book-list ul li .book-info {
    float: left
}

.center-book-list ul li .book-info {
    width: calc(100% - 84px)
}

.center-book-list ul li .book-info h3 {
    font: 16px/21px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    overflow: hidden;
    height: 21px;
    margin-top: -3px;
    margin-bottom: 8px
}

.center-book-list ul li .book-info h3 a {
    color: #1a1a1a
}

.center-book-list ul li .book-info h3 a:hover {
    color: #ed4259
}

.center-book-list ul li .book-info p {
    font: 12px/20px Arial, '-apple-system', Simsun;
    overflow: hidden;
    height: 40px;
    margin-bottom: 10px;
    color: #666
}

.center-book-list ul li.no-img {
    width: 30.5%;
    margin-right: 20px
}

.center-book-list ul li.no-img .book-info {
    width: 216px
}

.right-wrap {
    position: relative;
    z-index: 1;
    width: 216px
}

.right-wrap .book-wrap .book-info p.digital {
    height: 20px;
    padding: 4px 0 0;
    font-family: Arial;
}

.right-wrap .book-wrap .book-info p.digital em {
    font-size: 14px
}

.score-list li {
    border-top: 1px solid #e6e6e6
}

.score-list li.unfold {
    border-top: none
}

.score-list .book-wrap .book-info h3 {
    font: 14px/18px Arial, '-apple-system', Simsun
}

.score-list .book-wrap .book-info h4 {
    font-size: 16px
}

.score-list .book-wrap .book-info .score {
    font: 12px/16px Arial, '-apple-system', Simsun;
    overflow: hidden;
    height: 16px;
    padding: 2px 0;
    color: #bf2c24
}

.score-list .book-wrap .book-info .score cite {
    margin: 0 3px
}

.score-list li.unfold {
    overflow: visible;
    height: 114px
}

.score-list li .name {
    font: 14px/31px Arial, '-apple-system', Simsun;
    float: left;
    overflow: hidden;
    width: 160px;
    height: 31px
}

.score-list li i {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    float: right;
    overflow: hidden;
    width: 46px;
    height: 16px;
    margin-top: 8px;
    text-align: right;
    color: #a6a6a6
}

.state-box {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    line-height: 18px
}

.state-box img {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin: -2px 5px 0 0;
    vertical-align: middle
}

.state-box .author {
    display: block;
    overflow: hidden;
    height: 18px;
    margin-top: 2px;
    padding-right: 10px;
    color: #a6a6a6
}

.state-box .author:hover {
    color: inherit
}

.state-box i, .state-box span {
    float: right;
    overflow: hidden;
    padding: 0 3px;
    text-align: center;
    border-radius: 1px
}

.state-box span {
    max-width: 62px;
    height: 18px;
    color: #bf2c24;
    border: 1px solid #df9591
}

.state-box i {
    max-width: 82px;
    height: 18px;
    margin-right: 8px;
    color: #a6a6a6;
    border: 1px solid #bfbfbf
}

.update-wrap .wrap-title span {
    color: grey
}

.update-wrap .update-list-wrap {
    overflow: hidden;
    height: auto
}

.update-wrap .wrap-title {
    position: relative;
    z-index: 1;
    overflow: hidden;
    width: 216px;
    height: 24px;
    white-space: nowrap
}

.update-wrap .wrap-title span {
    font: 12px/20px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    position: absolute;
    top: 6px;
    right: 0;
    color: #666
}

.update-wrap .wrap-title a {
    margin-left: 87px
}

.update-wrap .wrap-title a .more-dashen {
    font-size: 12px
}

.update-wrap .god-wrap .god-list, .update-wrap .update-rec-list {
    overflow: hidden;
    width: 216px;
    height: auto;
}

.update-wrap .god-wrap .god-list ul, .update-wrap .update-rec-list ul {
    width: 192px;
    margin-right: auto;
    margin-left: auto
}

.update-wrap .update-rec-list ul li.no10 {
    border: 0;
}

.update-wrap .god-wrap .god-list ul li.bd0, .update-wrap .update-rec-list ul li.bd0 {
    border-bottom: none
}

.update-wrap .god-wrap .god-list .book-wrap, .update-wrap .update-rec-list .book-wrap {
    padding: 25px 0 12px
}

.update-wrap .god-wrap .god-list .book-wrap .book-info, .update-wrap .update-rec-list .book-wrap .book-info {
    margin-top: 22px
}

.update-wrap .god-wrap .god-list .book-wrap .book-info h4, .update-wrap .god-wrap .god-list .book-wrap .book-info p, .update-wrap .update-rec-list .book-wrap .book-info h4, .update-wrap .update-rec-list .book-wrap .book-info p {
    text-align: right
}

.update-wrap .god-wrap .god-list .book-wrap .book-info h4 a, .update-wrap .update-rec-list .book-wrap .book-info h4 a {
    color: #1a1a1a
}

.update-wrap .god-wrap .god-list .book-wrap .book-info h4 a:hover, .update-wrap .update-rec-list .book-wrap .book-info h4 a:hover {
    color: #ed4259
}

.update-wrap .god-wrap .god-list .book-wrap .book-info .digital, .update-wrap .update-rec-list .book-wrap .book-info .digital {
    font-size: 0;
    height: 20px
}

.update-wrap .god-wrap .god-list .book-wrap .book-info .digital span, .update-wrap .update-rec-list .book-wrap .book-info .digital span {
    font: 12px/20px Arial, '-apple-system', Simsun
}

.update-wrap .god-wrap .god-list .book-wrap .book-info .digital i, .update-wrap .update-rec-list .book-wrap .book-info .digital i {
    font: 12px/20px Arial;
    margin: 0 3px
}

.update-wrap .god-wrap .god-list .book-cover, .update-wrap .update-rec-list .book-cover {
    float: left
}

.update-wrap .god-wrap .god-list p.intro, .update-wrap .update-rec-list p.intro {
    font: 12px/20px Arial, '-apple-system', Simsun;
    overflow: hidden;
    height: 60px;
    color: #666
}

.update-wrap .update-list-wrap {
    width: 738px
}

.update-wrap .update-list-wrap .update-tab {
    height: 24px;
    padding-bottom: 4px;
    float: left;
    width: 713px;
    margin-left: 23px;
}

.update-wrap .update-rec-list ul li {
    line-height: 38px;
    font-size: 14px;
    font-weight: 300;
    font-family: 'Roboto', sans-serif;
    height: 45px;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
    float: left;
    width: 100%;
    padding: 5px 0;
}

.update-rec-list li img {
    height: 30px;
    width: 30px;
    border-radius: 20px;
    margin-right: 10px;
}

.update-rec-list li i.fa {
    position: absolute;
    width: 20px;
    height: 100%;
    left: 1px;
    text-align: center;
    font-size: 27px;
    z-index: 1;
    top: 14px;
}

.update-rec-list li span.no {
    font-weight: 400;
    float: left;
    width: 20px;
    height: 100%;
    text-align: center;
    margin-right: 10px;
    position: relative;
    z-index: 2;
    color: #000;
    font-size: 15px;
    line-height: 40px;
}

.update-rec-list li.no1 span.no, .update-rec-list li.no2 span.no, .update-rec-list li.no3 span.no {
    font-size: 11px;
    color: #fff;
}

.update-rec-list li.no1 i {
    color: #b90000;
}

.update-rec-list li.no2 i {
    color: #cfcf00;
}

.update-rec-list li.no3 i {
    color: darkgreen;
}

.update-rec-list li span {
    float: right;
    font-size: 15px;
    line-height: 40px;
    font-weight: 400;
}

.update-wrap .update-list-wrap .update-tab .blue, .update-wrap .update-list-wrap .update-tab p {
    float: right
}

.update-wrap .update-list-wrap .update-tab a, .update-wrap .update-list-wrap .update-tab span {
    font: 12px/16px Arial, '-apple-system', Simsun;
    float: left;
    margin-top: 7px;
    color: #a6a6a6
}

.update-wrap .update-list-wrap .update-tab a.act {
    font-weight: 700
}

.update-wrap .update-list-wrap .update-tab a.act, .update-wrap .update-list-wrap .update-tab a:hover {
    color: #ed4259
}

.update-wrap .update-list-wrap .update-tab a.blue {
    color: #3f5a93
}

.update-wrap .update-list-wrap .update-tab a.blue:hover {
    color: #2972cc
}

.update-wrap .update-list-wrap .update-tab a em.iconfont {
    font-size: 12px;
    vertical-align: middle
}

.update-wrap .update-list-wrap .update-tab span {
    font-family: Arial;
    font-size: 12px;
    margin-right: 5px;
    margin-left: 5px
}

.update-wrap .update-list-wrap .update-tab span.blue {
    color: #3f5a93
}

.update-wrap .update-list-wrap .update-list {
    width: 708px;
    margin-left: 30px
}

.update-wrap .update-list-wrap .update-list table td {
    height: 31.5px
}

.update-wrap .update-list-wrap .update-list table td a {
    float: left;
    overflow: hidden;
    height: 30px
}

.update-wrap .update-list-wrap .update-list table td a.classify, .update-wrap .update-list-wrap .update-list table td a.name {
    font: 14px/30px Arial, '-apple-system', Simsun;
    color: #1a1a1a
}

.update-wrap .update-list-wrap .update-list table td a.classify {
    margin-left: -7px;
    color: grey
}

.update-wrap .update-list-wrap .update-list table td a.classify em {
    font-family: Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    font-size: 13px
}

.update-wrap .update-list-wrap .update-list table td a.section {
    overflow: hidden;
    max-width: 220px;
    margin-right: 5px;
    white-space: normal;
    text-overflow: ellipsis;
    color: #666
}

.update-wrap .update-list-wrap .update-list table td a.section em {
    margin-right: 5px
}

.update-wrap .update-list-wrap .update-list table td a.author {
    color: #999
}

.update-wrap .update-list-wrap .update-list table td a:hover {
    color: #ed4259
}

.update-wrap .update-list-wrap .update-list table td a.author, .update-wrap .update-list-wrap .update-list table td a.section {
    font: 12px/30px Arial, '-apple-system', Simsun
}

.update-wrap .update-list-wrap .update-list table td a.author:hover, .update-wrap .update-list-wrap .update-list table td a.section:hover {
    color: inherit
}

.update-wrap .update-list-wrap .update-list table td .vip {
    float: left;
    width: 21px;
    height: 12px;
    margin-top: 9px;
    background: url(/qd/images/common/tag.7a994.png) no-repeat 0 0
}

.update-wrap .update-list-wrap .update-list table td i {
    font: 12px/1 Arial;
    float: right;
    margin-top: 3px;
    color: #666
}

.update-wrap .update-list-wrap .update-list table tr.bd0 td {
    border-bottom: none
}

.update-wrap .god-wrap h3.wrap-title {
    font-size: 18px
}

.update-wrap .god-wrap .god-list .god-info {
    overflow: hidden;
    height: 206px
}

.update-wrap .god-wrap .god-list ul {
    width: 192px;
    margin-right: auto;
    margin-left: auto
}

.update-wrap .god-wrap .god-list li {
    position: relative
}

.update-wrap .god-wrap .god-list li .photo {
    position: absolute;
    top: 15px;
    right: 0;
    width: 60px;
    height: 60px
}

.update-wrap .god-wrap .god-list li .photo img {
    width: 60px;
    height: 60px;
    border-radius: 100%
}

.update-wrap .god-wrap .god-list li h3 a {
    display: block;
    overflow: hidden;
    width: 128px;
    height: 21px;
    color: #1a1a1a
}

.update-wrap .god-wrap .god-list li h3 a:hover {
    color: #ed4259
}

.update-wrap .god-wrap .god-list li h4, .update-wrap .god-wrap .god-list li p {
    font-family: Arial, '-apple-system', Simsun;
}

.update-wrap .god-wrap .god-list li h4 {
    font-weight: 400;
    margin-bottom: 5px;
    color: #999
}

.update-wrap .god-wrap .god-list li .type {
    font: 12px/16px Arial, '-apple-system', Simsun;
    overflow: hidden;
    width: 128px;
    height: 16px;
    margin-bottom: 10px
}

.update-wrap .god-wrap .god-list li .works {
    overflow: hidden;
    max-height: 36px;
    margin-bottom: 14px;
    color: #3f5a93
}

.update-wrap .god-wrap .god-list li .works a {
    line-height: 20px;
    color: #3f5a93
}

.update-wrap .god-wrap .god-list li .works a:hover {
    color: #ed4259
}

.update-wrap .god-wrap .god-list li .works span {
    font-family: simsun;
    margin: 0 4px
}

.update-wrap .god-wrap .god-list li .intro {
    overflow: hidden;
    height: 60px
}

.time-limit-wrap {
    height: 222px
}

.time-limit-wrap li {
    position: relative;
    z-index: 1;
    float: left;
    width: 169px;
    height: 220px;
    transition: box-shadow .5s;
    text-align: center
}

.time-limit-wrap li.time-box {
    width: 172px
}

.time-limit-wrap li.time-box .iconfont {
    font-size: 60px;
    display: block;
    height: 60px;
    margin: 10px 0
}

.time-limit-wrap li.time-box:hover {
    border: 1px solid #f7f6f2
}

.time-limit-wrap li.time-box .limit-wrap {
    padding-top: 25px
}

.time-limit-wrap li.time-box h3 {
    font-size: 18px;
    line-height: 21px;
    overflow: hidden;
    height: 21px;
    color: #ed4259
}

.time-limit-wrap li.time-box .type {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    overflow: hidden;
    height: 16px;
    padding: 2px 0;
    color: #999
}

.time-limit-wrap li.time-box .countdown {
    overflow: hidden;
    height: 22px;
    margin-bottom: 10px;
    color: #bf2c24
}

.time-limit-wrap li.time-box .countdown i {
    font: 18px/21px Arial
}

.time-limit-wrap li.time-box .countdown em {
    margin-right: 5px
}

.time-limit-wrap li.time-box .blue {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 14px;
    display: block;
    overflow: hidden;
    height: 19px;
    vertical-align: middle
}

.time-limit-wrap li.time-box .blue span {
    font-family: simsun;
    font-weight: 700;
    display: inline-block;
    margin-top: -2px;
    margin-left: 5px;
    vertical-align: middle
}

.time-limit-wrap li.odd {
    border: 1px solid #f7f6f2;
    background: #f7f6f2
}

.time-limit-wrap li.even {
    border: 1px solid #fcfcfa;
    background: #fcfcfa
}

.time-limit-wrap li .book-img {
    width: 66px;
    height: 88px;
    margin: 20px auto 10px
}

.time-limit-wrap li .book-img a {
    width: 100%;
    height: 100%
}

.time-limit-wrap li .free-blue-btn {
    margin: 0 auto;
    background-image: url(/qd/images/common/blue_btn.182db.png)
}

.time-limit-wrap li .free-blue-btn.disabled {
    cursor: default;
    color: #a6a6a6;
    background-position: 0 -58px
}

.time-limit-wrap li .name {
    font: 16px/21px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    display: block;
    overflow: hidden;
    height: 21px;
    padding: 0 10px;
    color: #1a1a1a
}

.time-limit-wrap li .name:hover {
    color: #ed4259
}

.time-limit-wrap li s {
    font: 12px/14px Arial, '-apple-system', Simsun;
    display: block;
    overflow: hidden;
    height: 14px;
    margin: 8px 0;
    color: #999
}

.time-limit-wrap li:hover {
    position: relative;
    z-index: 3;
    box-shadow: 0 5px 16px #d9d4c7
}

.time-limit-wrap li:first-of-type:hover {
    box-shadow: none
}

.filter-search-wrap {
    height: 80px;
    background: #f2f2f2
}

.filter-search-wrap .box-center {
    background: #f2f2f2
}

.filter-search-wrap .filter-search-box {
    overflow: hidden;
    width: 926px;
    height: 80px
}

.filter-search-wrap .filter-search-box .title {
    font: 14px/80px Arial, '-apple-system', Simsun;
    overflow: hidden;
    width: 126px;
    height: 80px;
    margin-right: 24px;
    padding-left: 48px;
    color: #1a1a1a
}

.filter-search-wrap .filter-search-box .filter-search {
    font-size: 0;
    overflow: hidden;
    width: 692px;
    height: 34px;
    margin: 23px 35px 0 0;
    border-right: 1px solid #d9d9d9
}

.filter-search-wrap .filter-search-box .filter-search .lbf-combobox {
    float: left;
    margin-right: 12px
}

.filter-search-wrap .filter-search-box .filter-search .lbf-combobox.classify .lbf-combobox-caption {
    width: 24px
}

.filter-search-wrap .filter-search-box .filter-search .lbf-combobox.tags a, .filter-search-wrap .filter-search-box .filter-search .lbf-combobox.words a {
    width: 92px
}

.filter-search-wrap .filter-search-box .filter-search .red-btn {
    font: 14px/34px Arial, '-apple-system', Simsun;
    float: left;
    width: 100px;
    height: 34px
}

.filter-search-wrap .everyone {
    overflow: hidden;
    width: 220px;
    height: 40px;
    margin-top: 20px
}

.filter-search-wrap .everyone .title {
    font: 12px/37px Arial, '-apple-system', Simsun;
    overflow: hidden;
    width: 60px;
    height: 32px;
    margin-right: 16px;
    color: #a6a6a6
}

.filter-search-wrap .everyone .key-words {
    overflow: hidden;
    width: 143px;
    height: 40px
}

.filter-search-wrap .everyone .key-words a {
    font: 12px/20px Arial, '-apple-system', Simsun;
    display: block;
    color: #666
}

.filter-search-wrap .everyone .key-words a:hover {
    color: inherit
}

.free-blue-btn {
    font: 14px/29px Arial, '-apple-system', Simsun;
    display: block;
    overflow: hidden;
    width: 88px;
    height: 28px;
    text-align: center;
    color: #3f5a93;
    background-image: url(/qd/images/common/blue_btn.182db.png);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: cover
}

.free-blue-btn:hover {
    transition: none;
    transition: all 0s;
    color: #2972cc;
    background-position: 0 -29px
}

:root .free-blue-btn {
    background-image: url(/qd/images/common/blue_btn_2x.ecc08.png)
}

.read-btn {
    font: 14px/28px Arial, '-apple-system', Simsun;
    display: block;
    width: 98px;
    height: 28px;
    text-align: center;
    color: #fff;
    border: 1px solid #bf2c24;
    border-radius: 15px;
    background: #bf2c24
}

.read-btn:hover {
    color: #fff;
    border: 1px solid #ed4259;
    background: #ed4259
}

.red-btn {
    text-align: center;
    color: #fff;
    background: #bf2c24
}

.red-btn:hover {
    color: #fff;
    background: #ed4259
}

.all-search {
    font: 14px/32px Arial, '-apple-system', Simsun;
    display: block;
    padding-left: 12px;
    color: grey;
    background: #f7f7f7
}

em.point {
    display: block
}

em.point span {
    width: 4px;
    height: 4px;
    margin-right: 2px;
    border-radius: 100%;
    background: #fff
}

.left-slider-wrap {
    padding: 24px 0 20px
}

.poster-main {
    position: relative;
    width: 277px;
    height: 124px;
    margin: 0 auto
}

.poster-main a, .poster-main img {
    display: block
}

.poster-main .poster-list {
    position: relative;
    width: 277px;
    height: 124px
}

.poster-main .poster-item {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 66px;
    width: 84px;
    height: 112px;
    box-shadow: 0 1px 5px rgba(0, 0, 0, .7)
}

.poster-main .poster-item .poster-info {
    position: absolute;
    display: none;
    width: 192px;
    margin: 25px 0 0 -52px;
    text-align: center
}

.poster-main .poster-item .poster-info h3 {
    font: 18px/24px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif
}

.poster-main .poster-item .poster-info h3 a:hover {
    color: #ed4259
}

.poster-main .poster-item .poster-info .author {
    font: 12px/16px Arial, '-apple-system', Simsun;
    padding: 8px 0;
    color: #bf2c24
}

.poster-main .poster-item .poster-info .author em {
    font-family: Arial;
    margin: 0 5px
}

.poster-main .poster-item .poster-info .number {
    font-family: Arial, '-apple-system', Simsun;
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    font-size: 12px;
    margin-bottom: 10px;
    color: #666
}

.poster-main .poster-item .poster-info .number b {
    font-family: Arial;
    font-size: 18px;
    color: #333
}

.poster-main .poster-item .poster-info .info {
    font: 12px/20px Arial, '-apple-system', Simsun;
    margin-bottom: 15px;
    text-align: left;
    color: #666
}

.poster-main .poster-item.act .poster-info {
    display: block
}

.poster-main .poster-btn {
    position: absolute;
    z-index: 1;
    top: 0;
    cursor: pointer
}

.poster-main .poster-prev-btn {
    left: 0
}

.poster-main .poster-next-btn {
    right: 0
}

.recent-finish-wrap .book-wrap .book-info {
    margin-top: 3px
}

.new-rec-wrap .book-wrap .book-info {
    margin-top: 2px
}

.three-silde-wrap {
    position: relative;
    z-index: 1;
    height: 112px;
    margin-bottom: 10px;
    padding: 16px 0 0 48px
}

.three-silde-wrap .la-ball-pulse {
    position: absolute;
    z-index: 300;
    top: 50px;
    left: 88px
}

.survey-btn {
    position: fixed;
    z-index: 21;
    bottom: 30px;
    left: 0;
    width: 30px;
    height: 94px;
    background: url(/qd/images/index/diaocha.2515b.png) no-repeat 0 -136px
}

.survey-btn.first {
    left: -30px
}

.survey-wrap {
    position: fixed;
    z-index: 20;
    bottom: 0;
    left: -956px;
    height: 140px
}

.survey-wrap.first {
    left: 0;
    width: 100%
}

.survey-wrap .survey-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 200px;
    background: #3e3d43;
    background: rgba(61, 62, 67, .95)
}

.survey-wrap .survey-box .center {
    position: relative;
    width: 956px;
    margin: 0 auto
}

.survey-wrap .survey-box p {
    width: 925px;
    height: 136px;
    margin: 0 auto;
    background-image: url(/qd/images/index/diaocha.2515b.png);
    background-position: 0 0
}

.survey-wrap .survey-box .go-survey {
    position: absolute;
    top: 48px;
    left: 711px;
    width: 140px;
    height: 44px
}

.survey-wrap .survey-box .close-survey {
    position: absolute;
    top: 0;
    right: 15px;
    width: 40px;
    height: 40px
}

.lbf-autocomplete-suggestion, .lbf-autocomplete-suggestions strong {
    height: 30px
}

.finish-book-wrap.box-center, .new-rec-wrap.box-center {
    margin: 0 auto 33px
}


 
.box-center {
    width: 1200px;
    margin-right: auto;
    margin-left: auto;
}



.fl {
    float: left
}

.fr {
    float: right
}

.mr0 {
    margin-right: 0
}

.mr10 {
    margin-right: 10px
}

.mr30 {
    margin-right: 30px
}

.mb10 {
    margin-bottom: 10px
}

.mb20 {
    margin-bottom: 20px
}

.mb30 {
    margin-bottom: 30px
}

.mb35 {
    margin-bottom: 35px
}

.mb40 {
    margin-bottom: 40px
}

.mb45 {
    margin-bottom: 45px
}

.mb50 {
    margin-bottom: 50px
}

.mb60 {
    margin-bottom: 60px
}

.hidden {
    display: none
}

.cf {
    zoom: 1
}

.cf:after, .cf:before {
    display: table;
    content: ''
}

.cf:after {
    clear: both
}

.dib-wrap {
    font-size: 0
}

.dib-wrap a, .dib-wrap span {
    display: inline-block;
    vertical-align: middle;
    letter-spacing: normal;
    word-spacing: normal
}

.dib-box a, .dib-box span {
    display: inline-block;
    vertical-align: middle;
    letter-spacing: normal;
    word-spacing: normal
}

.red-btn {
    position: relative;
    z-index: 1;
    text-align: center;
    color: #fff;
    border-color: #bf2c24;
    background: #bf2c24
}

.red-btn:hover {
    color: #fff;
    border-color: #ed4259;
    background: #ed4259
}

.red-btn.disabled {
    cursor: default;
    color: #fff;
    border-color: #a6a6a6;
    background: #a6a6a6
}

.red-btn .la-ball-spin-clockwise {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -8px 0 0 -8px
}

.blue-btn {
    position: relative;
    z-index: 1;
    text-align: center;
    color: #3f5a93;
    border-color: #3f5a93
}

.blue-btn:hover {
    color: #2972cc;
    border-color: #2972cc;
    background: #f0f5ff
}

.blue-btn.disabled {
    cursor: default;
    color: #a6a6a6;
    border-color: #a6a6a6;
    background: 0 0
}

.blue-btn .la-ball-spin-clockwise {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -8px 0 0 -8px
}

.blue-btn .la-ball-spin-clockwise i {
    background-color: #3f5a93
}

.in-shelf {
    cursor: default;
    color: #a6a6a6;
    border-color: #a6a6a6
}

.in-shelf:hover {
    color: #a6a6a6;
    border-color: #a6a6a6;
    background: 0 0
}

.grey-btn {
    position: relative;
    z-index: 1;
    text-align: center;
    color: #1a1a1a;
    border-width: 1px;
    border-style: solid;
    border-color: #ccc;
    border-color: rgba(0, 0, 0, .2);
    background: #fbfbfb;
    background: rgba(255, 255, 255, .5)
}

.grey-btn:hover {
    color: #1a1a1a
}

.grey-btn.disabled {
    cursor: default;
    color: #a6a6a6;
    border-color: #a6a6a6;
    background: 0 0
}

.red-radius-btn {
    font: 14px/34px Arial, '-apple-system', Simsun;
    position: relative;
    z-index: 1;
    display: block;
    width: 140px;
    height: 34px;
    margin: 20px auto 3px;
    text-align: center;
    color: #fff;
    border-radius: 20px;
    background-color: #bf2c24
}

.red-radius-btn .iconfont {
    font-size: 16px;
    display: inline-block;
    min-width: 16px;
    margin: -3px 5px 0 0;
    vertical-align: middle;
    color: #fff;
    -webkit-text-stroke-width: 0
}

.red-radius-btn:hover {
    color: #fff;
    background: #ed4259
}

.red-radius-btn.disabled {
    cursor: default;
    background-color: #a6a6a6
}

.red-radius-btn .la-ball-spin-clockwise {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -8px 0 0 -6px
}

:root .blue-btn.btn-loading, :root .red-btn.btn-loading, :root .red-radius-btn.btn-loading {
    cursor: default;
    text-indent: -9999em
}

:root .red-btn.btn-loading:hover, :root .red-radius-btn.btn-loading:hover {
    background: #bf2c24
}

:root .blue-btn.btn-loading:hover {
    background: 0 0
}

 
.popup-wrap {
    position: fixed;
    z-index: 1000;
    top: 30%;
    left: 50%;
    display: none;
    margin-left: -345px;
    background: #fff
}

.popup-wrap .close-popup {
    position: absolute;
    top: -15px;
    right: -15px;
    width: 36px;
    height: 36px;
    background: url(/qd/images/btn_close.44844.png) no-repeat
}

.popup-wrap.login-popup {
    z-index: 9999999999;
    width: 690px;
    height: 310px
}

.popup-wrap .popup-box {
    height: 100%;
    background: #fff
}

.popup-wrap .popup-box iframe {
    z-index: 9999999;
    width: 100%;
    max-width: 100%;
    height: 300px
}

.mask {
    position: fixed;
    z-index: 999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    background: rgba(0, 0, 0, .7)
}

.tip-popup {
    padding-bottom: 24px;
    background: #fcfcfa
}

.popup-title {
    height: 39px;
    border-bottom: 1px solid #e6e6e6;
    background: #fff
}

.popup-title h3 {
    font-size: 18px;
    line-height: 40px;
    height: 40px;
    padding: 0 10px;
    text-align: left;
    color: #1a1a1a
}

.tip-content {
    padding: 0 20px;
    text-align: center
}

.popup-content {
    padding: 0 20px;
    text-align: center
}

.popup-content p {
    font: 18px/1.6 Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif
}

.tip-text {
    padding: 60px 0
}

.tip-text p {
    font: 16px/32px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif
}

.popup-btn {
    font-size: 0;
    text-align: center
}

.popup-btn a {
    display: inline-block;
    vertical-align: middle
}

.popup-btn a.red-btn {
    font: 14px/34px Arial, '-apple-system', Simsun;
    width: 120px;
    height: 34px;
    margin-right: 0
}

.popup-btn a.blue-btn {
    font: 14px/32px Arial, '-apple-system', Simsun;
    width: 118px;
    height: 32px;
    margin-left: 24px;
    border: 1px solid #3f5a93
}

.report-wrap {
    padding: 20px 40px
}

.report-wrap h3 {
    font: 12px/16px Arial, '-apple-system', Simsun;
    margin-bottom: 8px;
    color: grey
}

.report-wrap h3 + p {
    font: 14px/20px Arial, '-apple-system', Simsun;
    margin-bottom: 24px
}

.report-wrap .type {
    font-size: 0;
    width: 410px;
    padding-bottom: 20px
}

.report-wrap .type label {
    font: 14px/20px Arial, '-apple-system', Simsun;
    margin: 0 24px 16px 0
}

.lbf-light-tip .simple-tips span.icon-font {
    font-size: 48px;
    display: inline-block;
    vertical-align: middle
}

.lbf-light-tip .simple-tips h3 {
    font: 16px/24px Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    display: inline-block;
    margin-top: -12px;
    vertical-align: middle
}

.lbf-panel {
    transform: translateZ(0);
    animation: tinydown .5s;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .2) !important
}

.lbf-panel .lbf-panel-close {
    font-size: 18px;
    top: 12px;
    right: 12px;
    width: 16px;
    transition: .5s;
    transition: .5s;
    transform: rotate(0);
    transform: rotate(0)
}

.lbf-panel .lbf-panel-close:hover {
    transform: rotate(90deg)
}

.lbf-panel .lbf-panel-close:hover {
    transform: rotate(90deg)
}

.qdlogin-wrap {
    position: fixed;
    z-index: 1000;
    top: 50%;
    left: 50%;
    display: block;
    width: 400px;
    height: 425px;
    margin-top: -207px;
    margin-left: -196.5px;
    background: 0 0
}

 
.footer {
    text-align: center;
    background: #fafafa
}

.footer .box-center {
    background: #fafafa
}

.footer .friend-link {
    font-size: 0;
    overflow: hidden;
    padding-top: 20px;
    padding-bottom: 2px
}

.footer .friend-link a, .footer .friend-link cite, .footer .friend-link em {
    font-size: 12px;
    display: inline-block;
    vertical-align: middle
}

.footer .friend-link em {
    font-family: Arial, '-apple-system', Simsun;
    margin-right: 8px
}

.footer .footer-menu em, .footer .friend-link em {
    color: #1a1a1a
}

.footer .footer-menu a, .footer .friend-link a {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    line-height: 27px;
    margin-right: 16px;
    color: #1a1a1a
}

.footer .footer-menu a:hover, .footer .friend-link a:hover {
    color: #ed4259
}

.footer .footer-menu a.yuewen, .footer .friend-link a.yuewen {
    margin-right: 0
}

.footer .footer-menu {
    padding: 0 0 4px
}

.footer .footer-menu a {
    color: #666
}

.footer .copy-right, .footer .safety-box {
    padding-bottom: 16px
}

.footer .copy-right p, .footer .safety-box p {
    font: 12px/20px Arial, '-apple-system', Simsun;
    overflow: hidden;
    height: 20px;
    color: #a6a6a6
}

.footer .copy-right span, .footer .safety-box span {
    font-family: Arial;
    margin-right: 5px
}

.footer .safety-img {
    padding: 0 0 16px
}

.footer .safety-img a {
    width: 140px;
    height: 52px;
    margin-right: 14px;
    border: 1px solid #ededed;
    background-image: url(/qd/images/foot_site.c7a69.png?max_age=31536000)
}

.footer .safety-img a.site1 {
    background-position: 0 0
}

.footer .safety-img a.site2 {
    background-position: 0 -52px
}

.footer .safety-img a.site3 {
    background-position: 0 -104px
}

.footer .safety-img a.site4 {
    background-position: 0 -156px
}

.footer .safety-img a.site5 {
    background-position: 0 -208px
}

.footer .safety-img a.site6 {
    background-position: 0 -260px
}

.footer .safety-img a.site7 {
    background-position: 0 -312px
}

.lbf-combobox {
    display: inline-block
}

}
.lbf-combobox .lbf-combobox-label {
    line-height: 24px;
    position: relative;
    display: inline-block;
    overflow: hidden;
    height: 24px;
    padding-right: 36px;
    padding-left: 10px;
    text-align: left;
    vertical-align: middle;
    color: grey;
    background: #fff
}

* {
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
    color: #262626;
}

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

.lbf-combobox .lbf-combobox-label .lbf-combobox-caption {
    display: inline-block;
    vertical-align: top;
    white-space: nowrap
}

.lbf-combobox .lbf-combobox-label .lbf-combobox-icon {
    position: absolute;
    position: absolute;
    top: 14px;
    right: 10px;
    width: 0;
    height: 0;
    border-top: 5px solid #a6a6a6;
    border-right: 5px solid transparent;
    border-bottom: 0 none;
    border-left: 5px solid transparent
}

.lbf-combobox .lbf-combobox-label .lbf-combobox-icon:before {
    -webkit-transition: .3s ease-in;
    -o-transition: .3s ease-in;
    transition: .3s ease-in
}

.lbf-combobox-on,
.lbf-combobox-on:hover {
    background: #e5e5e5;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .2);
    box-shadow: 0 0 4px rgba(0, 0, 0, .2)
}

.lbf-combobox .lbf-combobox-label:hover,
.lbf-combobox-on {
    background: #fff
}

.lbf-combobox .lbf-combobox-label:focus .lbf-combobox-label:focus,
.lbf-combobox-on .lbf-combobox-label:focus {
    -webkit-box-shadow: inset 0 2px 0 rgba(0, 0, 0, .125);
    box-shadow: inset 0 2px 0 rgba(0, 0, 0, .125)
}

.lbf-combobox .lbf-combobox-on .lbf-combobox-icon:before {
    display: inline-block;
    -webkit-transform: scale(.5);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg)
}

.lbf-combobox .lbf-combobox-disabled {
    opacity: .65;
    filter: 'alpha(opacity=65)'
}

.lbf-combobox select {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0
}

.lbf-combobox-panel {
    font-size: 12px;
    display: none;
    overflow: auto;
    min-width: 150px;
    -webkit-transition: opacity .218s;
    -o-transition: opacity .218s;
    transition: opacity .218s;
    border-top: 1px solid #eee;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    background: #fff;
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
    box-shadow: 0 2px 4px rgba(0, 0, 0, .2)
}

.lbf-combobox-panel .lbf-combobox-item {
    font-family: Arial, '-apple-system', Simsun;
    line-height: 24px;
    display: block;
    height: 24px;
    padding: 3px 12px;
    cursor: pointer;
    text-align: left;
    white-space: nowrap;
    color: grey
}

.lbf-combobox-panel .lbf-combobox-item:hover {
    color: inherit;
    background: #f7f7f7
}

.lbf-button {
    font-family: Arial, '-apple-system', Simsun;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.42857;
    display: inline-block;
    margin-bottom: 0;
    padding: 4px 12px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    border: 1px solid transparent;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    background-image: none;
    touch-action: manipulation
}

.lbf-button.focus,
.lbf-button:focus,
.lbf-button:hover {
    text-decoration: none;
    color: #333
}

.lbf-button-disabled,
.lbf-button.disabled,
.lbf-button[disabled],
fieldset[disabled] .lbf-button {
    cursor: not-allowed;
    pointer-events: none;
    opacity: .65;
    -webkit-box-shadow: none;
    box-shadow: none;
    filter: 'alpha(opacity=65)'
}

.lbf-button ::-moz-focus-inner {
    padding: 0;
    border: 0
}

.lbf-button-primary {
    color: #fff;
    border-color: #2b6feb;
    background-color: #427fed
}

.lbf-button-primary.focus,
.lbf-button-primary:focus {
    color: #fff;
    border-color: #0d3989;
    background-color: #1660e6
}

.lbf-button-primary:hover {
    color: #fff;
    border-color: #1353c5;
    background-color: #1660e6
}

.lbf-button-primary .open > .dropdown-toggle,
.lbf-button-primary.active,
.lbf-button-primary:active {
    color: #fff;
    border-color: #1353c5;
    background-color: #1660e6
}

.lbf-button-primary .open > .dropdown-toggle.focus,
.lbf-button-primary .open > .dropdown-toggle:focus,
.lbf-button-primary .open > .dropdown-toggle:hover,
.lbf-button-primary.active.focus,
.lbf-button-primary.active:focus,
.lbf-button-primary.active:hover,
.lbf-button-primary:active.focus,
.lbf-button-primary:active:focus,
.lbf-button-primary:active:hover {
    color: #fff;
    border-color: #0d3989;
    background-color: #1353c5
}

.lbf-button-primary .open > .dropdown-toggle,
.lbf-button-primary.active,
.lbf-button-primary:active {
    background-image: none
}

.lbf-button-primary .lbf-button-disabled.focus,
.lbf-button-primary .lbf-button-disabled:active,
.lbf-button-primary .lbf-button-disabled:focus,
.lbf-button-primary .lbf-button-disabled:hover,
.lbf-button-primary fieldset[disabled].focus,
.lbf-button-primary fieldset[disabled]:active,
.lbf-button-primary fieldset[disabled]:focus,
.lbf-button-primary fieldset[disabled]:hover,
.lbf-button-primary.disabled.focus,
.lbf-button-primary.disabled:active,
.lbf-button-primary.disabled:focus,
.lbf-button-primary.disabled:hover,
.lbf-button-primary.lbf-button-disabled.focus,
.lbf-button-primary.lbf-button-disabled:active,
.lbf-button-primary.lbf-button-disabled:focus,
.lbf-button-primary.lbf-button-disabled:hover,
.lbf-button-primary[disabled].focus,
.lbf-button-primary[disabled]:active,
.lbf-button-primary[disabled]:focus,
.lbf-button-primary[disabled]:hover {
    border-color: #2b6feb;
    background-color: #427fed
}

.lbf-button-primary .badge {
    color: #427fed;
    background-color: #fff
}

.lbf-button-success {
    color: #fff;
    border-color: #4cae4c;
    background-color: #5cb85c
}

.lbf-button-success.focus,
.lbf-button-success:focus {
    color: #fff;
    border-color: #255625;
    background-color: #449d44
}

.lbf-button-success:hover {
    color: #fff;
    border-color: #398439;
    background-color: #449d44
}

.lbf-button-success .open > .dropdown-toggle,
.lbf-button-success.active,
.lbf-button-success:active {
    color: #fff;
    border-color: #398439;
    background-color: #449d44
}

.lbf-button-success .open > .dropdown-toggle.focus,
.lbf-button-success .open > .dropdown-toggle:focus,
.lbf-button-success .open > .dropdown-toggle:hover,
.lbf-button-success.active.focus,
.lbf-button-success.active:focus,
.lbf-button-success.active:hover,
.lbf-button-success:active.focus,
.lbf-button-success:active:focus,
.lbf-button-success:active:hover {
    color: #fff;
    border-color: #255625;
    background-color: #398439
}

.lbf-button-success .open > .dropdown-toggle,
.lbf-button-success.active,
.lbf-button-success:active {
    background-image: none
}

.lbf-button-success .lbf-button-disabled.focus,
.lbf-button-success .lbf-button-disabled:active,
.lbf-button-success .lbf-button-disabled:focus,
.lbf-button-success .lbf-button-disabled:hover,
.lbf-button-success fieldset[disabled].focus,
.lbf-button-success fieldset[disabled]:active,
.lbf-button-success fieldset[disabled]:focus,
.lbf-button-success fieldset[disabled]:hover,
.lbf-button-success.disabled.focus,
.lbf-button-success.disabled:active,
.lbf-button-success.disabled:focus,
.lbf-button-success.disabled:hover,
.lbf-button-success.lbf-button-disabled.focus,
.lbf-button-success.lbf-button-disabled:active,
.lbf-button-success.lbf-button-disabled:focus,
.lbf-button-success.lbf-button-disabled:hover,
.lbf-button-success[disabled].focus,
.lbf-button-success[disabled]:active,
.lbf-button-success[disabled]:focus,
.lbf-button-success[disabled]:hover {
    border-color: #4cae4c;
    background-color: #5cb85c
}

.lbf-button-success .badge {
    color: #5cb85c;
    background-color: #fff
}

.lbf-button-info {
    color: #fff;
    border-color: #46b8da;
    background-color: #5bc0de
}

.lbf-button-info.focus,
.lbf-button-info:focus {
    color: #fff;
    border-color: #1b6d85;
    background-color: #31b0d5
}

.lbf-button-info:hover {
    color: #fff;
    border-color: #269abc;
    background-color: #31b0d5
}

.lbf-button-info .open > .dropdown-toggle,
.lbf-button-info.active,
.lbf-button-info:active {
    color: #fff;
    border-color: #269abc;
    background-color: #31b0d5
}

.lbf-button-info .open > .dropdown-toggle.focus,
.lbf-button-info .open > .dropdown-toggle:focus,
.lbf-button-info .open > .dropdown-toggle:hover,
.lbf-button-info.active.focus,
.lbf-button-info.active:focus,
.lbf-button-info.active:hover,
.lbf-button-info:active.focus,
.lbf-button-info:active:focus,
.lbf-button-info:active:hover {
    color: #fff;
    border-color: #1b6d85;
    background-color: #269abc
}

.lbf-button-info .open > .dropdown-toggle,
.lbf-button-info.active,
.lbf-button-info:active {
    background-image: none
}

.lbf-button-info .lbf-button-disabled.focus,
.lbf-button-info .lbf-button-disabled:active,
.lbf-button-info .lbf-button-disabled:focus,
.lbf-button-info .lbf-button-disabled:hover,
.lbf-button-info fieldset[disabled].focus,
.lbf-button-info fieldset[disabled]:active,
.lbf-button-info fieldset[disabled]:focus,
.lbf-button-info fieldset[disabled]:hover,
.lbf-button-info.disabled.focus,
.lbf-button-info.disabled:active,
.lbf-button-info.disabled:focus,
.lbf-button-info.disabled:hover,
.lbf-button-info.lbf-button-disabled.focus,
.lbf-button-info.lbf-button-disabled:active,
.lbf-button-info.lbf-button-disabled:focus,
.lbf-button-info.lbf-button-disabled:hover,
.lbf-button-info[disabled].focus,
.lbf-button-info[disabled]:active,
.lbf-button-info[disabled]:focus,
.lbf-button-info[disabled]:hover {
    border-color: #46b8da;
    background-color: #5bc0de
}

.lbf-button-info .badge {
    color: #5bc0de;
    background-color: #fff
}

.lbf-button-warning {
    color: #fff;
    border-color: #eea236;
    background-color: #f0ad4e
}

.lbf-button-warning.focus,
.lbf-button-warning:focus {
    color: #fff;
    border-color: #985f0d;
    background-color: #ec971f
}

.lbf-button-warning:hover {
    color: #fff;
    border-color: #d58512;
    background-color: #ec971f
}

.lbf-button-warning .open > .dropdown-toggle,
.lbf-button-warning.active,
.lbf-button-warning:active {
    color: #fff;
    border-color: #d58512;
    background-color: #ec971f
}

.lbf-button-warning .open > .dropdown-toggle.focus,
.lbf-button-warning .open > .dropdown-toggle:focus,
.lbf-button-warning .open > .dropdown-toggle:hover,
.lbf-button-warning.active.focus,
.lbf-button-warning.active:focus,
.lbf-button-warning.active:hover,
.lbf-button-warning:active.focus,
.lbf-button-warning:active:focus,
.lbf-button-warning:active:hover {
    color: #fff;
    border-color: #985f0d;
    background-color: #d58512
}

.lbf-button-warning .open > .dropdown-toggle,
.lbf-button-warning.active,
.lbf-button-warning:active {
    background-image: none
}

.lbf-button-warning .lbf-button-disabled.focus,
.lbf-button-warning .lbf-button-disabled:active,
.lbf-button-warning .lbf-button-disabled:focus,
.lbf-button-warning .lbf-button-disabled:hover,
.lbf-button-warning fieldset[disabled].focus,
.lbf-button-warning fieldset[disabled]:active,
.lbf-button-warning fieldset[disabled]:focus,
.lbf-button-warning fieldset[disabled]:hover,
.lbf-button-warning.disabled.focus,
.lbf-button-warning.disabled:active,
.lbf-button-warning.disabled:focus,
.lbf-button-warning.disabled:hover,
.lbf-button-warning.lbf-button-disabled.focus,
.lbf-button-warning.lbf-button-disabled:active,
.lbf-button-warning.lbf-button-disabled:focus,
.lbf-button-warning.lbf-button-disabled:hover,
.lbf-button-warning[disabled].focus,
.lbf-button-warning[disabled]:active,
.lbf-button-warning[disabled]:focus,
.lbf-button-warning[disabled]:hover {
    border-color: #eea236;
    background-color: #f0ad4e
}

.lbf-button-warning .badge {
    color: #f0ad4e;
    background-color: #fff
}

.lbf-button-danger {
    color: #fff;
    border-color: #d43f3a;
    background-color: #d9534f
}

.lbf-button-danger.focus,
.lbf-button-danger:focus {
    color: #fff;
    border-color: #761c19;
    background-color: #c9302c
}

.lbf-button-danger:hover {
    color: #fff;
    border-color: #ac2925;
    background-color: #c9302c
}

.lbf-button-danger .open > .dropdown-toggle,
.lbf-button-danger.active,
.lbf-button-danger:active {
    color: #fff;
    border-color: #ac2925;
    background-color: #c9302c
}

.lbf-button-danger .open > .dropdown-toggle.focus,
.lbf-button-danger .open > .dropdown-toggle:focus,
.lbf-button-danger .open > .dropdown-toggle:hover,
.lbf-button-danger.active.focus,
.lbf-button-danger.active:focus,
.lbf-button-danger.active:hover,
.lbf-button-danger:active.focus,
.lbf-button-danger:active:focus,
.lbf-button-danger:active:hover {
    color: #fff;
    border-color: #761c19;
    background-color: #ac2925
}

.lbf-button-danger .open > .dropdown-toggle,
.lbf-button-danger.active,
.lbf-button-danger:active {
    background-image: none
}

.lbf-button-danger .lbf-button-disabled.focus,
.lbf-button-danger .lbf-button-disabled:active,
.lbf-button-danger .lbf-button-disabled:focus,
.lbf-button-danger .lbf-button-disabled:hover,
.lbf-button-danger fieldset[disabled].focus,
.lbf-button-danger fieldset[disabled]:active,
.lbf-button-danger fieldset[disabled]:focus,
.lbf-button-danger fieldset[disabled]:hover,
.lbf-button-danger.disabled.focus,
.lbf-button-danger.disabled:active,
.lbf-button-danger.disabled:focus,
.lbf-button-danger.disabled:hover,
.lbf-button-danger.lbf-button-disabled.focus,
.lbf-button-danger.lbf-button-disabled:active,
.lbf-button-danger.lbf-button-disabled:focus,
.lbf-button-danger.lbf-button-disabled:hover,
.lbf-button-danger[disabled].focus,
.lbf-button-danger[disabled]:active,
.lbf-button-danger[disabled]:focus,
.lbf-button-danger[disabled]:hover {
    border-color: #d43f3a;
    background-color: #d9534f
}

.lbf-button-danger .badge {
    color: #d9534f;
    background-color: #fff
}

.lbf-button-link {
    font-weight: 400;
    color: #427fed;
    border-radius: 0
}

.lbf-button-link,
.lbf-button-link.active,
.lbf-button-link:active {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none
}

.lbf-button-link,
.lbf-button-link:active,
.lbf-button-link:focus,
.lbf-button-link:hover {
    border-color: transparent
}

.lbf-button-link:focus,
.lbf-button-link:hover {
    text-decoration: underline;
    color: #1456cf;
    background-color: transparent
}

.lbf-button-link .lbf-button-disabled,
.lbf-button-link fieldset[disabled],
.lbf-button-link.disabled,
.lbf-button-link.lbf-button-disabled,
.lbf-button-link[disabled] {
    color: #777
}

.lbf-button-link .lbf-button-disabled:active,
.lbf-button-link .lbf-button-disabled:focus,
.lbf-button-link .lbf-button-disabled:hover,
.lbf-button-link fieldset[disabled]:active,
.lbf-button-link fieldset[disabled]:focus,
.lbf-button-link fieldset[disabled]:hover,
.lbf-button-link.disabled:active,
.lbf-button-link.disabled:focus,
.lbf-button-link.disabled:hover,
.lbf-button-link.lbf-button-disabled:active,
.lbf-button-link.lbf-button-disabled:focus,
.lbf-button-link.lbf-button-disabled:hover,
.lbf-button-link[disabled]:active,
.lbf-button-link[disabled]:focus,
.lbf-button-link[disabled]:hover {
    text-decoration: none;
    color: #777;
    border-color: transparent;
    background-color: transparent
}

.lbf-button-normal {
    font-size: 12px;
    line-height: 1.42857;
    padding: 4px 12px;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px
}

.lbf-button-large {
    font-size: 15px;
    line-height: 1.33333;
    padding: 10px 16px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px
}

.lbf-button-small {
    font-size: 11px;
    line-height: 1.5;
    padding: 5px 10px;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px
}

.lbf-button-block {
    display: block;
    width: 100%
}

.lbf-button-block + .lbf-button-block {
    margin-top: 5px
}

input[type=button].lbf-button-block,
input[type=reset].lbf-button-block,
input[type=submit].lbf-button-block {
    width: 100%
}

.lbf-button-group {
    position: relative;
    display: inline-block;
    vertical-align: middle
}

.lbf-button-group > .lbf-button {
    position: relative;
    float: left;
    margin-left: -1px
}

.lbf-button-group > .lbf-button.active,
.lbf-button-group > .lbf-button:active,
.lbf-button-group > .lbf-button:focus,
.lbf-button-group > .lbf-button:hover {
    z-index: 2
}

.lbf-button-group > .lbf-button:not(:first-child):not(:last-child) {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0
}

.lbf-button-group > .lbf-button:first-child {
    margin-left: 0
}

 
.lbf-autocomplete-suggestions {
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, .2);
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    outline: 0;
    background-color: #fff;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2)
}

.lbf-autocomplete-suggestions strong {
    font-family: Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    font-weight: 700;
    color: #000
}

.lbf-autocomplete-suggestion {
    font-family: Arial, HelveticaNeue-Light, 'Helvetica Neue Light', 'Microsoft YaHei', sans-serif;
    font-size: 14px;
    line-height: 32px;
    overflow: hidden;
    padding: 0 12px;
    cursor: pointer;
    white-space: nowrap
}

.lbf-autocomplete-suggestion a {
    display: block
}

.lbf-autocomplete-suggestion a:hover {
    color: inherit
}

.lbf-autocomplete-no-suggestion {
    padding: 4px 6px
}

.lbf-autocomplete-selected {
    background: #f0f0f0
}

.lbf-autocomplete-group {
    line-height: 32px
}

.lbf-autocomplete-group strong {
    font-size: 14px;
    display: block;
    overflow: hidden;
    padding: 0 12px;
    white-space: nowrap;
    color: grey;
    background: #f7f7f7
}

.footer-container {
    float: left;
    width: 100%;
    margin-top: 10px;
    background-color: #f8f8f8;
    border-top: 1px solid #e7e7e7;
    color: #4E4E4E;
    font-size: 14px;
    padding: 20px 0;
}

.container {
    width: 1200px;
    margin: 0 auto;
}

.col-md-3 {
    width: 25%;
    float: left;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    box-sizing: border-box;
}

.col-md-9 {
    width: 75%;
    float: left;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    box-sizing: border-box;
    font-weight: 100;
    font-family: 'Roboto', sans-serif;
    line-height: 1.42857143;
}

.focus-img {
    box-shadow: 0px 1px 5px #d9d4c7;
}

.focus-wrap .focus-box .focus-img li {
    position: relative;
    z-index: 1;
    float: left;
    overflow: hidden;
    width: 33.33%;
    height: 130px;
    transition: box-shadow .5s;
    text-align: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.focus-wrap .focus-box .focus-img li > div {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 0.2;
    background: #3333;
}

.focus-wrap .focus-box .focus-img li > a > img {
    display: block;
    margin: 15px auto 0;
    border-radius: 100%;
    width: 80px;
    height: 80px;
    box-shadow: 1px 2px 10px #d9d4c7;
}

.focus-img p {
    font-size: 16px;
    font-family: arial;
    margin-top: 10px;
    color: rgba(255, 255, 255, 0.95);
}

.focus-img span {
    color: #ffffff;
    font-size: 11px;
    font-family: Arial;
    /* text-transform: uppercase; */
    margin-top: 6px;
    display: inline-block;
    font-weight: 600;
    right: -51px;
    position: absolute;
    top: -42px;
    background: #bf2c24;
    padding: 2px 33px;
    transform: rotate(40deg);
    text-align: center;
    padding-top: 49px;
    padding-bottom: 4px;
}

.focus-wrap .focus-box .focus-img li.first {
    background-image: url(../images/cover2.jpg);
}

.focus-wrap .focus-box .focus-img li.middle {
    background-image: url(../images/cover5.jpg);
}

.focus-wrap .focus-box .focus-img li.last {
    background-image: url(../images/cover1.jpg);
}

.focus-wrap .focus-box .focus-img li.middle > span {
    top: -43px;
    right: -49px;
    background: #327c86;
}

.focus-wrap .focus-box .focus-img li.last > span {
    top: -44px;
    right: -46px;
    background: #a3af1e;
}

.example-desc {
    margin: 3px 0;
    padding: 5px;
}

#carousel {
    width: 277px;
    height: 124px;
    position: relative;
    clear: both;
}

#carousel img {
    visibility: hidden; /* hide images until carousel can handle them */
    cursor: pointer; /* otherwise it's not as obvious items can be clicked */
    max-width: 95px;
    max-height: 125px;
}

.split-left {
    width: 450px;
    float: left;
}

.split-right {
    width: 400px;
    float: left;
    margin-left: 10px;
}

#callback-output {
    height: 250px;
    overflow: scroll;
}

textarea#newoptions {
    width: 430px;
}

.update-wrap .update-rec-list ul li.no1 {
    height: auto;
}

.update-wrap .update-rec-list ul li.no1 .book-wrap {
    padding-top: 10px;
    overflow: hidden;
}

.update-wrap .update-rec-list li.no1 .book-wrap .book-info {
    margin-top: 0;
}

.update-wrap .update-rec-list li.no1 .book-wrap .book-info .digital {
    text-align: left;
    line-height: 1.4;
    width: auto;
    overflow: visible;
    height: auto;
    font-size: 14px;
}

.update-wrap .update-rec-list li.no1 .book-wrap .book-info h4 {
    text-align: left;
}

.update-wrap .update-rec-list li.no1 .book-wrap .book-cover {
    -webkit-transform: perspective(60px) rotateY(0deg);
    -moz-transform: perspective(60px) rotateY(0deg);
    transform: perspective(60px) rotateY(0deg);
}

.update-wrap .update-rec-list li.no1 .book-wrap .book-cover:after {
    display: none;
}

.update-wrap .update-rec-list li.no1 .book-wrap .book-cover img {
    width: 80px;
    border-radius: 0;
    object-fit: cover;
    height: 80px;
}

.ui-autocomplete {
    z-index: 10000;
}

.ui-autocomplete li {
    padding: 5px 0 !important;
    border-bottom: 1px solid #dcdcdc;
}

.ui-menu .ui-menu-item a {
    font-size: 14px;
    color: #555;
    font-weight: 300;
    font-family: 'Roboto', sans-serif;
    padding: 5px !important;
}

.ui-menu .ui-menu-item a.ui-state-focus {
    border: 0;
    background: none;
    font-family: 'Roboto', sans-serif;
    margin: 0;
}