
/* 瀑布流 */
.masonry { width:1280px;  margin:30px auto 30px;left: 0; right: 0; overflow: hidden;display: block;position: relative;}
/*自适应页面高度*/
body{
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}


.topb{position:fixed; bottom:100px; right:200px;font-size:18px; font-family:"Microsoft YaHei";background:url(../images_scwmw2023/top.png) no-repeat top center;background-size: contain; width:60px; height:60px; line-height:50px; cursor:pointer; display:none;z-index:999}

.wall-column {
  display: block;
  position: relative;
  width: calc(100%/4);
  float: left;
  padding: 0 12px;
  box-sizing: border-box;
}
@media (max-width: 640px) {
  .wall-column {
    width: calc(98vw/2);
    padding: 0 6px;
  }
}
@media (max-width: 480px) {
  .wall-column {
    width: calc(98vw/2);
    padding: 0 6px;
  }
}  

.waterfell {border: 1px solid #e5e5e5; margin: 5px 10px 30px 10px; break-inside: avoid;  height:auto;border-radius:8px;background:#f8f8f8; padding: 6px;}
      
.waterfell img { width:100%;}
      
.waterfell h2 { padding: 8px 0;}
      
.waterfell P { color: #555; text-align: center; line-height:36px;}
@media screen and (min-width: 1024px) and (max-width: 1439.98px) {
  .masonry {width: 98vw; }
}
@media screen and (min-width: 768px) and (max-width: 1023.98px) {
  .masonry { width: 98vw;} 
 }
@media screen and (max-width: 767.98px) {
  .masonry {width: 98vw;}
  .waterfell {border: 1px solid #e5e5e5;break-inside: avoid; margin: 0 auto 1rem;float: left; height:auto;border-radius:0.4rem;background:#f8f8f8;text-align: center;
  padding:0 0 6px 0;
  }
  .waterfell img { width:100%;}
}



.class-name { color: #666; font-size:1rem; line-height: 2rem; height:4rem;  display: flex;align-items: center;margin-top: 10px;}
.class-name p {
  height: 2.8rem;
  box-sizing: border-box;
  font-size: 1rem;
  color: #999;
  text-align: center;
  line-height: 2.8rem;
  float: left;
}
.class-name span:nth-of-type(1){margin: 0 10px;}
.class-name p a {color: #999; }
.class-name p a:hover{ color: #db0000;}
.class-name span a {color: #999; font-size:1rem; line-height:2.8rem;}
.class-name span a:hover{ color: #db0000;}


/*翻页*/
.page{margin:1rem 0 2.5rem 0.8rem; overflow:hidden; margin:0 auto;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
}
.page a{height:1.6rem; border:1px #bbb solid; float:left; margin-right:0.5rem; text-align:center; line-height:1.6rem; font-size:1rem;color:#666; padding:0 0.6rem; display:block;}
.page_s{border:1px #E0002B solid !important; color:#E0002B !important; cursor:default;}


/*内容页*/
.info-box{ overflow:hidden; margin:0 auto; max-width:1280px;width: 100%;flex: 1 1 auto;}




@media screen and (max-width: 1000px) {
  .class-name,
  .info-class,
  .columns,
  .footbox
  {
    display: none !important;
  }
  html{max-width: 100vh;}
  .page{margin: 1rem auto;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .topb{
    right: 5px;
  }

}
 

