/* 用户信息侧边栏 */
.usercenter {margin-top: 40px;}
.usercenter .sidebar{text-align: center;margin-top:50px;}
.usercenter .sidebar .layui-nav-item li{background: #ff6d24;}
.usercenter .sidebar .layui-nav-item a.active{color: #fff}
.usercenter .sidebar .username{
    font-size:20px;
    line-height:50px;
    margin-bottom:40px;
}
.usercenter .sidebar .username img{
    width: 30px;
    height: 30px;
}
.usercenter .sidebar figure img{
    width:140px;
    height:140px;
    margin:0 auto;
    border:1px solid #ddd;
    border-radius: 50%;
}
.usercenter .sidebar .layui-nav{
    width:40%;
    margin:0 auto;
    background:#fff;
}
.usercenter .sidebar .layui-nav-item{
    height:60px;
}
.usercenter .sidebar  .layui-nav-item a{
    font-size: 16px;
    border-radius:30px;
    color:#333;
}
.usercenter .sidebar  .layui-nav-item a:hover, .usercenter .sidebar  .layui-nav-item a.active{
    background:#ff6d24;
    color:rgb(255, 255, 255);
}
/* 用户信息右侧信息主体 */
.zh{
    margin-top:20px;
    /* 边框肯定右边长啊，为什么边框在左侧 */
    border-left: 1px solid #eee;
}
.zh_card{
    margin-top:46px;
}
.zh_touxiang img{
    /* 只定义宽度不定义高度，用户传个长方形图片怎么处理？ */
    width: 100px;
    height: 100px;
    /* width:100%; */
    
    /* 别的边框都是#ddd 为什么这个就变了？要保持一致性
    border:1px solid rgb(173, 173, 173); */
    border:1px solid #ddd;
}
.zh_touxiang button{margin-top: 10px;}

.zh_btcolor{
    border-radius: 0px;
    background:#ec4f4a;
    color:rgb(255, 255, 255);
}
.zh_btcolor:hover{
    background: #ee5d58;
}

.zh_card .layui-btn{display: none;width: 100px;}
.renzheng .layui-input-block{float: left;display: block;padding: 9px 0px;font-weight: 400;line-height: 20px;margin-left: 0px;width: 80%;}
.renzheng .layui-input-block span{margin-right: 10px;margin-left: 5px;}
.renzheng .layui-input-block a{color: #ec4f4a;}
.jianjie button{margin-top: 10px;}
/* 用户收藏 */
.sc{
    /* 对比一下你自己写的模块上下左右间距，一定要注意细节 */
    margin:20px 0 30px 0;
    padding: 20px 0 0 20px;
    border-left: 1px solid #eee;
}
@media(max-width:768px){
    .sc{
        padding-left:0;
    }  
}
.sc_card{
    border-bottom:1px solid #eee;
    /* margin-top:16px; */
    padding:10px;
}
.sc_card img{
    display:inline-block;
    /* 保持和网站图片统一比例，防止变形 */
    width:200px;
    height: 134px;
}
.sc_title{
    font-size: 20px;
    height: 48px;
    margin-top:10px;
}
.sc_title a:hover{color: #ff6d24;}

.sc_bqgroup{
    margin-top:20px;
}
.sc_biaoqian{
    line-height: 20px;
    height: 20px;
    font-size: 14px;
    display: inline-block;
    padding:2px 10px;
    margin-right:20px;
    text-align: center;    
    background-color:#eee;
    color:#000;
    border-radius:10px;
}
.sc_btgroup{
    background-color:transparent;
    font-size:16px;
    border:none;
    border-radius: 4px;
    float: right;
    margin-left: 0;
}
.sc_btgroup:hover{
    background-color:#e60012;
}
.sc_bthide{
    padding-left:4px;
    color:transparent;
    cursor: pointer;
    font-size: 14px;
}
.sc_btgroup:hover .sc_bthide{
    display: inline-block;
    color:#fff;
}
.sc_btqxsc{
    display: inline-block;
    text-align: center;
    width:24px;
    height:24px;
    line-height: 24px;
    background:#eee;
    border-radius:50%;
    cursor: pointer;
}
/* 身份验证 */
.yz{
    margin-top:50px;
}
.yz h1{
    text-align: center;
    line-height: 100px;
    margin-bottom:40px;
    border-bottom:1px solid #eee;
}
.yz_card{
    margin-bottom:50px;
}
.yz_card input{
    margin-top:10px;
}
.yz_card div{
    width:320px;
    min-height: 240px;    
    border:1px solid rgb(231, 231, 231);
}
.yz_card p{
    width:50%;
    color:#fff;
    border-radius: 0 10px 0 0;
    background: #ff6d24;
    font-size: 18px;
    line-height:50px;
    text-align:center;
}
.yz_img{
    width:100%;
}
.yz_bttj{    
    display: block;
    margin:0 auto;
    margin-bottom: 20px;
    height: 50px;
    width:200px;
    margin-top:50px;border:none;
    color:#fff;
    background-color:#ff6d24;
    border-radius: 4px;
    cursor: pointer;
}
.yz_bttj:hover{
    background:#ffa673;
}

/* 订阅 */
.dy{
    margin:40px 0 30px 0;
    padding: 20px 0 0 20px;
}
@media(max-width:768px){
    .dy{
        padding-left:0;
    }  
}
.dy .dy_card .layui-row{
    background:rgb(243, 243, 243);
}
.dy .dy_card .layui-col-xs5 img{
    display: block;
    width: 80%;
    margin:0 auto;
}
.dy .dy_card .layui-col-xs7{
    padding-left:10px;
    padding-right: 20px;
}
.dy .dy_card .btn_dy{
    color:rgb(180, 180, 180);
    width:70%;
}
.dy .dy_card .btn_dy:hover{
    background-color:#e60012;
    border-color: #e60012;
    color: #fff
}
.dy .dy_card .btn_qxdy{
    width:70%;
    background:none;
    border:none;
    color:#fff;
    background-color:#e60012;
}
.dy .dy_card img{
    padding:10px;
}
.dy .dy_card a:hover {color: #e60012;}
.dy .dy_card p{
    color:rgb(100, 100, 100);
    font-size:16px;
    height:50px;
    margin-top:18px;
}