@charset "utf-8";
/* CSS Document */
.flex-start{display: flex; justify-content:flex-start;}
.flex-end{display: flex;justify-content:flex-end;}
.flex-center{display: flex; justify-content:center;}
.flex-between{display: flex; justify-content:space-between;}

body{background:#f4f4f4}

#test1 img{width:100%; height:auto}

.Menu{margin:0 auto; margin-top:10px; padding:10px; width:calc(100% - 20px); background:#FFF}
.Menu li{width:25%; text-align:center; overflow:hidden}
.Menu li img{width:45px; height:45px; border-radius:50%}
.Menu li p{padding-top:10px; width:100%; text-align:center; font-weight:500}

.Mendianzhanshi{margin:0 5px; margin-top:10px; width:calc(100% - 10px)}
.Mendianzhanshi li{width:calc(33% - 5px); text-align:center}
.Mendianzhanshi li img{width:100%}
.Mendianzhanshi li p{width:100%}
.Mendian{margin:0 auto; margin-top:10px; border-bottom:#d9d9d9 solid 1px; width:100%; background:#FFF}
.Mendian label{margin-top:17px; width:12px; height:1px; background:#d9d9d9}
.Mendian span{padding:0 10px; line-height:35px; font-size:16px; font-weight:600; color:#353535}
.minVideoViewBox{
    width:100%; background:#FFF;
    overflow-x: auto;
    overflow-y: hidden;
    white-space:nowrap;
    &::-webkit-scrollbar{
        background:none;
    }
    &::-webkit-scrollbar-thumb{
        background: rgba(71, 145, 242,.5);
        border-radius: 5px;
    }
    &::-webkit-scrollbar-track{

    }
    &::-webkit-scrollbar-button{

    }
    &::-webkit-scrollbar-track-piece{
    }
}
.miniStreamView{
    width:100px;
    height:130px;
    display: inline-block;
    margin:6px;
}
.miniStreamView img{width:100px; height:100px; border-radius:5px}
.miniStreamView p{width:100px; height:30px; line-height:30px; text-align:center; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}
.Zuopin{margin:0 auto; padding:6px; widows:calc(100% - 12px); background:#FFF; overflow:hidden}
.Zuopin li{float:left; margin-right:10px; width:calc(50% - 5px); text-align:center; overflow:hidden}
.Zuopin li:nth-child(2n){margin-right: 0;} 
.Zuopin li img{float:left; width:100%;}
.Zuopin li p{float:left; width:100%; text-align:center; line-height:30px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}

.Top01{margin:0 auto; padding:6px; width:calc(100% - 12px); line-height:30px; text-align:center; font-size:16px; position:relative; background:#257dfc; color:#fff; overflow:hidden}
.Top01 i{position:absolute; left:0}
.Top01 span{}
.Xiang01{margin:0 auto; padding:6px; width:calc(100% - 12px); background:#FFF; overflow:hidden}
.Xiang01 h2{float:left; width:100%; line-height:24px; font-size:16px; font-weight:600}
.Xiang01 p{float:left; width:100%; line-height:20px; font-size:14px}
.Xiang02{margin:0 auto; padding:6px; width:calc(100% - 12px); line-height:24px; background:#FFF; overflow:hidden}
.Xiang02 img{max-width:100%}

.Login{margin:6px; padding:6px; width:calc(100% - 24px); background:#FFF; border-radius:5px; overflow:hidden}
.Login .Col01{float:left; border-bottom:#d9d9d9 solid 1px; width:100%; line-height:50px}
.Login .Col01 i{padding-top:1px}
.Login .Col01 .Yan{width:100%}
.Login .Col01 .Yan button{margin-top:9px; padding:5px 10px; border:#CCC solid 1px; height:34px; line-height:24px; background:#FFF; color:#333; border-radius:5px}
.Login .Col01 input{border:0; padding-left:6px; outline:none}
.Login .Col02{float:left; margin-top:16px; width:100%}
.Login .Col02 button{width:100%; color: #fff; border-radius: 22px; background-color: #eb3477; border: none; height: 35px; line-height: 35px;}
.Login .Col02 a{width:100%; text-align:center; color: #fff; border-radius: 22px; background-color: #5f8cd0; border: none; height: 35px; line-height: 35px;}

.My001{background: url(../img/006.png) top center no-repeat #ecf3ff; background-size: 100% auto;}
.Block03{margin: 0 10px; padding-top: 10px; width: calc(100% - 20px);}
.Block03 .Logo{width: 50px; height: 50px; border-radius: 50%; background: #FFF; text-align: center; position: relative;}
.Block03 .Logo img{ width: 50px; height: 50px; border-radius:50%}
.Block03 .Logo #uploadButton{ position:absolute; top:0; width:50px; height:50px; z-index:999}
.Block03 p{padding-left: 10px; color: #FFF; line-height: 50px; font-size: 16px;}

.Block04{margin: 0 10px; margin-top: 10px; width: calc(100% - 20px); background: rgb(255,255,255,0.3); border-radius: 20px; overflow: hidden;}
.Block04 .List01{float: left; padding: 10px; width: calc(100% - 20px); color: #FFF;}
.Block04 .List01 p{line-height: 30px;}
.Block04 .List01 img{margin-top: 5px; height: 17px; width: auto;}

.Block04 .List02{float: left; padding: 10px; width: calc(100% - 20px); background: #FFF; border-radius: 20px;}
.Block04 .List02 li{width: 100%; text-align: center;}
.Block04 .List02 li img{height: 45px; width: auto;}

.Yaoqing{margin: 10px; width: calc(100% - 20px); text-align: center;}
.Yaoqing img{width: 100%; height: auto;}

.Col04{margin: 0 10px; padding: 10px 0; width: calc(100% - 20px); background: #FFF; border-radius: 20px; overflow: hidden;}
.Col04 li{float: left; padding: 5px 10px; width: calc(100% - 20px); height: 35px; line-height: 35px; border-bottom: #d5d5d5 solid 1px;}
.Col04 li img{height: auto; width: 17px;}
.Col04 li span{padding-left: 10px;}
.Col04 li:last-child{border-bottom: 0;}

.mask{width:100%;height:1200px;background:gray;position:fixed;top:0;left:0;z-index:100;opacity:0.6; display:none}
.Dingdan{position:fixed; padding:10px; width:calc(100% - 40px); height:100px; left:10px; right:10px; background:#FFF; border-radius:5px; overflow:hidden; z-index:101; display:none}
.Dingdan li{float:left; width:100%; line-height:30px; border-bottom:#d5d5d5 solid 1px}
.layui-clear{margin:0 auto; margin-top:6px; width:100%; height:61px; overflow:hidden}
.Footer{margin:0 auto; padding:6px; width:calc(100% - 12px); position:fixed; bottom:0; background:#257dfc}
.Footer li{width:25%; text-align:center; overflow:hidden}
.Footer li img{height:24px; width:auto}
.Footer li p{padding-top:5px; width:100%; text-align:center; color:#FFF}