body{
}

.movie-hero{
    height:3.3rem;
    border-radius:0.12rem;
    overflow:hidden;
	width: 95%;
	margin: 0 auto;
}
.movie-hero .swiper-container,
.movie-hero .swiper-container a,
.movie-hero .swiper-container a img{
    height:3.3rem;
}
.movie-hero .swiper-container a:after{
    content:'';
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:1.1rem;
    background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(11,15,22,.68) 100%);
}
.movie-hero .title{
    position:absolute;
    left:.24rem;
    right:.24rem;
    bottom:.2rem;
    z-index:1;
    line-height:.44rem;
    font-size:.3rem;
    color:#fff;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.movie-page{
    margin-top:0.12rem;
}
.movie-page-inner{
    position:relative;
    margin:0 .18rem .24rem;
    padding:.22rem .16rem .08rem;
    background:#fff;
    border:1px solid #eceef2;
    border-radius:.16rem;
}
.movie-page-head{
    padding:0 .08rem .14rem;
    border-bottom:1px solid #f0f2f5;
}
.page-title{
    line-height:.46rem;
    font-size:.36rem;
    color:#1f2430;
    font-weight:700;
}
.page-sub{
    margin-top:.06rem;
    line-height:.34rem;
    font-size:.22rem;
    color:#8a93a3;
}

.movie-tab-nav{
    display:flex;
    overflow-x:auto;
    white-space:nowrap;
    -webkit-overflow-scrolling:touch;
    padding:.16rem .08rem .02rem;
    margin:0;
}
.movie-tab-nav span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:.56rem;
    margin:0 .12rem .12rem 0;
    padding:0 .18rem;
    background:#f5f6f8;
    border:1px solid #e7eaf0;
    border-radius:.08rem;
    font-size:.24rem;
    color:#4b5567;
}
.movie-tab-nav span.active{
    color:#e15a2b;
    border-color:#f0b59a;
    background:#fff7f2;
    font-weight:700;
}
.movie-tab-nav span a{
    color:inherit;
}

.clean-movie-grid{
    padding:.08rem .06rem 0;
}
.clean-movie-grid li{
    width:33.333%;
    padding:0 .06rem;
    box-sizing:border-box;
    margin-bottom:.24rem;
}
.clean-movie-grid .item-inner{
    width:100%;
    max-width:none;
    margin:0 auto;
}
.clean-movie-grid .pic{
    position:relative;
    height:2.92rem;
    background:#e7ebf1;
    border-radius:.08rem;
    overflow:hidden;
}
.clean-movie-grid img{
    width:100%;
    height:2.92rem;
    display:block;
    object-fit:cover;
    border-radius:.08rem;
}
.clean-movie-grid .pic:after{
    content:'';
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:.72rem;
    background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(10,13,18,.62) 100%);
    pointer-events:none;
}
.clean-movie-grid .absInfo{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    z-index:1;
    height:.5rem;
    line-height:.5rem;
    padding:0 .12rem;
    text-align:right;
    font-size:.2rem;
    color:#fff;
    background:none;
}
.clean-movie-grid .title{
    display:block;
    margin-top:.12rem;
    line-height:.36rem;
    height:.36rem;
    font-size:.26rem;
    color:#1f2430;
    font-weight:700;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}
.clean-movie-grid .meta{
    margin-top:.04rem;
    line-height:.3rem;
    font-size:.2rem;
    color:#8a93a3;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.clean-movie-grid .info{
    display:block;
}
.clean-movie-grid .desc{
    margin-top:.08rem;
    line-height:.32rem;
    height:.64rem;
    overflow:hidden;
    font-size:.22rem;
    color:#667181;
}

.movie-loadmore{
    margin:.04rem .08rem .2rem;
    background:#f5f6f8;
    border:1px solid #eceef2;
    color:#7b8595;
}

.tv-page .clean-movie-grid li{
    width:50%;
}
.tv-page .clean-movie-grid .item-inner{
    width:100%;
}
.tv-page .clean-movie-grid .pic,
.tv-page .clean-movie-grid img{
    height:4.42rem;
}

@media only screen and (max-width:376px){
    .movie-page-inner{margin:0 .14rem .2rem;padding:.2rem .12rem .06rem;}
    .clean-movie-grid{padding:.08rem .04rem 0;}
    .clean-movie-grid li{padding:0 .04rem;}
    .clean-movie-grid .item-inner{width:100%;}
    .clean-movie-grid img,
    .clean-movie-grid .pic{height:2.76rem;}
    .movie-tab-nav span{height:.52rem;padding:0 .16rem;font-size:.23rem;}
    .tv-page .clean-movie-grid img,
    .tv-page .clean-movie-grid .pic{height:4.04rem;}
}
