@charset "utf-8";
/* 全局样式 */
body, ul, dl, dd, dt, ol, li, p, h1, h2, h3, h4, h5, h6, textarea, form, select, fieldset, table, td, div, input {margin:0;padding:0;-webkit-text-size-adjust: none}
h1, h2, h3, h4, h5, h6{font-size:12px;font-weight:normal;}
body>div, form>div {margin:0 auto;}
div{ text-align:left}
a img {border:0;}
table{border-collapse:collapse; border-spacing:0;}
select,textarea{font: 12px Arial,"微软雅黑";}
body {color:#000;text-align:center;font:12px "微软雅黑";}
ul, ol, li {list-style-type:none;vertical-align:0;}
a {outline-style:none;color:#000;text-decoration:none;}
a, area {blr:expression(this.onFocus=this.blur())}
:focus {-moz-outline-style: none;}
.clear {clear:both;}
.hidden {display:none;}
.block {display:block;}
.left{float:left;}
.right{float:right;}
/* .clearfix{*zoom:1}
.clearfix:after{display:block;clear:both;height:0;overflow:hidden;visibility:hidden;content:"."} */
.yj{-moz-border-radius: 15px;/* Gecko browsers */-webkit-border-radius: 15px;/* Webkit browsers */border-radius:15px;/* W3C syntax */}



/* 通用样式 */

.zt_wh1200{ width:1200px; margin:0 auto}

.zt_he10{ height:10px;}
.zt_he20{ height:20px;}
.zt_he30{ height:30px;}
.zt_he40{ height:40px;}
.zt_he50{ height:50px;}
.zt_he60{ height:60px;}
.zt_he70{ height:70px;} 
.zt_he80{ height:80px;}
.zt_he90{ height:90px;}
.zt_he100{ height:100px;}



.login{width: 100%;height: 100vh;background: #fbecf4 url(../images/bg.jpg) center 0 no-repeat; background-size: 100% auto;}
.logo{position: fixed;top: 80px;left: 100px;}
.con_dw{display: flex;justify-content: flex-end; height: 100%; align-items: center;}
.login_box{width: 580px; background: #fff;padding: 30px;box-shadow:  0 0 20px #eff1fa;position: relative; display: flex;flex-direction: column;align-items: center;border-radius: 10px;}
.login_box h2{width: 100%; color: #b82389;font-size: 62px;}
.login_box h3{font-size: 46px;text-align: center;}
.log_ul{display: flex;justify-content: center;}
.log_ul li{font-size: 28px;margin-top: 30px;padding: 0 20px;border-left: 1px solid #eee;line-height: 28px;}
.log_ul li:first-child{border: none;}
.log_ul .active{color: #b82389;}
.kuai{position: absolute; top: 50px;left: 50%;margin-left: -30px;}
.log_con{margin-top: 30px;}
.inp_box input{width: 560px; padding-left: 20px; height: 75px;font-size: 28px;border: none; border-bottom: 1px solid #ccc;outline: none;margin-bottom: 10px;}
.log_p{width: 100%;display: flex;justify-content: space-between;}
.log_p a{font-size: 22px;color: #b82389;}
.log_btn{display: flex;justify-content: center;margin-top: 50px;margin-bottom: 20px;}
.log_btn button{width: 570px;height: 85px;background: #b82389;color: #fff;font-size: 38px;border: none;border-radius: 50px;}
.inp_box {position: relative;}
.log_list{display: none;}
.inp_box span{font-size: 28px;color: #b82389;position: absolute;top: 20px;right: 20px;}
.log_ewm{width: 200px;height: 200px;background: #eee;margin: 0 auto;}
.log_ewm img{width: 100%;height: 100%;}


@media only screen and (max-width: 1400px) { 
    .login{width: 100%; background-attachment: fixed; background-size: 100% 100%;}
    .con_dw{ width:950px; margin:0 auto}
    .login_box{width: 460px;}
    .inp_box input{width: 400px;font-size: 24px;height: 60px;}
    .log_btn button{width: 400px;height: 60px;font-size: 24px;}
    .login_box h3{font-size: 36px;text-align: center;}
    .log_ul li{font-size: 22px;}
    .login_box h2{font-size: 50px;}
    .log_p a{font-size: 18px;}
    .inp_box span{font-size: 20px;}
} 


@media only screen and (max-width: 768px) { 

    .login{width: 100%;background: #fbecf4; background-size: 100% 100%;height: 100%;}
    .login{width: 100%;}
    .con_dw{width:90%; margin:0 auto;justify-content: center;}
    .login_box{width: 90%;margin-top: 30px;padding: 15px;}
    .inp_box input{width: 100%;font-size: 16px;height: 40px;padding-left: 10px;}
    .log_btn button{width: 80%;height: 50px;font-size: 18px;}
    .login_box h3{font-size: 20px;text-align: center;}
    .log_ul li{font-size: 14px;padding: 0 5px;line-height: 20px;margin-top: 20px;}
    .login_box h2{font-size: 36px;}
    .log_p a{font-size: 14px;}
    .inp_box span{font-size: 16px;}
    .logo{padding-top: 80px; width: 100%; position: static; display: flex;justify-content: center;align-items: center;}
    .logo img{width: 160px;}
    .log_btn{margin-top: 20px;}
    .log_btn button{height: 40px;}
    .log_ewm{width: 120px;height: 120px;background: #eee;margin: 0 auto;}
    .inp_box span{font-size: 14px;color: #b82389;position: absolute;top: 10px;right: 5px;}
    .con_dw{display: flex;align-items: flex-start;}
    .log_con{margin-top: 20px;}
    .kuai{width: 60px;}
    body,html{overflow-x:hidden;background: #fbecf4}
} 






.ky_box{display: flex;width: 100%;height: 100vh;}
.ky_l{width:16%;height: 100%; background: #343345;position: fixed;top: 0;left: 0;}
.ky_r{width: 100%;margin-left: 16%;}


.close_l{width: 40px;height: 100px; background: #eabddb; margin-top: -50px; display: flex;justify-content: center;align-items: center;
 border-top-right-radius: 10px;border-bottom-right-radius:10px; position: absolute;top: 50%;right: -40px;}
.close_r{width: 40px;height: 100px; background: #eabddb; margin-top: -50px; display: flex;justify-content: center;align-items: center;
border-top-right-radius: 10px;border-bottom-right-radius:10px; position: absolute;top: 50%;right: -40px;}

.rotate{transform:rotate(180deg);transtion:all .8s linear;-webkit-transform:rotate(180deg);   -webkit-transtion:all .3s linear;}

.ky_top{width: 100%;display: flex;flex-direction: column;align-items: center;margin-top: 45px;}
.ky_top p{font-size: 18px;color: #fff;margin-top: 10px;}
.tx_box img{border: 1px solid #ccc;border-radius: 50%;}
.ky_top h4{font-size: 16px;color: #999;margin-top: 10px;}
.ky_top h3{font-size: 20px;color: #fff;margin-top: 10px;}
.nav_list{width: 100%;margin-top: 30px;}
.nav_list li{height: 80px;display: flex;justify-content: center;align-items: center;position: relative;}
.nav_list li span{font-size: 20px;color: #fff;margin-left: 15px;}
.nav_list .active{background: #262531;}

.time{color: #999999;font-size: 14px;text-align: center;margin-top: 30px;}

.ky_r_top{width: 100%;height: 65px;background: #f1f1f1;display: flex;align-items: center;justify-content: space-between;}
.mbx{margin-left: 40px;}
.mbx a{font-size: 18px;color: #666;}
.quit{display: flex;align-items: center;margin-right: 40px;font-size: 18px;color: #666;}
.quit img{margin-right: 15px;}
.ky_con{padding: 25px 55px;}
.stage_list{display: flex;align-items: center;}
.stage_list h3{width: 50%;background: #dc91c4;height: 47px;line-height: 47px;text-align: center;font-size: 26px;color: #fff;}
.stage_list .active{padding: 10px 0; border-radius: 10px;background: #b82389;}

.ke_list{display: flex;align-items: center;margin-top: 30px;}
.ke_list h3{height: 38px;padding: 0 30px;border: 1px solid #b82389; height: 38px;line-height: 38px;text-align: center;font-size: 22px;color: #333;margin-right: 30px;border-radius: 10px;}
.ke_list .active{ background: #b82389;color: #fff;}
.lei_list{margin-top: 30px;}
.lei_list{height: 80px;background: #f6f6f6;}
.lei_list ul{display: flex;padding-left: 20px;border-bottom: 1px solid #ccc;}
.lei_list ul li{font-size: 20px;padding: 15px 25px;}
.lei_list ul .active{border-bottom: 2px solid #b82389;margin-bottom: -1px;}
.table_list table{width: 100%;}
.table_list table tr th{height: 60px;font-size: 18px;text-align: center;border: 1px solid #eee;}
.table_list table tr td{height: 60px;font-size: 16px;text-align: center;padding: 0 10px;border: 1px solid #eee;}
.table_list table tr:nth-child(even){background: #f5f5f5;}
.table_a{width: 100%; display: flex;justify-content: center; }
.table_a a{color: #b92389;border: 1px solid #b92389;padding: 5px 20px;border-radius: 5px;margin: 0 10px;}
.table_a a:last-child{background: #b92389;color: #fff;}

.page{display: flex;justify-content: space-between;margin:0 55px;align-items: center;margin-bottom: 40px;}
.page p{font-size: 14px;color: #666;display: flex;align-items: center;}
.page ul{display: flex;align-items: center;}
.page ul li{width: 34px;height: 34px;text-align: center;line-height: 34px;margin: 0 8px;border-radius: 50%;}
.page ul .active{background: #c74fa1;color: #fff;}
.page ul .active a {background: #c74fa1;color: #fff;}
.page p select{background: #f8e9f3;border: none;font-size: 16px;height: 30px;padding: 0 10px;border-radius: 20px;outline: none;margin-left: 10px;}

.live_box{width: 100%; display: flex;justify-content: space-between;}
.live_l{width: 73%;margin-left: 50px;}
.live_tit h3{font-size: 20px;margin-top: 35px;}
.sp_box{margin-top: 40px; background: #f4f4f4;width: 100%;height: 700px;border-radius: 15px;position: relative;}
.sp_kz{width: 100%;height: 55px; background: rgba(0, 0, 0,0.5);position: absolute;bottom: 0;left: 0;display: flex;justify-content: flex-end;align-items: center;border-bottom-left-radius: 15px;
border-bottom-right-radius:15px; }
.sp_btn{margin-right: 100px;}
.sp_line{width: 100%;height: 3px;background: #b92389;position: absolute;top: 0;left: 0;}
.sp_kz ul{width: 70px;background: rgba(0, 0, 0,0.5);position: absolute; right: 90px;bottom: 70px;border-radius: 6px;display: none;}
.sp_kz ul li{height: 40px;text-align: center;color: #fff;font-size: 16px;line-height: 40px; border-bottom: 1px solid #eee;}

.live_r{width: 18%; margin-top: 100px; width: 18%;margin-right: 50px;}

.live_img{display: flex;justify-content: center;}
.live_img img{width: 288px;height: 191px;display: block;}
.live_r .live_ul li{margin-top: 15px;height: 50px;width: 100%;border-radius: 10px;background: #b92389;color: #fff;font-size: 18px;cursor: pointer; text-align: center;color: #fff;line-height: 50px;color: #fff;}
.live_r .live_ul li a{color: #fff;font-size: 18px;}
.live_r .live_ul li:nth-child(2){background: #6786ff;}
.live_r .live_ul li:nth-child(3){background: #ffa200;}
.live_comment{width: 100%;height: 475px; background: #f4f4f4;margin-top: 15px;padding: 10px 0;border-radius: 8px;position: relative;}
.live_comment h3{font-size: 18px;color: #b92389;text-align: center;margin-top: 10px;}
.live_comment p{margin-top: 15px;padding: 0 10px;font-size: 18px;text-align: center;color: #666;}

.com_box{position: absolute;bottom: 10px; left: 4%;  height: 50px;background: #fff;width: 92%;display: flex;align-items: center;justify-content: space-between;}
.com_box img{margin-left: 8px;}
.com_box input{width: 60%;margin-left: 10px; height: 36px;border: 1px solid #dddddd;padding-left: 5px;outline: none;}
.com_box button{width: 50px;height: 36px;background: #b92389;font-size: 14px;color: #fff;border: none;outline: none;margin-right: 5px;border-radius: 10px; cursor: pointer;}

.live_video{width: 100%;height: 200px; background: #f4f4f4;margin-top: 15px;border-radius: 8px;position: relative;}

/* 直播仅聊天css start */
.chat_live_comment{width: 100%;height: 100%; background: #f4f4f4;margin-top: 15px;padding:10px 0;border-radius: 8px;position: relative;}
.chat_live_comment h3{font-size: 28px;color: #b92389;text-align: center;margin: 10px 0;}
.chat_live_comment p{margin-top: 15px;padding: 0 10px;font-size: 18px;text-align: center;color: #666;}

.chat_live_msg{height: 75%;word-wrap: break-word;overflow-y: scroll;padding-bottom: 50px;margin-left: 25px;padding-right: 10px;box-sizing: border-box;}
.chat_live_msg h4{font-size: 16px;padding: 3px 0}

.chat_com_box{position: absolute;bottom: 30px; left: 4%;  height: 70px;background: #fff;width: 92%;display: flex;align-items: center;border-radius: 10px;justify-content: space-between;}
.chat_com_box img{margin-left: 8px;}
.chat_com_box input{width: 75%;margin-left: 10px; height: 55px;border: 1px solid #dddddd;padding-left: 7px;outline: none;border-radius: 10px; }
.chat_com_box button{width: 100px;height: 55px;background: #b92389;font-size: 18px;color: #fff;border: none;outline: none;margin-right: 7px;border-radius: 10px; cursor: pointer;}
/* 直播仅聊天css end */