/** New: #11577 by LJ 2020-06-15 */
body { background-color: #f8f8f8;  height:auto;}
.ico-vip {
    display: inline-block; vertical-align: middle; width: 16px; height: 16px; 
    background: url('../images/authentica.png') no-repeat; background-size: 16px 16px; 
}
.ptb20 { padding-top: 20px; padding-bottom: 20px; }

/* title-f20 */
.title-f20 { line-height: 28px; }
.title-f20 b { font-size: 20px; }

/** lawyer-advert */
.lawyer-advert {
    position: relative; padding: 10px 100px 0 60px;
    margin: 8px; height: 60px; overflow: hidden;
    background: url('../images/lawyer-bg.png') #E4EFF8 no-repeat; background-size: 100% 100%;
    border-radius: 4px;
    box-shadow: 0 5px 10px rgba(0,0,0, .03);
}
.lawyer-advert .img-block { 
    position: absolute; left: 12px; top: 10px; 
    width: 40px; height: 40px; 
}
.lawyer-advert .img-block img { border-radius: 50%; }
.lawyer-advert .img-block .ico-vip { 
    position: absolute; right: 0; bottom: 0; 
    width: 12px; height: 12px; background-size: 12px 12px; 
}
.lawyer-advert .conts { display: flex; flex-direction: column; height: 40px; justify-content: center; }
.lawyer-advert .tit { 
    height: 22px; overflow: hidden; 
    font-size: 16px; font-weight: bold; color: #333; line-height: 22px; 
}
.lawyer-advert .skill { 
    float: left; margin-top: 2px; padding: 0 5px; 
    height: 16px; overflow: hidden; 
    background-color: #75B7DE; border-radius: 4px; 
    font-size: 10px; color: #fff; line-height: 16px; 
}
.lawyer-advert .skill span { margin-left: 6px;}
.lawyer-advert .btn { 
    position: absolute; top: 16px; right: 10px; 
    width: 80px; height: 28px; padding: 0; background-color: #fff; border-color: #0057FF; 
    font-size: 14px; color: #0057FF; line-height: 27px; 
}

/** unfold-bar */
.unfold-bar { position: relative; }
.unfold-bar .un-ovh { 
    overflow: hidden; box-sizing: unset; 
}
.unfold-bar .un-btn { 
    position: absolute; right: 0; bottom: 0;
    display: none;
    color: #2670FF; background-color: #fff; 
}
.unfold-bar .un-btn::before { 
    content: ''; position: absolute; top: 0; bottom: 0; left: -40px; 
    width: 40px; 
    background: linear-gradient(to right,rgba(255,255,255,0) 0%, rgba(255,255,255,1) 70%);
}

/** ask-bar */
.ask-bar { 
    padding: 20px 16px 16px; background-color: #fff; 
}
.ask-bar .txt { 
    font-size: 18px; font-weight: bold;  
    color: #333; line-height: 28px;
}
.ask-bar .txt a { color: #0057ff; }
.ask-bar .info { 
    margin-top: 10px; overflow: hidden;  
    font-size: 12px; color: #999;
}
.ask-bar .unfold-bar .un-ovh { height: 168px; }
.ask-bar .unfold-bar .un-btn { font-size: 16px; line-height: 28px; }
.ask-bar .unfold-bar.show .un-ovh { padding-bottom: 28px; }

/** lawyer-answer */
.lawyer-answer .title-f20 {
    position: relative; padding: 25px 16px 18px;
}
.lawyer-answer .title-f20:after {
    content: ''; position: absolute; right: 0; bottom: 0; left: 0;
    height: 1px; background-color: #e8e8e8;
    transform: scaleY(.5); transform-origin: center bottom;
}
.lawyer-answer .title-f20 span { 
    margin-left: 5px;
    font-size: 16px; color: #999;
}
    /** answer-list */
.answer-list { padding-right: 16px; padding-left: 16px; }
.answer-list li {
    position: relative; padding: 20px 0;
}
.answer-list li:after {
    content: ''; position: absolute; right: 0; bottom: 0; left: 0;
    height: 1px; background-color: #e8e8e8;
    transform: scaleY(.5); transform-origin: center bottom;
}
.answer-list .have-tag { padding-top: 30px; }
.answer-list .have-tag .tag {
    position: absolute; top: -.5px; left: 0;
    padding: 0 5px; height: 22px;
    font-size: 12px; line-height: 22px; color: #fff;
    border-radius: 0 0 4px 4px;
}
.answer-list .have-tag .tag-red { background-color: #FC6151; }
.answer-list .have-tag .tag-blue { background-color: #92B7FF; }
.answer-list .have-tag .tag .ico {
    float: left; margin-right: 4px;
    width: 16px; height: 18px;
}
.answer-list .have-tag .tag .iconfont {
    font-size: 14px; margin-right: 4px;
}
.answer-list .detail .un-ovh { height: 144px; }
.answer-list .detail .un-nr { font-size: 16px; line-height: 24px; }
.answer-list .detail .un-btn { font-size: 14px; line-height: 24px; }
.answer-list .detail.show .un-ovh { padding-bottom: 24px; }
.answer-list .info { position: relative; margin-top: 10px; }
.answer-list .info .lawyer {
    position: relative; display: block;
    padding: 0 90px 0 40px;
}
.answer-list .info .lawyer .img-block {
    position: absolute; top: 0; left: 0;
    width: 30px; height: 30px; 
    overflow: hidden; border-radius: 50%;
}
.answer-list .info .lawyer .tit { line-height: 18px; }
.answer-list .info .lawyer .name { font-size: 12px; }
.answer-list .info .lawyer .ico-vip {
    margin: -2px 0 0 5px; 
    width: 14px; height: 14px;
    background-size: 14px 14px;
}
.answer-list .info .lawyer .time {
    font-size: 10px; color: #999; line-height: 14px;
}
.answer-list .info .btn {
    position: absolute; top: 3px; right: 0;
    padding: 0; width: 80px; height: 28px;
    font-size: 14px; font-weight: bold; line-height: 29px; color: #0057ff;
    background-color: #F2F4FF;
    border: 0; border-radius: 14px;
}
.answer-list .other-detail { margin-top: 10px; }
.answer-list .other-detail .un-ovh { height: 60px; }
.answer-list .other-detail .un-nr { line-height: 20px; }
.answer-list .other-detail .un-btn { font-size: 13px; line-height: 20px; }
.answer-list .other-detail.show .un-ovh { padding-bottom: 20px; }
.answer-list .other-item {
    display: flex;
    font-size: 13px; line-height: 20px;
}
.answer-list .other-item .con { 
    margin-left: 5px;
    flex: 1; color: #666;
}
.answer-list .video { display: block; border-radius: 8px; }
/** voice-bar */
.voice-bar { 
    position: relative; 
    padding: 10px 50px 10px 110px; height: 50px; 
    background-color: #f5f5f5; border-radius: 4px; 
} 
.voice-bar audio { display: none; } 
.voice-bar .gy-line { 
    position: relative;
    height: 30px; background-color: #ccc; 
    border-top: 14px solid #f5f5f5; 
    border-bottom: 14px solid #f5f5f5;  
} 
.voice-bar .blue { 
    position: absolute; left: 0; top: 0; width: 0; 
    height: 2px; background-color: #0057ff; 
} 
.voice-bar .dot { 
    position: absolute; right: -6px; top: -5px; z-index: 10; 
    width: 12px; height: 12px; background-color: #0057ff; 
    border-radius: 50%; cursor: pointer; 
}
.voice-bar .time { 
    position: absolute; top: -9px; 
    width: 60px; height: 20px; font-size: 10px; 
} 
.voice-bar .time-play { 
    left: -70px; 
    text-align: right; color: #0057ff; 
} 
.voice-bar .time-end { right: -65px; }
.voice-bar .voice-btn {
    position: absolute; left: 20px; top: 10px; 
    width: 30px; height: 30px; 
    color: #999; text-align: center; line-height: 30px;
    background-color: #fff; border-radius: 50%; 
    box-shadow: 0 1px 12px 0 rgba(0,0,0, .1);
}
.voice-bar .voice-btn .icon-player1 { 
    margin: -2px 0 0 2px; font-size: 10px; 
}
.voice-bar .voice-btn.play { color: #0057ff; }
.voice-bar .voice-btn.play .icon-player1 { 
    font-size: 14px; margin-left: 0; 
}
.voice-bar .voice-btn.play .icon-player1:before { content: "\e827"; }
/** */
.law-provision a { 
    display: block; padding: 8px 10px; 
    font-size: 12px; color: #666; line-height: 20px;
    background-color: #f5f5f5;
}
/** more-btn */
.more-btn {
    display: block; margin: auto; padding: 0; 
    width: 168px; height: 32px;
    font-size: 14px; line-height: 32px;
    background-color: #F5F5F5;
    border: 0; border-radius: 16px;
    line-height: 1.6rem !important;
}

/** charlt-bar */
.charlt-bar {
    display: block; position: relative; margin: 10px 8px;
    border-radius: 4px; overflow: hidden;
    box-shadow: 0 2px 5px rgba(0,0,0,.05);
}
.charlt-bar .bg {
    display: block;
    width: 100%; height: auto;
}
.charlt-bar .con {
    position: absolute; top: 50%; right: 16px; left: 16px;
    text-align: center;
    transform: translateY(-50%);
}
.charlt-bar .txt1 {
    font-size: 18px; font-weight: bold; line-height: 30px;
}
.charlt-bar .txt2 {
    margin-top: 4px;
    font-size: 16px; color: #0057FF; line-height: 22px;
}
.charlt-bar .txt2 .line {
    display: inline-block; vertical-align: middle;
    margin: -3px 15px 0 0;
    width: 6px; height: 14px;
    background-color: #EC3B3B;
}
.charlt-bar .txt2 .iconfont {
    font-size: 10px; margin-left: 10px;
}

/* speciality-list */
.speciality-list li { 
    position: relative; padding: 20px 16px; 
}
.speciality-list li:first-child { padding-top: 15px; }
.speciality-list li::after {
    content: ''; position: absolute; right: 16px; bottom: 0; left: 16px;
    height: 1px; background-color: #E8E8E8;
    transform: scaleY(.5); transform-origin: center bottom;
}
.speciality-list .lawyer { display: flex; }
.speciality-list .photo-bar { 
    position: relative; 
    width: 70px; margin-right: 12px; 
}
.speciality-list .photo-bar .photo { 
    display: block; width: 70px; height: 70px; 
    border-radius: 50%; overflow: hidden; 
}
.speciality-list .photo-bar .ico-vip { 
    position: absolute; top: 54px; right: 6px; 
}
.speciality-list .photo-bar .u-label {
    height: 0.7rem;
    background: rgba(239, 88, 88, 0.9);
    opacity: 1;
    border-radius: 0 0 0.4rem 0.4rem;
    position: absolute;
    left: 0;
    right: 0;
    top: 2.8rem;
    font-size: .5rem;
    color: #fff;
    line-height: .7rem;
    text-align: center;
}
.speciality-list .con { flex: 1; }
.speciality-list .name { font-size: 16px; line-height: 22px; }
.speciality-list .name b { margin-right: 5px; }
.speciality-list .name .hualv-tag {
    display: inline-block; vertical-align: middle; margin-top: -3px;
    width: 72px; height: 17px;
}
.speciality-list .skill { 
    margin-top: 6px;
    font-size: 12px; line-height: 20px;
}
.speciality-list .other { 
    margin-top: 4px; 
    font-size: 12px; color: #999; line-height: 20px; 
    overflow: hidden; 
}
.speciality-list .other span { 
    float: left; margin-right: 8px; 
}
.speciality-list .other span:last-child { margin-right: 0; }
.speciality-list .other span em { color: #333; margin-left: 3px; }
.speciality-list .handle-bar { 
    display: flex; margin: 16px 20px 0 82px;
}
.speciality-list .handle-bar .btn { 
    flex: 1; margin-right: 10px; padding: 0; 
    height: 32px; 
    font-size: 14px; line-height: 32px; 
    border: 0; border-radius: 16px; 
}
.speciality-list .handle-bar .btn-online { 
    background-color: #0057FF; color: #fff; 
}
.speciality-list .handle-bar .btn-tel { 
    background-color: #F0F5FF; color: #2570FF; 
}
.speciality-list .handle-bar .is-disable { 
    background-color: #E8E8E8; color: #bbb; 
}

/** consulte-list */
.consulte-list .item { position: relative; }
.consulte-list .item::after {
    content: ''; position: absolute; right: 16px; bottom: 0; left: 16px;
    height: 1px; background-color: #E8E8E8;
    transform: scaleY(.5); transform-origin: center bottom;
}
.consulte-list .link {
    display: block; padding: 20px 16px 16px;
}
.consulte-list .link .tit { 
    font-size: 16px; line-height: 24px; color: #000;
    max-height: 48px; overflow: hidden; 
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; 
}
.consulte-list .link .data { 
    margin-top: 10px; line-height: 24px; overflow: hidden; 
    font-size: 12px; color: #999; 
}
.consulte-list .link .data .num { color: #EC3B3B; margin-right: 5px; }
.consulte-list .link .data .icon-arrow-right-o {
    margin-left: 5px; font-size: 10px;
}
.consulte-list .link .data .tag {
    padding: 0 8px; min-width: 52px; height: 24px;
    font-size: 12px; color: #333; line-height: 24px; text-align: center;
    border-radius: 12px; background-color: #F5F5F5;
}

/** specialy-tag */
.specialy-tag {
    display: inline-block;
    padding: 0 16px; height: 32px;
    font-size: 14px; color: #999; line-height: 32px;
    border-radius: 16px; background-color: #F8F8F8;
}

/** check-more */
.check-more {
    padding: 0 16px; height: 32px;
    font-size: 14px; color: #0057ff; line-height: 32px;
    border: 0; border-radius: 16px;
    background-color: #F2F4FF;
}
.check-more .icon-arrow-right-o {
    margin-left: 3px; font-size: 10px;
}

/** more-loading */
.more-loading { 
    display: block; 
    font-size: 14px; color: #666; 
    line-height: 66px; text-align: center; 
}
.more-loading img { 
    display: inline-block; vertical-align: middle; 
    margin: -2px 5px 0 0;  
    width: 15px; height: 15px;
}

/** det-tab-bar */
.det-tab-bar { margin-top: 10px; background-color: #fff; }
.det-tab-bar .det-tab { display: flex; overflow: hidden; }
.det-tab-bar .det-tab span { 
    flex: 1; height: 54px; line-height: 54px; 
    font-size: 13px; color: #333; text-align: center; 
}
.det-tab-bar .det-tab .is-this { color: #0057ff; font-weight: bold; }
.det-tab-con { padding-bottom: 10px; }
/** det-tab-list */
.det-tab-list { padding: 0 8px; }
.det-tab-list span { 
    float: left; margin-bottom: 10px; 
    text-align: center; height: 24px;
    overflow: hidden;
}
.det-tab-list span a { 
    position: relative;
    display: block; margin: 0 8px; height: 24px;
    font-size: 11px; color: #999; line-height: 25px; 
}
.det-tab-list span a::before {
    content: ''; position: absolute; top: 0; left: 0;
    width: 200%; height: 200%;
    border: 1px solid #ddd; border-radius: 8px; box-sizing: border-box;
    transform: scale(.5,.5) translate(-50%,-50%);
}
.det-tab-list-a span { width: 33.33%; }
.det-tab-list-b span { width: 50%; }

/** bottom-h55 */
.bottom-h55 { height: 55px; }

/** bottom-fixed */
.bottom-fixed { 
    position: fixed; right: 0; bottom: 0; left: 0; z-index: 90;
    display: flex; align-items: center; 
    background-color: #fff; box-shadow: 0 -3px 6px rgba(0,0,0, .1);
}
.bottom-fixed .left-data { 
    position: relative; padding-left: 70px; height: 55px;
    display: flex; flex: 4; align-items: center; 
}
.bottom-fixed .left-data .photo { 
    position: absolute; bottom: 0; left: 0; 
    width: 53px; height: 70px; 
}
.bottom-fixed .left-data .data { 
    position: relative;
    font-size: 13px; color: #333; line-height: 18px; 
}
.bottom-fixed .left-data .data::before { 
    content: ''; position: absolute; top: 5px; left: -14px;
    width: 8px; height: 8px; border-radius: 50%;
    background-color: #11BB65;
}
.bottom-fixed .left-data .data .num { color: #EC3B3B; margin: 0 3px; }
.bottom-fixed .left-data .data .time { color: #EC3B3B; margin-left: 3px; }
.bottom-fixed .btn { 
    flex: 3;
    margin-right: 16px; padding: 0; height: 40px; 
    font-size: 16px; color: #fff; line-height: 40px; 
    background-color: #EC3B3B;
    border: 0; border-radius: 20px;
}

@supports (bottom: env(safe-area-inset-bottom)) {
    .bottom-h55, .bottom-fixed {
        padding-bottom: env(safe-area-inset-bottom);
    }
}

.s-primary { color: #0057FF; }
/* popup-alert */
.popup-alert { width: 320px; }
.popup-alert .pop-conts {
    padding: 32px 25px 26px;
    font-size: 14px; color: #666;
}
.popup-alert .btn-group { height: 12.8vw; display: flex; position: relative; }
.popup-alert .btn-group:after { position: absolute; left: 0; top: 0; right: 0; content: ''; height: 0.267vw; background-color: #e8e8e8; transform: scaleY(.5);}
.popup-alert .btn-group .u-btn { flex: 1; font-size: 4.267vw; line-height: 12.8vw; height: 12.8vw; text-align: center; position: relative; border-radius: 0; border: none; }
.popup-alert .btn-group .u-btn:after { position: absolute; top: 0; right: 0; bottom: 0; content: ''; width: 0.267vw; background-color: #e8e8e8; transform: scaleX(.5);}
.popup-alert .btn-group .u-btn:last-child:after { width: 0; }


/** Fix: #12038 by LJ 2020-07-14 */
/* lawyer-advert */
.lawyer-advert .flex {
    display: flex; flex-direction: column;
    justify-content: center; height: 40px;
}
.lawyer-advert .skill { padding: 0 6px; }
.lawyer-advert .skill span:first-child { margin-left: 0; }

/* charlt-bar-v2 */
.charlt-bar-v2 {
    display: block; position: relative; margin: 10px 8px;
    border-radius: 4px; overflow: hidden;
    box-shadow: 0 5px 10px rgba(0,87,255,.15);
}
.charlt-bar-v2 .bg {
    display: block;
    width: 100%; height: auto;
}
.charlt-bar-v2 .con {
    position: absolute; top: 50%; right: 16px; left: 16px;
    text-align: center;
    transform: translateY(-50%);
}
.charlt-bar-v2 .txt1 {
    font-size: 18px; font-weight: bold; line-height: 30px;
    color: #fff;
}
.charlt-bar-v2 .txt2 {
    position: relative; display: inline-block; 
    margin-top: 4px; padding: 0 22px;
    font-size: 14px; color: #fff; line-height: 28px;
}
.charlt-bar-v2 .txt2 .iconfont {
    font-size: 10px; margin-left: 5px;
}
.charlt-bar-v2 .txt2:before {
    content: ''; position: absolute; top: 0; left: 0;
    width: 200%; height: 200%; box-sizing: border-box;
    border: 1px solid #B3CDFF; border-radius: 28px;
    transform: scale(.5,.5) translate(-50%,-50%);
}

/* */
.answer-list .info .btn { font-weight: normal; }

/* speciality-list */
.speciality-list li { padding-top: 15px; padding-bottom: 15px; }
.speciality-list .photo-bar .photo { border-radius: 8px; }
.speciality-list .photo-bar .ico-vip { right: 0; }
.speciality-list .skill { margin-top: 4px; }
.speciality-list .handle-bar { margin-top: 8px; }
.speciality-list .handle-bar .btn-tel {
    background-color: transparent; color: #0057FF;
    border: 1px solid #0057FF;
}
.speciality-list .handle-bar .btn-tel.is-disable {
    border-color: #E8E8E8; color: #bbb;
}

/* bottom-fixed */
.bottom-fixed .left-data { flex: 7; }
.bottom-fixed .btn {
    flex: 6; font-size: 18px;
    margin-right: 0; border-radius: 0;
    height: 55px; line-height: 55px;
}

/**/
.popup-bar .pop-close .iconfont { font-size: 14px; }
/** #12379 by LQ 2020-08-10 */
.jd-bar {
    position: relative; padding: 40px 20px; background: #fff;
    text-align: center; 
}
.jd-bar:after { 
    position: absolute; left: 0; top: 0; right: 0; content: '';
    border-top: 1px solid #e8e8e8; transform: scaleY(.5);
}
.jd-bar .f18 { font-size: 18px; font-weight: bold; }
.jd-bar .f14 { color: #999; margin: 10px 0 24px; }

/* #15099 by LQ 2020-12-23 */
.reply-tui .lawyer { line-height: 30px; }
.tui-article { position: relative;  margin-bottom: 24px; }
.tui-article .cont-txt { font-size: 16px; line-height: 24px; height: 184px; overflow: hidden; }
.tui-article dt { font-weight: 600; margin-bottom: 16px; }
.tui-article .bg-shut { 
    position: absolute; left: 0; right: 0; bottom: 0; 
    height: 96px; background: linear-gradient(180deg, rgba(255,255,255, 0) 0%, #fff 100%);
}
.tui-article .btn-all { 
    position: absolute; left: 50%; bottom: -12px; padding: 0 16px; line-height: 40px; transform: translateX(-50%);
    background-color: #fff; border-radius: 20px; box-shadow: 0px 2px 16px rgba(0,0,0, 0.12); color: #0050ff;
}
.tui-article .btn-all .iconfont { font-size: 12px; margin-left: 3px; }

.app-down-brand img{width:100%;}
.app-down-brand.mt10{margin-top:10px !important;}


/** #15090 by LJ 2020-12-24 */
.bottom-fixed-v2 .left-data .photo {
    width: 50px; height: 66px;
}
.bottom-fixed-v2 .left-data { padding-left: 64px; }
.bottom-fixed-v2 .left-data .data {
    font-size: 11px;
}
.bottom-fixed-v2 .app {
    background-color: #FF6600;
    font-size: 12px; line-height: 14px; color: #fff;
    height: 55px; padding: 14px 16px 13px; box-sizing: border-box;
}
.bottom-fixed-v2 .btn { font-size: 16px; }

/* #16203 by LQ 2021-03-04 */
.swiper-h100 { height: 100px; margin: 10px 8px; }
.swiper-h100 .swiper-slide {  border-radius: 4px; overflow: hidden; }
.swiper-h100 .charlt-bar-v2 { margin: 0; box-shadow: none; }

/** BBB-321 LQ 2021-11-16 */
.ico-like { 
    display: inline-block; vertical-align: middle; width: 14px; height: 14px; 
    background: url('../images/like_14.png') no-repeat; background-size: 100% 100%; 
}
.speciality-list .photo-bar .online {
    position: absolute; left: 0; right: 0; margin-top: 8px;
    font-size: 12px; color: #333; line-height: 16px; text-align: center;
}
.speciality-list .photo-bar .online .dot { 
    display: inline-block; vertical-align: middle; margin: -2px 6px 0 0; 
    width: 8px; height: 8px; background-color: #11bb65; border-radius: 50%; 
}
.speciality-list .name b {
    display: inline-block; vertical-align: middle; max-width: 150px;
    white-space: nowrap; text-overflow: ellipsis; overflow: hidden;   
}
.speciality-list .tag { overflow: hidden; }
.speciality-list .tag span { 
    float: left; padding: 0 4px; background-color: #f8f8f8; border-radius: 2px; 
    font-size: 12px; line-height: 20px; margin: 6px 10px 0 0;
}
.speciality-list .badge-tui { height: 24px; margin-top: 6px; }
.speciality-list .badge-tui span { display: inline-block; vertical-align: middle; 
    padding: 0 8px; background-color: #FFF3E2; border-radius: 4px;
    font-size: 12px; color: #FF9900;
}
.speciality-list .badge-tui .ico-like { margin: -2px 4px 0 0; }
.speciality-list .badge-tui em { margin-right: 2px; }
.speciality-list .handle-bar { margin-top: 12px; }

/** BBB-1601 LQ 2022-01-18 */
.inform-tip { 
    padding: 6px 12px; background-color: #f8f8f8; border-radius: 4px; 
    font-size: 12px; line-height: 18px; color: #999;
}
.inform-tip a { margin-left: 4px; }
.inform-tip a img { display: inline-block; vertical-align: middle; width: 12px; height: 12px; margin: -3px 4px 0 0; }

/* HLX-7198 2022-05-24 */
.s-f90 { color: #f90; }
/* art-lawyer-h144 */
.art-lawyer-h144 { 
    position: relative; height: 144px; 
    background: #fff url('../images/bg_h144.png') no-repeat; background-size: 100% auto;
}
.art-lawyer-h144 .card {
    position: absolute; left: 8px; right: 8px; bottom: 0; height: 94px; padding: 10px 8px 8px 76px;
    background: linear-gradient(180deg, rgba(255,255,255, .8) 50%, rgba(255,255,255, 0) 100%); border-radius: 8px 8px 0 0;
}
.art-lawyer-h144 .card .photo { position: absolute; left: 8px; top: 8px; width: 60px; height: 60px; }
.art-lawyer-h144 .card .photo img { border-radius: 6px; }
.art-lawyer-h144 .card .photo .online {
    position: absolute; left: 0; top: 64px; right: 0;
    font-size: 10px; color: #666; line-height: 14px; text-align: center;
}
.art-lawyer-h144 .card .photo .online .ico-dot { width: 6px; height: 6px; background: #13cc6e; border-radius: 50%; margin: 0 4px 0 0; }
.art-lawyer-h144 .card .tit { height: 22px; overflow: hidden; }
.art-lawyer-h144 .card .tit .name { float: left; font-size: 16px; line-height: 24px; max-width: 112px; }
.art-lawyer-h144 .card .tit .post { 
    float: left; max-width: 70px; height: 18px; margin: 2px 0 0 4px;
    padding: 0 4px; background: #fff;
    border: 1px solid #b3cdff; border-radius: 2px;
    font-size: 11px; color: #2670ff; line-height: 16px;
}
.art-lawyer-h144 .card .other { height: 16px; line-height: 16px; margin-top: 6px; font-size: 12px; color: #999; }
.art-lawyer-h144 .card .other .span { position: relative; float: left; padding-left: 8px; margin-left: 8px; }
.art-lawyer-h144 .card .other .span .iconfont { font-size: 10px; margin-right: 4px; }
.art-lawyer-h144 .card .other .span:after { position: absolute; top: 2px; left: 0; content: ''; height: 12px; border-right: 1px solid #e8e8e8; }
.art-lawyer-h144 .card .other .span:first-child { padding-left: 0; margin-left: 0; }
.art-lawyer-h144 .card .other .span:first-child:after { border: none; }
.art-lawyer-h144 .card .tag { height: 20px; margin-top: 8px;  }
.art-lawyer-h144 .card .tag span {
    float: left; margin-right: 4px;
    border: 1px solid #d9d9d9; border-radius: 2px;
    padding: 0 6px; font-size: 11px; color: #999; line-height: 18px;
}
.art-lawyer-h144 .u-btn {
    position: absolute; top: 68px; right: 16px;
    width: 80px; height: 28px; line-height: 28px; padding: 0; font-size: 14px;
}