@charset "utf-8";
/* CSS Document */
body{ background:#eee; padding-bottom:60px; float:left; }
.headerBox{ width:100%; position:relative; float:left; }  
.htop{ width:100%; height:120px; float:left; }
.htop .l{ padding:30px 0 0 0; float: left; }
.htop .l .avatar{ width:60px; height:60px; margin:0 0 0 10px; float:left; }
.htop .l .avatar img{ border-radius:60px; max-height:60px; max-width:60px; box-shadow:2px 2px 10px #D63F07; }
.htop .l .nick{ text-align:center; margin:18px 0 0 10px; float:left; }
.htop .l .nick span{ color:#FFFFFF; font-size:16px; } 
.htop .r{ width:100px; position:absolute; top:50px; right:0; }
.htop .r a.setting{ position: absolute; right:15px; font-size:13px; color:#fff; }

/*账户*/
.billBox{ width:100%; padding:8px 0; background-color:#fff; border-bottom:1px solid #f2f2f2; float:left; }
.billBox .mk{ width:33%; float:left;}
.billBox .mk.mk:first-child{ border-left:none; }
.billBox .mk em{ width:100%; text-align:center; font-size:18px; padding:5px 0 2px 0; color:#333; float:left; }
.billBox .mk span{ width:100%; text-align:center; font-size:12px; color:#333; float:left; }

/*订单*/
.oshow{ width:100%; padding:0.8rem 0 10px 0; border-bottom:1px solid #f2f2f2; margin:10px 0 10px 0; background:#fff; float:left; }
.oshow .oname{ width:100%; padding:2px 0 0 0; float:left;}
.oshow .oname span{ padding:5px 0 8px 10px; font-size:1rem; font-weight:bold; float:left; }
.oshow .oname a{ padding:5px 0.5rem 0 0; font-size:0.9rem; color:#999; float:right;}
.oshow .oname a i{ font:0.8rem consolas; margin:0 0 0 5px; color:#999; float:right; }

.oshow .ocon{ width:100%; padding:10px 0 5px 0; float:left;} 
.oshow .ocon .mk{ width:20%; position: relative; float:left;}
.oshow .ocon .mk:first-child{ border-left:none; }
.oshow .ocon .mk em{ min-width:16px; height:16px; line-height:16px; text-align:center; position:absolute; left:55%; top:-8px; font-size:12px; background:#fff; border:2px solid #FF0000; color:#FF0000; border-radius:30px; z-index:1; }
.oshow .ocon .mk span{ width:100%; color: #FF3300; padding:0 0 5px 0; font-size:16px; text-align:center; float:left;}
.oshow .ocon .mk span i{ width:30px; height:26px; margin-left:-13px; position:absolute; } 
.oshow .ocon .mk p{ width:100%; position: relative; color:#333; padding:30px 0 0 0; font-size:12px; text-align:center; float:left; }

/**/
.umenu{ width:100%; background:#fff; padding:1.2rem 0 1.5rem 0; float:left;} 
.umenu .li{ width:25%; float:left; }
.umenu .li a{ width:100%; float:left; }
.umenu .li a p.p1{ width:12px; margin:0 auto;  } 
.umenu .li a p.p1 i{width:20px; height:20px; line-height:27px; margin-left:-10px; padding:8px; border-radius:30px; float:left;  }
.umenu .li a p.p1 i img{ width:20px; height:20px; } 
.umenu .li a p.p2{ text-align:center; width:100%; font-size:0.85rem; color:#666666; margin-top:5px; float:left; } 

/*recommend*/
.rcmd{ width:100%; margin:10px 0 0 0; padding:10px 0; float:left; }
.rcmd .rname{ width:100%; padding:0 0 0.8rem 0; float:left; }
.rcmd .rname span{ width:3rem; border-left:2px solid #f00; padding:0 0 0 0.5rem; font-size:1rem; line-height:0.3rem; margin-left:3%; } 
.rcmd .con{ width:100%; float:left; }
.rcmd .con .gbox{ width:46%; background:#fff; margin:0 0 10px 3%; float:left; }
.rcmd .con .gbox:nth-child(odd){ margin:0 1% 1rem 3%; }
.rcmd .con .gbox:nth-child(even){ margin:0 3% 1rem 1%; }
.rcmd .con .gbox .img{ width:100%; float: left; }
.rcmd .con .gbox .img img{ width:100%; }
.rcmd .con .gbox .ttl{ width:100%; float:left;  }
.rcmd .con .gbox .ttl a{ font-size:0.8rem; height:2.5rem; line-height:1.3rem; overflow:hidden; padding:0 0.5rem; float:left; }
.rcmd .con .gbox .pr{ width:100%; padding:0.3rem 0 0.5rem; float:left; }
.rcmd .con .gbox .pr span{ color:#f00; font-size:1.2rem; margin:0 0 0.2rem 0.5rem; float:left; }


