html,body, h1, h2, h3, h4, h5, h6, div, ul, ol, li, dl, dt, dd, p, form, input, select, button, textarea, table,tr,th,td, iframe {
  margin: 0;
  padding: 0;
}
ul, ol {list-style: none;}
img {border-style: none; vertical-align: middle;}
body {background: #fff; color: #333; font:14px/1.5 "PingFangSC-Regular","微软雅黑","Microsoft Yahei"; }
body.loginbg{background:#6f8489 url(../images/loginbg.png) left top no-repeat;background-size:100%}
/* 链接 */
a {
  color: #333;
  text-decoration: none;
  transition: all 0.3s ease-in-out;
}
/*a:hover {color: #224f7f;}*/
/* 布局 */
.container {
  margin: auto;
  padding: 0 20px;
  max-width: 1400px;
}
.w1200{width: 1200px; margin: 0 auto;}
.container-full {margin: auto; padding: 0 5%;}
/* 浮动 */
.fl {float: left;}
.fr {float: right;}
.clearfix:after{content:"";display:block;height:0;line-height:0;clear:both;visibility:hidden;overflow:hidden;}
.clearfix{zoom:1;}
/* 对齐 */
.t-l {text-align: left;}
.t-c {text-align: center;}
.t-r {text-align: right;}

/* 颜色 */
.gray {color: #666;}
.lightgray {color: #999;}
.gold {color: #d9ad5e;}

.login{min-width:1180px;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center}
.login .logo img{width:auto;height:62px}
.login-form-box{display:flex}
.logo{position:fixed;top:50px;left:40px}
.login-form{display:flex;flex-direction:column;align-items:center;width:520px;height:500px;background-color:#fff;border-radius:5px;}
.login-title{font-size:24px;font-weight:500;margin-top:40px;margin-bottom:30px; font-family: "PingFangSC-Regular","微软雅黑","Microsoft Yahei";}
.form-box-item{width:420px;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;font-family: "PingFangSC-Regular","微软雅黑","Microsoft Yahei";}
.form-box-item .layui-input{border:none;font-family: "PingFangSC-Regular","微软雅黑","Microsoft Yahei";}
.form-box-checked{width:420px;display:flex;align-items:center;justify-content:space-between;margin-top:15px;height:40px;font-family: "PingFangSC-Regular","微软雅黑","Microsoft Yahei";}
.submit-btn{width:420px;height:54px;display:flex;justify-content:center;align-items:center;color:#fff;background-color:#1e446d;border:none;border-radius:5px;margin-top:15px;font-family: "PingFangSC-Regular","微软雅黑","Microsoft Yahei";}
/*.nav-home{margin: 40px 0; background: url('../images/home.png') top left no-repeat;} */

body{background-color: #e8ebf0;}
.header{height: 80px;background-color: #1e446d;padding: 0 20px;box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);}
.header{color: #fff;}
.header-logo img{height: 50px;margin-top:15px;}


.navbar{height: 80px;line-height: 80px;margin-left: 120px;}
.navbar li{display:inline-block;margin: 0 25px;font-weight: bold; }
.navbar li a{color: #fff;}
.search{display:flex;}
.search .form-group input{border:#dddddd 1px solid;width:180px;outline:medium;border-radius:40px;color:#fff;background:none;padding:12px;}
.search .btn-info{width:40px;height:40px;background:none;border:none;cursor:pointer;position:relative;left:-52px;top:1px;border-left:#dddddd 1px solid;padding-left:12px;}
.search .btn-info img{max-width:100%;}
.search input::placeholder{color:#fff}


.user-notice{display:flex;align-items:center;padding-top:22px;margin-right:30px}
.user-notice .message{margin-right:30px;position:relative}
.user-notice .message #notice-num{position:absolute;text-align:center;line-height:15px;top:-5px;left:18px;background-color:red;border-radius:10px;color:#fff;font-size:12px;padding:0 4px;z-index:10}

@media (min-width:768px) and (max-width:991px){
  .search{display: none};
}

@media (min-width:992px) and (max-width:1199px){
  .search{display: none};

}
@media (min-width:1200px) and (max-width:1439px){
  .navbar{margin-left:6%;}

  .navbar li{margin: 0 15px; }
  .user-notice{margin-right:0.5%}
  .search {display: none};
}





.user-imga{color: #fff;}
.user-avatar{width: 36px;height: 36px;border-radius: 50%; margin-right: 5px;}
.vip-img{width: 15px;height:auto; margin-left:3px}
#mycenterdiv {
  position: absolute;
  top: 6.2%;
  display: none;
  background-color: #f9f9f9;
  border: 1px solid #ddd;
  padding: 15px 10px 5px;
  z-index: 10; 
  width: 5%;
  font-size: 14px;
}

@media (min-width:1200px) and (max-width:1439px){
  #mycenterdiv {
    width: 8%;
    top: 7%;
  }
}
.fai{
  margin: 3% 5% 20px 7%;
}

.wrapper{display: flex;}
.leftnav{width: 200px;background-color: #fff;text-align: center;}
.leftnav dl{width: 200px;margin-top: 40px;}
.leftnav dl dt{margin: 50px 0 20px;color: #999999;}
.leftnav dl dd{height: 42px;line-height: 42px;margin: 10px 0;}
.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: #1e446d;}
.mainbody{margin-left:10px;flex-grow: 1;background-color:#fff}
.booklist{margin: 40px;}
.booklist li{padding: 30px;margin-bottom: 30px;background-color: #fff;}
.booklist .img{float: left;margin-right: 50px;}
.booklist .img img{width: 190px;}
.booklist .info{float: left;width: 1100px;}
.booklist .info h3{margin-bottom:40px;position: relative;}
.booklist .info h3 span{position: absolute;right: 0;}
.booklist .info h3 span a{margin-left: 15px;}
.booklist .info .txt{margin: 20px 0;}
.booklist .info .develop{background-color: #f66b1a;}
.booklist .info .tougao{background-color: #fff;color: #43be4c;border:1px solid #43be4c;}
.btn{display: inline-block;height: 30px;line-height: 30px;padding: 0 15px;background-color: #5bc0de;color: #fff;white-space: nowrap;text-align: center;font-size: 12px;border: none;border-radius: 2px;cursor: pointer;outline: 0;box-sizing: border-box;}

@media (min-width:1200px) and (max-width:1439px){
  .booklist{margin: 0px}
  .booklist .info{width: 100%;}

}

/* 分页样式 */
.pagination{padding: 20px 0 30px;width: 100%;text-align: center;margin-bottom: 30px;clear: both;}
.pagination *{display: inline-block;_zoom: 1;_display: inline;vertical-align: middle;line-height: 33px;padding-bottom: 1px;}
.pagination a{color: #666;padding: 0 14px;margin: 0 3px;background: #fff;border: 1px solid #ddd;-webkit-border-radius: 2px;border-radius: 2px;}
.pagination a:hover{display: inline-block;border-color: #1f456c;}
.pagination .hover{display: inline-block;color: #fff;background: #1f456c;border-color: #1f456c;}
.pagination a.page-num-current{background-color: #1f456c;color: #fff;}
.pagination .active a{background: #127a44;color: #fff;}
/* 投稿 */
.tgbody{width:1200px;margin:50px auto}
.content{background-color:#fff;padding:50px}
.layui-table th{background-color:#f5f5f5}
.steps{box-sizing:border-box;font-size:0}
.step,.step .step_text{display:inline-block}
.step{position:relative;width:33.33%;font-size:13px;height:40px;line-height:40px;color:#a4a4a6;background-color:#e2e6ef;z-index:1;text-align:center}
.step i{font-style:normal;display:inline-block;width:20px;height:20px;border-radius:50%;background-color:#fff;margin:10px 10px 10px 0;line-height:20px}
.step .step_text{width:90%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.step-after:after,.step-before:before{content:"";display:block;position:absolute;top:0}
.step-after:after{width:20px;right:0;z-index:9;border-top:20px solid transparent !important;border-left:20px solid #e2e6ef;border-bottom:20px solid transparent !important;background-color:#fff}
.step-before:before{left:-20px;z-index:8;border-top:20px solid #e2e6ef;border-left:20px solid transparent !important;border-bottom:20px solid #e2e6ef}
.steps .step-active{color:#fff;background-color:#53d358}
.steps .step-active i{color:#53d358}
.step-active:after,.step-active:before{border-color:#53d358}
.panel-upload{display:flex;justify-content:center;text-align:center;height:300px;margin:20px 0;background-color:rgba(248,249,251,1);border:1px dashed rgba(226,230,239,1);}
.upload-btn,.paiban-succ-btn,.submit-succ-btn{width:160px;height:40px;background-color:#2baa30;border-radius:20px}
#first-area .tips{margin-top: 20px;}
#second-area p{margin-bottom: 20px;}
#second-area .upload-btn{background-color: #fff;border: 1px solid #1d446d; color: #1d446d;}
#second-area .paiban-succ-btn {background-color: #fff;border: 1px solid #53d358; color: #53d358;}
#second-area .submit-succ-btn {background-color: #f66a1d;color: #fff;}
.panel-operate{margin: 60px 0 20px;}
.panel-operate #readme{vertical-align:middle; margin-right: 10px;}
.panel-operate span{display: flex; align-items: center;}
.paiban-btn,.sub-btn,.newpaiban-btn{width: 160px; height: 50px;background-color: #2baa30;border-radius: 5px;}
.paneldiv{display: flex; justify-content: center; margin-bottom: 20px;}

.upselec{    
  padding: 5px 20px 5px 5px;
  border-color: #666;
  margin-right: 25px;
  color: #333;
}

.banner img{width: 100%;} 
.books{background-color: #fff; padding: 30px;}
.book-header{color: #1e446d; display: flex; justify-content: space-between; margin-bottom: 8px; border-bottom: 1px solid #e8ecf0;}
.book-header span{border-bottom: 2px solid #1e446d;}
.book-header .refresh{border:none;}
.book-header .refresh img{ vertical-align:middle; margin-right: 10px;width: 15px;}
.books ul li{border:1px solid #e8ecf0;margin-bottom: 30px;background-color: #fff;position: relative;}
.books li .title{ height:50px; line-height:50px; background-color: #e8ecf0;padding:0 30px; font-size: 14px;}
.books li .title span{margin-right: 10px;}
.books li .detail{display: flex; padding: 15px;}
.books li .detail .book-img{width: 160px; margin-right: 30px;}
.books li .detail .qrcode{width: 100px; height: 100px;}
.books li .detail .cate{font-size: 12px;color: #999999;}
.books li .detail h3{margin-top: 15px;}
.books .status{margin:30px 0 0 0 ;position: relative;}
.books .status .btn-down{position: absolute; right: 50px;top: 5px;}
.books .status .btn-dele{position: absolute; right: 0px;top: 5px;}
.books .status .btn-updade{position: absolute; right: -50px;top: 5px;}

.copyinfo{display: flex; line-height: 35px; font-size: 14px;color: #666;}
.copyinfo div{margin-right: 30px;}
.timeline{display:flex;height: 60px; margin:20px auto; margin-left:5px;}   
.timeline-item { position: relative;padding-bottom: 20px;}      
.timeline-axis {position: absolute;left: -5px;top: 0;z-index: 10;width: 30px;height: 30px;line-height: 30px;background-color: #fff;color: #16b777;border-radius: 50%;text-align: center;cursor: pointer; font-style:normal;}      
.timeline-axis:hover {color: #ff5722}     
.timeline-item:before {content: "";position: absolute;left: 5px;top: 15px;z-index: 0;width: 100%;height: 1px;background: #16b777;}  
.timeline-item:first-child:before {display: block;}     
.timeline-item:last-child:before {display: none;}
.timeline-content {padding-left: 16px; width:128px;}      
/*.timeline-title {position: relative;margin-bottom: 10px;line-height: 22px}*/
.timeline-title {text-align: center; position: relative;top: 40px;transform: translate(-45%, 0); font-size: 14px; color:#16b777 }
.roundness{background-color: #fff; border:1px solid #16b777;}
.timeline-item.active .roundness{background-color: #16b777; color: #fff;}
.timeline-bank{position:absolute; top:-130px;left: -50px; text-align: center;}

@media (min-width:1200px) and (max-width:1439px){
  .timeline-content{width: 60px;}
  .books .status .btn-down{right: -110px;}
}

.nav-tabs>li.active>a,.nav-tabs>li.active>a:focus,.nav-tabs>li.active>a:hover{border:none;border-bottom:1px solid #1e446d}
.nav>li{position:relative;display:block}
.nav>li>a{position:relative;display:block;color:#555;padding:10px 15px}
.nav-tabs{border-bottom:1px solid #f5f5f5}
.nav-tabs>li{float:left;margin-bottom:-1px}
.msglist{margin-top:40px}

.personal{margin-top:50px;margin-left:40px}
.userinfo{padding:38px}
.userinfo header{font-size:18px;font-weight:500;color:#172533;padding-bottom:2rem;border-bottom:1px solid #ecf1f4}
.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:flex-start}
.userinfo li .xy-start img{width:40px;height:40px;margin-right:18px}
.info-item{margin-bottom:22px}
.info-item label{width:100px;text-align:right;vertical-align:middle;float:left;font-size:14px;color:#535d71;line-height:40px;padding:0 12px 0 0;-webkit-box-sizing:border-box;box-sizing:border-box}
.info-item .cont{margin-left:100px;line-height:40px;position:relative;font-size:14px}
.xy-between .bind,.xy-between .edit,.xy-between .logout{color:#fff;width:66px;height:38px;line-height:38px}
.xy-between .logout{background-color:#ff5f4f}
.xy-between .edit{background-color:#f6de00}
.xy-between .bind{background-color:#56c7df}

.zhonglantable th{text-align: center;}