@charset "utf-8";
/* CSS Document */
body,div,ul,li,p,h3,h1,h2,h5,h6,h4,dl,dt,dd,table,tr,td,img,span,b,form,input,span{margin:0; padding:0;}
img{border:0;}
ul, li{list-style:none;}
a{text-decoration:none;color: #333;}
body{font-size:14px; color:#000; font-family: "微软雅黑","microsoft Yahei"; background:#f8f8f8;}
.ty01, .ty02, .ty03, .ty04{margin:0 auto; overflow:hidden;}
.ty02, .ty04{width:80%;}

/* 对齐 */
.t-l {text-align: left;}
.t-c {text-align: center;}
.t-r {text-align: right;}
.color-blue {color: #2494f2!important}
.color-red {color: #ec494e!important}#mycenterdiv {position: absolute;top: 70%;display: none;background-color: #f9f9f9;border: 1px solid #ddd;padding: 15px 10px 5px;z-index: 10; width: 10%;font-size: 14px;}
#mycenterdiv ul{line-height:30px;}

/* 顶部导航栏 */
.head01{background:#fff;position:relative;}
.head01 .top{display:flex;justify-content:space-between;width:80%;margin:0 auto;}
.head01 .top div{display:flex;}
.logo{height:45px; margin-top:22px;margin-right:150px; overflow:hidden;}
.logo img{height:45px; float:left; overflow:hidden}
.head01 ul{line-height:90px}
.head01 ul a{font-size:18px; color:#333; margin-right:35px}
.head01 ul a:hover{color:#da2339; text-decoration:underline}
.head01 ul a.on_h{color:#da2339; }
.head01 h5{line-height:90px; font-size:18px; color:#333; font-weight:normal; display:flex;align-items:center}
.head01 h5 img{height:24px; margin-right:10px}
.head01 .user{align-items:center;}
.head01 .user a{font-size:16px; color:#333;}
.head01 .user .btn2{width:65px; height:35px; line-height:35px; text-align:center; font-size:16px; color:#fff;border-radius:30px; transition:all .3s; background:#da2339; margin-left: 10px;}
.user-avatar {width: 60px;height: 60px;border-radius: 50%;vertical-align: middle;}
.tyh301{width:100%; float:left; overflow:hidden; font-size:30px; color:#333; line-height:35px;  margin-bottom:30px }
.tyh301 img{height:31px; margin-right:10px; vertical-align:middle}
.tyh301 span{font-weight:normal; color:#999; font-size:16px; margin-left:15px; }

/* 左边栏 */
.wrapper{display: flex; margin:50px auto 80px;}
.leftnav{width: 320px; overflow:hidden; text-align: center; float:left; overflow:hidden; margin-right:30px}
.leftnav dl{width: 100%;}
.leftnav dl ul{width:100%; float:left; overflow:hidden; margin-bottom:20px; background:#fff; padding:30px 20px 20px; box-sizing:border-box}
.leftnav dl dt{color: #999999; font-size:19px; background:#bc071d;height: 60px;line-height:60px; text-align:center;color:#fff; width:100%; float:left; overflow:hidden}
.leftnav dl h3{height: 60px;line-height:60px; text-align:center; background:#bc071d; margin-bottom:15px; border-radius:15px 5px 0 0 }
.leftnav dl h3 a{color:#fff; font-size:19px; font-weight:normal}
.leftnav dl dd{height: 60px;line-height:60px; margin-bottom:15px;}
.leftnav dl dd a{font-size:16px; color:#666}
.leftnav dl dd img{width: 15px; vertical-align: middle; margin-right: 5px;}
.leftnav dl dd:hover{background-color: #f4f5f8;}
.leftnav dl dd:hover a{color:#333}
.leftnav dl dd.on_h{background-color:#f4f5f8; color:#333}
.leftnav dl dd.on_h a{color:#333;}
.leftnav h5{ display:none}
.mainbody{background-color:#fff; box-sizing:border-box; padding:30px}
.mainbody h3{width:100%; float:left; overflow:hidden; line-height:30px; padding-bottom:10px; border-bottom:1px solid #ddd; font-size:21px; color:#333; font-weight:normal; margin-bottom:20px; margin-bottom:30px}
.mainbody h3 span{color:#bc071d;  margin-right:3px}
.booklist{width:100%; float:left; overflow:hidden; background:#fff; }
.booklist dl{width:30%; float:left; overflow:hidden; margin-right:5%; margin-bottom:50px; padding:25px 25px 20px; box-sizing:border-box; background-image: linear-gradient(to bottom,#ffe2e5 ,#fff 50%) ;box-shadow:0px 5px 10px -5px #eee;}
.booklist dl:nth-child(3n){margin-right:0}
.booklist dl dt{width:100%; float:left; overflow:hidden; text-align:center; line-height:30px; font-size:19px; color:#333; margin-bottom:20px; font-weight:bold}
.booklist dl dd{width:100%; float:left; overflow:hidden;font-size:14px; line-height:26px; color:#666; margin-bottom:30px}
.booklist dl h5{width:100%; float:left; overflow:hidden; text-align:center; line-height:60px}
.booklist dl h5 a{padding:8px 25px; background:#bc071d; border-radius:30px; color:#fff; font-weight:normal; font-size:16px;}
.booklist dl:nth-child(2){background-image: linear-gradient(to bottom,#fec ,#fff 50%) }
.booklist dl:nth-child(3){background-image: linear-gradient(to bottom,#d9f1ff ,#fff 50%)  }
.booklist dl:nth-child(4){background-image: linear-gradient(to bottom,#f0f4ff ,#fff 50%) }
.booklist dl:nth-child(5){background-image: linear-gradient(to bottom,#eaf5e0 ,#fff 50%) }
.booklist dl:nth-child(6){background-image: linear-gradient(to bottom,#ffecdb ,#fff 50%)}
.booklist dl:nth-child(2) h5 a{background:#feb729}
.booklist dl:nth-child(3) h5 a{background:#32b4fd}
.booklist dl:nth-child(4) h5 a{background:#4b71fc}
.booklist dl:nth-child(5) h5 a{background:#73d821}
.booklist dl:nth-child(6) h5 a{background:#fe9238}

/* 登录 */
body.loginbg{background:#fff url(../img/member/background.jpg) left top no-repeat;background-size:cover;width: 100%;  display:flex; align-items:center;flex-wrap:wrap; padding-top:200px}
.login{width: 80%;padding:0 10%;display: flex;align-items: center; justify-content:space-between;flex-wrap:wrap}
.login .brief{}
.brief .logo img{width: auto;height: 45px;}
.brief .welcomes{color: #a87e4e;font-size: 60px;margin: 25px 0 12px 0;}
.brief .memo{color: #a87e4e;font-size: 24px;}
.login .login-form{background-color:#fff;width:400px;border-radius: 20px;padding:50px;}
.login-form .title{font-size: 24px;font-weight: 500;}
.login-form .info{padding:25px 0;}
.login-form .info ul li{font-size: 18px;}
.form-box-item{width:100%;display:flex;align-items:center;height:40px;border:1px solid #e5e5e5;margin-top:15px;}
.form-box-item .icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;}
.form-box-item .form-box-input{flex:1;}
.form-box-item .layui-input{border:none;}
.submit-btn{width:100%;height:54px;display:flex;justify-content:center;align-items:center;color:#fff;background-color:#c09c73;border:none;border-radius:5px;margin-top:45px; cursor:pointer}

/* 发布榜单 */
.publish{padding: 30px; flex:1}
.publish .title{display: flex;align-items: center;}
.publish .title span{margin-right: 10px;font-size: 16px;font-weight: 500;}
.hr-line-dashed{border-top: 1px dashed #e7eaec;height: 1px;flex: 1;}
.publish .content{padding: 30px 0;}
.layui-text-red {color: red;}
.publish .layui-body{left:0;}
.pic{margin-left: 112px;}
.pic dl,.pic dt,.pic img {max-width: 100%;}
.pic img{max-height: 100px;margin: 5px 0;margin-right: 5px;}
.pic dl{float: left;position: relative;}
.pic dl dd{position: absolute;right: 5px;top: 5px;cursor: pointer;background: #666;color: #fff;padding: 2px;}
.publish .btn{background-color: #da2339;border-radius: 5px;margin-top: 25px;width: 150px;}

/* 榜单列表 */
.rank{padding: 30px;}
.rank .title{border-left: 5px solid #c70920;background-color: #fff;padding: 0 15px;}
.rank .title span{font-size: 16px;font-weight: 500;}
.rank .lists{margin-top:30px;}
.lists .bang th,.lists .bang td{text-align: center;}
.layui-table th{background-color: #f5f5f5;}
.mainbody .page-link{color:#000;}

/* 账户信息 */
.userinfo .title{font-size: 16px;font-weight: 500;}
.userinfo ul li{border-bottom: 1px solid #e9ecee;padding: 40px 10px;}
.userinfo li .xy-between{display:flex;align-items:center;justify-content:space-between;width:100%;padding-right:100px;box-sizing:border-box}
.userinfo li .xy-start{display:flex;justify-content:flex-start;align-items:center;}
.userinfo li .xy-start img{width:40px;height:40px;margin-right:18px;}
.xy-between .edit{background-color:#f6de00;}

/* 底部信息 */
.link01{background:#eaeaea; padding:30px 0 40px;}
.link01 h3{width:100%; float:left; overflow:hidden; line-height:30px; height:30px; font-size:18px; color:#333; margin-bottom:10px}
.link01 ul{width:100%; float:left; overflow:hidden; line-height:30px; }
.link01 ul a{color:#666; font-size:14px;}
.link01 ul a:hover{color:#da2339; text-decoration:underline}
.link01 ul span{padding:0 25px; color:#ccc}
.link01 ul span:last-child{display:none}
.foot01{background: url(footbg.jpg) no-repeat center bottom; padding-top:50px}
.foot01 .ty02{display:flex;  padding-bottom:50px}
.foot02{width:70%; margin-right:10%; display:flex; justify-content:space-between }
.foot02 dl {flex:1}
.foot02 dl h5{width:100%; float:left; overflow:hidden; line-height:30px; height:30px; margin-bottom:25px}
.foot02 dl h5 a{font-weight:normal; color:#fff; font-size:16px; float:left; overflow:hidden; margin-right:45px}
.foot02 dl h5 a:hover{color:#da2339; text-decoration:underline}
.foot02 dl dd{width:100%; float:left; overflow:hidden; line-height:30px; height:30px; margin-bottom:10px; font-size:14px; color:rgba(255,255,255,.5); display:flex; align-items:center}
.foot02 dl dd img{margin-right:10px}
.foot02 dl dt{width:100%; float:left; overflow:hidden; margin-top:10px}
.foot02 dl dt a{display:block; font-size:14px; color:#fff; float:left; overflow:hidden; height:50px; line-height:50px; font-weight:normal; transition:all 0.3s; padding:0px 50px; background:#da2339; display:flex; align-items:center}
.foot02 dl dt a img{margin-right:10px}
.foot02 dl dt a:hover{border-radius:25px}
.foot02 ul{width:180px; float:left; overflow:hidden}
.foot02 ul li{width:100%; float:left; overflow:hidden;margin-bottom:20px}
.foot02 ul li a{display:flex; font-size:14px; color:#fff;align-items:center; padding:0 20px; height:48px; border:1px solid #62636b; box-sizing:border-box; transition:all 0.25s; background:url(arr11.png) no-repeat 140px center}
.foot02 ul li a img{margin-right:8px}
.foot02 ul li a:hover{border:1px solid #da2339; background:#da2339 url(arr12.png) no-repeat 150px center}
.foot03{width:20%}
.foot03 h4{width:100%; float:left; overflow:hidden; line-height:20px; font-size:16px; color:#fff; margin-bottom:5px}
.foot03 h6{width:100%; float:left; overflow:hidden; line-height:20px; font-size:12px; color:rgba(255,255,255,.5); font-weight:normal; margin-bottom:30px;    }
.foot03 li{width:100%; float:left; overflow:hidden; display:flex; }
.foot03 li img{border:8px solid #fff}
.foot03 li img:first-child{margin-right:25px}
.foot01 .ty03{border-top:2px solid rgba(255,255,255,.1); padding:20px 0}
.foot01 .ty04{line-height:40px;  font-size:14px; color:rgba(255,255,255,.5)}
.foot01 .ty04 span{float:right; line-height:40px; }


.dl-menuwrapper{ display:none}

/* 手机版 */
@media (max-width:767px){
	
body{ padding-top:50px}
.head01{ display:none }
.dl-menuwrapper{ display:block}
.logom{ max-width:50%; float:left; overflow:hidden; position:absolute; left:3%; top:15px; z-index:999}
.logom img{ height:26px}

.mem01{ position:absolute; right:45px; top:11px; z-index:9; }
.mem01 img{ height:26px}

.ty02,.ty04{ width:94%; padding:0 3%;  }

	
.link01{ background:#eaeaea; padding:10px 0 15px;}
.link01 h3{  line-height:30px; height:30px; font-size:16px;margin-bottom:5px}
.link01 ul{ width:100%; float:left; overflow:hidden; line-height:22px; }
.link01 ul a{ color:#666; font-size:12px;}

.link01 ul span{ padding:0 5px;}


.foot02{ width:100%; margin-right:0%; display:flex; justify-content:space-between }
.foot02 dl { }
.foot02 dl h5{ width:100%; float:left; overflow:hidden; line-height:30px; height:30px; margin-bottom:20px}
.foot02 dl h5 a{ font-weight:normal; color:#fff; font-size:14px; float:left; overflow:hidden; margin-right:10px}

.foot02 dl dd{line-height:30px; height:30px; margin-bottom:10px; font-size:14px; }
.foot02 dl dd img{ margin-right:10px}
.foot02 dl dt{ width:100%; float:left; overflow:hidden; margin-top:10px}
.foot02 dl dt a{ display:block; font-size:12px;height:40px; line-height:50px; font-weight:normal; transition:all 0.3s; padding:0px 40px; background:#da2339; display:flex; align-items:center}
.foot02 dl dt a img{ margin-right:10px}
.foot02 dl dt a:hover{ border-radius:20px}

.foot02 ul,.foot03{ display:none}

.foot01 .ty04{ line-height:20px;  font-size:12px; color:rgba(255,255,255,.5)}
.foot01 .ty04 span{ width:100%; float:left; line-height:20px; }



body.loginbg{padding-top:60px}	
.login{width:94%; padding:0 3%;  }
.login .brief{width:94%; padding:0 3%;  margin-bottom:30px}
.brief .logo img{width: auto;height: 30px;}
.brief .welcomes{font-size: 26px;margin: 25px 0 5px 0;}
.brief .memo{font-size: 16px;}


.login .login-form{width:94%; box-sizing:border-box;border-radius: 0px;padding:20px; margin:0 3%; box-sizing:border-box;}

.login-form .title{font-size: 20px;}
.login-form .info{padding:25px 0;}
.login-form .info ul li{font-size: 16px;}
.form-box-item{width:100%;display:flex;align-items:center;height:40px;border:1px solid #e5e5e5;margin-top:15px;}
.form-box-item .icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;}
.form-box-item .form-box-input{flex:1;}
.form-box-item .layui-input{border:none;}
.submit-btn{width:100%;height:54px;display:flex;justify-content:center;align-items:center;color:#fff;background-color:#c09c73;border:none;border-radius:5px;margin-top:45px; cursor:pointer}



/* 左边栏 */
.wrapper{display: flex;margin:20px auto 20px; padding:0; flex-wrap:wrap }
.leftnav{width: 100%; overflow:hidden; text-align: center; float:left; overflow:hidden; margin-right:0px; padding:0}
.leftnav dl{display:none}
.leftnav h5{ display:block; width:100%; float:left; overflow:hidden; height:36px; line-height:36px; margin-bottom:15px}
.leftnav h5 a{ display:block; width:23.5%; margin-right:2%; height:36px; line-height:36px; background:#eee; color:#333; text-align:center; float:left; overflow:hidden }
.leftnav h5 a.on_h{ background:#bc081d; color:#fff}
.leftnav h5 a:last-child{ margin-right:0}

.mainbody{ width:100%; padding:15px;}
.mainbody h3{ line-height:26px; padding-bottom:10px;font-size:18px;  margin-bottom:20px;}
.mainbody h3 span{color:#bc071d;  margin-right:3px}

.booklist dl{width:48%;  margin-right:0; margin-bottom:20px; padding:15px 10px 10px;  }
.booklist dl:nth-child(2n+1){margin-right:4%}
.booklist dl dt{line-height:20px; font-size:16px;margin-bottom:10px;}
.booklist dl dd{font-size:12px; line-height:20px;margin-bottom:10px}
.booklist dl h5{line-height:60px}
.booklist dl h5 a{padding:8px 25px; border-radius:30px; font-size:14px;}
.booklist dl:nth-child(5){ margin-bottom:0}
.booklist dl:nth-child(6){ margin-bottom:0}




}



/******** 750px ********/
@media (min-width:768px) and (max-width:991px){

.mainbody{flex: 1; }
}


/******** 970px ********/
@media (min-width:992px) and (max-width:1199px){

.mainbody{flex: 1; }

}


/******** 1160px ********/
@media (min-width:1200px) and (max-width:1439px){

.mainbody{flex: 1; }
}

/******** 1400px ********/
@media (min-width:1440px){

.mainbody{flex: 1; }	
}