@media all{
    *{margin:0;padding:0;}
    a{text-decoration:none;}
    .banner{position:relative;box-sizing:border-box;background:#F6FAFD;padding:60px 0;}
    .banner::before{position:absolute;top:0;right:0;content:'';width:857px;height:327px;background:url('/uploads/page/product-install/banner_bg.webp') no-repeat;background-size:100% 100%;}
    .banner .content{position:relative;z-index:120;width:1080px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;}
    .banner .content .content-left{width:50%;}
    .banner .content .content-left .title{font-weight:700;font-size:35px;line-height:126.18%;color:#031F8D;}
    .banner .content .content-left .desc{font-weight:400;font-size:16px;line-height:150.68%;color:#080F30;opacity:0.6;margin:20px 0;}
    .banner .content .content-left .guide{font-weight:400;font-size:16px;line-height:149.18%;color:#4690E5;}
    .banner .content .content-left .video-btn{display:flex;justify-content:center;align-items:center;width:260px;box-sizing:border-box;border:1px solid #3D3D3D;border-radius:26px;padding:12px 0;margin-top:20px;cursor:pointer;}
    .banner .content .content-left .video-btn .btn-text{font-weight:500;font-size:20px;line-height:24px;text-align:center;color:#3D3D3D;margin-right:10px;}
    .banner .content .content-left .video-btn .btn-icon{width:25px;height:25px;background:url('/uploads/page/product-install/play_balck.svg') no-repeat;background-size:100% 100%;}
    .banner .content .content-left .video-btn:hover{background:#303030;}
    .banner .content .content-left .video-btn:hover .btn-text{color:#FFFFFF;}
    .banner .content .content-left .video-btn:hover .btn-icon{background:url('/uploads/page/product-install/play_white.svg') no-repeat;}
    .banner .content .content-right{width:40%;}
    .recommended{width:1080px;margin:100px auto;display:flex;flex-direction:column;align-items:center;}
    .recommended .title{width:70%;font-weight:700;font-size:35px;line-height:146.68%;text-align:center;color:#080F30;}
    .recommended .content{width:100%;margin-top:40px;}
    .recommended .content .combo-item{box-sizing:border-box;width:100%;border:1px solid #EBEBEB;border-radius:16px;display:flex;justify-content:space-between;align-items:flex-start;padding:40px;margin-bottom:30px;}
    .recommended .content .combo-item .item-left{width:30%;}
    .recommended .content .combo-item .item-left-name{font-weight:700;font-size:24px;line-height:125.4%;color:#1A1A1A;}
    .recommended .content .combo-item .item-left p{font-weight:400;font-size:16px;line-height:155.4%;color:#9497A4;margin-top:10px;}
    .recommended .content .combo-item .item-middle-name{font-weight:700;font-size:24px;line-height:125.4%;color:#1A1A1A;}
    .recommended .content .combo-item .item-middle p{font-weight:700;font-size:34.4px;line-height:125.4%;color:#EC8424;margin-top:10px;}
    .recommended .content .combo-item .item-right{width:30%;}
    .recommended .content .combo-item .item-right .add{width:100%;height:52px;background:#3AC0CB;border-radius:26px;display:flex;align-items:center;justify-content:center;margin-top:30px;}
    .recommended .content .combo-item .item-right .add span{font-weight:500;font-size:20px;line-height:24px;text-align:center;color:#FFFFFF;margin-left:10px;}
    .recommended .content .combo-item .item-right .add:hover{background:#1AA6B1;}
    .recommended .content .combo-item:hover{border:1px solid #3AC0CB;}
    .resources{width:1080px;margin:0 auto;display:flex;flex-direction:column;align-items:center;}
    .resources .title{width:70%;font-weight:700;font-size:35px;line-height:146.68%;text-align:center;}
    .resources .content{width:100%;display:flex;justify-content:space-between;margin-top:50px;}
    .resources .content .content-part{width:46%;}
    .resources .content .content-part .title{width:100%;display:flex;align-items:center;}
    .resources .content .content-part .title .title-text{font-weight:600;font-size:24px;line-height:146.68%;color:#080F30;margin-left:10px;}
    .resources .content .content-part ul{list-style:none;margin-top:20px;}
    .resources .content .content-part ul li{display:flex;margin-bottom:20px;}
    .resources .content .content-part ul li span{display:block;width:4px;height:4px;background-color:#3AC0CB;border:4px solid rgba(244, 252, 252, 0.79);border-radius:50%;margin:9px 10px 0 0;flex-shrink:0;}
    .resources .content .content-part ul li a{font-weight:400;font-size:18px;line-height:150%;color:#53576F;}
    .resources .content .content-part ul li a:hover{text-decoration:underline;}
    @media screen and (max-width: 768px){
        .banner::before{content:'';width:0;height:0;background:none;}
        .banner .content{width:90%;flex-flow:column-reverse nowrap;}
        .banner .content .content-left{width:100%;margin-top:40px;display:flex;flex-direction:column;align-items:center;}
        .banner .content .content-left .title{font-size:28px;text-align:center;}
        .banner .content .content-left .desc{width:80%;text-align:center;}
        .banner .content .content-left .guide{text-align:center;}
        .banner .content .content-right{width:100%;display:flex;justify-content:center;}
        .recommended{width:100%;margin:80px auto;}
        .recommended .title{width:80%;font-size:24px;}
        .recommended .content{width:90%;margin-top:40px;}
        .recommended .content .combo-item{border:none;box-shadow:0px 8px 36px rgba(81, 27, 103, 0.16);border-radius:6px;flex-direction:column;}
        .recommended .content .combo-item .item-left{width:100%;}
        .recommended .content .combo-item .item-left .item-left-name{text-align:center;}
        .recommended .content .combo-item .item-left p{font-size:14px;text-align:center;}
        .recommended .content .combo-item .item-middle{width:100%;margin:20px 0;}
        .recommended .content .combo-item .item-middle .item-middle-name{text-align:center;}
        .recommended .content .combo-item .item-middle p{font-size:40px;text-align:center;}
        .recommended .content .combo-item .item-right{width:100%;}
        .recommended .content .combo-item:hover{border:none;}
        .resources{width:100%;}
        .resources .title{font-size:24px;}
        .resources .content{width:100%;display:flex;flex-direction:column;justify-content:space-between;align-items:center;margin-top:20px;}
        .resources .content .content-part{width:90%;margin-top:40px;}
        .resources .content .content-part ul li{margin-bottom:20px;}
    }
}