body {
    max-width: 750px;
    margin: auto
}

.bold {
    font-weight: bold
}

a:active, a:hover, a:link, a {
    outline: 0 none !important;
    color: #7b7b7d
}

i {
    display: block
}

.large-nav-box {
    margin: 0 auto;
    height: 5rem
}

.large-nav-box ul li {
    width: 25%;
    float: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    font-size: .96rem;
    color: #404040
}

.large-nav-box ul li .icon {
    margin-bottom: .4rem;
    display: block;
    width: 100%;
    height: 3rem;
    background-position: center;
    background-repeat: no-repeat
}

.nav {
    position: relative
}

.nav .icon {
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    margin: 0 auto .4rem
}

.nav ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 11.84rem;
    padding: .8rem .8rem;
    float: left
}

.nav ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 15%;
    height: 4rem;
    margin: 1rem .4rem;
    float: left;
    white-space: nowrap;
    text-align: center;
    color: #7b7b7d;
    font-size: .96rem
}

.nav .slider-nav {
    position: absolute;
    bottom: -0.8rem;
    left: 0;
    width: 100%;
    text-align: center
}

.nav .slider-nav a {
    width: .48rem;
    height: .48rem;
    margin: 0 .2rem;
    border-radius: 50%;
    display: inline-block;
    vertical-align: bottom;
    background-color: #d5d5d5
}

.nav .slider-nav a.on {
    background-color: #23c79c
}

.icon-big1 {
    background-image: url(./images/icon-big1.png);
    background-size: 2.4rem
}

.icon-big2 {
    background-image: url(./images/icon-big2.png);
    background-size: 2.4rem
}

.icon-big3 {
    background-image: url(./images/icon-big3.png);
    background-size: 2.4rem
}

.icon-big4 {
    background-image: url(./images/icon-big4.png);
    background-size: 2.4rem
}

.icon-fuke {
    background: url(./images/icon-fuke.png) center no-repeat;
    background-size: 100%
}

.icon-nanke {
    background: url(./images/icon-nanke.png) center no-repeat;
    background-size: 100%
}

.icon-erke {
    background: url(./images/icon-erke.png) center no-repeat;
    background-size: 100%
}

.icon-byby {
    background: url(./images/icon-byby.png) center no-repeat;
    background-size: 100%
}

.icon-liver {
    background: url(./images/icon-liver.png) center no-repeat;
    background-size: 100%
}

.icon-tumor {
    background: url(./images/icon-tumor.png) center no-repeat;
    background-size: 100%
}

.icon-kidney {
    background: url(./images/icon-kidney.png) center no-repeat;
    background-size: 100%
}

.icon-heart {
    background: url(./images/icon-heart.png) center no-repeat;
    background-size: 100%
}

.icon-face {
    background: url(./images/icon-face.png) center no-repeat;
    background-size: 100%
}

.icon-health {
    background: url(./images/icon-health.png) center no-repeat;
    background-size: 90%
}

.icon-tooth {
    background: url(./images/icon-tooth.png) center no-repeat;
    background-size: 100%
}

.icon-zy {
    background: url(./images/icon-zy.png) center no-repeat;
    background-size: 100%
}

.icon-con {
    background: url(./images/icon-con.png) center no-repeat;
    background-size: 85%
}

.icon-ys {
    background: url(./images/icon-ys.png) center no-repeat;
    background-size: 100%
}

.icon-lose-green {
    background: url(./images/icon-lose-green.png) center no-repeat;
    background-size: 100%
}

.icon-rice {
    background: url(./images/icon-rice.png) center no-repeat;
    background-size: 100%
}

.icon-heart-green {
    background: url(./images/icon-heart-green.png) center no-repeat;
    background-size: 100%
}

.icon-eye {
    background: url(./images/icon-eye.png) center no-repeat;
    background-size: 100%
}

.icon-yx {
    background: url(./images/icon-yx.png) center no-repeat;
    background-size: 100%
}

.icon-more {
    background: url(./images/icon-more.png) center no-repeat;
    background-size: 100%
}

.icon-media {
    background: url(./images/icon-nav-qrcode.png) center no-repeat;
    background-size: 100%
}

.health-headline {
    margin: 0rem .8rem;
    margin-top: 1.52rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.health-headline .title {
    font-size: 1.4rem;
    line-height: 1.6rem;
    color: #222024;
    margin-bottom: .4rem
}

.health-headline .title a {
    line-height: 1.6rem;
    float: right;
    font-size: .96rem
}

.headline-right {
    font-size: 1.08rem;
    line-height: 1.08rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.headline-right a {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    display: block
}

.headline-right p {
    border-radius: .24rem;
    background-color: #f9f9f9;
    padding: .8rem .72rem;
    margin-bottom: .4rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    color: #23c79c
}

.headline-right p.cb {
    color: #7b7b7d
}

.doc-speech {
    margin: 0rem .8rem;
    margin-top: 1.52rem
}

.doc-speech .title {
    font-size: 1.4rem;
    line-height: 1.6rem;
    color: #222024
}

.doc-speech ul {
    white-space: nowrap;
    overflow-y: hidden
}

.doc-speech ul li {
    display: inline-block;
    margin-right: .8rem
}

.speech {
    width: 23.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: .48rem 0rem 1rem 0
}

.speech-video {
    width: 7.8rem;
    height: 5.2rem;
    border-radius: .4rem;
    position: relative;
    overflow: hidden
}

.speech-video .hot {
    line-height: 1.6rem;
    height: 1.6rem;
    width: 1.92rem;
    background: url(./images/bg-hot-2.png) no-repeat;
    background-size: contain;
    font-size: .88rem;
    text-align: center;
    color: #fff;
    position: absolute;
    right: 0;
    top: 0
}

.speech-video img {
    width: 100%
}

.speech-video .play {
    position: absolute;
    width: 2.8rem;
    height: 2.8rem;
    background: url(./images/play.png) no-repeat;
    background-size: 100%;
    bottom: 5%;
    left: 0%;
    -webkit-transform: translate(0%, -5%);
    -ms-transform: translate(0%, -5%);
    transform: translate(0%, -5%)
}

.speech-video .play-time {
    padding-left: .4rem;
    width: 100%;
    height: 1.52rem;
    font-size: .8rem;
    color: #fff;
    position: absolute;
    bottom: 0;
    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0.5)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(to right, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0))
}

.speech-text {
    width: 15rem;
    float: left;
    margin-left: 1rem;
    position: relative
}

.speech-text .text-head {
    font-size: 1.18rem;
    line-height: 1.6rem;
    color: #222024;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical
}

.speech-text .text-person {
    font-size: 1.12rem;
    color: #727272;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    position: absolute;
    bottom: 0
}

.speech-text .text-person .circle {
    padding: 0rem .4rem;
    font-size: .8rem;
    border: 1px solid #ffecee;
    border-radius: .6rem;
    color: #d7868f;
    background-color: #ffecee
}

.speech-text .text-hospital {
    font-size: .88rem;
    color: #a3a3a3;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.doc-entrance {
    height: 8.8rem;
    margin-top: .8rem
}

.entrance-ask {
    width: 6.8rem;
    height: 100%;
    border-radius: .4rem;
    background: url(./images/bg-ask.png) no-repeat;
    background-size: 100% 100%;
    padding: .4rem;
    float: left
}

.entrance-ask .ask {
    font-size: 1.12rem;
    color: #fff;
    margin: 0;
    margin-top: 1.2rem
}

.entrance-ask .ask-sub {
    font-size: .88rem;
    color: #cff2e7
}

.entrance-ask .icon-arrow {
    margin: 0 auto;
    margin-top: .4rem;
    width: 2.2rem;
    height: 2.2rem;
    background: url(./images/icon-arrow.png) no-repeat;
    background-size: 100%
}

.entrances {
    margin-left: 7.2rem;
    height: 8.8rem;
    overflow: hidden
}

.entrance {
    margin: 0 .2rem;
    margin-bottom: .8rem;
    padding: .4rem .8rem;
    width: 10.04rem;
    float: left;
    height: 4rem;
    background: url(./images/bg-entrance.png) no-repeat;
    background-size: 100% 100%;
    border-radius: .4rem;
    position: relative
}

.entrance .ask {
    font-size: 1.12rem;
    line-height: 1.12rem;
    color: #19c195;
    margin-top: .2rem
}

.entrance .ask-sub {
    font-size: .88rem;
    color: #19c195;
    opacity: .6
}

.entrance .icon-doc {
    position: absolute;
    top: 0;
    right: 0;
    margin-top: .8rem;
    margin-right: .8rem;
    width: 2.4rem;
    height: 2.4rem;
    background: url(./images/icon-doc.png) center no-repeat;
    background-size: 2.4rem
}

.entrance .icon-diamond {
    position: absolute;
    top: 0;
    right: 0;
    margin-top: .8rem;
    margin-right: .8rem;
    width: 2.4rem;
    height: 2.4rem;
    background: url(./images/icon-diamond.png) center no-repeat;
    background-size: 2.4rem
}

.entrance .icon-med {
    position: absolute;
    top: 0;
    right: 0;
    margin-top: .8rem;
    margin-right: .8rem;
    width: 2.4rem;
    height: 2.4rem;
    background: url(./images/icon-med.png) center no-repeat;
    background-size: 2.4rem
}

.entrance .icon-record {
    position: absolute;
    top: 0;
    right: 0;
    margin-top: .8rem;
    margin-right: .8rem;
    width: 2.4rem;
    height: 2.4rem;
    background: url(./images/icon-record.png) center no-repeat;
    background-size: 2.4rem
}

.sdch {
    margin: 0rem .8rem;
    margin-top: 1.52rem
}

.sdch .title {
    font-size: 1.4rem;
    line-height: 1.6rem;
    color: #222024
}

.sdch ul {
    overflow: hidden
}

.sdch ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.sdch ul li a {
    display: inline-block;
    margin-right: .8rem
}

.sdch ul .look-more {
    width: 3.84rem;
    height: 12.8rem;
    -webkit-writing-mode: vertical-lr;
    -ms-writing-mode: tb-lr;
    writing-mode: vertical-lr;
    text-align: center;
    line-height: 3.84rem;
    color: #999;
    font-size: 1.18rem;
    background: #f7f7f7;
    border-radius: .4rem;
    letter-spacing: .4rem;
    margin: .48rem 0rem 1rem 0
}

.sdch-speech {
    width: 11.04rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column;
    flex-flow: column;
    margin: .48rem 0rem 1rem 0
}

.sdch-video {
    height: 12.8rem;
    border-radius: .4rem;
    position: relative;
    overflow: hidden
}

.sdch-video .hot {
    line-height: 1.6rem;
    height: 1.6rem;
    width: 1.92rem;
    background: url(./images/bg-hot-2.png) no-repeat;
    background-size: contain;
    font-size: .88rem;
    text-align: center;
    color: #fff;
    position: absolute;
    right: 0;
    top: 0
}

.sdch-video img {
    width: 100%
}

.sdch-video .play {
    position: absolute;
    width: 2.8rem;
    height: 2.8rem;
    background: url(./images/icon-cehua-play.png) no-repeat;
    background-size: 100%;
    bottom: 5%;
    left: 5%;
    -webkit-transform: translate(5%, -5%);
    -ms-transform: translate(5%, -5%);
    transform: translate(5%, -5%)
}

.sdch-video .play-time {
    padding-left: .4rem;
    width: 100%;
    height: 1.52rem;
    font-size: .8rem;
    color: #fff;
    position: absolute;
    bottom: 0;
    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0.5)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(to right, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0))
}

.sdch-speech-text {
    position: relative
}

.sdch-speech-text .text-head {
    font-size: 1.18rem;
    line-height: 1.44rem;
    color: #222024;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2
}

.sdch-speech-text .text-person {
    font-size: 1.12rem;
    color: #727272;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    position: absolute;
    bottom: 0
}

.sdch-speech-text .text-person .circle {
    padding: 0rem .4rem;
    font-size: .8rem;
    border: 1px solid #ffecee;
    border-radius: .6rem;
    color: #d7868f;
    background-color: #ffecee
}

.sdch-speech-text .text-hospital {
    font-size: .88rem;
    color: #a3a3a3;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.main-wrap {
    margin: 1.52rem 0
}

.main-wrap .hot-wrap {
    height: 7.6rem;
    margin: .72rem;
    margin-top: 1rem;
    background: url(./images/bg-diet-2.png) no-repeat;
    background-size: 100%;
    position: relative;
    border-radius: .32rem
}

.main-wrap .woman {
    width: 8.4rem;
    height: 8.2rem;
    background: url(./images/bg-zy.png) center no-repeat;
    background-size: 100%;
    position: absolute;
    top: -0.6rem;
    left: .4rem
}

.main-wrap .hot {
    line-height: 1.6rem;
    height: 1.6rem;
    width: 4.2rem;
    background: url(./images/bg-hot.png) no-repeat;
    background-size: contain;
    font-style: italic;
    font-size: .88rem;
    text-align: center;
    color: #fff;
    position: absolute;
    right: 0
}

.main-wrap .checkout {
    line-height: 2.48rem;
    height: 2.48rem;
    width: 7.44rem;
    background: url(./images/bg-checkout.png) no-repeat;
    background-size: contain;
    font-size: 1.12rem;
    text-align: center;
    color: #fff;
    position: absolute;
    right: 0;
    bottom: 0
}

.main-wrap .main-block-title {
    padding: 0 .72rem;
    color: #222023;
    font-size: 1.4rem;
    line-height: 1.2
}

.content {
    height: 5.2rem;
    float: left;
    position: absolute;
    top: 1.8rem;
    margin-left: 10.24rem
}

.content .content-title {
    font-size: 1.18rem;
    line-height: 1.6rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    color: #303138
}

.content .green {
    color: #1fc389
}

.content .text-person {
    width: 18rem;
    font-size: 1.12rem;
    color: #727272;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.content .text-person .circle {
    padding: 0 .4rem;
    font-size: .8rem;
    border: 1px solid #ffecee;
    border-radius: .6rem;
    color: #d7868f;
    background-color: #ffecee
}

.content .text-hospital {
    font-size: .88rem;
    color: #a3a3a3
}

.pick-up-list {
    margin-top: 1rem
}

.pick-up-list dl {
    margin: 1rem .8rem;
    position: relative;
    overflow: hidden
}

.pick-up-list dl dt {
    width: 8.8rem;
    height: 5.52rem;
    float: left;
    border-radius: .4rem
}

.pick-up-list dl dt img {
    width: 100%;
    border-radius: .32rem
}

.pick-up-list dl .type-neme {
    position: absolute;
    left: .92rem;
    top: .76rem;
    line-height: 1.6rem;
    font-size: 1.28rem;
    font-weight: 500
}

.pick-up-list dl .type-neme:after {
    content: "";
    width: 1.28rem;
    height: .2rem;
    margin-top: .28rem;
    display: block;
    border-radius: .2rem
}

.pick-up-list dl .type-neme.style-1 {
    color: #ab5c1e
}

.pick-up-list dl .type-neme.style-1:after {
    background-color: #d4a885
}

.pick-up-list dl .type-neme.style-2 {
    color: #35ab1e
}

.pick-up-list dl .type-neme.style-2:after {
    background-color: #93d285
}

.pick-up-list dl .type-neme.style-3 {
    color: #ab1e32
}

.pick-up-list dl .type-neme.style-3:after {
    background-color: #d58994
}

.pick-up-list dl .type-neme.style-4 {
    color: #1ea6ab !important
}

.pick-up-list dl .type-neme.style-4:after {
    background-color: #85cfd2 !important
}

.pick-up-list dl .type-neme.style-5 {
    color: #ac6222 !important
}

.pick-up-list dl .type-neme.style-5:after {
    background-color: #d2ab85 !important
}

.pick-up-list dl .type-neme.style-6 {
    color: #1e3cab !important
}

.pick-up-list dl .type-neme.style-6:after {
    background-color: #8597d2 !important
}

.pick-up-list dl .type-neme.style-7 {
    color: #dc5359 !important
}

.pick-up-list dl .type-neme.style-7:after {
    background-color: #eda3a7 !important
}

.pick-up-list dl .type-neme.style-8 {
    color: #64bfa8 !important
}

.pick-up-list dl .type-neme.style-8:after {
    background-color: #a8dcce !important
}

.pick-up-list dl .type-neme.style-9 {
    color: #d1ac6c !important
}

.pick-up-list dl .type-neme.style-9:after {
    background-color: #e8d1ac !important
}

.pick-up-list dl dd {
    margin-left: 10.24rem
}

.pick-up-list dl .tl {
    font-size: 1.18rem;
    line-height: 1.76rem;
    color: #303138;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical
}

.pick-up-list dl .name {
    vertical-align: middle;
    color: #727272;
    font-size: 1.12rem
}

.pick-up-list dl .job {
    height: 1.2rem;
    padding: 0 .4rem;
    display: inline-block;
    vertical-align: middle;
    border-radius: .6rem;
    line-height: 1.2rem;
    color: #d7868f;
    font-size: .8rem;
    background-color: #ffecee
}

.pick-up-list dl .hos {
    vertical-align: middle;
    font-size: .88rem;
    color: #a3a3a3
}

.pick-up-list dl .doctor-info {
    width: 100%;
    line-height: 1.76rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.advs {
    margin: 1rem .8rem
}

.wrap-nav {
    margin: 1rem .8rem;
    overflow: hidden
}

.wrap-nav ul {
    width: 100%;
    overflow-y: hidden;
    white-space: nowrap
}

.wrap-nav li {
    display: inline-block;
    width: 21%;
    height: 2.72rem;
    margin-right: .6rem
}

.wrap-nav .nav-entrance {
    width: 6.24rem;
    height: 100%;
    background-color: #f5f4f7;
    margin: 0 auto;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: .32rem
}

.wrap-nav .nav-entrance.on {
    background-color: #2ad394
}

.wrap-nav .nav-entrance.on .icon-sub {
    color: #fff
}

.wrap-nav .nav-entrance .icon-sub {
    font-size: 1.04rem;
    line-height: 1.12rem;
    margin-left: .4rem;
    color: #9ea4b8
}

.wrap-nav .nav-entrance .entrance-icon {
    width: 1.8rem;
    height: 1.8rem
}

.wrap-nav .yingyang i {
    background: url(./images/icon-rice-gray.png) center no-repeat;
    background-size: 1.8rem
}

.wrap-nav .yingyang.on i {
    background-image: url(./images/icon-rice-white.png)
}

.wrap-nav .yangsheng i {
    background: url(./images/icon-flower.png) center no-repeat;
    background-size: 1.6rem
}

.wrap-nav .yangsheng.on i {
    background-image: url(./images/icon-flower-white.png)
}

.wrap-nav .jianfei i {
    background: url(./images/icon-lose.png) center no-repeat;
    background-size: 1.72rem
}

.wrap-nav .jianfei.on i {
    background-image: url(./images/icon-lose-white.png)
}

.wrap-nav .meirong i {
    background: url(./images/icon-lipstick.png) center no-repeat;
    background-size: .88rem
}

.wrap-nav .meirong.on i {
    background-image: url(./images/icon-lipstick-white.png)
}

.wrap-nav .shipin i {
    background: url(./images/icon-video-gray.png) center no-repeat;
    background-size: 1.6rem
}

.wrap-nav .shipin.on i {
    background-image: url(./images/icon-video-white.png)
}

.wrap-nav .zhengxing i {
    background: url(./images/icon-face-gray.png) center no-repeat;
    background-size: 1.64rem
}

.wrap-nav .zhengxing.on i {
    background-image: url(./images/icon-face-white.png)
}

.wrap-nav .liangxing i {
    background: url(./images/icon-sex-gray.png) center no-repeat;
    background-size: 1.64rem
}

.wrap-nav .liangxing.on i {
    background-image: url(./images/icon-sex-white.png)
}

.wrap-nav .nanren i {
    background: url(./images/icon-man-gray.png) center no-repeat;
    background-size: 1.6rem
}

.wrap-nav .nanren.on i {
    background-image: url(./images/icon-man-white.png)
}

.wrap-nav .nvren i {
    background: url(./images/icon-woman-gray.png) center no-repeat;
    background-size: 1.6rem
}

.wrap-nav .nvren.on i {
    background-image: url(./images/icon-woman-white.png)
}

.wrap-nav .jingshen i {
    background: url(./images/icon-mental.png) center no-repeat;
    background-size: 1.68rem
}

.wrap-nav .jingshen.on i {
    background-image: url(./images/icon-mental-white.png)
}

.wrap-nav .xinwen i {
    background: url(./images/icon-new.png) center no-repeat;
    background-size: 1.44rem
}

.wrap-nav .xinwen.on i {
    background-image: url(./images/icon-new-white.png)
}

.wrap-nav .zhuanfang i {
    background: url(./images/icon-mic.png) center no-repeat;
    background-size: 1.56rem
}

.wrap-nav .zhuanfang.on i {
    background-image: url(./images/icon-mic-white.png)
}

.wrap-nav .jiankang i {
    background: url(./images/icon-heart-gray.png) center no-repeat;
    background-size: 1.6rem
}

.wrap-nav .jiankang.on i {
    background-image: url(./images/icon-heart-white.png)
}

.wrap-nav .liver i {
    background: url(./images/icon-liver-gray.png) center no-repeat;
    background-size: 1.6rem
}

.wrap-nav .liver.on .icon-sub {
    color: #fff
}

.wrap-nav .liver.on i {
    background-image: url(./images/icon-liver-white.png)
}

.wrap-nav .tumor i {
    background: url(./images/icon-tumor-gray.png) center no-repeat;
    background-size: 1.6rem
}

.wrap-nav .tumor.on .icon-sub {
    color: #fff
}

.wrap-nav .tumor.on i {
    background-image: url(./images/icon-tumor-white.png)
}

.wrap-nav .yingxiang i {
    background: url(./images/icon-yx-gray.png) center no-repeat;
    background-size: 1.6rem
}

.wrap-nav .yingxiang.on .icon-sub {
    color: #fff
}

.wrap-nav .yingxiang.on i {
    background-image: url(./images/icon-yx-white.png)
}

.jibing-wrap .hot-wrap {
    background: url(./images/bg-jibing-2.png) center no-repeat;
    background-size: 100%;
    border-radius: .32rem
}

.jibing-wrap .woman {
    background: url(./images/woman2.png) no-repeat;
    background-size: 100%;
    top: -8.5%;
    left: 4%
}

.child-wrap .hot-wrap {
    background: url(./images/bg-child-2.png) no-repeat;
    background-size: 100%
}

.child-wrap .woman {
    width: 6.72rem;
    height: 9.76rem;
    background: url(./images/child.png) no-repeat;
    background-size: 100%;
    top: -28%;
    left: 6%
}

.child-wrap .wrap-nav ul {
    width: auto;
    height: auto;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.child-wrap .wrap-nav li {
    width: auto;
    height: auto
}

.child-wrap .nav-entrance {
    width: 8rem;
    height: 2.72rem;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.child-wrap .nav-entrance .entrance-icon {
    display: inline-block;
    margin: auto .6rem
}

.child-wrap .nav-entrance .icon-babycar {
    background: url(./images/icon-babycar.png) no-repeat;
    background-size: 100%
}

.child-wrap .nav-entrance .icon-bottle {
    background: url(./images/icon-bottle.png) no-repeat;
    background-size: 100%
}

.child-wrap .nav-entrance .icon-sex {
    background: url(./images/icon-sex.png) no-repeat;
    background-size: 100%
}

.child-wrap .nav-entrance span {
    font-size: 1.12rem;
    color: #9ea4b8
}

.med-wrap .hot-wrap {
    background: url(./images/bg-child-2.png) no-repeat;
    background-size: 100%
}

.med-wrap .woman {
    width: 6.56rem;
    height: 8.44rem;
    background: url(./images/nurse.png) no-repeat;
    background-size: 100%;
    top: 8%;
    left: 6%
}

.med-wrap .content-title {
    top: 1rem;
    text-overflow: clip;
    white-space: normal;
    overflow: hidden
}

.med-wrap .content-text {
    margin: .4rem 0;
    margin-right: 1.2rem;
    font-size: .88rem;
    overflow: hidden;
    text-overflow: clip;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    color: #a3a3a3
}

.services {
    margin: 0 .8rem;
    margin-top: 1rem
}

.services .main-block-title {
    color: #222023;
    font-size: 1.4rem;
    line-height: 1.2
}

.services .services-wrap {
    height: 9.28rem;
    overflow-y: hidden;
    white-space: nowrap;
    margin: -0.4rem 0
}

.services li {
    display: inline-block;
    margin-right: 1.6rem;
    white-space: normal
}

.client-case {
    width: 23.92rem;
    height: 9.28rem;
    background: url(./images/bg-case.png) no-repeat;
    background-size: 100%;
    position: relative
}

.case-num {
    width: 1.6rem;
    height: 1.36rem;
    line-height: 1.36rem;
    color: #fff;
    background-color: #ff7574;
    border-bottom-right-radius: .4rem;
    text-align: center;
    font-size: .96rem;
    position: absolute;
    left: .8rem;
    top: 1.12rem
}

.case-content {
    width: 15.2rem;
    height: 4.8rem;
    position: absolute;
    left: 7.2rem;
    top: 2.8rem;
    font-size: 1.28rem;
    color: #000;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical
}

.case-icon {
    display: inline-block;
    background: url(./images/icon-round.png) no-repeat;
    background-size: 100%;
    width: .8rem;
    height: .8rem;
    position: absolute;
    left: 6.2rem;
    top: 3.6rem
}

.service {
    height: 1.92rem;
    font-size: 1.12rem;
    margin: 1rem 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.service .icon-service {
    display: inline-block;
    height: 1.92rem;
    width: 6.32rem;
    color: #fff;
    text-align: center
}

.service .service-1 {
    background: url(./images/icon-services.png) no-repeat;
    background-size: 100%
}

.service .service-3 {
    background: url(./images/icon-services-red.png) no-repeat;
    background-size: 100%
}

.service .service-4 {
    background: url(./images/icon-services-green.png) no-repeat;
    background-size: 100%
}

.service span {
    width: 18rem;
    color: #000;
    margin-left: .8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.servises-icon {
    margin: 1.6rem 0;
    height: 3.92rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around
}

.servises-icon li {
    width: 3.6rem;
    margin: 0 .4rem;
    height: 3.92rem;
    text-align: center;
    color: #393a41;
    float: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    white-space: nowrap
}

.servises-icon li .icon {
    width: 2.8rem;
    height: 2.8rem;
    margin: 0 auto
}

.servises-icon li .icon-ask {
    background: url(./images/icon-ask.png) no-repeat;
    background-size: 100%
}

.servises-icon li .icon-v {
    background: url(./images/icon-v.png) no-repeat;
    background-size: 100%
}

.servises-icon li .icon-h {
    background: url(./images/icon-h.png) no-repeat;
    background-size: 100%
}

.servises-icon li .icon-db {
    background: url(./images/icon-db.png) no-repeat;
    background-size: 100%
}

.servises-icon li .icon-ad {
    background: url(./images/icon-ad.png) no-repeat;
    background-size: 100%
}

.servises-icon li .icon-live {
    background: url(./images/icon-live.png) no-repeat;
    background-size: 100%
}

.servises-icon li .icon-dev {
    background: url(./images/icon-dev.png) no-repeat;
    background-size: 100%
}

.servises-icon li .icon-cop {
    background: url(./images/icon-cop.png) no-repeat;
    background-size: 100%
}

.servises-icon li .icon-app {
    background: url(./images/icon-app.png) no-repeat;
    background-size: 100%
}

.servises-icon li .icon-int {
    background: url(./images/icon-int.png) no-repeat;
    background-size: 100%
}

.servises-icon li .icon-wechat {
    background: url(./images/icon-wechat.png) no-repeat;
    background-size: 100%
}

.servises-icon li .icon-movie {
    background: url(./images/icon-movie.png) no-repeat;
    background-size: 100%
}

.servises-icon p {
    font-size: .88rem;
    color: #393a41
}

hr {
    border: none;
    height: 5px;
    background-color: #ececec
}

.area-tab {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1rem 1.2rem;
    margin-top: .4rem;
    border-bottom: 1px solid #a4a5aa;
    position: relative
}

.area-tab a {
    color: #000;
    font-size: 1.28rem
}

.area-tab a.active {
    color: #1fc389
}

.area-tab a.active::after {
    content: "";
    display: block;
    width: 5.12rem;
    height: .24rem;
    background-color: #1fc389;
    position: absolute;
    bottom: -4%;
    z-index: 1
}

.wrap-viewer dl {
    padding: .4rem 1.2rem;
    border-top: 1px solid #ececec;
    position: relative
}

.wrap-viewer dl dt {
    width: 4rem;
    text-align: center;
    float: left;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.wrap-viewer dl dt a {
    height: 100%;
    font-size: 1.04rem;
    color: #1fc389
}

.wrap-viewer dl dd {
    margin-left: 7.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.wrap-viewer dl dd a {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    color: #626262;
    font-size: 1.04rem;
    margin: .4rem .6rem;
    text-align: left
}



.latest-tab {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: start;
    padding: .4rem 1.2rem;
    border-bottom: 0
}


.latest-tab a {
    color: #99999b;
    font-weight: normal;
    font-size: 1.28rem
}

.latest-tab a.active, .latest-tab a.on {
    color: #303138
}

.latest-viewer {
    margin-top: .8rem;
    padding: 0 .8rem;
    position: relative
}

.latest-viewer .slider-item a {
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-bottom: .8rem;
    padding: .4rem .8rem;
    color: #1fc389;
    background-color: #f9f9f9;
    border-radius: .4rem;
    font-size: 1.12rem
}

.latest-viewer .slider-nav {
    width: 100%;
    text-align: center;
    line-height: 1
}

.latest-viewer .slider-nav a {
    width: .48rem;
    height: .48rem;
    margin: 0 .2rem;
    border-radius: 50%;
    display: inline-block;
    vertical-align: bottom;
    background-color: #d5d5d5
}
.latest-viewer .slider-nav .swiper-pagination-bullet{
    background: #d5d5d5!important;
}
.latest-viewer .slider-nav .swiper-pagination-bullet-active {
    background: #23c79c !important;
    width: 8px !important;

}
.slider-outer{
    width: 100%;
    overflow: hidden;
}
.slider-items{
    height: 100% !important;
}

.cooperation-wrap {
    height: 48rem;
    background: url(./images/bg-media.png) no-repeat;
    background-size: 100%;
    margin-top: 1rem
}

.cooperation-wrap-title {
    font-size: 1.6rem;
    color: #fff;
    text-align: center;
    padding-top: 1rem
}

.cooperation-wrap-title .media-right {
    background: url(./images/media-right.png) no-repeat;
    background-size: 100%;
    height: 1.2rem;
    width: 1.8rem;
    display: inline-block
}

.cooperation-wrap-title .media-left {
    background: url(./images/media-left.png) no-repeat;
    background-size: 100%;
    height: 1.2rem;
    width: 1.8rem;
    display: inline-block
}

.cooperation-wrap-title span {
    margin: 0 .8rem
}

.folders {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.folder {
    width: 13.52rem;
    height: 6.96rem;
    background: url(./images/bg-folder.png) no-repeat;
    background-size: 100%;
    padding-top: .6rem;
    padding-left: 1rem;
    position: relative;
    margin-left: 1rem;
    margin-top: 1.52rem
}

.folder .folder-logo {
    width: 5.64rem;
    height: 5.64rem;
    display: inline-block;
    position: absolute;
    top: .8rem;
    right: 0;
    background-size: 5.64rem;
    background-repeat: no-repeat
}

.folder .logo-jrtt {
    background-image: url(./images/logo-jrtt.png)
}

.folder .logo-bjh {
    background-image: url(./images/logo-bjh.png)
}

.folder .logo-wechat {
    background-image: url(./images/logo-wechat.png)
}

.folder .logo-weibo {
    background-image: url(./images/logo-weibo.png)
}

.folder .logo-qq {
    background-image: url(./images/logo-qq.png)
}

.folder .logo-tictok {
    background-image: url(./images/logo-tictok.png)
}

.folder .logo-ydzx {
    background-image: url(./images/logo-ydzx.png)
}

.folder-empty {
    background: url(./images/logo-pc.png) no-repeat;
    background-size: 100%
}

.folder-title {
    font-size: 1.2rem
}

.fans {
    font-size: .96rem;
    color: #7b7b7b
}

.look {
    width: 4.32rem;
    height: 1.76rem;
    line-height: 1.76rem;
    font-size: .88rem;
    background-color: #4777d6;
    border-radius: .8rem;
    text-align: center;
    color: #fff;
    -webkit-box-shadow: 0rem .2rem .4rem #b7daa8;
    box-shadow: 0rem .2rem .4rem #b7daa8
}

.tips {
    margin-top: 3.4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    opacity: .6
}

.line {
    width: 2.64rem;
    height: 1px;
    background-color: #beffcc;
    display: inline-block;
    margin-top: .8rem
}

.tip {
    font-size: .8rem;
    margin: 0 1.12rem;
    text-align: center;
    color: #beffcc
}

.footer {
    height: 5.12rem
}

.footer .footer-inner {
    position: fixed;
    z-index: 100;
    left: 50%;
    bottom: 0;
    height: 5.12rem;
    max-width: 750px;
    width: 100%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    border-top: 1px solid #e6e6e6;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff
}

.footer-item {
    width: 5rem;
    margin-top: 0rem;
    text-align: center;
    float: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column;
    flex-flow: column
}

.footer-item p {
    font-size: .8rem;
    color: #595959
}

.footer-item .footer-logo {
    width: 2.4rem;
    height: 2.4rem;
    background-repeat: no-repeat
}

.home i {
    background: url(./images/logo-home.png) center no-repeat;
    background-size: 1.6rem
}

.home.on p {
    color: #69d4ab
}

.home.on i {
    background-image: url(./images/logo-home-green.png)
}

.question i {
    background: url(./images/logo-question.png) center no-repeat;
    background-size: 1.68rem
}

.question.on p {
    color: #69d4ab
}

.question.on i {
    background-image: url(./images/logo-question-green.png)
}

.medicine i {
    background: url(./images/logo-medicine.png) center no-repeat;
    background-size: 1.44rem
}

.medicine.on p {
    color: #69d4ab
}

.medicine.on i {
    background-image: url(./images/logo-medicine-green.png)
}

.ill i {
    background: url(./images/logo-ill.png) center no-repeat;
    background-size: 1.44rem
}

.ill.on p {
    color: #69d4ab
}

.ill.on i {
    background-image: url(./images/logo-ill-green.png)
}

.personal i {
    background: url(./images/logo-personal.png) center no-repeat;
    background-size: 1.44rem
}

.personal.on p {
    color: #69d4ab
}

.personal.on i {
    background-image: url(./images/logo-personal-green.png)
}

.top-wrap {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.top-wrap .header {
    position: fixed;
    left: 50%;
    top: 0;
    z-index: 100;
    max-width: 750px;
    width: 100%;
    height: 4.4rem;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transition: border, background-image, background-color 500ms;
    transition: border, background-image, background-color 500ms
}

.top-wrap .header * {
    -webkit-transition: border, background-image, background-color 500ms;
    transition: border, background-image, background-color 500ms
}

.top-wrap .header.scroll {
    border-bottom: 1px solid #e6e6e6;
    background-color: #fff
}

.top-wrap .header.scroll .logo {
    background-image: url(images/fd-logo-ori.png)
}

.top-wrap .header.scroll .search-input-cont {
    background-color: #f7f7f7;
    background-image: url(images/icon-search-gray.png)
}

.top-wrap .header.scroll .search-input-cont p {
    color: #333;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.top-wrap .header.scroll .search-input-cont input {
    color: #333
}

.top-wrap .header.scroll .search-input-cont input::-webkit-input-placeholder {
    color: #bcbcbc
}

.top-wrap .header.scroll .search-input-cont input::-webkit-input-placeholder, .top-wrap .header.scroll .search-input-cont input::placeholder {
    color: #bcbcbc
}

.top-wrap .header.scroll .btns-wrap .btn-item.btn-chat {
    background-image: url(./images/icon-head-ask-white.png)
}

.top-wrap .header.scroll .btns-wrap .btn-item.btn-qrcode {
    background-image: url(./images/icon-qrcode-black.png)
}

.top-wrap .header .header-inner {
    height: 100%;
    overflow: hidden;
    display: flex;align-items: center;
    justify-content: space-between;
    margin: 0 .5rem;
}

.top-wrap .header .logo {
    height: 3rem;


}
.top-wrap .header .logo img{
    max-height: 100%;
}

.top-wrap .header .search-input-cont {
    width: 14.6rem;
    height: 2.56rem;
    margin-top: .96rem;
    margin-left: .8rem;
    padding: .4rem 1.2rem .4rem 2.24rem;
    float: left;
    border-radius: 1.28rem;
    background: rgba(255, 255, 255, .2) url(./images/icon-search-white.png) no-repeat .8rem center;
    background-size: 1.12rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.top-wrap .header .search-input-cont p {
    color: #fff;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding-right: 2.24rem
}

.top-wrap .header .search-input-cont input {
    height: 1.76rem;
    width: 100%;
    padding: 0;
    margin: 0;
    display: block;
    border: none;
    outline: none;
    color: #fff;
    line-height: 1.76rem;
    font-size: 1.04rem;
    background-color: rgba(0, 0, 0, 0)
}

.top-wrap .header .search-input-cont input::-webkit-input-placeholder {
    color: rgba(255, 255, 255, .5)
}

.top-wrap .header .search-input-cont input::-webkit-input-placeholder, .top-wrap .header .search-input-cont input::placeholder {
    color: rgba(255, 255, 255, .5)
}

.top-wrap .header .btns-wrap .btn-item {
    margin-left: .8rem;
    margin-top: .96rem;
    float: left;
    background: no-repeat center;
    background-size: 100%
}

.top-wrap .header .btns-wrap .btn-item.btn-chat {
    width: 3.12rem;
    height: 2.6rem;
    background-image: url(./images/icon-head-ask.png)
}

.top-wrap .header .btns-wrap .btn-item.btn-qrcode {
    width: 1.68rem;
    height: 1.68rem;
    background-image: url(./images/icon-qrcode-white.png)
}

.top-wrap .banner-slider-wrap {
    position: relative
}

.top-wrap .banner-slider-wrap .slider-nav {
    position: absolute;
    left: 0;
    bottom: .8rem;
    width: 100%;
    text-align: center
}

.top-wrap .banner-slider-wrap .slider-nav a {
    width: .4rem;
    height: .4rem;
    margin: 0 .2rem;
    display: inline-block;
    vertical-align: bottom;
    border-radius: .2rem;
    -webkit-transition: 500ms;
    transition: 500ms;
    background-color: rgba(255, 255, 255, .5)
}

.top-wrap .banner-slider-wrap .slider-nav a.on {
    width: .96rem;
    background-color: #fff
}

.layer-head {
    position: relative;
    height: 9.6rem;
    background: radial-gradient(20px at left bottom, transparent 51%, #22c79c 51%) bottom left/51% 100% no-repeat, radial-gradient(20px at right bottom, transparent 51%, #22c79c 51%) bottom right/51% 100% no-repeat
}

.layer-head .back {
    display: block;
    width: 2.72rem;
    height: 2.72rem;
    position: absolute;
    top: -8%;
    right: -3%;
    background: url(images/icon-back.png) center no-repeat;
    background-size: 100%
}

.layer-head .layer-head-box {
    height: 8.8rem;
    padding-top: .8rem;
    background: url(images/bg-alert_02.jpg) center no-repeat;
    background-size: 100%
}

.layer-head .round {
    border-radius: 24px;
    font-size: 1.12rem;
    background-color: #e3fff8;
    text-shadow: 0px 0px 0px;
    width: 12.8rem;
    margin: .4rem auto;
    color: #23c99e
}

.media-layer {
    position: fixed;
    z-index: 999;
    top: 0;
    left: 150%;
    width: 100%;
    height: 100%;
    -webkit-transform: translate(-50%);
    -ms-transform: translate(-50%);
    transform: translate(-50%);
    opacity: 0;
    -webkit-transition: 300ms;
    transition: 300ms;
    font-size: 14px;
    background: rgba(51, 51, 51, .6)
}

.media-layer.show {
    left: 50%;
    opacity: 1
}

.media-layer .layer {
    border-radius: .8rem;
    width: 27.2rem;
    margin: .8rem auto;
    overflow: hidden;
    overflow-y: scroll
}

.layer-cont {
    width: 100%;
    padding: .8rem .8rem;
    border-bottom-left-radius: .8rem;
    border-bottom-right-radius: .8rem;
    background: radial-gradient(20px at left top, transparent 51%, white 51%) top left/51% 100% no-repeat, radial-gradient(20px at right top, transparent 51%, white 51%) top right/51% 100% no-repeat
}

.layer-cont .cont-box {
    padding: 0rem .8rem
}

.layer-cont .media-title {
    font-size: 1.28rem;
    color: #23c89d
}

.layer-cont .qrcode-items {
    background: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.layer-cont .qrcode {
    text-align: center;
    padding: .8rem 0;
    display: inline-block;
    width: 50%
}

.layer-cont .qrcode img {
    width: 70%
}

.layer-cont .qrcode p {
    font-size: 1.12rem
}

.all-nav-layer {
    position: fixed;
    z-index: 999;
    top: 0;
    left: 150%;
    width: 100%;
    height: 100%;
    -webkit-transform: translate(-50%);
    -ms-transform: translate(-50%);
    transform: translate(-50%);
    opacity: 0;
    -webkit-transition: 300ms;
    transition: 300ms;
    font-size: 14px;
    background-color: #fff
}

.all-nav-layer.show {
    left: 50%;
    opacity: 1
}

.all-nav-layer .bar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    line-height: 40px;
    padding: 0 10px;
    background: #1fc389
}

.all-nav-layer .bar b {
    display: block;
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    padding-right: 35px;
    text-align: center;
    color: #fff;
    font-size: 16px;
    font-weight: normal
}

.all-nav-layer .bar a {
    display: block;
    max-width: 35px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background: url(images/icon_back_white.png) left center no-repeat;
    background-size: 22px auto
}

.all-nav-layer .cont {
    height: 100%;
    padding-bottom: 100px;
    overflow-y: auto
}

.all-nav-layer .nav-all {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: wrap;
    flex-flow: wrap;
    padding: 5px 5px 10px 0
}

.all-nav-layer .nav-all a {
    display: inline-block;
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    margin: 5px;
    padding: 3px 10px;
    text-align: center;
    color: gray;
    border-radius: 20px;
    background: #f2f2f2
}

.page-layer {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    -webkit-transition: opacity .5s;
    transition: opacity .5s;
    font-size: 14px;
    background: #fff
}

.page-layer.show {
    display: block;
    z-index: 999;
    opacity: 1
}

.page-layer .bar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    line-height: 40px;
    padding: 0 10px;
    background: #1fc389
}

.page-layer .bar b {
    display: block;
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    padding-right: 35px;
    text-align: center;
    color: #fff;
    font-size: 16px;
    font-weight: normal
}

.page-layer .bar a {
    display: block;
    max-width: 35px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background: url(images/icon_back_white.png) left center no-repeat;
    background-size: 22px auto
}

.page-layer .sec {
    overflow: hidden;
    padding: 0 10px
}

.page-layer .sec .tl {
    padding: 10px 0;
    color: gray
}

.search-layer .bar form {
    position: relative;
    display: block;
    -webkit-box-flex: 2;
    -ms-flex: 2;
    flex: 2;
    padding: 6px 0;
    padding-right: 40px
}

.search-layer .bar form input[type=search] {
    width: 100%;
    height: 28px;
    line-height: 28px;
    padding: 0 10px 0 20px;
    float: left;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0;
    border-radius: 20px;
    color: #fff;
    background: rgba(255, 255, 255, .2)
}

.search-layer .bar form input[type=search]::-webkit-input-placeholder {
    color: #fff;
    opacity: .8
}

.search-layer .bar form input[type=search]::-moz-placeholder {
    color: #fff;
    opacity: .8
}

.search-layer .bar form input[type=search]:-ms-input-placeholder {
    color: #fff;
    opacity: .8
}

.search-layer .bar form input[type=search]::-ms-input-placeholder {
    color: #fff;
    opacity: .8
}

.search-layer .bar form input[type=search]::placeholder {
    color: #fff;
    opacity: .8
}

.search-layer .bar form input[type=submit] {
    position: absolute;
    right: 0;
    top: 6px;
    width: 30px;
    height: 28px;
    color: #fff;
    font-size: 15px;
    border: 0;
    background: rgba(0, 0, 0, 0)
}

.search-layer .sec .tl .btn-clear {
    display: block;
    width: 30px;
    height: 25px;
    float: right;
    background: url(images/icon_clear_gray.png) right center no-repeat;
    background-size: 15px auto
}

.search-layer .sec .cont1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column wrap;
    flex-flow: column wrap
}

.search-layer .sec .cont1 a {
    width: 100%;
    display: inline-block;
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    padding: 5px 10px;
    margin: 5px 2px;
    border-radius: 20px;
    color: #666;
    background: #f7f7f7;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.search-layer .sec .cont1 p {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-radius: 20px;
    padding: 5px 10px;
    color: gray;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background: #f7f7f7;
    text-align: center
}

.search-layer .sec .cont2 .cont-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column wrap;
    flex-flow: column wrap
}

.search-layer .sec .cont2 .cont-item a {
    width: 100%;
    display: inline-block;
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    padding: 5px 10px;
    margin: 5px 2px;
    border-radius: 20px;
    color: #666;
    background: #f7f7f7;
    overflow: hidden
}

.search-layer .sec .cont2 .cont-item p {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 5px 10px;
    color: gray;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.media-source {
    position: fixed;
    z-index: 999;
    top: 0;
    left: 150%;
    width: 100%;
    height: 100%;
    -webkit-transform: translate(-50%);
    -ms-transform: translate(-50%);
    transform: translate(-50%);
    opacity: 0;
    -webkit-transition: 300ms;
    transition: 300ms;
    font-size: 14px;
    background: rgba(51, 51, 51, .6)
}

.media-source.show {
    left: 50%;
    opacity: 1
}

.media-source .source-layer {
    border-radius: .8rem;
    width: 27.2rem;
    margin: .8rem auto;
    overflow: hidden;
    overflow-y: scroll;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.media-source .source-layer .layer-head {
    position: relative;
    height: 9.6rem;
    background: radial-gradient(20px at left bottom, transparent 51%, #22c79c 51%) bottom left/51% 100% no-repeat, radial-gradient(20px at right bottom, transparent 51%, #22c79c 51%) bottom right/51% 100% no-repeat
}

.media-source .source-layer .layer-head .back {
    display: block;
    width: 2.72rem;
    height: 2.72rem;
    position: absolute;
    top: -8%;
    right: -3%;
    background: url(./images/icon-back.png) center no-repeat;
    background-size: 100%
}

.media-source .source-layer .layer-head .layer-head-box {
    height: 8.8rem;
    padding-top: .8rem;
    background: url(./images/bg-alert_02.jpg) center no-repeat;
    background-size: 100%
}

.media-source .source-layer .layer-head .round {
    border-radius: 24px;
    font-size: 1.12rem;
    background-color: #e3fff8;
    text-shadow: 0px 0px 0px;
    width: 12.8rem;
    margin: .4rem auto;
    color: #23c99e
}

.media-source .cont {
    width: 100%;
    padding: .8rem .8rem;
    border-bottom-left-radius: .8rem;
    border-bottom-right-radius: .8rem;
    background: radial-gradient(20px at left top, transparent 51%, white 51%) top left/51% 100% no-repeat, radial-gradient(20px at right top, transparent 51%, white 51%) top right/51% 100% no-repeat;
    padding-bottom: .8rem;
    overflow-y: auto;
    margin: auto
}

.media-source .cont .cont-box {
    display: none;
    padding: 0rem .8rem
}

.media-source .cont .cont-box.show {
    display: block
}

.media-source .media-title {
    font-size: 1.28rem;
    color: #23c89d
}

.media-source .qrcode-items {
    background: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: stretch;
    -ms-flex-pack: stretch;
    justify-content: stretch;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.media-source .dy-qr {
    background: #fff;
    display: block
}

.media-source .dy-qr .qrcode {
    width: 100%
}

.media-source .dy-qr .qrcode img {
    width: 100%
}

.media-source .qrcode {
    text-align: center;
    padding: .8rem 0;
    display: inline-block;
    width: 50%
}

.media-source .qrcode img {
    width: 8.8rem
}

.media-source .qrcode p {
    font-size: 1.12rem
}

.iphone-x-family .footer-tabs {
    height: 80px
}

.iphone-x-family .footer-tabs .fixed {
    height: 80px;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.iphone-x-family .footer-item {
    margin-top: .2rem
}

/*# sourceMappingURL=style.css.map */
.runk {display: flex;flex-wrap: wrap}
.runk a{padding:10px 24px;display: block}