@charset "UTF-8";

.bannerwrap {
    height: 500px;
}

.bannerwrap .slideritem li.li0 {
    background: url(../../statics/images/product/img/banner2.png) no-repeat center center #000815;
}

.apimarket-content .hot-Box {
    display: flex;
    justify-content: center;
    margin-top: 77px;
}

.apimarket-content .hot-Box li {
    width: 290px;
    height: 390px;
    text-align: center;
    margin-right: 20px;
    background: #FFFFFF;
}

.apimarket-content .hot-Box li:last-of-type {
    margin-right: 0;
}

.apimarket-content .hot-Box li img {
    width: 204px;
    height: 227px;
}

.apimarket-content .hot-Box li p {
    height: 16px;
    font-size: 16px;
    font-family: PingFangSC-Light, PingFang SC;
    font-weight: 300;
    color: #666666;
    line-height: 16px;
    margin-top: 15px;
}

.apimarket-content .hot-Box li p.title {
    height: 22px;
    font-size: 22px;
    font-weight: 500;
    color: #333333;
    line-height: 22px;
    margin-top: 20px;
}

.apimarket-content .hot-Box li p.fav-box {
    height: 14px;
    font-size: 14px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #666666;
    line-height: 14px;
}

.apimarket-content .hot-Box li p.fav-box .stars {
    width: 12px;
    height: 12px;
    display: inline-block;
    background: url("../../statics/images/product/apimarket/stars.png") 0 0 /12px 12px no-repeat;
}

.apimarket-content .function-item3{
    justify-content: space-between;
}

.apimarket-content .scene-Box {
    display: flex;
    justify-content: center;
    margin-top: 127px;
}

.apimarket-content .scene-Box li {
    text-align: center;
    margin-right: 180px;
    position: relative;
}

.apimarket-content .scene-Box li:last-of-type {
    margin-right: 0;
}

.apimarket-content .scene-Box li img {
    width: 120px;
    height: 120px;
}

.apimarket-content .scene-Box li p {
    height: 22px;
    font-size: 22px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #333333;
    line-height: 22px;
    margin-top: 30px;
}

.apimarket-content .scene-Box li .limask {
    position: absolute;
    width: 280px;
    height: 302px;
    top: -55px;
    left: -82px;
    opacity: 0;
    transition: all 0.5s;
}

.apimarket-content .scene-Box li .limask .limaskinner {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #000000;
    opacity: 0.6;
}

.apimarket-content .scene-Box li:hover .limask {
    opacity: 1;
}

.apimarket-content .scene-Box li .limask .comingSoon {
    font-size: 32px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #FFFFFF;
    line-height: 42px;
    position: absolute;
    top: 118px;
    left: 77px;
}