html,body {width: 100%;font-family: "微软雅黑";font-size: 14px;}
html,body,ul,li,dl,dt,dd,p,ol,h1,h2,h3,h4,h5,h6,form,img,table,fieldset,legend,input,span{margin:0; padding:0;}
ul,li,ol{list-style:none;}
table,tr,td{border:none;text-align: left;}
img,fieldset{border:0;}
img{display:inline-block;vertical-align: middle;}
a{text-decoration:none;}
input,a{outline:none;}
i,em{font-style:normal;}
/*清除浮动样式*/
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix {zoom: 1;}
.mb28{margin-bottom: 28px;}

.container{width: 100%;float: left;background: #002004;position: relative;}
.container .box{width: 1200px;margin: 0 auto;}
.container .top{width: 100%;height: 50px;background: #00370B;line-height: 50px;}
.container .login{float: left;background: url(../../images/live/login.png) left center no-repeat;background-size: 28px 28px;padding-left: 34px;font-size: 17px;color: #FFFCFC;margin-right: 25px;cursor: pointer;}
.container .label{float: left;font-size: 12px;color: #A5A5A5;}
.container .link-box{float: right;height: 50px;line-height: 50px;}
.container .link-box ul{float: left;width: auto;height: 50px;overflow: hidden;}
.container .link-box ul li{width: auto;display: inline-block;height: 50px;float: left;}
.container .link-box ul li img{width: auto;}
.container .link-box ul li span{display: inline-block;width: 1px;height: 12px;background: #00260F;margin: 0 6px;}
.container .topinfo{width: 100%;height: 150px;}
.container .topinfo .left{float: left;display: flex;align-items: center;height: 150px;}
.container .topinfo .left .logo{width: 483px;height: 87px;}
.container .topinfo .right{float: right;display: flex;align-items: center;height: 150px;}
.container .topinfo .right .input-box{width: 250px;height: 31px;border-radius: 20px;margin-right: 38px;}
.container .topinfo .right .input-box input{padding-left: 23px;width: 185px;height: 31px;line-height: 31px;background: #fff;font-size: 12px;color: #9B9B9B;border-radius: 20px 0 0 20px;float: left;border: 0;}
.container .topinfo .right .input-box .search-btn{width: 42px;height: 31px;background: #004E10 url(../../images/live/search.png) center no-repeat;background-size: 17px 17px;border-radius: 0 20px 20px 0;float: left;cursor: pointer;}
.container .topinfo .right .ewm{width: 96px;height: 117px;}
.container .nav{width: 100%;height: 50px;background: #00370B;margin-bottom: 23px;}
.container .nav .swiper-container{height: 50px;width: 1200px;margin: 0 auto;}
.container .nav .swiper-container .swiper-slide{font-size: 18px;line-height: 50px;width: 100%;text-align: center;}
.container .nav .swiper-container .swiper-slide a{color: #F6F6F6;}
.container .nav .swiper-container .swiper-slide.active{background: #004E10;}
.container .nav .swiper-container .swiper-slide.active a{color: #D5AF65;}
.container .main{width: 100%;}
.container .main .live-box{width: 100%;margin-bottom: 37px;height: 720px;overflow: hidden;display: flex;justify-content: center;}
.container .main .live-box .left{width: 335px;height: 720px;}
.container .main .live-box .left .title-box{width: 304px;height: 42px;background: #00370B url(../../images/live/bag.png) 7px center no-repeat;line-height: 42px;font-size: 18px;color: #FEFEFE;padding-left: 31px;background-size: 17px 15px;}
.container .main .live-box .left .title-box .num{color: #F7DB9C;}
.container .main .live-box .left .goodslist{width: 100%;height: 678px;overflow-y: overlay;background: #fff;}
.container .main .live-box .left .goodslist .goods-box{width: 100%;height: 146px;border-bottom: 1px solid #EBEAEA;display: flex;align-items: center;justify-content: center;background: #fff;}
.container .main .live-box .left .goodslist .goods-box .img-box{width: 110px;height: 110px;position: relative;margin-right: 5px;}
.container .main .live-box .left .goodslist .goods-box .img-box .goods-img{width: 100%;height: 100%;cursor: pointer;}
.container .main .live-box .left .goodslist .goods-box .img-box .state{width: 50px;height: 20px;line-height: 20px;text-align: center;position: absolute;left: 0;top: 0;font-size: 12px;color: #FDFCFC;}
.container .main .live-box .left .goodslist .goods-box .img-box .state.progressive{background: #E03A2E;}
.container .main .live-box .left .goodslist .goods-box .img-box .state.past{background: #A0A0A0;}
.container .main .live-box .left .goodslist .goods-box .text-box{width: 196px;height: 110px;position: relative;}
.container .main .live-box .left .goodslist .goods-box .text-box .text{font-size: 12px;color: #666666;line-height: 18px;}
.container .main .live-box .left .goodslist .goods-box .text-box .text .price{background: url(../../images/live/rmb.png) left center no-repeat;padding-left: 17px;font-size: 14px;color: #E44841;}
.container .main .live-box .left .goodslist .goods-box .text-box .link-btn{display: block;width: 87px;height: 25px;border: 1px solid #E03A2E;border-radius: 20px;font-size: 14px;color: #E03A2E;line-height: 25px;text-align: center;position: absolute;left: 0;bottom: 0;}
.container .main .live-box .center{width: 405px;height: 720px;position: relative;}
.container .main .live-box .center video{width: 100%;height: 100%;}
.container .main .live-box .center .dianzan-box{width: 52px;height: 52px;background: url(../../images/live/zan.png) center no-repeat;background-size: 100% 100%;position: absolute;bottom: 45px;right: 15px;cursor: pointer;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-khtml-user-select:none;}
.container .main .live-box .center .dianzan-box .num{font-size: 16px;color: #FA5145;position: absolute;top: -25px;left: 50%;transform: translate(-50%, 0);text-align: center;}

.container .main .live-box .right{width: 460px;height: 720px;background: #fff;flex: 1;}
.container .main .live-box .right .info-box{height: 101px;background: #00370B;padding: 13px 16px 16px 8px;}
.container .main .live-box .right .info-box .author-box{width: 100%;height: 50px;display: flex;align-items: center;margin-bottom: 18px;justify-content: space-between;}
.container .main .live-box .right .info-box .author-box .author-head{width: 48px;height: 48px;float: left;margin-right: 9px;}
.container .main .live-box .right .info-box .author-box .author-head img{width: 100%;height: 100%;border-radius: 50%;}
.container .main .live-box .right .info-box .author-box .author-info{float: left;}
.container .main .live-box .right .info-box .author-box .author-info .author-name{font-size: 18px;color: #FEFCFC;margin-bottom: 10px;}
.container .main .live-box .right .info-box .author-box .author-info .author-label{font-size: 14px;color: #CFCFCF;}
.container .main .live-box .right .info-box .author-box .attention{width: 80px;height: 30px;line-height: 30px;text-align: center;background: #E03A2E;border-radius: 15px;float: right;font-size: 18px;color: #FEFDFD;cursor: pointer;}
.container .main .live-box .right .info-box .author-box .followed{background: #A0A0A0;}
.container .main .live-box .right .info-box .people-box{width: 100%;height: 35px;display: flex;align-items: center;}
.container .main .live-box .right .info-box .people-box .num-box{padding: 0 12px;height: 34px;line-height: 34px;background: #004E10;font-size: 14px;color: #FFFDFD;margin-right: 10px;border-radius: 17px;}
.container .main .live-box .right .info-box .people-box .head-list{height: 35px;overflow: hidden;}
.container .main .live-box .right .info-box .people-box .head-list li{float: left;width: 35px;height: 35px;border-radius: 50%;margin-right: 5px;}
.container .main .live-box .right .info-box .people-box .head-list li img{width: 100%;height: 100%;border-radius: 50%;}
.container .main .live-box .right .chat-box{width: 100%;height: 590px;background: #fff;}
.container .main .live-box .right .chat-box .list-box{width: 100%;height: 500px;background: #F5F4F4;overflow-y: auto;padding-top: 10px;}
.container .main .live-box .right .chat-box .chat-list{display: flex;flex-direction: column;width: 100%;}
.container .main .live-box .right .chat-box .chat-list .chat-item{padding: 10px 20px 10px 12px;font-size: 14px;color: #020202;background: #fff;border-radius: 4px;line-height: 18px;max-width: 380px;margin: 0 0 12px 12px;width: fit-content;border: 1px solid #EBEAEA;width: -moz-fit-content;}
.container .main .live-box .right .chat-box .chat-list .chat-item.active1{background: #F36666;color: #FFFBFB;border: 0;}
.container .main .live-box .right .chat-box .chat-list .chat-item.active2{color: #DE3229;border: 0;}
.container .main .live-box .right .chat-box .chat-list .chat-item .userid{color: #008BC8;}
.container .main .live-box .right .chat-box .chat-input{width: 100%;height: 80px;position: relative;overflow: hidden;}
.container .main .live-box .right .chat-box .chat-input textarea{width: 82%;height: 77%;padding: 2% 16% 2% 2%;font-size: 14px;color: #020202;outline: none;border: 0;resize: none;line-height: 20px;}
.container .main .live-box .right .chat-box .chat-input .send{width: 72px;height: 32px;border: 1px solid #EBEAEA;line-height: 32px;text-align: center;border-radius: 4px;font-size: 16px;color: #525151;position: absolute;bottom: 7px;right: 8px;cursor: pointer;z-index: 99;}

/*评论*/
.comment-box{width: 100%;height: 590px;background: #fff;}
.comment-box .comment-title{width: 96%;line-height: 36px;font-size: 16px;color: #333333;background: #F5F4F4;border-bottom: 1px solid #ddd;padding-left: 4%;}
.comment-box .comment-con{width: 100%;height: 473px;background: #F5F4F4;overflow-y: auto;}
.comment-box .comment-con .nocomment{text-align: center;font-size: 14px;line-height: 36px;color: #ccc;}
.comment-box .comment-con .new-comment{width: 96%;line-height: 36px;font-size: 16px;color: #333333;border-bottom: 1px solid #ddd;padding-left: 4%;}
.comment-box .comment-list{padding-top: 20px;}
.comment-box .comment-list .comment-item{width: 90%;margin: 0 auto 20px;border-bottom: 1px solid #ddd;padding-bottom: 20px;}
.comment-box .comment-list .comment-item:last-of-type{border-bottom: 0;margin-bottom: 0;}
.comment-box .comment-list .comment-item .top-box{width: 100%;height: 32px;display: flex;justify-content: space-between;align-items: center;margin-bottom: 5px;}
.comment-box .comment-list .comment-item .top-box .top-left{height: 32px;display: flex;align-items: center;}
.comment-box .comment-list .comment-item .top-box .top-left .head-img{width: 32px;height: 32px;display: inline-block;margin-right: 6px;}
.comment-box .comment-list .comment-item .top-box .top-left .name{font-size: 16px;color: #269cd0;}
.comment-box .comment-list .comment-item .top-box .top-right{height: 24px;font-size: 12px;color: #b8b7b7;line-height: 24px;background: url(../../images/live/zan01.png) left 2px no-repeat;background-size: auto 75%;padding-left: 20px;cursor: pointer;}
.comment-box .comment-list .comment-item .top-box .top-right.active{background: url(../../images/live/zan02.png) left 2px no-repeat;background-size: auto 75%;}
.comment-box .comment-list .comment-item .bottom-box{padding-left: 10%;position: relative;}
.comment-box .comment-list .comment-item .bottom-box .text{font-size: 14px;color: #333333;width: 95%;margin-bottom: 6px;line-height: 20px;}
.comment-box .comment-list .comment-item .bottom-box .text .author{color: #269cd0;}
.comment-box .comment-list .comment-item .bottom-box .bottom-line{width: 95%;}
.comment-box .comment-list .comment-item .bottom-box .bottom-line .left-text{float: left;}
.comment-box .comment-list .comment-item .bottom-box .bottom-line .time{font-size: 12px;color: #999999;margin-right: 8px;}
.comment-box .comment-list .comment-item .bottom-box .bottom-line .reply-btn{font-size: 12px;color: #333333;cursor: pointer;}
.comment-box .comment-list .comment-item .bottom-box .bottom-line .right-text{font-size: 12px;color: #3ea3d3;cursor: pointer;float: right;}
.comment-box .comment-list .comment-item .bottom-box .reply-box{width: 100%;}
.comment-box .comment-list .comment-item .bottom-box .reply-box .reply-list{border-bottom: 1px solid #ddd;padding: 10px 0;}
.comment-box .comment-list .comment-item .bottom-box .reply-box .reply-list:last-of-type{border: 0;}
.comment-box .comment-list .comment-item .bottom-box .reply-box .reply-list .reply-name{font-size: 14px;color: #269cd0;}
.comment-box .comment-list .more{width: 100%;text-align: center;font-size: 14px;color: #269cd0;margin-top: 10px;cursor: pointer;}
.comment-box .comment-list .more i{display: inline-block;width: 0;height: 0;border-left: 6px solid transparent;border-right: 6px solid transparent;border-top: 9px solid #269cd0;}

.comment-box .comment-input{width: 100%;height: 80px;position: relative;overflow: hidden;}
.comment-box .comment-input textarea{width: 82%;height: 78%;padding: 2% 16% 2% 2%;font-size: 14px;color: #020202;outline: none;border: 0;resize: none;line-height: 20px;}
.comment-box .comment-input .send{width: 72px;height: 32px;border: 1px solid #EBEAEA;line-height: 32px;text-align: center;border-radius: 4px;font-size: 16px;color: #525151;position: absolute;bottom: 7px;right: 8px;cursor: pointer;z-index: 99;}

.container .main .play-list{width: 100%;margin-bottom: 40px;background: #003406;}
.container .main .play-list .title-box{width: 100%;height: 58px;border-bottom: 1px solid #004E10;position: relative;margin-bottom: 60px;}
.container .main .play-list .title-box .title{font-size: 30px;color: #E8BD6E;font-family:SourceHanSerifCN-Bold;background: #003406;position: absolute;left: 50%;bottom: -20px;margin-left: -87px;display: block;width: 174px;text-align: center;}
.container .main .play-list .list-box{padding: 0 20px;}
.container .main .play-list .list-box .list-item{width: 550px;float: left;margin-left: 60px;margin-bottom: 50px;}
.container .main .play-list .list-box .list-item:nth-of-type(2n+1){margin-left: 0;}
.container .main .play-list .list-box .list-item a{display: block;}
.container .main .play-list .list-box .list-item .img-box{width: 100%;height: 290px;position: relative;cursor: pointer; display: flex; justify-content: center;align-content: center; overflow: hidden;}
.container .main .play-list .list-box .list-item .img-box img{width: 100%;height: 100%;}
.container .main .play-list .list-box .list-item .img-box .label-box{padding: 0 20px 0 110px;background: rgba(255,255,255,0.4);border-radius: 20px;line-height: 35px;position: absolute;left: 14px;top: 20px;font-size: 16px;color: #fffdfd;z-index: 1;}
.container .main .play-list .list-box .list-item .img-box .label-box .state{display: block;width: 97px;height: 35px;border-radius: 20px;position: absolute;top: 0;left: 0;z-index: 2;text-align: center;font-size: 20px;display: flex;align-items: center;justify-content: center;}
.container .main .play-list .list-box .list-item .img-box .label-box .state.play{background: #EE342A;}
.container .main .play-list .list-box .list-item .img-box .label-box .state.playback{background: #0BA344;}
.container .main .play-list .list-box .list-item .img-box .label-box .state.foreshow{background: #008DCC;}
.container .main .play-list .list-box .list-item .img-box .label-box .state i{display: inline-block;width: 7px;height: 7px;background: #fff;border-radius: 50%;margin-right: 5px;}
.container .main .play-list .list-box .list-item .text{font-size: 20px;color: #E8BD6E;cursor: pointer; height: 36px; line-height: 36px; overflow: hidden;} 


.layui-m-layercont{ position: relative; padding: 0;}
.layui-m-layer0 .layui-m-layerchild{width: auto !important;}
.layui-m-layercont .closevideo{position: absolute; z-index: 1; top: -40px; right:-60px; width: 50px; height: 50px; background: url(../../images/live/icon-close.png) center no-repeat; background-size: 100% auto;}
.layui-m-layercont .img-modal{max-width: 400px;}
.login-modal{display: none;width: 100%;height: 100%;background: rgba(0,0,0,0.5);position: absolute;top: 0;left: 0;z-index: 99;}
.login-modal .modal-bg{width: 100%;height: 100%;}
.login-box{background: #fff;border-radius: 10px;padding: 80px 60px 64px;position: fixed;top: 30%;left: 50%;width: 560px;z-index: 999;animation-name: zoom;animation-duration: 0.3s;margin-left: -280px;}
@keyframes zoom {
	from {transform: scale(0);}
	to {transform: scale(1);}
}
.login-box .close-login{width: 27px;height: 26px;background: url(../../images/live/close.png) center no-repeat;background-size: 100% 100%;position: absolute;top: 24px;right: 16px;}
.login-box .input-line{width: 560px;height: 70px;}
.login-box .input-line input{padding: 0 17px;box-sizing: border-box;border: 1px solid #CCCCCC;font-size: 26px;color: #A2A2A2;height: 70px;line-height: 70px;border-radius: 4px;font-family:HiraginoSansGB-W3;width: 560px;font-weight: 100;}
.login-box .input-line .code{width: 385px;float: left;margin-right: 10px;}
.login-box .input-line .get-code{width: 165px;height: 70px;border-radius: 4px;background: #E03A2E;font-size: 24px;text-align: center;color: #fff;line-height: 70px;float: left;font-family:HiraginoSansGB-W3;font-weight: 100;cursor: pointer;}
.login-box .input-line .get-code.default{cursor: not-allowed;background: #bbb;}
.login-box .login-btn{width: 560px;height: 78px;line-height: 78px;text-align: center;font-size: 30px;color: #FEFDFD;font-family:HiraginoSansGB-W3;background: #E03A2E;border-radius: 4px;margin-top: 50px;font-weight: 100;cursor: pointer;}

.login-text{width: 277px;height: 70px;line-height: 70px;text-align: center;font-size: 16px;}
.load-more{width: 100px;height: 30px;line-height: 30px;border: 1px solid #ccc;color: #ccc;font-size: 14px;text-align: center;cursor: pointer;margin: 0 auto 10px;border-radius: 20px;}
.load-more.none{border: 0;width: 100%;}