@import url(style.css); 
.membox {overflow: hidden; padding: 35px 0; background: #f6f6f6;}

/***会员中心***/
.mleft{ float: left; width:210px;}
.mleft .minfo{ background:#fff; text-align: center; padding:30px 12px 23px 12px; }
.mleft .minfo .pic{width:80px; height:80px; margin:0 auto; border-radius:50%; position: relative;}
.mleft .minfo .pic .im1{display:block; width:80px; height:80px; border-radius:50%;}
.mleft .minfo h3{font-weight: normal; font-size:16px; color:#222; padding:10px 0;}
.mleft .minfo .p1 a{color:#db241c;}
.menu{ background:#fff; margin-top:15px;}
.menu li a{ display: block; height:50px; line-height:50px; font-size:15px; padding-left:86px; color:#333; text-decoration:none;}
.menu li:hover a,.mleft ul li.on a{color:#fff; text-decoration:none;}
.menu li.li1 a{ background:url(../img/mem/m1.png) no-repeat 48px center;}
.menu li.li2 a{ background:url(../img/mem/m2.png) no-repeat 48px center;}
.menu li.li3 a{ background:url(../img/mem/m3.png) no-repeat 48px center;}
.menu li.li1.on a,.mleft ul li.li1:hover a{ background:#db241c url(../img/mem/m1on.png) no-repeat 48px center;}
.menu li.li2.on a,.mleft ul li.li2:hover a{ background:#db241c url(../img/mem/m2on.png) no-repeat 48px center;}
.menu li.li3.on a,.mleft ul li.li3:hover a{ background:#db241c url(../img/mem/m3on.png) no-repeat 48px center;}

.mright{width:970px; min-height:500px; float: right; background:#fff; padding:30px;}
.mright .mtit h2{ font-size:22px; font-weight: normal;}

.mright .meminfo{ display: flex; margin-top:30px; height:100px; overflow: hidden; margin-bottom:30px;}
.mright .meminfo dt{ width:70px; height:70px; border-radius:50%; overflow:hidden; margin-right:12px;}
.mright .meminfo dt img{ display: block; width:100px; height:100px; opacity:0;}
.mright .meminfo dd{ flex:1;}
.mright .meminfo dd p{ margin-top:5px;}

.mright .mtable{ margin-top:20px; width:100%;}
.mright .mtable tr th{ height:45px; background:#F4FBFF; font-weight: normal; font-size:14px; color: #666; }
.mright .mtable tr td{ height:50px; text-align: center; font-size:14px; border-bottom:1px solid #f5f5f5;}
.mright .mtable tr td b{color:#db241c;}
.mright .mtable tr td b.j{color:#db241c;}
.mright .mtable tr td img{display:block; width:90px; height:68px; margin:20px auto;}
.mright .mtable tr td span{ height:22px; line-height:22px; width:50px; display: block; margin:0 auto; border-radius:3px; font-size:12px; color:#fff; background:#db241c}
.mright .mtable tr td span.s1{background:#7d7d7d;}
.mright .mtable tr td span.s2{background:#E81919;}
.mright .mtable tr td a.blue{ color:#db241c}
.mright .mtable tr td a.red{ color:#E71414}

/***登录弹窗***/
.alertForm{background:#fff; width:350px; border-radius:8px; position: relative; overflow: hidden; padding-bottom:20px;}
.alertForm.mg{ margin:50px auto;}
.alertForm h1{display:block; font-size:20px; padding:20px 0; text-align: center;}
.alertForm .close img{ width:20px; position: absolute; right:10px; top:10px;}
.alertForm .box{width:298px; margin: 0 auto;}
.alertForm ul{margin-top:10px;}
.alertForm ul li{margin-bottom:17px; position: relative;}
.alertForm ul li .intxt{ border: 1px solid #eee; border-radius:19px; height:40px; transition: 0.3s ease; line-height:40px; font-size:14px; padding-left:55px; width:100%;}
.alertForm ul li .intxt:focus{border-color:#db241c;}
.alertForm ul li span{ width:30px; height:22px; opacity:0.6; background:url(../img/mem/mobile.png) no-repeat left center; border-right:1px solid #eee; position: absolute; left:12px; top:8px;}
.alertForm ul li.pass span{background-image:url(../img/mem/pass.png);}
.alertForm ul li.yzm span{background-image:url(../img/mem/yzm.png);}
.alertForm ul li .getcode{ height:40px; border:0px; cursor: pointer; padding:0 12px; position: absolute; background:none; right:5px; top:0;  color:#db241c; font-size:14px; border-top-right-radius:22px;border-bottom-right-radius:22px;}
.alertForm ul li .getcode[disabled]{  cursor: default; }
.alertForm ul li.li1{color:#666;}
.alertForm ul li.li1 a{float:right; color:#db241c; text-decoration: underline;}
.alertForm ul li.li1 a.l{float:none;}
.alertForm ul li.li2{ text-align: right; color:#666; font-size:14px;}
.alertForm ul li.li2 a{color:#db241c;}
.alertForm ul li.li2 a:hover{ text-decoration: underline;}
.alertForm .tit{text-align: center; margin-top:20px;}
.alertForm .tit span{color:#BABABA; position: relative;}
.alertForm .tit span:after{ width:88px; height:1px; background: #eee; position: absolute; top:8px; content:''; left:-97px;}
.alertForm .tit span:before{ width:88px; height:1px; background: #eee; position: absolute; top:8px; content:''; right:-97px;}
.alertForm .other{margin-top:20px; text-align: center;}
.alertForm .other img{display: inline-block; margin:0 15px;}
.alertForm .other a:hover{ opacity:0.7;}
.btns{ height:40px; line-height:40px; font-size:16px; cursor:pointer; transition:0.3s ease; pointer; background-image: linear-gradient(45deg,#f1433c,#db241c) ; color:#fff; border-radius:22px; border:0px; width:100%;}
.btns:hover{ opacity:0.9;}

/***个人资料***/
.mem-form { margin-top:50px;}
.mem-form .mem-head img{ display: block; width:100%; height:100%;}
.mem-form .mem-head .pic{ border:1px solid #eee; width:100px; border-radius:50%; overflow:hidden; height:100px; background: #fff; text-align: center; cursor: pointer; position: relative; color:#ccc; font-size:13px;  margin-bottom:5px;}
.mem-form .mem-head .pic h3{ font-weight: normal;font-size:18px; padding:120px 0px 12px 0;}
.mem-form .mem-head .pic span{ background:rgba(0,0,0,0.7); position: absolute; left:0; bottom:0; color:#fff; padding:10px 0; width:100%;}
.mem-form .mem-head .layui-upload-file{display:none;}
.mem-form .form li{ position: relative; display: flex; align-items: center; clear: both; margin-bottom:14px; font-size:14px; }
.mem-form .form li span{ margin-right:12px; display: flex; align-items: center; justify-content: flex-end; width:120px; text-align: right;}
.mem-form .form li span i{ color:red;}
.mem-form .form li .intxt{ flex:1; height:40px; line-height:40px; display: block; width:100%; border:1px solid #e5e5e5; padding:0 14px; border-radius: 3px; background: none; font-size:14px;}
.mem-form .form li .intxt:hover{ border-color:#15d79e}
.mem-form .form li .btns{ width:84px; font-size:14px; line-height:40px; margin-right:12px; height:40px; border-radius:3px;}

