/*CSS RESET*/

* {
    outline: none;
}

body, p, h1, h2, h3, h4, h5, h6, dl, dd, figure {
    margin: 0;
    padding: 0;
}

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

a {
    text-decoration: none;
}

img {
    border: none;
    vertical-align: top;
}

th, td {
    padding: 0;
}

/*清掉表格单元格默认内边距*/

@media all and (min-width:800px) {}

/*border-collapse:collapse;消除单元格间的空隙*/

form, select {
    margin: 0;
}

input, textarea {
    margin: 0;
    padding: 0;
    outline: none;
}

textarea {
    resize: none;
    -webkit-appearance: none;
}

/*禁止长按复制*/

/*.noselect { -webkit-touch-callout: none; touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }*/

html {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto;
}

body {
    position: relative;
    width: 100%;
    height: 100%;
    font-family: Helvetica, "黑体", "Helvetica Neue", Helvetica, STHeiTi, sans-serif;
}

html, body {
    width: 100%;
    height: 100%;
}

.defaultimg {
    position: absolute;
    top: -300px;
    opacity: 0;
    width: 0;
    height: 0;
}

.fl {
    float: left;
}

.fr {
    float: left;
}

.disnone {
    display: none;
}

.clearfix {
    zoom: 1;
}

.clearfix:after {
    content: "";
    display: block;
    clear: both;
}

.line_clamp {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -moz-box;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-all;
}

body {
    margin: 0 auto;
}

.uploadtip {
    z-index: 100;
}

/*dropload.css*/

.dropload-up, .dropload-down {
    background: #eee;
    position: relative;
    height: 0;
    overflow: hidden;
    font-size: 12px;
    color: #999;
    /* 开启硬件加速 */
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.dropload-down {
    height: 50px;
    width: 100%;
}

.dropload-down .dropload-refresh {
    background: #f7f7f7;
}

.dropload-refresh, .dropload-update, .dropload-load, .dropload-noData {
    height: 50px;
    line-height: 50px;
    text-align: center;
    background: #eee;
}

.dropload-load .loading {
    display: inline-block;
    height: 15px;
    width: 15px;
    border-radius: 100%;
    margin: 6px;
    border: 2px solid #666;
    border-bottom-color: transparent;
    vertical-align: middle;
    -webkit-animation: rotate 0.75s linear infinite;
    animation: rotate 0.75s linear infinite;
}

@-webkit-keyframes rotate {
    0% {
        -webkit-transform: rotate(0deg);
    }
    50% {
        -webkit-transform: rotate(180deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }
    50% {
        transform: rotate(180deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/*顶部导航*/

.topnav {
    padding: 0 0.2rem;
    height: 0.8rem;
    background: #f64e45 url("../images/logo_little.png") no-repeat center center;
    background-size: 0.8rem;
    position: fixed;
    top: 0;
    box-sizing: border-box;
    width: 100%;
    z-index: 10;
}

.tophome {
    display: inline-block;
    width: 1rem;
    height: 100%;
    background: url("../images/home.png") no-repeat 0 center;
    background-size: 0.5rem;
}

/*header*/

#liveHead {
    position: relative;
    padding: 0.3rem;
    background: url(../images/live_bg_default.png) no-repeat;
    background-size: 100% 100%;
}

#liveHead .icon {
    width: 0;
    text-align: center;
    padding: 0 0.2rem;
    /* float: left;*/
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -moz-box-flex: 1;
}

.title .top .down, .title .bot .area {
    padding-right: 0.1rem;
    text-align: center;
    width: 0;
    height: 0.3rem;
    /* float: right;*/
    padding-top: 0.1rem;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -moz-box-flex: 1;
}

.title .down {
    width: 0;
    background: url(../images/tri-down.png) no-repeat;
    background-size: 0.24rem 0.24rem;
    background-position: center center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -moz-box-flex: 1;
}

.title .down span {
    display: none;
    background: url(../images/tri-up.png) no-repeat;
}

#liveHead div.triToggle {
    background: url(../images/tri-up.png) no-repeat;
    background-size: 0.24rem 0.24rem;
    background-position: center center;
}

.wrap {
    position: absolute;
    width: 100%;
    height: 100%;
}

.circle {
    width: 0.64rem;
    height: 0.64rem;
    background: url(../images/live.png) no-repeat center center;
    background-size: contain;
    border-radius: 0.35rem;
    line-height: 0.64rem;
    text-align: center;
    margin: 0 auto;
}

.focus {
    font-size: 0.26rem;
    color: rgb(153, 153, 153);
    display: none;
}

.focus .img {
    display: inline-block;
    width: 0.26rem;
    height: 0.26rem;
    background: url(../images/eye.png) no-repeat center center;
    background-size: contain;
}

.focus .img, .focus span {
    vertical-align: middle;
}

#mainTitle {
    font-size: 0.31rem;
    color: #fff;
    position: absolute;
    left: .3rem;
    bottom: .3rem;
    width: 90%;
    z-index: 1;
    line-height: .38rem;
}

#mainContent {
    font-size: 0.24rem;
    color: rgb(153, 153, 153);
    -webkit-line-clamp: 3;
}

#mainContent p {
    padding-left: 0.1rem;
    margin: 0.2rem 0 0 0.2rem;
    border-left: 4px solid #f93c42;
    word-break: break-all;
}

.havenew {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 0.2rem;
    z-index: 10;
    display: none;
}

.havenew span {
    display: inline-block;
    width: 2.4rem;
    height: 0.6rem;
    background: rgba(73, 145, 226, 0.95);
    line-height: 0.6rem;
    text-align: center;
    font-size: 0.22rem;
    color: #fff;
    border-radius: 100px;
}

.havenew span i {
    display: inline-block;
    background: url(../images/arrow_up_icon.png)no-repeat;
    background-size: 100% 100%;
    width: .2rem;
    height: .2rem;
    vertical-align: middle;
    margin-left: .08rem;
    margin-bottom: .03rem;
}

.alert_win p {
    font-size: 0.24rem;
}

#listsWrap {
    margin: 0 auto;
    width: 1000px;
    position: relative;
    border-top: 1px solid #eee;
    overflow: hidden;
    background: #f9f9f9;
    padding-bottom: 200px;
    margin-top: 35px;
}

.swiper-slide {
    height: 100%;
    background: #f7f7f7;
}

/*container*/

.arrow-left {
    width: 0.16rem;
    height: 0.16rem;
    background: #FFF;
    transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    position: absolute;
    left: -0.09rem;
}

.widthSet {
    text-align: center;
    width: 6rem;
    padding: 0 0.2rem 0.2rem;
    position: relative;
}

.article span {
    display: block;
    height: 0.28rem;
    width: 100%;
}

/*.items .host { width: 1rem; text-align: center; float: left; }*/

.items .host {
    width: 0;
    padding: 0 0.1rem;
    text-align: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -moz-box-flex: 1;
}

/*.items { padding: 0 0.2rem 0.2rem 0; background-color: #eee; }*/

.items {
    width: 100%;
    box-sizing: border-box;
    /* padding: 0 0.2rem 0.2rem 0;*/
    padding: 30px 30px 0 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -o-box;
    display: box;
    -ms-flex-direction: row;
    -webkit-box-orient: horizontal;
    box-orient: horizontal;
    -webkit-flex-direction: row;
    flex-direction: row;
    align-items: flex-start;
    -webkit-box-align: start;
}

/*.items .content { width: 4.8rem; float: left; }*/

.items .content {
    width: 100%;
}

.items.newactive {
    background: #ddeafb;
}

.swiper-container {
    overflow: scroll;
}

#slider {
    background: #ddd;
}

.liveHost {
    background: url(../images/host.png) no-repeat center center;
    background-size: contain;
}

.liveGuest {
    background: url(../images/guest.png) no-repeat center center;
    background-size: contain;
}

.avatar {
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 0.3rem;
    text-align: center;
    margin: 0 auto;
    overflow: hidden;
}

.avatar img {
    width: 0.6rem;
    height: 0.6rem;
}

.name {
    font-size: 0.24rem;
    margin: 0 auto;
    line-height: 0.5rem;
    width: 0.8rem;
    color: rgb(153, 153, 153);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.content {
    padding: 0.2rem;
    text-align: left;
    position: relative;
}

#discussView .items .content .tit .left {
    font-size: 20px;
    color: #999999;
    float: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 60%;
}

.content .box .left2 {
    font-size: 20px;
    color: #999999;
    float: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 10px;
    max-width: 60px;
    height: 30px;
    line-height: 32px;
    vertical-align: middle;
    /*  margin-top: .01rem;
    margin-bottom: .05rem;*/
}

.content .right {
    font-size: 17px;
    color: #cccccc;
    float: right;
}

.content .tit {
    position: relative;
}

.content .article {
    padding: 20px 0;
    text-align: justify;
    color: #333;
    /* font-size: 0.3rem;*/
    font-size: 27.3px;
    word-break: break-all;
    line-height: 1.5;
    line-height: 45px;
    text-align: justify;
}

.content img {
    width: 100%;
}

/*#discussView .items { background: #fff; }*/

#discussView .content {
    border: 1px solid #eee;
    background: #fff;
    /*padding: 0.18rem;*/
    border-radius: 0 5px 5px 5px;
}

#discussView .arrow-left {
    border-left: 1px solid #eee;
    border-top: 1px solid #eee;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}

#ir-tabs-wrapper {
    font-size: 0;
    border-top: 0.01rem solid rgb(205, 205, 205);
    background: #fff;
    position: absolute;
    z-index: 10;
}

#ir-tabs-wrapper a.active {
    color: rgb(245, 78, 69);
    border-bottom: 3px solid rgb(245, 78, 69);
}

#ir-tabs-wrapper a {
    display: inline-block;
    width: 3.2rem;
    height: 0.6rem;
    text-align: center;
    font-size: 0.28rem;
    text-align: center;
    color: rgb(51, 51, 51);
    line-height: 0.6rem;
    border-bottom: 3px solid #fff;
}

#tabL .box {
    display: block;
    float: left;
    border: 1px #E6E6E6 solid;
    border-radius: 20px;
    margin-left: 16px;
    margin-top: 5.5px;
    background: #fff;
}

#tabL .box .avatar {
    width: 20px;
    height: 20px;
    border-radius: 30px;
    float: left;
    margin-right: 10px;
    overflow: hidden;
    margin-left: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
}

#liveView {
    /*background: #f9f9f9;border-top: 5px solid #eee;*/
    background: #f7f7f7;
    position: relative;
}

#tabL .items {
    padding: 0px 30px 0;
}

#tabL .content {
    padding: 0;
}

#tabL .det {
    padding: 0 0 42px 0;
    /* border-bottom: 1px solid #eee;*/
}

#tabL .content .article {
    padding: 13.7px 0 0;
}

#tabL .content .liveImg, #tabL .content .videoArea {
    padding-top: 20px;
}

#tabL .content .left {
    float: left;
    position: relative;
    line-height: 48px;
    font-size: 22px;
    color: #f64e45;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    /* width: 50%; */
}

/*.dropload-refresh { background: #fff; }*/

/*chat*/

.mycolor {
    background: rgb(221, 234, 251);
}

.message {
    min-width: 3rem;
    padding: 0.2rem;
    background: rgb(242, 242, 242);
    margin-bottom: 0.2rem;
}

.message:nth-last-child(1) {
    margin-bottom: 0;
}

.conPull1, .conPull2 {
    padding-top: 0.2rem;
}

.conPull2 .left {
    color: rgb(153, 153, 153);
}

.preloader {
    position: absolute;
    left: 0;
    top: -0.5rem;
    z-index: 0;
    color: #999;
    text-align: center;
    line-height: 0.5rem;
    height: 0.5rem;
    width: 6rem;
    opacity: 0;
    font-size: 0.24rem;
    -webkit-transition: 300ms;
    -moz-transition: 300ms;
    -ms-transition: 300ms;
    -o-transition: 300ms;
    transition: 300ms;
    background: rgba(0, 0, 0, 0.1);
    margin: 0.2rem;
}

.preloader.visible {
    top: 0;
    opacity: 1;
}

/*::-webkit-scrollbar {display:none}
*/

#pagenavi {
    margin: 0 auto;
    width: 1000px;
    height: 55px;
    background: url(../images/bgk.jpg) no-repeat bottom;
}

#pagenavi span {
    font-size: 18px;
}

#pagenavi span.active {
    font-weight: bold;
    position: relative;
    background: #1348a4;
    color: #fff;
}

#pagenavi span.active:after {
    color: #fff;
    width: 100px;
    height: 20px;
}

#pagenavi a {
    font-size: 28px;
    display: block;
    text-align: center;
    float: left;
    height: 55px;
    width: 160px;
    color: #333;
    line-height: 60px;
    color: #fff;
    margin-right: 5px;
}

#pagenavi span {
    display: block;
    background: #999999;
    font-size: 24px;
    position: relative;
    height: 55px;
    width: 150px;
    padding-left: 10px;
    margin: 0 auto;
}

#pagenavi span i {
    width: 60px;
    height: 60px;
    position: absolute;
    left: 0px;
    top: 0px;
}

#pagenavi span i.liveT {
    background: url(../images/afbg.png) no-repeat center;
}

#pagenavi span i.disT {
    background: url(../images/bfbg.png) no-repeat center;
}

.outer {
    /* background: #f9f9f9; */
    background: #f7f7f7;
    position: relative;
    width: 100%;
    height: 890px;
    overflow: hidden;
}

.header {
    width: 1200px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}

.header .btn {
    position: absolute;
    right: 0;
    top: 0;
    width: 4em;
    height: 100%;
    text-align: center;
    color: #06c;
    font-size: 0.24rem;
    background-color: #ccc;
}

.header .btn:active {
    background-color: #aaa;
    color: #fff;
}

#toplive .items {
    overflow: hidden;
    position: relative;
}

#toplive .items:after {
    content: '置顶';
    position: absolute;
    font-size: .205rem;
    line-height: .3rem;
    right: .3rem;
    margin-top: .2em;
    color: #f64e45;
}

#toplive .hidden {
    height: 1.8rem;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -moz-box;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

#openLive {
    font-size: 0.28rem;
    margin: 0 0.3rem;
    padding: 0.1rem 0;
    text-align: right;
    border-bottom: 1px solid #eee;
    color: #999;
}

.inner {
    width: 100%;
    background: #f7f7f7;
    overflow-y: auto;
    overflow-y: scroll;
    height: 100%;
    padding: 0;
}

.inner .item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    -webkit-box-align: center;
    box-align: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 3.125%;
    border-bottom: 1px solid #ddd;
    color: #333;
    text-decoration: none;
}

.inner .item img {
    display: block;
    width: 40px;
    height: 40px;
    border: 1px solid #ddd;
}

.inner .item h3 {
    display: block;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    max-height: 40px;
    overflow: hidden;
    line-height: 20px;
    margin: 0 10px;
    font-size: 0.24rem;
}

.inner .item .date {
    display: block;
    height: 20px;
    line-height: 20px;
    color: #999;
}

.opacity {
    -webkit-animation: opacity 0.5s linear;
    animation: opacity 0.5s linear;
}

@-webkit-keyframes opacity {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes opacity {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.area {
    width: 100%;
    height: 100%;
    position: relative;
}

.videoArea {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.videoArea video {
    position: absolute;
    z-index: 0;
    /*display: none;*/
    visibility: hidden;
}

.videofloat {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 1);
    z-index: 10000;
}

.videofloat video {
    width: 100%;
}

.videofloat .videoarea {
    width: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}

.videocancel {
    position: absolute;
    top: 100px;
    right: 50%;
    margin-right: -35%;
    width: 40px;
    height: 40px;
    color: #fff;
    z-index: 10010;
    background: url(../images/back_white.png) no-repeat center center;
    background-size: contain;
}

.videoArea p {
    width: 100%;
    height: 100%;
    position: relative;
    top: 0;
    z-index: 1;
}

.videoArea .imgbtn {
    width: 0.8rem;
    position: absolute;
    top: 50%;
    margin-top: -0.4rem;
    left: 50%;
    margin-left: -0.4rem;
}

/*视频直播*/

#roomLiveArea, #tvLiveArea {
    display: none;
}

#roomLiveArea {
    width: 100%;
    position: relative;
    margin: auto;
    background: black;
    overflow: hidden;
}

#postImage {
    height: 100%;
    position: relative;
    display: none;
}

#postImage img {
    width: 100%;
    min-height: 100%;
}

#postStatus {
    position: absolute;
    bottom: 0.6rem;
    left: 0;
    width: 100%;
    display: none;
}

#postStatus div {
    color: #fff;
    padding: 5px 10px;
    display: inline-block;
    font-size: 12px;
}

#videobox {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

#videobox video {
    position: absolute;
    left: 0;
    top: -1000px;
    z-index: 0
}

/*下载指引条*/

.boxbottom {
    background: rgba(0, 0, 0, 0.8);
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 1rem;
    margin: 0 auto;
    z-index: 100;
}

.logoarea {
    width: 100%;
    position: absolute;
    left: 0.1rem;
    top: 0.1rem;
}

.downarea {
    position: absolute;
    right: 0.1rem;
    top: 0.15rem;
}

.downarea .downbtn {
    background-color: #f93c42;
    color: #fff;
    width: 1.4rem;
    height: 0.5rem;
    text-align: center;
    line-height: 0.5rem;
    font-size: 0.26rem;
    outline: none;
    margin: 0.1rem 0;
    display: inline-block;
    border-radius: 5px;
    vertical-align: middle;
}

.downarea .close {
    color: #fff;
    font-size: 0.5rem;
    margin-left: 0.2rem;
    vertical-align: middle;
}

.slogantext {
    float: left;
}

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

.slogantext .txta {
    position: absolute;
    top: 0rem;
}

.slogantext .txtb {
    font-size: 0.24rem;
    color: #aaa;
    position: absolute;
    bottom: 0;
}

.logoimg {
    margin-right: 0.1rem;
    width: 0.8rem;
    border-radius: 10px;
    float: left;
}

.commentsub {
    background: #fff url(../images/line.png) no-repeat 0 top;
    height: 0.56rem;
    padding: 0.12rem 0;
}

.commentsub div {
    color: #ccc;
    height: 100%;
    background: #eee url(../images/comment_grey.png) no-repeat 0.3rem center;
    background-size: 0.32rem;
    margin: 0 0.2rem;
    border-radius: 100px;
    font-size: 0.26rem;
    line-height: 0.56rem;
    text-indent: 0.8rem;
}

@keyframes slideToUp {
    from {
        opacity: 0;
        bottom: -1rem;
    }
    to {
        opacity: 1;
        bottom: .15rem;
    }
}

@-moz-keyframes slideToUp {
    from {
        opacity: 0;
        bottom: -1rem;
    }
    to {
        opacity: 1;
        bottom: .15rem;
    }
}

@-webkit-keyframes slideToUp {
    from {
        opacity: 0;
        bottom: -1rem;
    }
    to {
        opacity: 1;
        bottom: .15rem;
    }
}

@-o-keyframes slideToUp {
    from {
        opacity: 0;
        bottom: -1rem;
    }
    to {
        opacity: 1;
        bottom: .15rem;
    }
}

div.slideUp {
    animation: slideToUp 0.5s forwards;
    -moz-animation: slideToUp 0.5s forwards;
    /* Firefox */
    -webkit-animation: slideToUp 0.5s forwards;
    /* Safari 和 Chrome */
    -o-animation: slideToUp 0.5s forwards;
    /* Opera */
}

@keyframes slideToDown {
    from {
        opacity: 1;
        bottom: 0;
    }
    to {
        opacity: 0;
        bottom: -1rem;
    }
}

@-moz-keyframes slideToDown {
    from {
        opacity: 1;
        bottom: 0;
    }
    to {
        opacity: 0;
        bottom: -1rem;
    }
}

@-webkit-keyframes slideToDown {
    from {
        opacity: 1;
        bottom: 0;
    }
    to {
        opacity: 0;
        bottom: -1rem;
    }
}

@-o-keyframes slideToDown {
    from {
        opacity: 1;
        bottom: 0;
    }
    to {
        opacity: 0;
        bottom: -1rem;
    }
}

div.slideDown {
    animation: slideToDown 0.8s forwards;
    -moz-animation: slideToDown 0.8s forwards;
    /* Firefox */
    -webkit-animation: slideToDown 0.8s forwards;
    /* Safari 和 Chrome */
    -o-animation: slideToDown 0.8s forwards;
    /* Opera */
}

/* added by yexl 20160706   ——  ===============分享页视频poster+play icon   start*/

.video_show_wrap {
    text-align: center;
    position: relative;
    width: 100%;
    margin: 0 auto;
}

.video_show_wrap .vi_poster {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.video_show_wrap .vi_poster div {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.video_show_wrap .vi_poster .vi_poster_pic img {
    width: 100% !important;
    min-height: 100%;
}

.video_show_wrap .vi_poster .vi_play_btn {
    position: absolute;
    top: 0;
    background: url("../images/play.png") no-repeat center center;
    background-size: 12%;
}

.video_show_wrap .vi_poster .load_gif, #roomBtn.load_gif {
    background: url("../images/loading.gif") no-repeat center center;
    background-size: 10%;
}

.articlepage_videowrap {
    width: 100%;
    margin: 0 auto;
}

/* ==================================分享页视频poster+play icon   end*/

#roomPosterArea {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: none;
}

#roomImg {
    width: 100%;
    height: 100%;
}

#roomBtn {
    width: 100%;
    height: 100%;
    background: url('../images/play.png') no-repeat center center;
    background-size: 0.7rem 0.7rem;
    position: absolute;
    top: 0;
}

/*评论栏*/

.commentdiv {
    display: none;
}

.shadow {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .7);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
}

.commentwrap {
    padding: 0.12rem 0.2rem;
    background: #fff;
    height: auto;
    box-sizing: border-box;
}

.com_title {
    border-left: 5px solid #f64e45;
    text-indent: 0.1rem;
    font-size: 0.28rem;
    margin-bottom: 0.2rem;
}

.com_textarea {
    box-sizing: border-box;
    width: 100%;
    padding: 0.2rem;
    font-size: 0.28rem;
    color: #999;
    border: 1px solid #eee;
}

.com_submit {
    text-align: right;
    margin: 0.2rem 0 0.1rem;
}

.com_submit_btn {
    display: inline-block;
    width: 1.4rem;
    height: 0.6rem;
    line-height: 0.6rem;
    text-align: center;
    background: #999;
    border-radius: 5px;
    color: #fff;
    font-size: 0.28rem;
}

.com_submit_btn_active {
    background: #3F82E7;
    opacity: 1 !important;
}

.com_name {
    font-size: 0.28rem;
    color: rgb(57, 131, 233);
    padding: 0.2rem 0;
}

.com_content {
    font-size: 0.3rem;
    color: #333;
}

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

.com_time .time {
    font-size: 0.24rem;
    color: #999;
}

.com_time .support {
    float: right;
}

.com_lists {
    margin-top: 0.3rem;
}

.com_lists li {
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    margin-top: -1px;
}

.comarea {
    display: none;
}

.sending {
    width: 0.4rem;
    padding: 0.1rem;
}

/*下载指引条*/

.tipdownload {
    /*display: none;*/
    background: rgba(0, 0, 0, 0.5);
    position: fixed;
    bottom: -1rem;
    width: 100%;
    height: 0.8rem;
    margin: 0 auto;
    z-index: 100;
    padding: 0.1rem 0.2rem;
    box-sizing: border-box;
    -webkit-box-align: center;
}

.tipdownload .downbtn, .tipdownload .openapp {
    background-color: #f93c42;
    color: #fff;
    width: 1.4rem;
    text-align: center;
    line-height: 0.5rem;
    font-size: 0.26rem;
    outline: none;
    display: block;
    border-radius: 5px;
    float: right;
    margin: 0.05rem 0;
}

.tipdownload .close, .tipdownload .tipclose {
    width: 0.26rem;
    margin-left: 0.2rem;
    vertical-align: middle;
    float: right;
    margin: 0.14rem 0 0.14rem 0.2rem;
}

.tipdownload .txta {
    float: left;
    font-size: 0.3rem;
    color: #fff;
    margin: 0;
    line-height: 0.6rem;
}

.tipdownload .logoimg {
    margin-right: 0.2rem;
    width: 0.6rem;
    border-radius: 6px;
    float: left;
}

/*3.5.0*/

.top_box_new {
    background: #fff;
    /*padding-top: .16rem;*/
    /* border-top: #dddddd 1px solid;*/
}

.top_box_new .top_line_new {
    width: 100%;
    height: 0rem;
    background: #fff url(../images/line.png) no-repeat 0 top;
}

.liveL {
    display: none;
    margin: 0 .3rem 0 .3rem;
    background: #f3504b;
    color: #fff;
    font-size: .22rem;
    border-radius: .1rem;
    text-align: center;
    flex-wrap: wrap;
    padding: .16rem 0;
}

.list_book {
    padding: .3rem;
    background: #fff;
    margin-bottom: .2rem;
}

/* .list_book p{
    font-size: .30rem;
    color: #333333;
    word-break: break-all;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-align: left;
} */

.list_book p {
    font-size: .30rem;
    color: #333333;
    overflow: hidden;
    text-align: left;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.list_book span {
    font-size: .22rem;
    color: #999999;
    margin-top: .3rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: .24rem;
    display: inline-block;
    width: 4.4rem;
    height: .24rem;
    position: relative;
    /* padding-left: .15rem; */
    padding: 0.01rem 0 0 .2rem;
}

.list_book span:before {
    content: '';
    width: 5px;
    height: 5px;
    position: absolute;
    top: .1rem;
    margin-left: -.05rem;
    margin-top: -.05rem;
    left: .1rem;
    background: #fc372c;
    border-radius: 50%;
}

.list_book a {
    font-size: .27rem;
    color: #fff;
    background: #2f8ad1;
    width: 1.2rem;
    height: .47rem;
    text-align: center;
    line-height: .47rem;
    border-radius: .5rem;
    display: inline-block;
}

.combot {
    display: none;
    width: .8rem;
    height: .8rem;
    background: url("../images/share_comment_icon.png")no-repeat;
    background-size: 100% 100%;
    position: fixed;
    right: .3rem;
    bottom: .28rem;
    z-index: 100;
    box-sizing: border-box;
    -webkit-box-align: center;
    padding: 0 !important;
}

/*预约头*/

.book_box {
    display: none;
    background: url("../images/live_bg_default.png")no-repeat;
    z-index: 999;
    text-align: center;
    background-size: 100% 100%!important;
}

.book_box .over {
    background: rgba(0, 0, 0, .6);
    width: 100%;
    height: 100%;
}

/* .book_box .over .title{
    font-size: .30rem;
    color: #fff;
    word-break: break-all;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    padding: .75rem .4rem 0 .4rem;
    text-align: center;
} */

.book_box .over .title {
    font-size: .30rem;
    color: #fff;
    overflow: hidden;
    /* padding: .75rem .4rem 0 .4rem; */
    padding: 1rem .4rem 0 .4rem;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.book_box .over .liveL2 {
    font-size: .27rem;
    color: #fff;
    background: #2f8ad1;
    width: 1.2rem;
    height: .47rem;
    text-align: center;
    line-height: .47rem;
    border-radius: .5rem;
    display: block;
    margin: 0 auto;
    margin-top: .34rem;
    margin-bottom: .34rem;
}

.book_box .over .tip {
    position: relative;
    font-size: .22rem;
    color: #999999;
    margin-top: .2rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: .22rem;
    display: inline-block;
    padding: 0.01rem .2rem;
    text-align: center;
}

.book_box .over .tip:before {
    content: '';
    width: 5px;
    height: 5px;
    position: absolute;
    top: 50%;
    margin-left: -.05rem;
    margin-top: -.05rem;
    left: .1rem;
    background: #fc372c;
    border-radius: 50%;
}

/*回顾标签*/

#playbackTip {
    display: none;
    position: absolute;
    background: rgba(0, 0, 0, .6);
    bottom: .25rem;
    left: .3rem;
    border-radius: 4px;
    color: #fffefe;
    text-align: center;
    width: .6rem;
    height: .35rem;
    font-size: .23rem;
    line-height: .35rem;
}

/*3.8.0*/

.timeLine {
    padding: 0px 25px 25px 25px;
    width: 100%;
    box-sizing: border-box;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -o-box;
    display: box;
    -ms-flex-direction: row;
    -webkit-box-orient: horizontal;
    box-orient: horizontal;
    -webkit-flex-direction: row;
    flex-direction: row;
    align-items: flex-start;
    -webkit-box-align: start;
}

.timeLine:first-child {
    padding-top: 35px;
}

.timeLine p {
    width: 100%;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -moz-box-flex: 1;
    font-size: 0.21rem;
    line-height: 0.3rem;
    color: #999;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* #pagenavi .arr_box {
    display: none;
    width: .7rem;
    height: 100%;
    position: absolute;
    right: 0rem;
    top: 0
} */

#pagenavi .arr_box {
    display: none;
    width: .7rem;
    height: 0.6rem;
}

#pagenavi .arr_box .tw_arr {
    width: .22rem;
    height: .12rem;
    position: absolute;
    right: .3rem;
    top: 50%;
    margin-top: -.06rem;
}

#pagenavi .arr_box .tw_up {
    background: url(../images/live_pic_up_arrow.png)no-repeat;
    background-size: 100% 100%;
}

#pagenavi .arr_box .tw_down {
    background: url(../images/live_pic_down_arrow.png)no-repeat;
    background-size: 100% 100%;
}

#liveHead .shadow {
    display: none;
    position: absolute;
    bottom: 0px !important;
    top: inherit !important;
    left: 0;
    background: url(../images/live_pic_shadow_bg.png)no-repeat;
    background-size: 100% 100%;
    height: 1.5rem;
    width: 100%;
    z-index: 1;
}

#discussView .items {
    position: relative;
}

#discussView .items:first-child .content:after {
    content: "";
    position: absolute;
    width: 40px;
    height: 26.6px;
    background: url(../images/live_mes_new_tag_icon.png)no-repeat;
    background-size: 100% 100%;
    top: -15px;
    right: -20px;
    z-index: 1;
}

.content .tit i {
    display: inline-block;
    position: absolute;
    left: -30px;
    top: 0%;
    margin-top: 17px;
    background: url(../images/timeline_tag_icon.png)no-repeat;
    background-size: 100% 100%;
    /*  width: .24rem;
    height: .1rem;*/
    /*transform-origin: 0 0; !* 不从中心点缩放 *!
    transform: scale(0.01); !* 缩放回原尺寸 *!

    -webkit-transform-origin: 0 0; !* 不从中心点缩放 *!
    -webkit-transform: scale(0.01); !* 缩放回原尺寸 *!

    -o-transform-origin: 0 0; !* 不从中心点缩放 *!
    -o-transform: scale(0.01); !* 缩放回原尺寸 *!

    -moz-transform-origin: 0 0; !* 不从中心点缩放 *!
    -moz-transform: scale(0.01); !* 缩放回原尺寸 *!

    -ms-transform-origin: 0 0; !* 不从中心点缩放 *!
    -ms-transform: scale(0.01); !* 缩放回原尺寸 *!*/
}

/*.arrow-lefts{
    position: absolute;
    top: -1px;
    left: -10px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 10px 0;
    border-color: #eee #eee transparent transparent;
}
.arrow-lefts::before {
    position: absolute;
    content: '';
    top: 1px;
    left: 2px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 10px 0;
    border-color: transparent #ffffff transparent transparent;
}*/

.content .article span {
    font-size: 27.3px;
    color: #6186a6;
    padding: 20px 0;
    text-align: justify;
    word-break: break-all;
    line-height: 1.5;
    line-height: 45px;
    text-align: justify;
    display: inline;
}

.arrow-lefts {
    position: absolute;
    top: -1px;
    left: -7px;
    width: 7px;
    height: 13px;
    background: url(../images/live_chat_arr.png)no-repeat;
    background-size: 100% 100%;
}

#discussView .noChat {
    width: 1.8rem;
    height: 1.8rem;
    margin: 1.6rem auto;
    background: url(../images/live_nochat.png)no-repeat;
    background-size: 100% 100%;
    position: relative;
}

#discussView .noChat::after {
    content: '快来聊天吧～';
    position: absolute;
    bottom: -.5rem;
    left: 0%;
    width: 1.8rem;
    color: #999999;
    font-size: .28rem;
    text-align: center;
}

/*评论高亮*/

#discussView .highlight {
    float: right;
    padding: 0.256rem 0 0 0.3rem!important;
}

#discussView .highlight .host {
    float: right!important;
}

#discussView .highlight .content {
    background-color: #E0F3FF !important;
    border-radius: 5px 0 5px 5px;
}

#discussView .highlight .content .arrow-lefts {
    position: absolute;
    top: -1px;
    right: -7px!important;
    left: inherit!important;
    width: 7px;
    height: 13px;
    background: url(../images/live_chat_arr_blue_new.png)no-repeat;
    background-size: 100% 100%;
}

#discussView .highlight.items:first-child .content:after {
    content: "";
    position: absolute;
    width: 40px;
    height: 26px;
    background: url(../images/new_icon.png)no-repeat;
    background-size: 100% 100%;
    top: -15px;
    left: -20px;
    z-index: 1;
}

/*3.8.0*/

.liveAll {
    background: url(../images/live_user_icon.png) no-repeat center center;
    background-size: contain;
}

#discussView .items {
    padding: 25.6px 30px 0 0;
    display: block;
    overflow: hidden;
    /* display: inline-block;
    overflow: hidden; */
    max-width: 100%;
    width: auto!important;
    clear: both;
}

#discussView .items .content {
    padding: 13.7px 17px;
    position: relative;
    max-width: 470px;
    min-width: 200px;
    float: left;
    width: auto !important;
}

#discussView .items .host {
    padding: 0 15px 0 25.6px;
    text-align: center;
    width: 48px;
    height: 48px;
    float: left;
}

#discussView .items .content .article {
    padding: 13.7px 0 0 0;
    font-size: 27.3px;
}

#discussView .items .host .avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    text-align: center;
    margin: 0 auto;
    overflow: hidden;
}

.shadow_box {
    background: rgba(0, 0, 0, 0.5)!important;
    height: 100%!important;
}

/* 外链&&相关365报价官网_365bet足球即时比分网_365平台被黑 */

.listOther {
    display: none;
    position: relative;
    border-top: 1px solid #eee;
    overflow: hidden;
    background: #fff;
}

.newslist {
    margin: 0 15px 15px;
}

.subArtNew {
    display: block;
    padding: 0.2rem 0;
    overflow: hidden;
    position: relative;
    width: 100%;
    min-height: 1.2rem;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    margin-top: -1px;
}

.subArtNew:first-child {
    border-top: none;
}

.normalArt .signarea_new {
    position: absolute;
    bottom: 0.2rem;
    width: 70%;
    height: 40px;
    line-height: 40px;
}

.normalArt .signarea_new2 {
    position: relative;
}

.signarea_new img, .signarea_new2 img {
    width: 0.26rem;
    height: 0.26rem;
    border-radius: 50%;
    margin-right: 0.05rem;
    vertical-align: middle;
    line-height: 1.2;
}

.signarea_new span, .signarea_new2 span {
    font-size: 0.218rem;
    color: #bbb;
    vertical-align: middle;
    line-height: 1.2;
}

.pubtext_new {
    display: inline-block;
    max-width: 1.4rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.pubtext_new, .pubtime_new {
    margin-right: 0.17rem;
}

.sign_new {
    display: inline-block;
    font-size: 0.218rem;
    text-align: center;
    vertical-align: middle;
}

.tagBorder {
    color: #3a84e9 !important;
    border: 1px solid #3a84e9;
    border-radius: 2px;
    padding: 0 0.05rem;
}

.rightImgDiv, .videoSmall {
    float: right;
    /* width: 28%; */
    width: 160px;
    height: 1.2rem;
    margin-left: 0.1rem;
    overflow: hidden;
    position: relative;
}

.rightImgDiv img, .videoSmall img {
    width: 100%;
    min-height: 100%;
}

.stampNew {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0.6rem;
    height: 0.6rem;
    transform: translate(-50%, -50%);
}

.stampNew .viNew {
    display: inline-block;
    width: 100%;
    height: 100%;
    background: url('../images/play.png') no-repeat center;
    background-size: 100% 100%;
}

.stampNew2 {
    position: absolute;
    bottom: 0.1rem;
    width: 1.1rem;
    height: 0.3rem;
    border-radius: 2px;
    right: 0.1rem;
}

.stampNew2 span {
    display: inline-block;
    text-indent: 0.4rem;
    background-size: 0.16rem 0.16rem;
    height: 0.3rem;
    line-height: .35rem;
    width: 100%;
    font-size: 100%;
    font-family: "microsoft yahei";
    color: #fff;
}

.stampNew2 .au {
    background: url(../images/earphone.png) no-repeat 0.1rem center;
    background-size: 0.2rem 0.2rem;
    background-color: rgba(0, 0, 0, .5);
    font-size: 0.22rem;
}

.stampNew2 .liveNew {
    background: url(../images/live-large.png) no-repeat right;
    background-size: contain;
    position: absolute;
}

.normalArt .subText {
    width: 70%;
    float: left;
}

.normalArt .longText {
    width: 100%;
    /* width: 5.8rem; */
    float: left;
}

.normalArt .list-title {
    font-size: 0.29rem;
    color: #333;
    line-height: 150%;
    height: .8rem;
}

.normalArt .imgSmallDiv {
    display: -webkit-flex;
    /* Safari */
    display: -webkit-box;
    display: flex;
    padding: 10px 0px;
}

.normalArt .imgSmallDiv div {
    flex-grow: 1;
    -webkit-box-flex: 1;
    -moz-flex-grow: 1;
    -webkit-flex-grow: 1;
    width: 1.92rem;
    height: 1.44rem;
    overflow: hidden;
}

.normalArt .imgSmallDiv div:nth-child(2) {
    padding: 0 0.2rem;
}

.normalArt .imgSmallDiv img {
    width: 100%;
    min-height: 100%;
}

/** 4.1.0 自定义卡片 **/

/* #tabC{
    padding: 0.3rem;
} */

/* #tabC .customDesc{
    width: 100%;
    font-size: 0.273rem;
    word-break: break-all;
    text-align: justify;
    line-height: 0.45rem;
    color: #333;
} */

#tabC .items_c {
    width: 100%;
    box-sizing: border-box;
    /* padding: 0 0.2rem 0.2rem 0;*/
    padding: 0 0.3rem 0.42rem;
}

#tabC .article {
    padding: 0.2rem 0;
    text-align: justify;
    color: #333;
    font-size: 0.273rem;
    word-break: break-all;
    line-height: 1.5;
    line-height: 0.45rem;
    text-align: justify;
}

#tabC .liveImg {
    width: 100%;
    margin-top: 0.2rem;
}

/**4.2**/

.start_soon {
    width: 2.37rem;
    height: .22rem;
    font-size: .22rem;
    text-align: center;
    color: #999;
    margin: .34rem auto 0;
    position: relative;
    padding: 0 5px;
    background: url('../images/start_icon.png') no-repeat center;
    background-size: contain;
}

.book_box .over .liveL2, .book_box .over .tip {
    display: none;
}

.book_box .start_soon2 {
    margin-top: .67rem;
}

.slideShowBtn {
    display: block;
    position: fixed;
    bottom: 40px;
    width: 140px;
    height: .6rem;
    line-height: .6rem;
    font-size: 15px;
    background: #f3504b;
    color: #fff;
    text-align: center;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 100px;
    box-shadow: rgba(246, 78, 69, .8) 0 2px 4px;
    z-index: 500;
}

.titleak {
    width: 1000px;
    margin: 0 auto;
    font-size: 36px;
    line-height: 50px;
    font-weight: bold;
    text-align: center;
    padding: 15px 0;
    color: #1348a4;
    font-family: 微软雅黑;
}

.bannera {
    width: 100%;
    height: 247px;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #1348a4;
}

.timefb {
    /* background: url(../images/);
    ; */
    text-align: center;
    width: 900px;
    margin: 0 auto;
    height: 60px;
    line-height: 40px;
    color: #333;
    font-size: 16px;
}

.zhaiyao {
    font-size: 26px;
    width: 900px;
    margin: 0 auto;
    /* height: 90px; */
    line-height: 32px;
    color: #333;
    margin-bottom: 20px;
}

.videobg {
    width: 100%;
    height: 84px;
    margin: auto;
    margin-top: -50px;
    background: url(../images/video_bg01.png) no-repeat center;
    position: relative;
    z-index: -1;
}

.timel {
    padding-bottom: 5px;
    width: 900px;
    background: url(../images/top_0101.png) no-repeat center bottom;
}

.book_box, .video_show_wrap, .video_show_wrap, .top_box_new {
    width: 1000px !important;
    margin: 0 auto;
}

.footera {
    width: 100%;
    height: 110px;
    padding-top: 40px;
    background: #1148a3;
    color: #fff;
    font-size: 14px;
    text-align: center;
    line-height: 40px;
}

.erweima {
    padding: 0.26rem;
    width: 320px;
    height: 340px;
    position: fixed;
    margin-left: -160px;
    top: 35%;
    left: 50%;
    font-size: 0.26rem;
    display: none;
    background: rgba(0, 0, 0, 0.8);
    z-index: 9999;
    text-align: center;
    color: #fff;
}

.erweima img {
    width: 86%;
    ;
}

.erweima p {
    margin-bottom: 15px;
}

.erweimabg {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 888;
    display: none;
}

/*新的直播内视频播放*/

.videoAreaNew {
    position: relative;
    width: 100%;
    height: 450px;
    *height: 450px;
    _height: 450px;
}

.videoAreaNew video {
    width: 100%;
    height: 100%;
}

#pcDis {
    width: 1000px;
    height: 200px;
    margin: 0 auto;
    background-color: #f7f7f7;
    z-index: 2;
    border-top: 1px solid #eee;
    box-sizing: border-box;
    padding: 20px;
    position: absolute;
    bottom: 0;
}

#pcDis textarea {
    width: 820px;
    height: 150px;
    font-size: 25px;
}

#pcDis span {
    display: inline-block;
    width: 120px;
    height: 36px;
    text-align: center;
    line-height: 36px;
    background-color: #3F82E7;
    border-radius: 4px;
    color: #fff;
    position: absolute;
    right: 20px;
    bottom: 25px;
    font-size: 18px;
    cursor: pointer;
    opacity: .8;
}

#loginBtn {
    position: absolute;
    right: 20px;
    top: 10px;
    font-size: 20px;
    line-height: 28px;
    color: #fff;
}

#loginForm {
    position: fixed;
    box-sizing: border-box;
    width: 600px;
    height: 473px;
    background: #fff;
    top: 50%;
    left: 50%;
    margin-left: -300px;
    margin-top: -236px;
    /*transform: translate(-50%, -50%);*/
    z-index: 999;
    /* display: none; */
    padding: 30px 60px 40px;
    font-size: 18px;
    display: none;
}

.validateMes{
    display: none;
}

.disabled{
    opacity: .8;
}

#loginForm .login_form_title {
    width: 100%;
    text-align: center;
    font-size: 24px;
    color: #4E5256;
    letter-spacing: 0;
}

#loginForm .login_wrapper {
    width: 360px;
    margin: 35px auto 0;
}
#closeForm{
    position: absolute;
    top: 0;
    right: 0;
    width: 25px;
    height: 25px;
    background: url('../images/close.png') no-repeat;
    background-size: cover;
    cursor: pointer;
}

#checkCode {
    display: block;
    width: 120px;
    height: 50px;
    float: right;
}
#checkCode:hover{
    cursor: pointer;
}

#checkCode img {
    width: 100%;
    height: 100%;
}

#loginForm .login_input {
    height: 50px;
    margin-bottom: 30px;
}

#loginForm .login_input input {
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    border-radius: 4px;
    height: 50px;
    padding-left: 20px;
    font-size: 20px;
    box-sizing: border-box;
}

#loginForm .login_form_btn {
    width: 360px;
    height: 50px;
    background: #3F82E7;
    border-radius: 4px;
    line-height: 50px;
    text-align: center;
    color: #fff;
    margin: 0 auto;
}

input[name="phone"] {
    width: 360px;
}

input[name="code"] {
    width: 220px;
}

input[name="message"] {
    width: 230px;
}

input[name="message"]+span.getMessage {
    display: block;
    width: 120px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    font-size: 20px;
    color: #3F82E7;
    float: right;
    cursor: pointer;
}

.validateMes {
    font-size: 15px;
    color: #f64e45;
}
#myPhone{
    margin-right: 20px;
}
#logout, #login{
    cursor: pointer;
}