.mui-single-certificate{
    position: relative;
    border: 1px solid $line-color;
    .status-box{
        position: absolute;
        top: 1.4rem;
        left: .20rem;
        z-index: 10;
        background-color: #fde53d;
        border-radius: 2px;
        font-size: .20rem;
        color: $title-color;
        padding: .05rem 0.1rem;
    }
    .box-img{
        height: 2.0rem;
        width: 100%;
        overflow: hidden;
        img{
            height: 100%;
            width: 100%;
            object-fit: cover;
        }
    }
    .box-info{
        .name{
            font-size: $title-size;
            color: $title-color;
        }
        .source{
            font-size: $info-size;
            color: $info-color;
            padding-top: .10rem;
        }
        .btn-box{
            .btn{
                width: 50%;
                text-align: center;
                color: $primary-color;
                font-size: .24rem;
                padding: .10rem 0;
                .iconfont{
                    display: inline-block;
                    font-weight: normal;
                    font-size: .30rem;
                    padding-right: .05rem;
                }
                &:first-child{
                    border-top: 1px solid $line-color;
                    border-right: 1px solid $line-color;
                }
                &:last-child{
                    border-top: 1px solid $line-color;
                }
            }
        }
    }
    .mask-box{
        position: fixed;
        width: 100%;
        height: 100%;
        overflow: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        top: 0;
        left: 0;
        z-index: 99;
        .mask-i{
            position: absolute;
            width: 100%;
            height: 100%;
            background:rgba(0, 0, 0, 0.5)
        }
        img{
            width: 80%;
            position: relative;
            z-index: 1;
        }
    }
}