.teaDetailsBox{
    position: absolute;
    width:100%;
    top: 1.6rem;
    left: 0;
    height: 6.5rem;
    font-size: 0;
}
.teaDetailsBox>.contentWidth{
    height: 6.5rem;
    background: #262626;
}
.teaDetailsLeft{
    width:10.4rem;
    height: 6.5rem;
   box-sizing: border-box;
    padding:.7rem 1rem 0 .9rem;
    font-size: .16rem;
    font-family: Source Han Sans CN;
    font-weight: 400;
    color: #999999;
}
.teaDetailsTop .t-d-t-l .t-d-t-l-name{
    font-size:.36rem;
    font-weight: bold;
    line-height: .36rem;
    color: #FFFFFF;
}
.teaDetailsTop .t-d-t-l .t-d-t-l-name span{
    font-size: .18rem;
    font-weight: 500;

}
.teaDetailsTop .t-d-t-l .info{
    padding:.07rem .2rem;
    background:#666666;
    margin-top: .2rem;
    color: #fff;
}
.teaDetailsTop .t-d-t-r{
    border: .01rem solid #999999;
    width:2rem;
    height: .44rem;
    display: inline-block;
    text-align: center;
    line-height: .44rem;

    color: #999999;
    opacity: 1;
}
.teaDetailsRight{
    width:4.8rem;
    height: 6.5rem;
}
.teaDetailsRight img{
    width:100%;
    height: 6.5rem;
    object-fit: cover;
}
.teaDetailsInfo{
    margin-top:.25rem
}
.teaDetailsInfo .title{
    font-size: .18rem;
    font-family: Source Han Sans CN;
    font-weight: bold;
    line-height: .18rem;
    color: #FFFFFF;
    opacity: 1;
}
.teaDetailsInfo .info{
    margin-top:.15rem;
}
.teaDetailsInfo .info span{

}
.caseBox{
    width:100%;
    margin-top:2.8rem;
    margin-bottom:.7rem;
}
.caseBox .caseTitle{
    width:100%;
    text-align: center;
    font-size: .4rem;
    font-family: Source Han Sans CN;
    font-weight: bold;
    line-height: .4rem;
    margin-bottom: .5rem;
    color: #262626;
}
.caseBox .caseTitle span{
    display: inline-block;
    width:6.3rem;
    height: 0.02rem;
    background:#262626;
}
.caseListBox{
    width:100%;

}
.caseItem{
    margin-top:.25rem;
    margin-right: .25rem;
    width:4.9rem;
    height: 4.1rem;
    font-size: 0;
}
.caseItem:nth-child(3n+3){
    margin-right: 0;
}
.caseItem .caseImg{
    width:100%;
    height: 3.2rem;
    position: relative;
}
.caseItem .caseImg img{
    width:100%;
    height: 3.2rem;
    object-fit: cover;
}
.caseItem .caseImg .caseHover{
    width: 100%;
    height: 100%;
    background:#000000;
    opacity: .6;
    position: absolute;
    top:0;
    left: 0;
    display: none;
}
.caseItem .caseItemContent{
    width:100%;
    height: .9rem;
    background: #F2F4F7;
    padding:.2rem;
    box-sizing: border-box;
}
.caseItem .caseItemContent .title{
    font-size: .18rem;
    font-family: Source Han Sans CN;
    font-weight: 500;
    margin-bottom:.12rem;
    color: #262626;
}
.caseItem .caseItemContent .info{
    font-size: .14rem;
    font-family: Source Han Sans CN;
    font-weight: 400;
    color: #999999;
}
.caseItem .caseItemContent .info span{
    border-right: .01rem solid #999999;
    padding-right: .15rem;
    margin-right: .15rem;
}
.caseItem .caseItemContent .info span:last-child{
    border-right: none;
}
.caseItem:hover{
    box-shadow: 0 .05rem .15rem rgba(0,0,0,0.3);
}
.caseItem:hover .caseImg .caseHover{
    display: block;
}
.caseItem:hover .caseItemContent{
    background: #262626;
}
.caseItem:hover .caseItemContent .title,.caseItem:hover .caseItemContent .info{
    color: #fff;
}
.caseItem:hover .caseItemContent .info span{
    border-right: .01rem solid #999999;
}
.caseItem:hover .caseItemContent .info span:last-child{
    border-right: none;
}