.banner img{width: 100%;}
.tac {text-align: center;}
.cursor{cursor: pointer;}
*{box-sizing: border-box !important;}
body{line-height: 1;width: 100%;overflow-x: hidden;font-size: .2rem;background-color: #f2f6fc;}

.flex {display: flex;}
.flex-item{display: flex;align-items: center;}
.flex-center{display: flex;align-items: center;justify-content: center;}
.flex-wrap{display: flex;flex-wrap: wrap;}

.layui-nav-bar {opacity: 0 !important;}
.layui-icon-search{position: absolute;left: .15rem; z-index: 999;}
.layui-nav *{font-size: .2rem;}
.layui-nav.layui-nav-tree{width: 18%;}
.layui-nav {background: #fff; margin-top: .75rem; width: 18%; }
.layui-nav a{color: #333 !important;}
.layui-form{width: 100%;}
.layui-input{background-color: #f7f8fa;width: 100%;padding-left: .4rem;}
.layui-input-group>.layui-input-prefix{ background: transparent !important;border: none; position: absolute;  z-index: 10;   width: .4rem; height: .4rem;}
.layui-input-group>.layui-input-suffix{width: 1rem;}
.layui-tabs{background-color: #fff;}
.layui-nav-tree .layui-nav-child{background-color: transparent;}
.layui-nav-tree .layui-nav-item a{height: .7rem;border-bottom: .01rem solid #f5f6f7;padding-top:0;padding-bottom: 0;line-height: .7rem;}
.layui-nav-tree .layui-nav-item dd a{height: .5rem;line-height: .5rem;}
.layui-nav.layui-nav-tree{padding: .2rem .3rem;}
.layui-nav-tree .layui-nav-child dd{ border-radius: .12rem;}
.layui-nav-tree .layui-this>a,.layui-nav-tree .layui-this>a:hover {background-color: #199fff !important;border-radius: .12rem !important; color: #fff !important;}
.layui-nav .layui-nav-child a:hover {background-color: #1f29371a !important;border-radius: .12rem;}
.layui-input:focus{border-color: transparent !important;box-shadow: unset !important;}

.w-13{width: 18%;}
.w-87{width: 82%;}
.left-box {width: 18%; background-color: #fff;}
.left-box .logo{width: 18%; padding-top: .2rem;position: fixed;top: 0; left: 0;background-color: #fff;z-index: 999;}
.left-box .logo-img{ width: 2rem;}
.right-box {  width: 100%;height: 100%;}
.right-box .search-box{padding: .15rem;background-color: #fff;}
.search-box  .nav-icon{display: none;}
.fixed-box{position: sticky;top: 0;z-index: 9999;}
.content-box {padding: .3rem 0rem .3rem .3rem;box-sizing: border-box;}
.content-box .box{ min-height: 3.5rem; overflow: hidden; border-radius: .12rem; background: #fff;margin-right: .3rem;margin-bottom: .2rem;}
.content-box .box img{width: 100%;height: 2.16rem;border-radius: .12rem .12rem 0rem 0rem;}
.content-box .box .text{padding: .13333rem .26667rem .26667rem;}
.content-box .box .text p{height: .41rem; overflow : hidden;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;line-height: .21rem;display: -webkit-box;font-size: .18rem;color: #666;}
.content-box .box .text p:last-child{ font-size: .22rem;color: #333;margin-top: .1rem;}
.content-box .box:hover{box-shadow: rgba(0, 0, 0, 0.06) 0px 0.2rem 0.4rem;  transform: translate3d(0px, -0.02667rem, 0px);}


.details-box {width: 40%;margin: .3rem auto;}
.details-box .img{width: 40% !important;}



@media screen and (max-width: 768px){
  .layui-nav .layui-nav-child a:hover{background-color: transparent !important;}
  .details-box {width: 90%;margin: .3rem auto;}
  body{font-size: .24rem;}
  .w-87 {width: 100%;}
  .layui-input{padding-left: .5rem;}
  .content-box .box{margin-right: .2rem; width: 3.35rem; height: 3.5rem;}
  .content-box .box .text p:last-child{line-height: .25rem;height: .46rem;}
  .search-box  .nav-icon{width: .65rem;text-align: center;}
  .hide-xs, .left-box{opacity: 0;font-size: 0;width: 0;position: absolute;margin-left: -3rem;}
  .xs-block{ opacity: 1; width: 100% !important;height: 100% !important;background-color: rgba(0, 0, 0, 0.3);position: fixed;top: 0;left: 0;z-index: 99999;margin-left: 0rem;}
  .xs-block .layui-nav.layui-nav-tree{transition: all 0.5s ease;width: 5rem;}
  .xs-block .left-box{transition: all 0.5s ease; opacity: 1;width: 3.2rem;margin-left: 0rem;}
  .xs-block .left-box .logo{transition: all 0.5s ease;width: 5rem;}
  .xs-block .shade-close{ width: 100%;height: 100%;position: fixed !important;top: 0;z-index: 99; margin-left: 0rem; opacity: 1; }
}

@media screen and (min-width: 1024px){

}