/*通用类*/

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

input, textarea {
    -webkit-user-select: auto;
}

.clearfix {
    clear: both;
}

.notScroll {
    overflow: hidden !important;
}

/*兼容老设备的rem-px基准*/

html {
    font-size: 42.6667px;
}

@media screen and (max-width: 320px) {
    html {
        font-size: 42.6667px;
    }
}

@media screen and (min-width: 321px) and (max-width: 360px) {
    html {
        font-size: 48px;
    }
}

@media screen and (min-width: 361px) and (max-width: 375px) {
    html {
        font-size: 50px;
    }
}

@media screen and (min-width: 376px) and (max-width: 414px) {
    html {
        font-size: 55px;
    }
}

@media screen and (min-width: 415px) and (max-width: 484px) {
    html {
        font-size: 64px;
    }
}

@media screen and (min-width: 485px) and (max-width: 720px) {
    html {
        font-size: 96px;
    }
}

@media screen and (min-width: 721px) and (max-width: 768px) {
    html {
        font-size: 102px;
    }
}

@media screen and (min-width: 769px) and (max-width: 1080px) {
    html {
        font-size: 144px;
    }
}

@media screen and (min-width: 1080px) {
    html {
        font-size: 144px;
    }
}

/*新设备的rem-vw标准*/

html {
    overflow-x: hidden;
    font-size: 13.3333333333vw;
    /*一便rem.js失效，这里起作用*/
}

body {
    width: 100%;
    min-width: 320px;
    min-height: 100vh;
    margin: 0 auto;
    font-family: PingFang SC, Hiragino Sans GB, Microsoft YaHei UI, Microsoft YaHei, Source Han Sans CN, sans-serif;
    overflow-x: hidden;
    text-align: left;
    position: relative;
    font-size: 0.26rem;
    line-height: 1.8;
    color: #333;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
hr,
ul,
ol,
li,
dl,
dt,
dd,
form,
fieldset,
legend,
input,
button,
select,
textarea,
th,
td,
pre {
    padding: 0;
    margin: 0;
    outline: none;
    border: none;
}

img {
    border: none;
    vertical-align: top;
    max-width: 100%;
}

h1,
h2,
h3 {
    font-weight: normal;
}

a {
    color: #333;
    text-decoration: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
    outline: none;
}

input,
textarea,
select {
    font-family: PingFang SC, Hiragino Sans GB, Microsoft YaHei UI, Microsoft YaHei, Source Han Sans CN, sans-serif;
    font-size: 1em;
    outline: none;
    margin: 0;
    padding: 0;
}

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

textarea::-webkit-input-placeholder {
    color: #a0a0a0;
}

input[type='button'],
input[type='text'],
input[type='search'],
input[type='submit'],
input[type='reset'],
input[type='date'],
input[type='time'],
input[type='number'] {
    -webkit-appearance: none;
}

select {
    -webkit-appearance: none;
}

textarea {
    -webkit-appearance: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0;
}

ul,
ol {
    padding: 0;
    list-style-type: none;
}

em {
    font-style: normal;
}

input.sub,
label {
    border: none;
    cursor: pointer;
}

input,
textarea {
    font-family: Helvetica;
    outline: none;
    margin: 0;
    padding: 0;
}

table {
    border-collapse: collapse;
}

td,
th {
    padding: 0;
}

/*home*/
.slide {
    width: 6.9rem;
    margin: 0.3rem auto 0 auto;
    height: 2.8rem;
    border-radius: 0.14rem;
    overflow: hidden;
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: .3s opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10;
    bottom: 0.1rem;
    left: 0;
    width: 100%;
    height: 0.08rem;
    font-size: 0;
}

.swiper-pagination-bullet {
    width: 0.1rem;
    height: 0.1rem;
    display: inline-block;
    border-radius: 10px;
    background: #fff;
    margin: 0 2px;
    transition: 300ms;
}

.swiper-pagination-bullet-active {
    background: #ff3955;
}

.swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    list-style: none;
    padding: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
    transform: translate3d(0px, 0, 0);
}

.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: block;
}

.slide .swiper-slide {
    width: 100%;
    border-radius: 0.14rem;
    overflow: hidden;
}

.sousuo {
    width: 6.9rem;
    margin: 0.2rem auto;
    border-radius: 0.1rem;
    background: #f7f7f7;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 0.7rem;
    color: #7d7d7d;
}

.sousuo img {
    width: 0.3rem;
    height: 0.3rem;
    margin-right: 0.1rem;
}

.nav {
    width: 6.5rem;
    margin: 0 auto;
    padding-top: 0.2rem;
    padding-bottom: 0.4rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nav a {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.nav a img {
    width: 0.6rem;
    height: 0.6rem;
    display: block;
}

.nav a span {
    color: #1a1a1a;
    font-size: 0.26rem;
    line-height: 0.3rem;
    margin-top: 0.1rem;
}

.line20 {
    height: 0.24rem;
    width: 100%;
    display: block;
    background: #f6f7f9;
}

.homeList {
    width: 6.9rem;
    margin: 0.4rem auto 0.1rem auto;
}

.homeTil {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.3rem;
}

.homeTil h4 {
    color: #1a1a1a;
    font-size: 0.32rem;
    font-weight: 700;
    height: 0.32rem;
    border-left: 2px solid #ff3350;
    padding-left: 0.1rem;
    line-height: 0.32rem;
}

.homeTil a {
    color: #808080;
    font-size: 0.26rem;
    height: 0.3rem;
    line-height: 0.3rem;
    display: flex;
    align-items: center;
}

.homeTil a img {
    width: 0.16rem;
    height: 0.3rem;
    margin-left: 0.1rem;
}

.homeSlide {
    width: 100%;
    margin: 0.4rem 0 0.2rem 0;
}

.homeSlide .homeTil {
    width: 6.9rem;
    margin: 0 auto 0.3rem auto;
}

.homeSlideUl ul {
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    min-height: 3rem;
    position: relative;
    -webkit-overflow-scrolling: touch;
    font-size: 0;
    padding-left: 0.3rem;
}

.homeSlideUl li {
    display: inline-block;
    vertical-align: top;
    white-space: normal;
    width: 1.36rem;
    margin-right: 0.3rem;
    padding-bottom: 0.2rem;
}

.homeSlideUl li a {
    width: 100%;
    display: block;
    position: relative;
}

.bkLabel {
    position: absolute;
    left: .06rem;
    top: 0;
    background: #ff3955;
    border-radius: 0 0 .06rem .06rem;
    font-size: .2rem;
    font-style: normal;
    color: #fff;
    height: .3rem;
    line-height: .3rem;
    padding: 0 .06rem;
}

.homeSlideUl li img {
    width: 1.36rem;
    height: 1.82rem;
    box-shadow: 0 4px 8px rgb(51 55 61 / 10%);
}

.homeSlideUl li h4, .listBox ul li h4 {
    color: #1a1a1a;
    font-size: 0.28rem;
    line-height: 0.36rem;
    font-weight: 400;
    margin: 0.14rem 0 0.07rem;
    max-height: 0.72rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.homeSlideUl li p, .listBox ul li p {
    color: #808080;
    font-size: 0.26rem;
    line-height: 0.3rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.listBox {
    width: 100%;
}

.listBox ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.listBox ul li {
    width: 1.36rem;
    margin-right: 0.3rem;
    margin-bottom: 0.3rem;
}

.listBox ul li.noneConBox {
    margin-bottom: 0;
}

.listBox ul li:nth-child(4n) {
    margin-right: 0;
}

.listBox ul li a {
    width: 100%;
    display: block;
    position: relative;
}

.listBox ul li img {
    width: 1.36rem;
    height: 1.82rem;
    display: block;
    box-shadow: 0 4px 8px rgb(51 55 61 / 10%);
}

.listUl {
    width: 100%;
}

.listUl ul {
    width: 100%;
}

.listUl ul li {
    width: 100%;
    margin-bottom: 0.3rem;
    padding-bottom: 0.3rem;
    border-bottom: 1px solid #f0f1f2;
}

.listUl ul li:last-child {
    padding-bottom: 0;
    border-bottom: none;
}

.listUl ul li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.listUl ul li .listUlImg {
    width: 1.38rem;
    height: 1.84rem;
    box-shadow: 0 4px 8px rgb(51 55 61 / 10%);
}

.listUl ul li .listInfo {
    width: 5.3rem;
}

.listUl ul li h4 {
    color: #1a1a1a;
    font-weight: 700;
    font-size: 0.32rem;
    line-height: 0.44rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.listUl ul li p {
    color: #808080;
    font-size: 0.28rem;
    line-height: 0.38rem;
    height: 0.76rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0.1rem 0 .2rem 0;
}

.listUl ul li .listOther {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.listUl ul li .listOther h5 {
    color: #808080;
    font-weight: 400;
    font-size: 0.26rem;
    height: 0.3rem;
    line-height: 0.3rem;
    max-width: 2rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.listUl ul li .listOther h5 img {
    width: 0.22rem;
    height: 0.3rem;
    margin-right: .08rem;
}

.listUl ul li .listTags {
    display: flex;
    align-items: center;
}

.listUl ul li .listTags span {
    margin-left: 0.06rem;
    border-radius: 0.04rem;
    height: 0.3rem;
    padding: 0 0.06rem;
    line-height: 0.3rem;
    font-size: 0.22rem;
    display: flex;
    align-items: center;
}

.listUl ul li .listTags span.tags1 {
    border: 1px solid #ffa100;
    color: #ffa100;
}

.listUl ul li .listTags span.tags2 {
    border: 1px solid #ff3955;
    color: #ff3955;
}

.listUl ul li .listTags span.tags3 {
    border: 1px solid #4284ee;
    color: #4284ee;
}

.copyright {
    width: 100%;
    padding: 0.3rem 0;
}

.copyright img {
    width: 1.68rem;
    height: 1.68rem;
    margin: 0 auto;
    display: block;
}

.copyright p {
    text-align: center;
    color: #808080;
    font-size: 0.24rem;
    line-height: 0.3rem;
    margin-top: 0.2rem;
}

.bindingBg {
    width: 100%;
    height: 0.9rem
}

.binding {
    background: #fff;
    box-shadow: 0px -4px 4px rgb(0 0 0 / 5%);
    z-index: 60;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 0.9rem;
    padding: 0 0.3rem 0 0.1rem;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 1.1rem;
    max-width: 7.5rem;
    margin: 0 auto;
}

.bindingLeft {
    display: flex;
    align-items: center;
}

.binding .close {
    width: 0.56rem;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 0.9rem;
}

.binding .close img {
    width: 0.26rem;
    height: 0.26rem;
}

.binding p {
    color: #7d7d7d;
    font-size: 0.26rem;
}

.binding a {
    width: 1.5rem;
    height: 0.6rem;
    border-radius: 0.6rem;
    line-height: 0.6rem;
    text-align: center;
    color: #fff;
    background: #ff3955;
}

.tabBarBg {
    width: 100%;
    height: 1.1rem;
}

.tabBar {
    width: 100%;
    background: #fff;
    border-top: 1px solid #dddddd;
    height: 1.1rem;
    position: fixed;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 900;
    max-width: 7.5rem;
    margin: 0 auto;
}

.tabBar ul {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tabBar ul li {
    width: 33.33%;
}

.tabBar ul li a {
    display: flex;
    text-align: center;
    height: 1.1rem;
    align-items: center;
    flex-direction: column;
    justify-content: center;
}

.tabBar ul li img {
    width: 0.4rem;
    height: 0.4rem;
    display: block;
    margin: 0 auto;
}

.tabBar ul li span {
    line-height: 0.3rem;
    height: 0.3rem;
    font-size: 0.24rem;
    color: #808080;
    display: block;
    margin-top: 0.1rem;
}

.tabBar ul li.current span {
    color: #ff3955;
}

/*classify*/
.headTop {
    width: 100%;
    height: 0.9rem;
    background: #fff;
    border-bottom: 1px solid #d8d9da;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    z-index: 200;
}

.backBtn, .homeBtn {
    width: 0.9rem;
    height: 0.9rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.backBtn img, .homeBtn img {
    width: 0.5rem;
    height: 0.5rem;
}

.headTopCon {
    width: 5.6rem;
}

.headTopCon ul {
    width: 100%;
}

.headTopCon ul li {
    margin-left: 0.8rem;
    display: inline-block;
    line-height: .3rem;
}

.headTopCon ul li:first-child {
    margin-left: 0.3rem;
}

.headTopCon ul li a {
    color: #7d7d7d;
    font-size: 0.28rem;
    height: 0.3rem;
    position: relative;
}

.headTopCon ul li a::after {
    content: "";
    width: 100%;
    height: 1px;
    display: block;
    background: #fff;
}

.headTopCon ul li.current a {
    color: #ff3955;
}


.headTopCon ul li.current a::after {
    background: #ff3955;
}

.classNav {
    width: 100%;
    position: fixed;
    left: 0;
    top: .9rem;
    bottom: 0;
    height: 100%;
    right: 0;
    z-index: 100;
    background: rgba(0, 0, 0, 0.5);
}

.classNavBg {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    bottom: 0;
    right: 0;
    top: .9rem;
    z-index: 99;
}

.classNav ul {
    background: #fff;
    width: 100%;
    position: relative;
    z-index: 101;
}

.classNav ul li {
    display: inline-block;
    padding: 0 .4rem;
    margin: .2rem 0;
    position: relative;
}

.classNav ul li a {
    font-size: .28rem;
    color: #7d7d7d;
    height: 0.3rem;
}

.classNav ul li a::after {
    content: "";
    width: 100%;
    height: 1px;
    display: block;
    background: #fff;
}

.classNav ul li.current a {
    color: #ff3955;
}

.classNav ul li.current a::after {
    background: #ff3955;
}

.classifySort {
    width: 6.9rem;
    margin: 0.2rem auto 0.3rem auto;
}

.classifySort ul {
    display: flex;
    align-items: center;
}

.classifySort ul li {
    margin-right: 0.8rem;
}

.classifySort ul li a {
    color: #7d7d7d;
    font-size: 0.28rem;
    height: 0.3rem;
    position: relative;
}

.classifySort ul li a::after {
    content: "";
    width: 100%;
    height: 1px;
    display: block;
    background: #fff;
}

.classifySort ul li.current a {
    color: #ff3955;
}


.classifySort ul li.current a::after {
    background: #ff3955;
}

.classifyList {
    width: 6.9rem;
    margin: 0 auto;
}

.pageBar {
    text-align: center;
    margin: 0 auto;
    padding: 0.5rem 0 0.6rem 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #f0f1f2;
    width: 6.9rem;
}

.pageBar a {
    line-height: 0.3rem;
    padding: 0.15rem 0.24rem;
    border-radius: 0.04rem;
    text-align: center;
    color: #ff4f7b;
    font-size: .28rem;
}

.pageBar a.active {
    color: #7d7d7d;
}

.pageBar a.hwMo {
    color: #c7c7c7;
}

/*ranking*/
.rankingTop {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 100;
    width: 7.5rem;
    margin: 0 auto;
}

.headTopCon h1 {
    color: #1a1a1a;
    font-size: 0.32rem;
    margin-left: -0.2rem;
    max-width: 5rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rankingBox {
    width: 100%;
}

.rankLeft {
    position: fixed;
    top: 0.9rem;
    left: 0;
    right: 0;
    width: 7.5rem;
    margin: 0 auto;
    z-index: 10;
}

.rankLeftBox {
    width: 1.50rem;
    height: calc(100vh - 0.9rem);
    border-right: 1px solid #f0f1f2;
}

.rankLeft ul {
    width: 100%;
}

.rankLeft ul li {
    width: 100%;
}

.rankLeft ul li:active {
    background: #f2f2f2;
}

.rankLeft ul li a {
    color: #808080;
    font-size: 0.26rem;
    line-height: 0.3rem;
    padding: 0.28rem 0;
    display: block;
    text-align: center;
    position: relative;
}

.rankLeft ul li.current a {
    color: #ff3955;
    font-size: 0.3rem;
}

.rankLeft ul li.current a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.24rem;
    width: 2px;
    height: 0.4rem;
    background: #ff3955;
}

.rankList {
    width: 6rem;
    margin-left: 1.5rem;
    margin-top: 0.9rem;
    z-index: 20;
    position: relative;
}

.rankList ul {
    margin: 0 0.3rem;
    padding-top: 0.3rem;
}

.rankList ul li {
    width: 100%;
    margin-bottom: .3rem;
}

.rankList ul li a {
    display: -webkit-box;
    -webkit-box-align: center;
    position: relative;
}

.rankList ul li a .bkLabel {
    right: 0;
    left: auto;
    padding: 0 0.05rem;
}

.rankList ul li .pic {
    width: .96rem;
    height: 1.3rem;
    position: relative;
    margin: 0 .24rem 0 0;
}

.rankList ul li .pic img {
    width: 1rem;
    height: 1.3rem;
    display: block;
}

.rankList ul li .pic em {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    background: #bfbfbf;
    display: inline-block;
    height: .28rem;
    line-height: .28rem;
    color: #fff;
    font-size: .22rem;
    padding: 0 .05rem;
    border-radius: 0 0 .1rem 0;
}

.rankList ul li:nth-child(1) .pic em {
    background: #e60012;
}

.rankList ul li:nth-child(2) .pic em {
    background: #f39800;
}

.rankList ul li:nth-child(3) .pic em {
    background: #8fc31f;
}

.rankList ul li .info {
    line-height: .4rem;
    -webkit-box-flex: 1;
}

.rankList ul li .info h4 {
    font-size: .3rem;
    line-height: .48rem;
    height: .48rem;
    font-weight: normal;
    word-break: keep-all;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.rankList ul li .info p {
    color: #888d95;
    font-size: .24rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rankList ul li .info p .pipe {
    margin: 0 .05rem;
}

.loading-more {
    font-size: .24rem;
    color: #999;
    text-align: center;
    padding: 0.2rem 0 0.5rem 0;
}

.noneBox {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-top: 1.6rem;
}

.noneBox img {
    width: 0.8rem;
    height: 1rem;
}

.noneBox p {
    color: #808080;
    font-size: 0.26rem;
    line-height: 0.3rem;
    margin-top: 0.2rem;
}

/*newbook  finishedbook*/
.newbook, .finishedbook {
    width: 6.9rem;
    margin: 0 auto;
    padding-top: 0.4rem;
    padding-bottom: 0.2rem;
}

/*search*/
.searchBox {
    width: 6.9rem;
    margin: 0.3rem auto;
    background: #f7f7f7;
    border-radius: 0.08rem;
    height: 0.8rem;
}

.searchBox form {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.searchBox input {
    width: 6rem;
    height: 0.8rem;
    line-height: 0.8rem;
    color: #1a1a1a;
    font-size: 0.28rem;
    padding-left: 0.2rem;
    background: none;
    cursor: pointer;
}

.searchBox input::placeholder {
    color: #808080;
}

.searchBox button {
    width: 0.86rem;
    height: 0.8rem;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.searchBox button img {
    width: 0.32rem;
    height: 0.32rem;
}

.searching {
    width: 100%;
}

.searching .homeTil {
    width: 6.9rem;
    margin: 0 auto 0.3rem auto;
}

.searchingBox {
    width: 100%;
}

.searchingBox a {
    margin-left: 0.3rem;
    display: inline-block;
    text-decoration: underline;
    color: #7d7d7d;
    font-size: 0.28rem;
}

.search {
    width: 6.9rem;
    margin: 0 auto;
}

/*book*/
.book {
    width: 100%;
}

.bookPic {
    width: 6.9rem;
    margin: 0.3rem auto 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.bookPic .bImg {
    width: 1.68rem;
    height: 2.24rem;
    position: relative;
}

.bookPic .bImg img {
    width: 1.68rem;
    height: 2.24rem;
}

.bookPic .bInfo {
    width: 5rem;
}

.bookPic .bInfo h4 {
    color: #1a1a1a;
    font-size: 0.32rem;
    line-height: 0.46rem;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bookPic .bInfo p {
    color: #1a1a1a;
    font-size: 0.28rem;
    line-height: 0.48rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bookPic .bInfo span {
    margin: 0 0.06rem;
}

.bookdesc {
    width: 6.9rem;
    padding: 0.3rem 0;
    border-top: 1px solid #f0f1f2;
    border-bottom: 1px solid #f0f1f2;
    margin: 0.3rem auto 0 auto;
    position: relative;
}

.bookdescBox {
    color: #1a1a1a;
    font-size: 0.28rem;
    line-height: 0.44rem;
    /*max-height: 1.8rem;*/
    overflow: hidden;
    display: block;
}

.bookdescBox pre {
    color: #1a1a1a;
    font-size: 0.28rem;
    word-break: break-word;
    white-space: pre-wrap;
    font-family: PingFang SC, Hiragino Sans GB, Microsoft YaHei UI, Microsoft YaHei, Source Han Sans CN, sans-serif;
}

.bookdescmore {
    position: absolute;
    right: 0;
    bottom: 0.3rem;
    width: 0.8rem;
    height: 0.44rem;
    text-align: right;
    background: linear-gradient(to right, rgba(255, 255, 255, 0), #fff 0.48rem);
}

.bookdescmore img {
    width: 0.3rem;
    height: 0.16rem;
    margin-top: 0.1rem;
}

.bookcata {
    width: 6.9rem;
    margin: 0 auto;
    height: 0.9rem;
}

.bookcata a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 0.9rem;
}

.bookcata h4 {
    color: #1a1a1a;
    font-size: 0.32rem;
    font-weight: 700;
}

.bookcata p {
    color: #808080;
    font-size: 0.26rem;
    display: flex;
    align-items: center;
}

.bookcata p img {
    width: 0.16rem;
    height: 0.3rem;
    margin-left: 0.1rem;
}

.bookreview {
    width: 100%;
}

.bookreviewBox {
    width: 6.9rem;
    margin: 0 auto;
}

.bookTil {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.3rem 0;
    border-bottom: 1px solid #f0f1f2;
    margin-bottom: 0.3rem;
}

.bookTil h4 {
    color: #1a1a1a;
    font-size: 0.32rem;
    font-weight: 700;
    height: 0.32rem;
    line-height: 0.32rem;
}

.bookTil a {
    color: #808080;
    font-size: 0.26rem;
    height: 0.3rem;
    line-height: 0.3rem;
    display: flex;
    align-items: center;
}

.bookTil a img {
    width: 0.16rem;
    height: 0.3rem;
    margin-left: 0.1rem;
}

.bookreview ul {
    width: 100%;
}

.bookreview ul li {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 0.3rem;
}

.bookreview ul li .comPic {
    width: 0.54rem;
    height: 0.54rem;
    border-radius: 0.5rem;
    background: #ddd;
    overflow: hidden;
}

.bookreview ul li .comPic img {
    width: 0.54rem;
    height: 0.54rem;
}

.bookreview ul li .comInfo {
    width: 6.1rem;
    padding-bottom: 0.3rem;
    border-bottom: 1px solid #f0f1f2;
}

.bookreview ul li:last-child .comInfo {
    border-bottom: none;
    padding-bottom: 0;
}

.bookreview ul li .comInfo h4 {
    color: #1a1a1a;
    font-size: 0.28rem;
    line-height: 0.44rem;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bookreview ul li .comInfo p {
    color: #333333;
    font-size: 0.24rem;
    line-height: 0.34rem;
    margin-top: 0.06rem;
    word-wrap: break-word
}

.noneReview {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 3.4rem;
    justify-content: center;
}

.noneReview img {
    width: 0.8rem;
    height: 1rem;
}

.noneReview p {
    color: #808080;
    font-size: 0.26rem;
    line-height: 0.3rem;
    margin-top: 0.2rem;
}

.bookreview a.goreview {
    width: 100%;
    border-top: 1px solid #f0f1f2;
    height: 0.9rem;
    text-align: center;
    color: #ff3955;
    font-size: 0.26rem;
    display: block;
    line-height: 0.9rem;
}

.bookreview a.goreview:active {
    background: #f2f2f2;
}

.recommend {
    width: 6.9rem;
    margin: 0 auto;
}

.bookBtnBg {
    width: 100%;
    height: 0.9rem;
}

.bookBtn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: fixed;
    left: 0;
    bottom: 0;
    right: 0;
    max-width: 7.5rem;
    margin: 0 auto;
}

.bookBtn .joinBtn {
    width: 1.9rem;
    height: 0.9rem;
    background: #f6f7f9;
    text-align: center;
    line-height: 0.9rem;
    font-size: 0.3rem;
}

.bookBtn a {
    width: 5.6rem;
    background: #ff3955;
    height: 0.9rem;
    text-align: center;
    line-height: 0.9rem;
    color: #fff;
    font-size: 0.3rem;
}

.bookBtn a:active {
    opacity: 0.8;
}

/*comment*/
.comment {
    width: 100%;
    padding: 0.3rem;
    height: 70vh;
}

.comment textarea {
    width: 100%;
    font-size: 0.28rem;
    color: #1a1a1a;
    border: 0 none;
    box-sizing: border-box;
    width: 100%;
    height: inherit;
    overflow: auto;
    resize: none;
    line-height: 0.4rem;
}

.comment textarea::placeholder {
    color: #808080;
}

.commentBtn {
    width: 100%;
    text-align: center;
    height: 0.9rem;
    background: #ff3955;
    color: #fff;
    font-size: 0.3rem;
    line-height: 0.9rem;
    position: fixed;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 50;
    max-width: 7.5rem;
    margin: 0 auto;
}

.commentBtn:active {
    opacity: 0.8;
}

/*commentlist*/
.commentlist {
    width: 6.9rem;
    margin: 0 auto;
    padding-top: 0.3rem;
}

.bookreview.commentlist ul li:last-child .comInfo {
    padding-bottom: 0.3rem;
    border-bottom: 1px solid #f0f1f2;
}

/*catalog*/
.catalog {
    width: 6.9rem;
    margin: 0 auto;
}

.catalog ul {
    width: 100%;
    padding-bottom: 0.3rem;
}

.catalog ul li {
    width: 100%;
    height: 0.9rem;
    border-bottom: 1px solid #efefef;
}

.catalog ul li a {
    color: #1a1a1a;
    font-size: 0.3rem;
    line-height: 0.9rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.catalog ul li a p {
    max-width: 5.4rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.catalog ul li.current a p {
    color: #ff3955;
}

.catalog ul li a em {
    color: #76ba5c;
    font-size: 0.24rem;
    float: right;
    margin-left: 10px;
}

.catalog li a span {
    color: #ff3955;
    font-size: 0.24rem;
    float: right;
    margin-left: 10px;
}

/*chapter*/
.chapter {
    width: 100%;
    background: #f6f6ef;
}

.chaContent {
    padding: 0 0.3rem;
}

.chaInfo {
    color: #333;
    font-size: 0.32rem;
    line-height: 1.8;
    overflow: hidden;
}

.chaInfo p {
    padding-top: 0.4rem;
    text-indent: 2em;
}

.chapterfeedback {
    width: 100%;
    text-align: center;
    margin-top: 0.4rem;
    margin-bottom: 0.2rem;
}

.chapterfeedback a {
    color: #7d7d7d;
    font-size: 0.26rem;
    text-decoration: underline;
}

.chapterfollow {
    margin: 0 0.3rem 0.2rem 0.3rem;
}

.chapterfollow a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 0.8rem;
    line-height: 0.8rem;
    color: #ff3955;
    font-size: 0.3rem;
    border: 1px dashed #ff3955;
    text-align: center;
    text-decoration: underline;
}

.chaPage {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;

}

.chaPage a {
    width: 33.33%;
    background: #ff3955;
    color: #ffffff;
    font-size: 0.32rem;
    line-height: 1.1rem;
    height: 1.1rem;
    text-align: center;
    display: block;
    position: relative;
}

.chaPage a:active {
    opacity: 0.8;
}

.chaPage a::after {
    content: "|";
    position: absolute;
    right: 0;
    color: #ff9caa;
}

.chaPage a:last-child:after {
    display: none;
}

/*menuBk*/
.menuBkBg {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 490;
    background: rgba(0, 0, 0, 0.5);
    max-width: 7.5rem;
    margin: 0 auto;
}

.menuBk {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    background: #fff;
    padding: 0.4rem 0;
    z-index: 500;
    max-width: 7.5rem;
    margin: 0 auto;
}

.menuOne {
    padding: 0 0.3rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.menuBgcolor > div {
    width: 23%;
    height: 0.7rem;
    border-radius: 0.5rem;
    font-size: 0.28rem;
}

.colorBtn1 {
    background: #f6f6ef;
    border: 1px solid #f6f6ef;
}

.colorBtn2 {
    background: #f5eee0;
    border: 1px solid #f5eee0;
}

.colorBtn3 {
    background: #f1e6c0;
    border: 1px solid #f1e6c0;
}

.menuBgcolor > div.active {
    border: 1px solid #a9a399;
}

.colorBtnBox {
    background: #333333;
    border: 1px solid #333333;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.28rem;
}

.menuFont {
    padding: 0.3rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.menuFont span,
.menuOne span,
.menuFoot span {
    width: 0.8rem;
    font-size: 0.28rem;
    line-height: 0.7rem;
    color: #3c3f45;
}

.menuFontBox,
.menuBgcolor,
.menuSpacing {
    width: calc(100% - 0.8rem);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.menuFontBox a {
    width: 48%;
    text-align: center;
    background: #f2f2f2;
    color: #070707;
    line-height: 0.7rem;
    display: block;
    border-radius: 0.5rem;
    font-size: 0.28rem;
}

.menuFontBox a.noClick {
    color: #999;
}

.menuFontBox a.fontJd {
    font-weight: 700;
}

.menuFoot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0.3rem;
}

.menuSpacing > div {
    width: 31%;
    text-align: center;
    background: #f2f2f2;
    color: #070707;
    border-radius: 0.5rem;
    font-size: 0.28rem;
    height: 0.7rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #f2f2f2;
}

.menuSpacing .active {
    border: 1px solid #aaaaaa;
}

.menuFoot img {
    width: 0.5rem;
    height: 0.5rem;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #646464;
}

/*black*/
.chaBlack {
    background: #373737;
}

.chaBlack .headTop {
    background: #222425;
    border-bottom: 1px solid #5a5a5a;
}

.chaBlack .headTop .headTopCon h1 {
    color: #cecece;
}

.chaBlack .chaInfo {
    color: #cecece;
}

.chaBlack .menuBk {
    background: #454545;
}

.chaBlack .menuOne a {
    color: #afb7c0;
}

.chaBlack .menuOne a.noClick {
    color: #767779;
}

.chaBlack .menuFont span,
.chaBlack .menuOne span {
    color: #8a8a8a;
}

.chaBlack .menuFontBox a {
    color: #fff;
    background: #676767;
}

.chaBlack .menuFontBox a.noClick {
    color: #999;
}

.chaBlack .menuFoot span {
    color: #8a8a8a;
}

.chaBlack .menuSpacing > div {
    background: #676767;
    border: 1px solid #676767;
}

.chaBlack .menuSpacing .active {
    border: 1px solid #c9c9c9;
}

.chaBlack .menuFoot i {
    color: #fff;
}

/*black end*/

/*endBook*/
.endBook {
    width: 100%;
    background: #f6f7f9;
    height: 1.68rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.endBook h4 {
    width: 4rem;
    margin: 0 auto;
    position: relative;
    text-align: center;
}

.endBook h4::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    background: #c0c5cc;
    left: 0;
    top: 0.2rem;
}

.endBook h4 span {
    color: #808080;
    font-size: 0.32rem;
    background: #f6f7f9;
    height: 0.4rem;
    line-height: 0.4rem;
    z-index: 10;
    position: relative;
    padding: 0 0.2rem;
    font-weight: 400;
}

/*feedbackBox*/
.feedbackBox {
    width: 6.9rem;
    margin: 0 auto;
}

.feedbackBox h4 {
    width: 100%;
    box-sizing: border-box;
    line-height: 0.6rem;
    height: 0.6rem;
    font-size: 0.3rem;
    color: #7d7d7d;
    margin: 0.3rem 0;
    font-weight: 400;
}

.feedCheck {
    width: 100%;
}

.feedCheck .feedCheBox {
    margin-bottom: 0.3rem;
    color: #222222;
    font-size: 0.3rem;
    line-height: 0.3rem;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.feedCheck label {
    cursor: pointer;
}

.feedbackBox textarea {
    width: 100%;
    border: 1px solid #c4c4c4;
    border-radius: 0.06rem;
    color: #1a1a1a;
    font-size: 0.3rem;
    line-height: 0.34rem;
    outline: none;
    padding: 0.06rem;
    resize: none;
    height: 2rem;
    box-sizing: border-box;
    margin: 0.2rem 0 0.5rem 0;
}

.feedCheBox input[type="radio"] {
    width: 0.3rem;
    height: 0.3rem;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    margin-right: 0.12rem;
    position: relative;
    cursor: pointer;
}

.feedCheBox input[type="radio"]::before {
    content: "";
    position: absolute;
    top: -1px;
    left: -2px;
    background: #fff;
    width: 100%;
    height: 100%;
    border: 1px solid #c4c4c4;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.feedCheBox input[type="radio"]:checked::before {
    content: "\2713";
    background-color: #fff;
    position: absolute;
    top: -1px;
    left: -2px;
    width: 100%;
    border: 1px solid #ff3955;
    border-radius: 0;
    color: #ff3955;
    font-size: 0.24rem;
    font-weight: bold;
}

.feedbackBox button {
    width: 6.1rem;
    height: 0.9rem;
    line-height: 0.9rem;
    text-align: center;
    margin: 0 auto;
    background: #ff3955;
    color: #fff;
    font-size: 0.32rem;
    border-radius: 0.5rem;
    outline: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.feedbackBox button:active {
    opacity: 0.8;
}

.popTip {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
}

.popTipBox {
    max-width: 7rem;
    background: rgba(0, 0, 0, 0.7);
    padding: 0.22rem;
    border-radius: 0.1rem;
}

.popTipBox p {
    color: #fff;
    font-size: 0.28rem;
    line-height: 0.36rem;
}

/*self*/
.self {
    width: 6.9rem;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.3rem 0;
    position: relative;
}

.self .selfImg {
    width: 1.1rem;
    height: 1.1rem;
    position: relative;
}

.self .selfImg img.selfImgPic {
    width: 1.1rem;
    height: 1.1rem;
    border: 2px solid #fff;
    box-sizing: border-box;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.self .selfImg img.selfVipIcon {
    position: absolute;
    width: 0.4rem;
    height: 0.4rem;
    bottom: -0.04rem;
    right: -0.06rem;
}

.selfInfo {
    width: 5.6rem;
}

.selfInfoTil {
    display: flex;
    align-items: center
}

.selfInfoTil img {
    width: .32rem;
    height: .32rem;
    margin-left: .2rem
}

.selfInfo h4 {
    color: #1a1a1a;
    font-size: 0.32rem;
    line-height: 0.5rem;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 3.4rem;
}

.selfInfo span {
    color: #7d7d7d;
    font-size: 0.26rem;
    line-height: 0.4rem;
    margin-right: 0.1rem;
}

.douBox {
    width: 6.9rem;
    border-radius: 0.1rem;
    background: #ff3955;
    height: 0.9rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.2rem;
    margin: 0 auto;
}

.monDouzi {
    color: #fff;
    font-size: 0.3rem;
}

.monDouzi em {
    font-style: normal;
}

.douBuyBtn {
    width: 1.2rem;
    height: 0.6rem;
    border-radius: 0.06rem;
    background: #fff;
}

.douBuyBtn a {
    width: 1.2rem;
    height: 0.6rem;
    line-height: 0.6rem;
    color: #ff3955;
    text-align: center;
    display: block;
    font-size: 0.3rem;
}

.zichanbanner {
    width: 6.9rem;
    margin: 0.3rem auto 0 auto;
}

.zichanbanner img {
    width: 6.9rem;
    height: 2.16rem;
    border-radius: 0.06rem;
    overflow: hidden;
}

.selfMenu {
    width: 6.9rem;
    margin: 0.1rem auto 0 auto;
}

.selfMenu ul {
    width: 100%;
}

.selfMenu ul li {
    width: 100%;
}

.selfMenu ul li a {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.26rem 0;
    border-bottom: 1px solid #f0f0f0;
}

.selfMenu ul li a:active {
    background: #f1f1f1;
}

.selfMenuBox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #1a1a1a;
    font-size: 0.28rem;
    line-height: 0.4rem;
}

.selfMenuBox img {
    width: 0.4rem;
    height: 0.4rem;
    margin-right: 0.1rem;
}

.selfMenuRight {
    display: flex;
    align-items: center;
}

.selfMenuRight p {
    color: #7d7d7d;
    font-size: 0.26rem;
}

.selfMenuRight img {
    width: 0.16rem;
    height: 0.3rem;
    margin-left: 0.1rem;
}

.selfMenuRight .signBtn {
    color: #ff3955;
    font-size: 0.28rem;
    text-decoration: underline;
}

.selfMenuRight .signYesBtn {
    color: #7d7d7d;
    font-size: 0.28rem;
    text-decoration: none;
}

.signPop {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 800;
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-width: 7.5rem;
    margin: 0 auto;
}

.signPopBox {
    width: 5.2rem;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.signPopBox img {
    width: 100%;
}

.signPopCon {
    position: absolute;
    bottom: 0.4rem;
}

.signPopCon h4 {
    color: #ffffff;
    font-size: 0.46rem;
    line-height: 0.6rem;
    font-weight: 400;
}

.signPopCon h5 {
    color: #ffffff;
    font-size: 0.36rem;
    line-height: 0.5rem;
    font-weight: 400;
    margin: 0.12rem 0 0.24rem 0;
}

.signPopCon a {
    color: #fc4f7c;
    font-size: 0.36rem;
    line-height: 0.5rem;
    width: 3.5rem;
    height: 0.76rem;
    background: #fff;
    line-height: 0.76rem;
    display: block;
    border-radius: 0.5rem;
}

.signPopClose img {
    color: #fff;
    font-size: 0.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.2rem;
    position: relative;
    z-index: 801;
    width: 0.62rem;
    height: 0.62rem;
}

/*selfinfo*/
.selfinfo {
    width: 6.9rem;
    margin: 0.45rem 0.3rem 0.2rem 0.3rem;
    background: #fff;
    border-radius: 0.06rem;
}

.mineName {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.til {
    width: 1rem;
    color: #1a1a1a;
    font-size: 0.3rem;
}

.mineCon {
    width: 5.8rem;
}

.mineCon input {
    width: 100%;
    height: 0.66rem;
    border: 1px solid #dddddd;
    box-sizing: border-box;
    border-radius: 0.06rem;
    padding: 0 0.1rem;
    font-size: 0.3rem;
    color: #222;
}

.mineImg {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 0.3rem;
}

.minePic {
    width: 1.4rem;
    height: 1.4rem;
    border-radius: 0.06rem;
    overflow: hidden;
    position: relative;
}

.minePic img {
    width: 1.4rem;
    height: 1.4rem;
}

.minePicTil {
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    height: 0.34rem;
    line-height: 0.34rem;
    color: #fff;
    background: rgba(0, 0, 0, 0.5);
    font-size: 0.2rem;
    text-align: center;
}

.mineBtn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 0.3rem;
}

.mineBtn button {
    width: 6.1rem;
    height: 0.8rem;
    line-height: 0.8rem;
    text-align: center;
    border-radius: 1rem;
    background: #ff3955;
    color: #fff;
    font-size: 0.3rem;
}

.mineBtn button:active {
    opacity: 0.8;
}

/*recharge*/
.recharge {
    width: 6.9rem;
    margin: 0 auto;
}

.buyTil {
    text-align: center;
    padding-top: 0.3rem;
}

.buyTil p {
    color: #1a1a1a;
    font-size: 0.34rem;
    font-weight: 400;
}

.buyMode {
    width: 6.9rem;
    margin: 0.3rem auto;
}

.buyModeTip {
    position: relative;
    text-align: center;
    margin-bottom: 0.2rem;
}

.buyModeTip span {
    background: #fff;
    height: 0.3rem;
    font-size: 0.28rem;
    position: relative;
    padding: 0 0.2rem;
    z-index: 2;
}

.buyModeTip::after {
    content: "";
    position: absolute;
    left: 10%;
    bottom: 0;
    width: 80%;
    height: 1px;
    background: #d1d1d1;
    top: 50%;
    z-index: 1;
}

.buyMode ul {
    display: flex;
    align-items: center;
    justify-content: start;
    flex-wrap: wrap;
}

.buyMode ul li {
    width: calc(50% - 0.15rem);
    margin-right: 0.3rem;
    margin-top: 0.15rem;
    margin-bottom: 0.15rem;
    text-align: center;
    border: 1px solid #fffcf2;
    border-radius: 0.1rem;
}

.newBuyBox li.buyLi1, .newBuyBox li.buyLi2, .newBuyBox li.buyLi3 {
    width: calc(33.33% - 0.2rem);
}

.newBuyBox li.buyLi2 {
    margin-right: 0.3rem !important;
}

.newBuyBox li.buyLi3 {
    margin-right: 0;
}

.newBuyBox li.buyLi4 {
    margin-right: 0.3rem !important;
}

.newBuyBox li.buyLi5 {
    margin-right: 0 !important;
}

.buyMode ul li:nth-child(2n) {
    margin-right: 0;
}

.buyMode ul li span {
    color: #222222;
    font-size: 0.24rem;
    line-height: 0.3rem;
}

.buyMode ul li span i {
    color: #fff;
    font-size: 0.24rem;
    height: 0.36rem;
    line-height: 0.38rem;
}

.money {
    color: #fc5c7c;
    font-size: 0.4rem;
    line-height: 0.5rem;
    font-weight: 400;
}

.money em {
    font-size: 0.24rem;
    font-weight: 400;
}

.newBuyTip, .buyTipRecom {
    position: absolute;
    top: 0;
    right: 0;
    width: auto;
    height: 0.3rem;
    line-height: 0.3rem;
    background: #bababa;
    text-align: center;
    padding: 0 0.06rem;
    color: #fff;
    font-size: 0.2rem;
    border-radius: 0 0.02rem 0 0.08rem;
}

.buyTipRecom {
    background: #fc5c7c;
}

.bugVip {
    padding: 0 0.3rem;
}

.bugVip ul {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 0.1rem;
    width: 100%;
    flex-wrap: wrap;
}

.bugVip ul li {
    width: calc(50% - 0.15rem);
    border-radius: 0.1rem;
    position: relative;
    padding: 0.3rem 0;
    text-align: center;
    background: linear-gradient(140deg, #758cba, #9eafcd);
    margin-bottom: 0.3rem;
}

.bugVip ul li span {
    display: block;
    color: #fff;
    font-size: 0.24rem;
    line-height: 0.3rem;
}

.bugVip ul li h4 {
    display: block;
    color: #fff;
    line-height: 0.5rem;
    font-weight: 400;
    font-size: 0.4rem;
    padding: 0.2rem 0 0.1rem 0;
}

.bugVip ul li h4 em {
    font-size: 0.24rem;
    font-weight: 400;
}

.bugVip ul li p {
    display: block;
    color: #fff;
    line-height: 0.32rem;
    font-size: 0.2rem;
}

.bugVip ul li .yesVip {
    position: absolute;
    left: 0.2rem;
    top: 0.2rem;
    width: 1.4rem;
    opacity: 0.5;
}

.buyVipCurr {
    position: absolute;
    right: 0.16rem;
    top: 0.16rem;
    width: 0.26rem;
    height: 0.26rem;
    border-radius: 0.5rem;
    background: #e0b465;
    color: #fff;
    font-size: 0.2rem;
    border: 1px solid #fff;
    display: none;
}

.buyVipCurr img {
    width: 100%;
}

.bugVip ul li.vip0 {
    background: linear-gradient(140deg, #758cba, #9eafcd);
}

.bugVip ul li.vip1 {
    background: linear-gradient(140deg, #3e9aeb, #71bdfe);
}

.bugVip ul li.vip2 {
    background: linear-gradient(140deg, #fc8140, #ffb43e);
}

.bugVip ul li.vip3 {
    background: linear-gradient(140deg, #fa534f, #f96c6c);
}

.bugVip ul li.current {
    box-shadow: 0 0 0.16rem rgba(0, 0, 0, 0.1);
}

.bugVip ul li.current .buyVipCurr {
    display: block;
}

.bugVip ul.buyVipOne li {
    width: 100%;
}

.bugVip ul.buyVipThree li:nth-child(3) {
    width: 100%;
}

.buyTip {
    padding: 0.2rem 0.3rem 0 0.3rem;
}

.buyTip p {
    color: #707070;
    font-size: 0.26rem;
    line-height: 0.42rem;
}

.buyTip img {
    width: 2rem;
    margin: 0.2rem auto;
    display: block;
}

.buyBottom {
    width: 100%;
    background: #fff;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    height: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 500;
    max-width: 7.5rem;
    margin: 0 auto;
}

.buyBottom button {
    width: 7.1rem;
    height: 0.8rem;
    color: #fff;
    font-size: 0.3rem;
    line-height: 0.8rem;
    background: #ff3955;
    border-radius: 0.06rem;
}

.buyBottom button:active {
    opacity: 0.8;
}

.buyBotBox {
    height: 1.1rem;
}

.buyChoice {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 600;
    display: flex;
    align-items: flex-end;
    max-width: 7.5rem;
    margin: 0 auto;
}

.buyChoiceBg {
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    position: fixed;
}

.buyChoiceBox {
    width: 100%;
    height: auto;
    background: #fff;
    border-radius: 0.2rem 0.2rem 0 0;
    padding: 0.3rem 0.4rem;
    position: relative;
}

.buyChoiceTil {
    color: #1a1a1a;
    font-size: 0.32rem;
    line-height: 0.4rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 0.2rem;
}

.buyInfo {
    width: 100%;
    padding-bottom: 0.2rem;
}

.buyInfo ul {
    width: 100%;
}

.buyInfo ul li {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

.buyInfo ul li span {
    color: #7d7d7d;
    font-size: 0.28rem;
    line-height: 0.7rem;
}

.buyInfo ul li p {
    color: #1a1a1a;
    font-size: 0.28rem;
}

.buyInfo ul li p em {
    font-size: 0.22rem;
}

.buyInfo ul li p span {
    color: #1a1a1a;
}

.buyModeWx {
    width: 100%;
}

.buyModeWx ul {
    width: 100%;
}

.buyModeWx ul li {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.3rem;
}

.buyModeWx ul li .paymentImg {
    display: flex;
    align-items: center;
}

.buyModeWx ul li .paymentImg img {
    width: 0.52rem;
    height: 0.52rem;
    margin-right: 0.2rem;
}

.buyModeWx ul li .paymentImg p {
    color: #1a1a1a;
    font-size: 0.3rem;
}

.paymentBox {
    width: 0.34rem;
    height: 0.34rem;
    border-radius: 0.5rem;
    border: 1px solid #c4c4c4;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
}

.paymentBox img {
    width: 0.34rem;
    height: 0.34rem;
}

.buyModeWx ul li.current .paymentBox {
    border: 1px solid #ff3955;
    background: #ff3955;
}

.buyChoiceBtn {
    width: 6.9rem;
    height: 0.9rem;
    line-height: 0.9rem;
    color: #fff;
    border-radius: 0.06rem;
    background: #ff3955;
    margin-top: 0.2rem;
    font-size: 0.3rem;
}

.buyChoiceBtn:active {
    opacity: 0.8;
}

/*follow  contact*/
.follow, .contact {
    width: 100%;
    padding-top: 1.6rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.follow img, .contact img {
    width: 3.6rem;
    height: 3.6rem;
}

.follow p, .contact p {
    color: #7d7d7d;
    font-size: 0.28rem;
    line-height: 0.4rem;
    padding-top: 0.1rem;
}

/*rechargehis*/
.rechargehis {
    width: 100%;
}

.rechargehis ul {
    width: 100%;
}

.rechargehis ul li {
    border-bottom: 1px solid #f0f0f0;
    padding: 0.2rem 0.3rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.reHisTil h4 {
    color: #1a1a1a;
    font-size: 0.28rem;
    line-height: 0.4rem;
    font-weight: 400;
    max-width: 4.6rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.reHisTil span {
    color: #808080;
    font-size: 0.22rem;
    line-height: 0.3rem;
    display: block;
}

.reHisInfo {
    text-align: right;
}

.reHisInfo h4 {
    color: #ff3955;
    font-size: 0.28rem;
    line-height: 0.4rem;
    font-weight: 700;
}

.reHisInfo span {
    color: #808080;
    font-size: 0.24rem;
    line-height: 0.3rem;
    display: block;
}

/*consumptionhis*/
.consumptionhis {
    width: 100%;
}

.consumptionhis ul {
    width: 100%;
}

.consumptionhis ul li {
    border-bottom: 1px solid #f0f0f0;
    padding: 0.2rem 0.3rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/*login*/
.login {
    width: 100%;
}

.loginTil {
    display: flex;
    align-items: center;
    flex-direction: column;
    padding: 0.7rem 0 0.3rem 0;
}

.loginTil img {
    width: 1rem;
    height: 1rem;
}

.loginTil h4 {
    color: #1a1a1a;
    font-size: 0.34rem;
    line-height: 0.44rem;
    margin-top: 0.1rem;
    font-weight: 400;
}

.loginForm {
    width: 6.2rem;
    margin: 0 auto;
}

.logininput {
    width: 100%;
    background: url(../img/userIco.png) no-repeat 0.1rem center;
    background-size: 0.4rem 0.4rem !important;
    border-bottom: 1px solid #EEE;
    padding-left: 0.8rem;
    margin-bottom: 0.2rem;
}

.logininput input {
    width: 4rem;
    height: 0.96rem;
    line-height: 0.96rem;
    font-size: 0.3rem;
    color: #1a1a1a;
    background: none;
}

.logininput input::placeholder {
    color: #d1d1d1;
}

.logininput.loginpass {
    background: url(../img/passwordIco.png) no-repeat 0.1rem center;
}

.loginLink {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.loginLink a {
    color: #0091DE;
    font-size: 0.26rem;
}

.loginLink a:active {
    opacity: 0.8;
}

.loginForm button {
    width: 6.1rem;
    border-radius: 1rem;
    height: 0.9rem;
    background: #ff3955;
    color: #fff;
    font-size: 0.3rem;
    line-height: 0.9rem;
    text-align: center;
    margin-top: 0.6rem;
}

.loginForm button:active {
    opacity: 0.8;
}

/*passwordForm*/
.password {
    width: 100%;
}

.passwordForm {
    width: 6.2rem;
    margin: 0 auto;
    padding-top: 0.2rem;
}

.passwordinput {
    width: 100%;
    background: #f6f7f9;
    padding: 0 0.3rem;
    margin-bottom: 0.3rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
    border-radius: 0.06rem;
}

.passwordinput input {
    width: 100%;
    height: 0.8rem;
    line-height: 0.8rem;
    font-size: 0.3rem;
    color: #1a1a1a;
    background: none;
}

.passwordinput .codeBtn {
    width: 1.8rem;
    background: #ff3955;
    color: #fff;
    font-size: 0.3rem;
    position: absolute;
    height: 0.8rem;
    line-height: 0.8rem;
    right: 0;
    top: 0;
    text-align: center;
}

.passwordinput .codeBtn:active {
    opacity: 0.8;
}

.passwordinput .codeBtn.codeCount {
    background: #ddd;
}

.passwordinput .codeBtn.codeCount:active {
    opacity: 1 !important;
}

.passwordForm button {
    width: 6.1rem;
    border-radius: 1rem;
    height: 0.9rem;
    background: #ff3955;
    color: #fff;
    font-size: 0.3rem;
    line-height: 0.9rem;
    text-align: center;
    margin-top: 0.4rem;
}

.passwordForm button:active {
    opacity: 0.8;
}

/*register*/
.register {
    width: 100%;
}

/*contentH5*/
.contentH5 {
    width: 100%;
}

/*loading*/
.listLoading {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.2rem 0 0.3rem 0;
}

.circle-line {
    width: 0.5rem;
    height: 0.5rem;
    display: inline-block;
    position: relative;
    left: -0.1rem;
}

.circle-line i {
    display: block;
    width: 100%;
    height: 0.05rem;
    opacity: .7;
    position: absolute;
    top: calc(50% - 0.025rem);
    left: 0;
    transform-origin: center;
    animation: circle 1.5s linear infinite;
}

.circle-line i::before {
    content: '';
    display: block;
    width: 0.05rem;
    border-radius: 50%;
    height: 0.05rem;
    position: absolute;
    top: 0;
    right: 0.1rem;
    background-color: #999;
}

.circle-line i:nth-child(1) {
    transform: rotate(0deg);
    animation-delay: 0.2s;
}

.circle-line i:nth-child(2) {
    transform: rotate(45deg);
    animation-delay: 0.4s;
}

.circle-line i:nth-child(3) {
    transform: rotate(90deg);
    animation-delay: 0.6s;
}

.circle-line i:nth-child(4) {
    transform: rotate(135deg);
    animation-delay: 0.8s;
}

.circle-line i:nth-child(5) {
    transform: rotate(180deg);
    animation-delay: 1s;
}

.circle-line i:nth-child(6) {
    transform: rotate(225deg);
    animation-delay: 1.2s;
}

.circle-line i:nth-child(7) {
    transform: rotate(270deg);
    animation-delay: 1.4s;
}

.circle-line i:nth-child(8) {
    transform: rotate(315deg);
    animation-delay: 1.6s;
}

@keyframes circle {
    0% {
        opacity: 0.05;
    }

    100% {
        opacity: 1;
    }
}

/*browser*/
.browser {
    width: 100%;
    z-index: 910;
}

.browser img {
    display: block;
    width: 90%;
    margin: 0 auto;
    margin-top: 0.5rem;
}

/*bookShelf*/
.bookshelfTop {
    width: 100%;
    height: 0.9rem;
    background: #fff;
    border-bottom: 1px solid #d8d9da;
}

.bookshelfHead {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.bookshelfTop ul {
    display: flex;
    align-items: center;
    height: 0.9rem;
}

.bookshelfTop ul li {
    margin-left: 0.3rem;
    color: #7d7d7d;
    font-size: 0.28rem;
    height: 0.9rem;
    line-height: 0.9rem;
    position: relative;
}

.bookshelfTop ul li:active {
    background: #f1f1f1;
}

.bookshelfTop ul li::after {
    content: "";
    width: 100%;
    height: 1px;
    display: block;
    position: absolute;
    left: 0;
    bottom: 0.18rem;
}

.bookshelfTop ul li.current {
    color: #ff3955;
}

.bookshelfTop ul li.current::after {
    background: #ff3955;
}

.setBookshelf {
    margin-right: 0.1rem;
    color: #3e72da;
    font-size: 0.28rem;
    line-height: 0.9rem;
    padding: 0 0.2rem;
}

.setBookshelf:active {
    background: #f1f1f1;
}

.setHeadTop {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0.1rem;
}

.setHeadTop > div {
    color: #ff3955;
    font-size: 0.28rem;
    line-height: 0.9rem;
    padding: 0 0.2rem;
}

.setHeadTop > div:active {
    background: #f1f1f1;
}

.bookShelf {
    width: 6.9rem;
    margin: 0 auto;
    padding-top: 0.3rem;
}

.bookShelf ul {
    width: 100%;
}

.bookShelf ul li {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.3rem;
    padding-bottom: 0.3rem;
    border-bottom: 1px solid #f0f1f2;
}

.bookShelf ul li a {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.bookShelf ul li .listUlImg {
    width: 1.08rem;
    height: 1.44rem;
    box-shadow: 0 4px 8px rgb(51 55 61 / 10%);
}

.bookShelf ul li .listInfo {
    width: 5.6rem;
}

.bookShelf ul li .listInfo h4 {
    color: #1a1a1a;
    font-size: 0.32rem;
    font-weight: 700;
    line-height: 0.44rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bookShelf ul li .listInfo h5 {
    color: #808080;
    font-size: 0.28rem;
    line-height: 0.4rem;
    display: flex;
    align-items: center;
    font-weight: 400;
    margin: 0.1rem 0;
}

.bookShelf ul li .listInfo h5 span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bookShelf ul li .listInfo h5 img {
    width: 0.22rem;
    height: 0.3rem;
    margin-right: 0.08rem;
}

.bookShelf ul li .listOther {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.bookShelf ul li .listOther p {
    color: #808080;
    font-size: 0.28rem;
    line-height: 0.4rem;
    max-width: 3.9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bookShelf ul li .listOther span {
    color: #808080;
    font-size: 0.28rem;
    line-height: 0.4rem;
    display: flex;
    align-items: center;
}

.bookShelf ul li .listOther span img {
    width: 0.16rem;
    height: 0.3rem;
    margin-left: 0.1rem;
}

.bookShelfHis ul li .selectBox {
    width: 0.34rem;
    height: 0.34rem;
    display: none;
    align-items: center;
    justify-content: center;
    border-radius: 1rem;
    border: 1px solid #c0c5cc;
}

.bookShelfHis ul li .selectBox.current {
    background: #ff3955;
    border: 1px solid #ff3955;
}

.bookShelfHis ul li .selectBox img {
    width: 0.34rem;
    height: 0.34rem;
}

.editBox ul li a {
    width: 6.3rem;
}

.editBox ul li a .listInfo {
    width: 5rem;
}

.editBox ul li a .listInfo .listOther p {
    max-width: 3.4rem;
}

.bookShelfHis.editBox ul li .selectBox {
    display: flex;
}

.delBtn {
    width: 100%;
    background: #fff;
    border-top: 1px solid #dddddd;
    height: 1.1rem;
    position: fixed;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 910;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ff3955;
    font-size: 0.3rem;
}

.delBtn:active {
    background: #f1f1f1;
}

.delBtn img {
    width: 0.32rem;
    height: 0.32rem;
    margin-right: 0.1rem;
}

/*orderSuccess*/
.orderSuccess {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 7.5rem;
    margin: 0 auto;
}

.orderSuccessBg {
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    position: fixed;
}

.orderSuccessBox {
    width: 5rem;
    height: auto;
    background: #fff;
    border-radius: .06rem;
    position: relative;
    overflow: hidden;
    text-align: center;
}

.orderSuccessBox h4 {
    color: #333333;
    font-size: .32rem;
    line-height: 1rem;
    font-weight: 400;
}

.orderSuccessBtn {
    color: #ff3955;
    font-size: .32rem;
    line-height: 1rem;
    border-top: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
}

.orderSuccessBox button {
    color: #7d7d7d;
    font-size: .32rem;
    line-height: 1rem;
    background: none;
    width: 100%;
    display: block;
}

/*paymentsuccess*/
.paymentsuccess {
    width: 6.9rem;
    margin: 0 auto;
}

.paymentsuccessTil {
    padding: .7rem 0 .6rem 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.paymentsuccessTil img {
    width: 1.22rem;
    height: 1.2rem;
}

.paymentsuccessTil h4 {
    color: #222222;
    font-size: .3rem;
    line-height: .4rem;
    padding-top: .2rem;
    font-weight: 400;
}

.paymentsuccessUl {
    width: 100%;
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
    padding: .3rem 0;
}

.paymentsuccessUl ul {
    width: 100%;
}

.paymentsuccessUl ul li {
    width: 100%;
    color: #444;
    font-size: .28rem;
    line-height: .6rem;
}

.paymentsuccessBtn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: .6rem;
}

.paymentsuccessBtn a {
    width: 5.4rem;
    height: .9rem;
    line-height: .9rem;
    text-align: center;
    background: #ff3955;
    color: #fff;
    font-size: .3rem;
    border-radius: .6rem;
}

/*loading弹框*/
.popLoading {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}

.popLoadingBox {
    width: 2.6rem;
    border-radius: .1rem;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: .5rem .2rem .4rem .2rem;
}

.popLoadingBox .loadBox .circle-line {
    display: block;
    width: 1rem;
    height: 1rem;
    left: 0;
}

.popLoadingBox .loadBox .circle-line i {
    height: .05rem;
    top: calc(50% - .025rem);
}

.popLoadingBox .loadBox .circle-line i::before {
    background: #fff;
    height: .05rem;
    width: .2rem;
    border-radius: 10px;
}

.popLoadingBox p {
    color: #fff;
    font-size: .28rem;
    line-height: .36rem;
    margin-top: .1rem;
    text-align: center;
}

/*404*/
.nonePage {
    width: 100%;
}

.nonePage img {
    width: 5rem;
    height: 2.5rem;
    display: block;
    margin: 1.6rem auto .8rem auto;
}

.nonePage h4 {
    color: #333;
    font-size: .28rem;
    font-weight: 400;
    line-height: 2;
    text-align: center;
}

.nonePage h5 {
    color: #333;
    font-size: .28rem;
    font-weight: 400;
    line-height: 2;
    text-align: center;
}

.nonePage a {
    width: 6.1rem;
    margin: 1rem auto 0 auto;
    height: .9rem;
    line-height: .9rem;
    text-align: center;
    background: #ff3955;
    color: #fff;
    font-size: .3rem;
    border-radius: .6rem;
    display: block;
}

.nonePage a:active {
    opacity: .8;
}

/*frequently*/
.frequently {
    width: 100%;
}

.frequentlyTil {
    padding: 1rem 0 .8rem 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.frequently img {
    width: 1.22rem;
    height: 1.2rem;
}

.frequentlyTil h4 {
    color: #222222;
    font-size: .28rem;
    line-height: .4rem;
    padding-top: .2rem;
    font-weight: 400;
}

.frequently a {
    width: 5.4rem;
    height: .9rem;
    line-height: .9rem;
    text-align: center;
    background: #ff3955;
    color: #fff;
    font-size: .3rem;
    border-radius: .6rem;
    display: block;
    margin: 1.8rem auto 0 auto
}

/*news*/
.news {
    width: 100%;
    padding: 0.1rem .3rem .3rem .3rem;
}

.newsCon p {
    color: #333;
    font-size: .28rem;
    line-height: 1.8;
    padding-top: .2rem;
}

/*mergepop*/
.mergepop {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
}

.mergeBox {
    width: 6rem;
    border-radius: 0.06rem;
    background: #fff;
    padding: .5rem .3rem .3rem .3rem;
}

.mergeBox img {
    width: 1rem;
    height: 1.1rem;
    display: block;
    margin: 0 auto;
}

.mergeBox h4 {
    color: #ff3350;
    font-size: .32rem;
    line-height: .4rem;
    font-weight: 700;
    text-align: center;
    margin: .3rem 0;
}

.mergeBox p {
    color: #333333;
    font-size: .28rem;
    line-height: .46rem;
    text-align: center;
    padding-bottom: .2rem;
}

.mergeBox a {
    width: 4.8rem;
    height: .8rem;
    border-radius: 6rem;
    background: #ff3350;
    border: 1px solid #ff3350;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: .3rem;
    margin: .2rem auto;
}

.mergeBox a.mergeNone {
    color: #ff3350;
    background: #fff;
}

.mergeBox a:active {
    opacity: 0.8;
}

/*merge*/
.merge {
    width: 100%;
}

.mergeUser {
    width: 7.1rem;
    margin: 1rem auto 0.5rem auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mergeUser li {
    width: 3.4rem;
    border: 1px solid #e2e2e2;
    border-radius: 0.06rem;
    position: relative;
    padding: 0 .3rem .2rem .3rem;
}

.mergeUser li.mergeIcon {
    border: none;
    position: absolute;
    left: 50%;
    margin-left: -0.4rem;
    width: 0.72rem;
    padding: 0;
    z-index: 10;
}

.mergeUser li.mergeIcon img {
    width: .72rem;
    height: .72rem;
}

.mergeUser li .mergeUserIcon {
    width: 1.1rem;
    height: 1.1rem;
    position: relative;
    display: block;
    margin: -0.55rem auto .1rem auto;
}

.mergeUser li .mergeUserIcon img {
    width: 1.1rem;
    height: 1.1rem;
    border: 2px solid #fff;
    box-sizing: border-box;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 0 10px rgb(0 0 0 / 10%);
}

.mergeUser li p {
    color: #222;
    font-size: 0.26rem;
    line-height: 0.4rem;
}

.mergeBtn {
    width: 5.6rem;
    height: .8rem;
    border-radius: 6rem;
    background: #ff3350;
    border: 1px solid #ff3350;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: .3rem;
    margin: .2rem auto;
}

/*nomerge*/
.nomerge {
    width: 100%;
}

.nomerge img {
    width: 1.22rem;
    height: 1.22rem;
    display: block;
    margin: 1.6rem auto .8rem auto;
}

.nomerge h4 {
    color: #333;
    font-size: .28rem;
    font-weight: 400;
    line-height: 2;
    text-align: center;
}

.nomerge h5 {
    color: #333;
    font-size: .28rem;
    font-weight: 400;
    line-height: 2;
    text-align: center;
}

.nomerge a {
    width: 5.4rem;
    margin: 1rem auto 0 auto;
    height: .9rem;
    line-height: .9rem;
    text-align: center;
    background: #ff3955;
    color: #fff;
    font-size: .3rem;
    border-radius: .6rem;
    display: block;
}

.nomerge a:active {
    opacity: .8;
}

/*9-1日新增*/
.authorHuifu {
    width: 100%;
    background: #f5f5f5;
    border-radius: 0.1rem;
    padding: 0.1rem 0.2rem;
    margin-top: 0.2rem;
}

.authorHuifu p {
    color: #333333;
    font-size: 0.24rem;
    line-height: 0.3rem;
    margin-top: 0;
}

.followChaBg {
    width: 100%;
    background: #f6f6ef;
}

.followCha {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    text-align: center;
}

.followChaBox {
    padding: 0.3rem 0;
}

.followCha h4 {
    color: #ff3955;
    font-size: 0.3rem;
    font-weight: 400;
    line-height: 0.4rem;
    margin-bottom: 0.3rem;
}

.followCha span {
    color: #999999;
    font-size: 0.24rem;
    line-height: 0.3rem;
    display: block;
}

.followChaEwm {
    width: 3.6rem;
    height: 3.6rem;
    display: block;
    margin: 0.2rem auto;
}

.followChaEwm img {
    width: 3.6rem;
    height: 3.6rem;
}

.followCha p {
    color: #666666;
    font-size: 0.24rem;
    line-height: 0.3rem;
}

.shelfXiajiaT {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.shelfXiajiaT h5 {
    max-width: 3.4rem;
}

.shelfXiajiaT p {
    color: #ff3955;
    font-size: 0.28rem;
}

.selfMenuRight p.hongse {
    color: #ff3955;
}

/* 首页绑定手机弹框 */
.Idphone {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 7.5rem;
    margin: 0 auto;
}

.Idphone-con {
    width: 5.24rem;
    height: 5.66rem;
    border-radius: 0.16rem;
    background-image: linear-gradient(#ffebee, #FFF 72%);
    display: flex;
    align-items: center;
    flex-direction: column;
    position: relative;
    z-index: 1000;
}

.Idphone-con-pic {
    width: 3.5rem;
    height: 2.46rem;
    margin-top: 0.44rem;
}

.Idphone-con-pic img {
    width: 3.5rem;
    height: 2.46rem;
}


.Idphone-con-wz1 {
    font-size: 0.38rem;
    font-weight: 700;
    color: #323232;
    line-height: 0.48rem;
    margin-top: 0.14rem;
}

.Idphone-con-wz2 {
    font-size: 0.34rem;
    color: #666666;
}

.Idphone-con a {
    width: 4.12rem;
    display: block;
    line-height: 0.78rem;
    height: 0.78rem;
    border-radius: 0.5rem;
    background-color: #ff3955;
    text-align: center;
    color: #fff;
    margin-top: 0.26rem;
    font-size: 0.3rem
}

.Idphone-del {
    position: absolute;
    bottom: -0.66rem;
    left: 0;
    right: 0;
    width: 5.24rem;
    text-align: center;
    z-index: 1000;
}

.Idphone-del img {
    width: 0.48rem;
    height: 0.48rem;
}

/* 右边领书币悬浮 */
.you-ling {
    position: fixed;
    top: 1.9rem;
    right: 0;
    bottom: 0;
    max-width: 7.5rem;
    margin: 0 auto;
    height: 1rem;
}

.you-ling a {
    display: block;
    width: 1.8rem;
    line-height: 0.68rem;
    height: 0.68rem;
    border-radius: 0.6rem 0 0 0.5rem;
    text-align: center;
    color: #fff;
    font-size: 0.28rem;
    background-color: #ff3955;
}

.selfMenuRight p.hongse {
    color: #ff3955;
}

/* 我的绑定手机弹框 */
.bangding {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.5);
    max-width: 7.5rem;
    margin: 0 auto;
}

.bangding-bg {
    width: 5.6rem;
    height: 4.6rem;
    border-radius: 0.16rem;
    background: #fff;
    padding-left: 0.4rem;
    position: relative;
}

.bangding-bg-title {
    font-size: 0.36rem;
    color: #262626;
    margin-top: 0.3rem;
    margin-bottom: 0.16rem;
}

.bangding-bg-srk {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #f2f2f2;
    width: 4.8rem;
}

.bangding-bg-srk input {
    width: 4.8rem;
    height: 0.92rem;
    line-height: 0.92rem;
    font-size: 0.28rem;
}

.bangding-bg-srk input.yzm {
    width: 3rem;
}

.bangding-bg-srk span {
    font-size: 0.28rem;
    color: #666;
}

.bangding-bg button {
    width: 4.8rem;
    height: 0.8rem;
    line-height: 0.8rem;
    text-align: center;
    border-radius: 1rem;
    background: #ff3955;
    color: #fff;
    font-size: 0.3rem;
    margin-top: 0.4rem;
}

.close2 {
    position: absolute;
    top: 0.5rem;
    height: 0.22rem;
    width: 0.22rem;
    right: 0.4rem;
}

.close2 img {
    height: 0.22rem;
    width: 0.22rem;
}

.bangding-cg {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bangding-cg p {
    background: rgba(0, 0, 0, 0.5);
    width: 2.2rem;
    height: 0.78rem;
    line-height: 0.78rem;
    color: #fff;
    text-align: center;
    font-size: 0.28rem;
    border-radius: 0.08rem;
}





.monDouzi span {
    font-size: 0.26rem;
    margin: 0 0.16rem;
}

.buyBoxLine {
    height: 1.55rem;
    display: block;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 0.06rem;
    border: 1px solid #cccccc;
    background-color: #fff;
    position: relative;
}

.buyMode ul li.current {
    border: none;
}
.buyMode ul li.current .buyBoxLine {
    border: 2px solid #fc5c7c;
}
.buyMode ul li.current span {
    color: #fc5c7c;
}
.buyMode ul li.current strong {
    color: #fc5c7c;
}

.buyMode ul li strong {
    color: #222222;
    font-size: 0.24rem;
    line-height: 0.3rem;
}
.buyMode ul li .zeng {
    width: 0.98rem;
    height: 0.32rem;
    background-color: #fcf4ed;
    border: 1px solid #fc5c7c;
    font-size: 0.18rem;
    line-height: .3rem;
    border-radius: 0.04rem;
    display: flex;
    margin: 0.08rem auto 0;
}
.buyMode ul li .zeng span {
    background-color: #fc5c7c;
    display: block;
    color: #fff;
    height: 0.3rem;
    line-height: 0.3rem;
    width: 0.3rem;
    font-size: 0.18rem;
    text-align: center;
}
.buyMode ul li .zeng strong {
    color: #fc5c7c;
    font-weight: normal;
    width: 100%;
    text-align: center;
}
