.product-app-monitor .banner-g {
    background: #041C38 url("../image/product/app-monitor/banner-bg.jpg") no-repeat center center;
}

.product-site-monitor .banner-g {
    background: #030408 url("../image/product/site-monitor/banner-bg.jpg") no-repeat center center;
}

.product-asset-mapping .banner-g {
    background: #B1B2B6 url("../image/product/asset-mapping/banner-bg.jpg") no-repeat center center;
}

.product-ops-panel .banner-g {
    background: #4160d4 url("../image/product/ops-panel/banner-bg.jpg") no-repeat center center;
}

.product-ipv6 .banner-g {
    background: #010101 url("../image/product/ipv6/banner-bg.jpg") no-repeat center center;
}

.advance .grid {
    display: grid;
    grid-template-columns: repeat(4, auto);
    grid-gap: 0 24px;
}

.advance .item {
    padding: 24px;
    border-radius: 8px;
    border-color: transparent;
    border-width: 1px;
    border-style: solid;
}

.advance .item:hover {
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
    border-color: #EEEEEE;
}

.advance .yzm-icon,
.advance .iconfont {
    font-size: 64px;
}

.advance .title {
    font-size: 18px;
    margin-top: 24px;
    font-weight: 600;
}

.advance .item:hover .yzm-icon,
.advance .item:hover .iconfont,
.advance .item:hover .title {
    color: #234BED;
}

.advance .desc {
    margin-top: 24px;
    line-height: 24px;
    color: #666666;
}

.function .grid {
    display: grid;
    grid-template-columns: repeat(2, auto);
    grid-gap: 24px;
}

.function .item {
    padding: 24px;
    border-radius: 8px;
    border-color: #EEEEEE;
    border-width: 1px;
    border-style: solid;
    background: #FFFFFF;
    display: flex;
    align-items: flex-start;
}

.function .item:hover {
    background: url("../image/product/function-bg.png") no-repeat center right;
}

.function .yzm-icon,
.function .iconfont {
    font-size: 64px;
}

.function .right {
    width: 0;
    flex-grow: 1;
    margin-left: 24px;
}

.function .title {
    font-size: 18px;
    font-weight: 600;
}

.function .item:hover .yzm-icon,
.function .item:hover .iconfont,
.function .item:hover .title {
    color: #234BED;
}

.function .desc {
    margin-top: 12px;
    line-height: 24px;
    color: #666666;
}

.scene .tab-panel-g {
    border: 1px solid #EEEEEE;
    margin-top: 24px;
    padding: 64px 40px;
    display: flex;
    align-items: flex-start;
    border-radius: 8px;
}

.scene .left {
    width: 0;
    flex-grow: 1;
    margin-right: 40px;
}

.scene .title {
    font-size: 24px;
    font-weight: 600;
}

.scene .desc {
    margin-top: 24px;
    line-height: 24px;
    color: #666666;
}