body{background: #f1f1f1}
.user-header{background: #d9c7b9; height: 80px;}
.user-logo{float: left; height: 39px; margin-top: 16px}
.user-logo img{height: 39px;}
.user-top-menu{float: right; width:1000px;}
.user-top-menu .leftMenu{float: left; font-size: 30px; color: #fff; margin-top: 20px}
.user-top-menu .leftMenu span{ margin-left: 20px; border-left: 1px #fff solid; padding-left: 20px; font-size: 14px}
.user-top-menu .leftMenu span a{color: #fff}
.user-top-menu .rightMenu{float: right;}
.user-top-menu .rightMenu a{border-radius: 15px; height:30px; line-height:30px; border:1px #fff solid; display: block;padding: 0 20px; color: #fff; margin-top: 25px}

.user-box{width: 1200px; margin: auto; margin-top:20px; clear: both; overflow: hidden; }
.leftBox{float: left; width: 200px;}
.rightBox{float: right; width: 980px;}
.user-menu{clear: both; overflow: hidden;}
.user-menu a{line-height: 40px; border-bottom: 1px #f1f1f1 solid; display: block; padding-left: 20px}
.user-menu a:last-child{border: 0}
.user-menu a.active{color: #b78836}
.my-card-header{font-size: 16px;}
.my-card-header i{color:#b78836;}

.my-btn{background: #000;} 

.user-face{float: left; width: 180px; text-align: center; overflow: hidden; margin-right: 20px}
.user-face img{width: 150px; height: 150px; margin-bottom: 10px;}
.user-info{ float: left;}
.user-info li{ height: 30px; line-height: 30px; font-size: 14px;}
.user-info li label{color: #999; width: 100px; display: block; float: left;}
.user-info li span{font-weight: bold; padding: 0 5px}

.empty{text-align: center; color: #999; font-size: 20px;}
.empty img{width: 150px;margin: auto;}

.my-card{border: 1px #f1f1f1 solid}
.my-card .layui-card-header{font-size: 12px; background: #f1f1f1}

.helpLeft{float: left; width: 200px; background: #fff}
.helpLeft .hd{height: 50px; background: #d9c7b9; color: #fff; text-align: center; font-size: 20px; line-height: 50px;}
.helpLeft .hd i{font-size: 20px}
.helpRight{float: right; width: 980px;}

.helpMenu{clear: both;}
.helpMenu a{display: block; padding-left:20px; line-height: 30px; border-bottom: 1px #f1f1f1 solid;color: #777}
.helpMenu a:last-child{border: 0}
.my-colla-title{background-color: #fff; font-weight: bold;}


.sn{float: left; width:200px; margin-right: 20px; cursor: pointer;}

.tabMenu{clear: both; overflow: hidden; margin-bottom: 10px;}
.tabMenu li{float: left; margin-right: 10px;}
.tabMenu li a{display: block; padding: 5px 10px; background: #f7f7f7}
.tabMenu li.active a{background: #000; color: #fff}

.actionTitle{display: flex;}
.actionTitle .c1{width: 100px;}
.actionTitle .c2{flex: 1}
.orderList{border:1px #eee solid; clear: both; overflow: hidden;}
.orderList .hd{line-height: 40px; border-bottom: 1px #eee solid; color: #999; }
.orderList .bd{display: flex;}
.orderList .bd .c1{width: 100px;}
.orderList .bd .c2{flex: 1}

.mPageName{color: #333; font-weight: bold;clear: both; font-size: 24px; margin-bottom: 20px}

.list{clear: both; overflow: hidden;}
.list li{border-bottom:1px #f1f1f1 solid; clear: both; padding:15px 0; overflow: hidden;}
.list li label{float:left; color: #666}
.list li p{float:right;}
.list li p.money{color: #f00}

.orderGoods{display: flex; margin-bottom: 5px;}
.orderGoods .img{width: 60px;}
.orderGoods .img img{border-radius: 5px; height: 60px;}
.orderGoods .name{flex: 1}
.orderGoods .number{width: 100px;}
.orderList a{color: #23BBFD;}

.orderBox{clear: both; border:1px #f1f1f1 solid; overflow: hidden; margin-bottom: 10px}
.orderBox *{font-size: 12px}
.orderBox a:hover{ color: #FF0036}
.orderBox .hd{clear: both; line-height: 40px; padding: 0 10px; background: #f1f1f1; overflow: hidden;}
.orderBox .bd{clear: both; display: flex;} 
.orderBox .bd .item{ padding: 10px; flex: 1; border-right: 1px #f1f1f1 solid}
.orderBox .bd .price{ padding: 10px; width: 70px; text-align: center; border-right: 1px #f1f1f1 solid}
.orderBox .bd .action{ padding: 10px; width:80px; text-align: right;}
.goodsDetail{clear: both; overflow: hidden;}
.goodsDetail li{float: left; margin-right: 10px; line-height: 20px}
.goodsDetail li img{height: 50px; display: block; width: 50px}
.goodsDetail li p{color: #999}
.delIcon{cursor: pointer; float: right; width: 40px; text-align: center;}
.delIcon i{font-size: 20px;}
.orderCut{float: left; padding-right: 10px}


.product{box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.15); background: #f7f7f7; clear: both; overflow: hidden;transition: 0.3s;}
.product .img{clear: both; overflow: hidden;}
.product img{display: block; width: 100%}
.product .name{font-size:16px; padding: 10px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical; height: 40px}
.product .price{font-size:16px; text-align: center; padding: 10px; float: left;}
.product .addBtn{ float: right; padding-right: 10px; padding-top: 10px}


.actionBox{clear: both; overflow: hidden;}
.actionBox .actionLeft{float: left;}
.actionBox .actionLeft span{line-height: 44px; padding-right: 20px; cursor: pointer;}
.actionBox .actionRight{float: right; text-align: right;}
.numberAction{clear: both; text-align: center; margin:5px 0;}
.numberAction span{display: inline-block; line-height: 20px;padding: 0 5px}
.numberAction span.set{height:20px; width: 20px; border:1px #ccc solid; border-radius: 50%; text-align: center; padding: 0; background: #f1f1f1; cursor: pointer;}
.numberAction span.set:hover{background:#FF0036;color: #fff;border:1px #FF0036 solid; }
.radio{width: 12px; height: 12px; margin: auto; border-radius: 50%; border:1px #ccc solid; cursor: pointer;}
.radio.active{background:#FF0036; border-color: #FF0036}