*{margin:0;padding:0;box-sizing:border-box;}
html{font-size:3.8vw;color:#333;}
h2,h3,h4,h5,h6{margin:0;}
img{max-width:100%}
body {
  margin: 0;
  font: 300 1em/1.8 PingFang SC, Lantinghei SC, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans;
}
html,body,.main{width:100%;overflow-x:hidden;}
a{color:#333;text-decoration:none;}

.container{padding-top:3.6rem;overflow:hidden;min-height:calc(100vh - 4.4rem);}
.back{position:absolute;width:100%;height:3.6rem;top:0;left:0;line-height:3.6rem;background:#fff;z-index:9;}/* position:fixed;返回如要悬停用fixed */
.back a{margin-left:1rem;}
.grid{padding:0 .5rem}
.col-1{width:47%;float:left;margin:0 1.5% 1rem;position: relative;}
.playlet--wrap{position:relative;}
.playlet--wrap img{border-radius:.4rem;display:block;height:80vw;object-fit:cover;}
.playlet--info{position:absolute;bottom:0;left:0;padding:1.8rem .8rem .6rem;border-radius:.4rem;width:100%;}
.playlet--info a{color:#fff;text-decoration:none;line-height:1.2;display:block;}
.playlet--name,.playlet--tag{margin-bottom:.4rem;}
.playlet--tag a{font-size:.94rem;color: rgba(255, 255, 255, 0.5)}
.footer{
  background-color: #444444;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 4.4rem;
}
.footer .footer__inner{
  color: #ffffff;
  font-size: 1rem;
}


@media screen and (min-width: 480px) {
    html{font-size:16px;}
    .col-1{width:30%;float:left;margin:0 1.5% 1rem;position: relative;}
    .playlet--wrap img{border-radius:.4rem;display:block;height:51.8vw;object-fit:cover;}


}
@media screen and (min-width: 680px) {
    html{font-size:20px;}
    .col-1{width:22%;float:left;margin:0 1.5% 1rem;position: relative;}
    .playlet--wrap img{border-radius:.4rem;display:block;height:38.3vw;object-fit:cover;}

}