/* 手机端不显示 */
 @media (min-width: 1200px) {
      .d-none-sj {
           display: block !important;
      }
 }

 .d-none-sj {
      display: none;
 }

 /* 手机端30%不显示 */
 @media (min-width: 1200px) {
      .left-list {
           display: block !important;
      }
 }

 .left-list {
      display: none;

 }

 /* 横向排列 */
 .d-flex {
      display: -webkit-box;
      /* 老式WebKit */
      display: -moz-box;
      /* 老式Firefox */
      display: -ms-flexbox;
      /* 旧版IE */
      display: -webkit-flex;
      /* 新版WebKit */
      display: -ms-flexbox !important;
      display: -webkit-flex !important;
      display: flex !important;
 }

 .justify-content-between {
      justify-content: space-between;
      /* 当前所有浏览器 */
      -webkit-box-pack: justify;
      /* 老式WebKit */
      -moz-box-pack: justify;
      /* 老式Firefox */
      -ms-flex-pack: justify;
      /* 旧版IE */
      -webkit-justify-content: space-between;
      /* 新版WebKit, Opera 12.1 - 12.5 */
      justify-content: space-between;
      /* 当前所有浏览器 */
 }

 .align-items-center {
      -webkit-box-align: center;
      /* 旧版 WebKit */
      -ms-flex-align: center;
      /* IE10 */
      align-items: center;
      /* 标准写法 */
 }

 /* 系统色 */
 .xts-bg-color {
      background-color: #72af30;
 }

 .xts-text-color {
      color: #72af30;
 }

 /* -----------------------------------------------样式开始 */
 .list-all {
      padding: 20px 0;
 }
/* 左侧列表 */
 .left-list {
      width: 25%;

 }

 .left-list .list-group {
      box-sizing: border-box;
      border: 1px solid #f9f9f9;
 }

 .left-list .list-group a {
      display: block;
      width: 100%;
      height: 50px;
      color: #111;
      border: 1px solid #f9f9f9;
      box-sizing: border-box;
      padding: 0 10px !important;
      font-size: 15px;
     

 }

 .left-list .list-group a:hover {
      background-color: #f8f8f8;
 }
.left-list .list-group .tit{display: block; width: 90%; white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;}
 .left-list .list-group i {display: block; width: 10%;}

 .left-list .leader {
      width: 100%;
      height: 50px;
      line-height: 50px;
      font-size: 20px;
      color: #fff;
 }

 .left-list .active {
      color: #72af30 !important;
 }
 .left-list .list-img-list{
     flex-wrap: wrap;
 }
.left-list .list-group-img a{
     position: relative;
     width: 46%;
     margin: 2%;
 }

.left-list .list-group-img a img{
     width: 130px;
     height: 130px;
     margin: auto;
     background-color: beige;
}
.left-list .list-group-img a .tit{
     position: absolute;
     text-align: center;
      width: 130px;
     height: 130px;
     opacity: 0;
     box-sizing: border-box;
     padding: 10px;
     overflow: hidden;
}
.left-list .list-group-img a:hover .tit{
     opacity: 1;
      background-color: rgba(27, 50, 2, 0.5);
      color: #fff;
}




/* 右侧列表 */

 
 .right-list {
      width: 100%;

 }
 /* 手机右侧100% */
 @media (min-width: 1200px) {
      .right-list {
         width: 75%;
      }
      .right-list .list-img{
          width: 100%;
      flex-wrap: wrap;
 }
 .right-list .list-img .item{
     width:33.3%;
     text-align: right;
 }
 .right-list .list-img .item img{
     width: 255px;
     height: 255px;
     background-color: #72af30;
     margin: auto;
 }
 .right-list .list-img .item img {
    transition: transform 0.5s ease; /* 平滑过渡效果 */
}
 .right-list .list-img .item img:hover {
    transform: scale(1.1); /* 放大到110% */
}
 .right-list .list-img .item .info{
     width: 255px;
     height: 50px;
     margin-left: auto;
     text-align: center;
     line-height: 50px;
     font-size: 16px;
     color: #111;
     box-sizing: border-box;
     white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;


 }
 }
 @media (min-width: 961px) and (max-width:1200px){
     .right-list {
      width: 100%;
     

 }
      .right-list .list-img{
          width: 100%;
      flex-wrap: wrap;
      text-align: center;
 }
 .right-list .list-img .item{
     width:33.3%;
     margin-bottom: 20px;
 }
 .right-list .list-img .item img{
     width: 255px;
     height: 255px;
     background-color: #72af30;
     margin: auto;
 }
 .right-list .list-img .item img {
    transition: transform 0.5s ease; /* 平滑过渡效果 */
}
 .right-list .list-img .item img:hover {
    transform: scale(1.1); /* 放大到110% */
}
 .right-list .list-img .item .info{
     width: 255px;
     margin: auto;
     height: 50px;
     text-align: center;
     line-height: 50px;
     font-size: 16px;
     color: #111;
     box-sizing: border-box;
     white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;

 }
 }

 @media (min-width: 720px) and (max-width:960px){
     .right-list {
      width: 100%;
      text-align: center;
      

 }
      .right-list .list-img{
          width: 100%;
      flex-wrap: wrap;
     
      
 }
 .right-list .list-img .item{
     width:48%;
     margin: 1%;
 }
 .right-list .list-img .item img{
     width: 255px;
     height: 255px;
     background-color: #72af30;
     margin: auto;
 }
 .right-list .list-img .item img {
    transition: transform 0.5s ease; /* 平滑过渡效果 */
}
 .right-list .list-img .item img:hover {
    transform: scale(1.1); /* 放大到110% */
}
 .right-list .list-img .item .info{
     width: 255px;
     margin: auto;
     height: 50px;
     text-align: center;
     line-height: 50px;
     font-size: 16px;
     color: #111;
     box-sizing: border-box;
     white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;

 }
 }
 @media (max-width:719px){
     .right-list {
      width: 100%;

 }
      .right-list .list-img{
          width: 100%;
      flex-wrap: wrap;
 }
 .right-list .list-img .item{
     width:100%;
     margin-bottom: 20px;
 }
 .right-list .list-img .item img{
     width: 255px;
     height: 255px;
     background-color: #72af30;
     margin: auto;
 }
.right-list .list-img .item .info{
     width: 255px;
     margin: auto;
     height: 50px;
     text-align: center;
     line-height: 50px;
     font-size: 16px;
     color: #111;
     box-sizing: border-box;
     white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;

 }
 }

  /* 分页 */
  .page-page{
     width: 100%;
     -webkit-justify-content: center; /* Safari 6.1+ */
    -ms-flex-pack: center;    /* IE 10 */
     justify-content: center;
     margin: 20px auto;
  }
  .page-page a{
     width: 30px;
     height: 30px;
     line-height: 30px;
     border: 1px solid #ccc;
     margin: 10px;
     color: #ccc;
  }
  .page-page a:hover{
     border: 1px solid #72af30;
     color: #72af30;
  }