@charset "utf-8";
/*====轮播图===*/
.banner{width: 100%;height: 488px;background:url(/public/images/banner_bg.png) center; background-size: cover;position: relative;}
.banner img{width: 100%;position: relative;}
/*热门推荐*/
.index_contain{
    padding: 0 4.5% 20px;
    background-color: #fff;
}
.index_contain h1{ text-align: center; color: #303133; font-size: 14px; font-weight: 600; height: 58px;line-height: 58px;}
.index_contain h1 .more{font-weight: normal;margin-left: 20px; color: #536574;}
/*作品图列表*/
/*.hot ul{ display: flex; justify-content: space-between;flex-wrap:wrap;}*/
.hot li{
    background: #FFFFFF; 
    border-radius: 4px;
    /*border: 1px solid #DCDFE6;*/
    width:calc((100% - 16px*3) / 4);
    margin-bottom: 24px; 
    float: left; 
    margin-right: 16px;
    /*width: calc((100% - 48px)/5);*/
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-shadow:0px 6px 5px -5px rgb(0 0 0 / 11%);
            box-shadow:0px 6px 5px -5px rgb(0 0 0 / 11%);
    padding-bottom: 5px;
}
.hot li:nth-child(4n){margin-right: 0;}
.hot li .works_img{
    width:100%; 
    height: 233px; 
    /* margin-bottom: 10px; */
    height: calc(((100vw - 20px) * 91 / 100 - 80px) / 4 / 1.12);
}
.hot li .works_img img{ 
    width: 100%; 
    height: 100%;
    max-height: 100%;}
.hot li .works_con,.hot li .works_like{
    padding: 8px 0;
    /* line-height: 40px; */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.hot li .works_like{
    color: #606266;
    padding-top: 0 !important;
}
.hot li .works_like a{
    color: #606266;
}
.hot li .works_like a:hover{
    color: #606266;
}

.hot li .works_like .works_down{
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    /* margin-right: 18px; */
}
.hot li .works_like .works_down .headimg{width: 28px;height: 28px;border-radius: 50%; margin-right: 6px;}
.hot li .works_con .works_name{
    /* display:inline-block;
    width:135px; */
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    margin-right: 10px;
    margin-left:6px;
    -o-text-overflow:ellipsis;
       text-overflow:ellipsis; 
    white-space:nowrap; 
    overflow:hidden;
}
.hot li .works_con .works_name,.hot li .works_con .works_num{ color: #303133; font-size: 16px;}
.hot li .works_con .charging_mode{
    border-width: 1px; 
    border-style: solid;  
    padding: 2px 2px; 
    border-radius: 6px; 
    font-size: 10px;
    display:inline-block;
    height:15px; 
    line-height:17px;
}
.hot li .works_con .charging_mode.charging_mode_pay{
    /* margin-top: 8px; */
    border-color: #FFDD8D; 
    background-color: #FFFDF7; 
    color: #ECBB49; 
}
.hot li .works_con .charging_mode.charging_mode_free{ 
    border-color: #C5E3B5; 
    background-color: #F7FFF2; 
    color: #7CBB58;
}
.works_btn .collectionbtn,.works_like .works_btn .downbtn a{cursor: pointer; color: #5294F9}
.works_btn strong {
    margin-left: 18px;
}
.works_btn .collectionbtn i,.works_btn .downbtn i,.details_downbtn .collectionbtn i,.details_downbtn .downbtn i{ margin-right: 4px;}

.works_btn .downbtn a{color: #909399;}
/*个人工作页*/
.workspage_info{ padding: 24px 0;}
.workspage_info .works_headimg{ margin-right: 32px; }
.workspage_info .works_headimg img{width: 94px; height: 94px; border-radius: 50%;}
.workspage_info .works_con{width: calc(100% - 126px);}
.workspage_info .works_con .name{ line-height: 38px; font-size: 30px; color: #303133;}
.workspage_info .works_con .autograph{ color: #606266;}
.workspage_info .works_con .works{color: #303133;line-height: 38px;}
/*3D模型页*/
.model_contain{
    box-sizing: border-box;
    min-height: calc(100vh - 259px);
    padding: 0 5% 20px; 
    -webkit-box-shadow: 0px 0px 0px 1px #ECEEF0; 
    box-shadow: 0px 0px 0px 1px #ECEEF0; 
}
.s-3d_main .hot li .works_img {
    height: calc(((100vw - 20px) * 90 / 100 - 80px) / 4 / 1.12);
}
.crumbs_nav{ height: 60px;}
.crumbs_nav .current{ font-size: 12px; line-height: 60px;}
.crumbs_nav .current a{ color: #909399;}
.search{position: relative; width: 45%; float: right; height: 32px; margin-top: 14px;}
.search .searchinput{width:100%; border-radius: 2px; border: 1px solid #DCDFE6;}
.search .searchbtn{position: absolute;right: 0; top:1px; width: 78px; height: 30px; line-height: 32px; color: #fff; font-size: 16px; background-color: #5294F9;text-align: center;}
.search .searchbtn:hover{ cursor: pointer;opacity: 0.9;}
.search .searchbtn img{width: 16px; height: 16px; margin: -2px 5px 0 0;}
/*筛选*/
.screen .screen_con{ background-color: #F9FAFB;}
.select-list{padding: 0 20px;}
.select-list dl{ border-bottom: 1px solid #EBEEF5;margin-right: -20px;}
.select-list:last-child dl{border-bottom: none;}
.select-list dt{ color: #303133; margin-right: 15px;}
.select-list dt,.select-list dd{float: left; height: 40px;line-height: 40px;}
.select-list dd a{padding: 2px 10px; margin-right:12px; color: #909399;}
.select-list dd:hover a,.select-list dd.selected a{ background-color: #5294F9; border-radius: 14px;color: #fff; }
.select-list .select-scale-main{float: left;}
.select-list .select-scale input{width: 160px; height: 25px; padding-left: 8px;}
.select-list .select-scale-btn{ background-color: #5294F9; border-radius: 2px;color: #fff; width: 50px;float: left; width: 50px; text-align: center;margin-top: 8px;height: 25px; line-height: 25px;margin-left: 16px;}
.select-list .select-scale-btn a{color: #fff;}
.sort li{ float: left; height: 46px;line-height: 46px; margin-top: 10px; margin-bottom: 10px; color: #606266;}
.sort .sort_li{ margin-left: 20px; margin-right: 10px; position: relative;}
.sort .sort_li:first-child{margin-left: 0;}
.sort .sort_li .borright{border-right: 1px solid #F0F2F5;width:1px;height:15px;position: absolute; top:15px;right: -10px;}
.sort .sort_li a{padding: 2px 10px; margin-right: 3px; border: 1px solid transparent;}
.sort .sort_li a:hover,.sort .sort_li a.selected{ background-color: #F3F8FF; border-radius: 14px; border: 1px solid #B6D3FF; color: #257CFF; }
.model_contain .addmore{width: 118px; height: 32px;line-height: 32px;background-color: #FFFFFF;border-radius: 2px; border: 1px solid #5294F9; color: #5294F9; text-align: center; margin:20px auto; -webkit-box-shadow: 0px 0px 1px 0px #5294F9; box-shadow: 0px 0px 1px 0px #5294F9; cursor: pointer}
.model_contain .addmore.s-off{
    border-color:#DCDFE6;
    color:#DCDFE6;
    -webkit-box-shadow:0px 0px 1px 0px #DCDFE6;
            box-shadow:0px 0px 1px 0px #DCDFE6
}

/*====案例详情页====*/
.details_contain{ width: 1185px; margin: 0 auto 20px;}
.details_imgs{width: 797px; height: 722px; background-color: #fff;position: relative; }
.details_right .details_down,.details_right .details_con,.details_right .details_user{width: 316px; background-color: #fff; margin-bottom: 16px; padding: 24px;}
.details_right .details_down{ height: 127px;}
.details_down .pay_type{font-size: 21px;color: #606266; font-weight: 500; margin-bottom: 10px;}
.details_downbtn .downbtn{ display:inline-block;width: 187px;height: 56px;background: #5294F9;border-radius: 2px; color: #fff; font-size: 18px; text-align: center;line-height: 56px; cursor: pointer;}
.details_downbtn .collectionbtn{display:inline-block;width: 106px;height: 56px;background: #FFFFFF;border-radius: 2px; border: 1px solid #DCDFE6;font-size: 18px;text-align: center;line-height: 56px; color: #606266; margin-left: 16px; cursor: pointer;}
.details_downbtn .downbtn img,.details_downbtn .collectionbtn img{width: 18px;height: 18px; margin-right: 6px;}
.details_down .details_downbotm{ line-height: 25px; margin-top: 10px;}
.details_down .details_downbotm .recharge_btn{position: relative; margin-right: 30px;cursor: pointer;}
.details_down .details_downbotm .recharge_btn i,.details_down .details_downbotm .banquan_btn i{ margin-right: 2px;}
.details_down .details_downbotm .banquan_btn{cursor: pointer; color: #909399;}
.details_down .details_downbotm .recharge_btn:hover,.details_down .details_downbotm .banquan_btn:hover{color: #5294F9;}
.details_down .details_downbotm .banquan_con{position:absolute;width: 391px;background: rgba(0, 0, 0, 0.85);border-radius: 4px;border: 1px solid #979797; color: #fff; padding-top:26px;padding-bottom:15px;display: none;}
.details_down .details_downbotm .banquan_con p{line-height: 24px; width: 92%; margin: 0 auto; margin-bottom: 10px;}
.details_down .details_downbotm .discount{ display: inline-block;width: 32px;height: 18px; line-height:18px;background: -o-linear-gradient(333deg, #F5A623 0%, #E54C4A 100%);background: linear-gradient(117deg, #F5A623 0%, #E54C4A 100%);border-radius: 2px; color: #fff; font-size: 12px; text-align: center; margin-left: 5px;}
.details_down .details_downbotm .borright{border-right: 1px solid #F0F2F5;width:1px;height:15px;position: absolute; top:2px;right: -16px;}
.details_right .details_con{ }
.details_right .details_con h2{color: #303133; font-size: 21px; width: 316px; line-height: 30px; -o-text-overflow:ellipsis; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.details_right .details_con .details_num{ color: #303133; border-bottom: 1px dashed #EBEEF5; line-height: 45px; padding-bottom: 10px; margin-bottom: 10px;}
.details_right .details_con .copybtn{display:inline-block;width: 60px;height: 24px;line-height: 24px; border-radius: 2px;border: 1px solid #DCDFE6; text-align: center; color: #606266;cursor:pointer; margin-top: 10px;}
.details_right .details_con ul li{ color: #606266; line-height: 32px;}
.details_right .details_con ul li span{ float: right;}
.details_right .details_user{ margin-bottom: 0; padding: 16px 24px; height: 146px;}
/* .headimg{} */
/* .details_right .details_user .headimg img{width: 60px; height: 60px; border-radius: 50%;} */
.details_right .details_user .user_con{ 
    margin-left: 12px;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    width: 0;
}
.details_right .details_user .user_box{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.details_right .details_user .user_box .img1{
    width: 60px;
    height: 60px;
    border-radius: 50%;
    -o-object-fit: cover;
       object-fit: cover;
}
.details_right .details_user .user_box .img2{
    width: 92px;
    height: 52px;
    -o-object-fit: cover;
       object-fit: cover;      
    border: 1px solid #F0F2F5;
}
.details_right .details_user .user_name,
.details_right .details_user .user_label{-o-text-overflow:ellipsis;text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.details_right .details_user .user_name{color:#303133; font-size: 18px;}
.details_right .details_user .user_label{font-size: 12px; line-height: 20px; color: #909399;}

/* .details_right .details_user .company_btn{width: 75px; height: 39px; background: #5294F9; border-radius: 2px; text-align: center; line-height: 39px; color: #fff;} */
.details_right .details_user .company_name{width: 243px;-o-text-overflow:ellipsis;text-overflow:ellipsis; white-space:nowrap; overflow:hidden; line-height: 25px;}
.details_right .details_user .works_show{ margin-top: 10px;}
.details_right .details_user .works_show li{float: left; margin-right: 13px;}
.details_right .details_user .works_show li:last-child{margin-right: 0;}
.details_right .details_user .works_show li img{width:69px;height: 69px;}
/*==模板下载弹窗===*/
.modeldown_con{ padding: 40px 30px;}
.modeldown_con label{color: #303133; font-size: 18px; width: 120px;}
.modeldown_con .model_details{ color: #606266; font-size: 16px; line-height: 38px; margin-left: 150px;}
.modeldown_con .model_details .name{font-size: 18px; width: 280px;-o-text-overflow:ellipsis;text-overflow:ellipsis; white-space:nowrap; overflow:hidden; margin-right: 30px;}
.pay_type{display: inline-block;}
.pay_type ul li{width: 113px;height: 38px; line-height:38px;background: #FFFFFF;border-radius: 2px;border: 1px solid #EBEEF5; text-align: center; float: left; margin-left: 10px;}
.pay_type ul li img{width: 20px; height: 20px; margin-right: 3px;}
.pay_type ul li.zfbon{border-color: #5294F9; position: relative;}
.pay_type ul li.zfbon:after{content: '';width: 18px;height: 18px;position: absolute;top: -1px; right: -1px;background: url("../images/zfb_duigou.png") no-repeat; background-size: 100% 100%;}
.pay_type ul li.wxon{border-color: #6BC73C; position: relative;}
.pay_type ul li.wxon:after{content: ''; width: 18px;height: 18px;position: absolute;top: -1px; right: -1px; background: url("../images/wx_duigou.png") no-repeat; background-size: 100% 100%;}
.pay_con{ margin-top: 65px;}
.pay_con .balance{text-align: center; font-size: 12px; line-height: 22px;}
.pay_con .balance .recharge_btn{margin-left: 10px; cursor: pointer;color: #5294F9;}
.pay_con .payment{display:block;width: 175px;height: 56px; line-height:56px;background: #5294F9;border-radius: 2px; text-align: center; color: #fff; font-size: 18px;margin: 0 auto;}
.code_pay{margin: 0 auto; text-align: center;}
.code_pay .code_paymoney{ color: #303133; font-size: 21px; line-height: 30px;}
.code_pay img{ width: 139px; height: 139px;}
.code_pay_wenzi{ color: #C0C4CC; font-size: 12px;}

/*====支付成功弹窗====*/
.success_con{ text-align: center;}
.success_con img{width: 108px; height: 108px; margin: 125px auto 15px; }
.success_con .success_tit{ font-size: 21px; font-weight: 500;}
.success_con .user_info{ line-height: 56px; color: #303133; font-size: 16px; margin-top: 70px;}
.success_con .user_info p{display: inline-block;}
.success_con .user_info .user_headimg{width: 24px; height: 24px; border-radius: 50%; margin: 0 5px;}
.success_con .user_info .user_infoname{position: relative;font-size: 14px;}
.success_con .user_info .borright{border-right: 1px solid #F0F2F5;width:1px;height:15px;position: absolute; top:20px;right: -15px;}
.success_con .user_info .user_balance{margin-left: 30px;font-size: 14px;}

/*绿色搭建案例详情*/
/*.details_main .details_con{width: 390px;  }*/
.details_main .details_con{width: 315px;}
.details_main .details_con h3{font-size: 21px; font-weight: bold;line-height: 58px;color: #303133;}
.details_main .details_con .decon_text p{line-height: 58px;}
.details_main .details_con p span{width: 70px;display: inline-block;}
.details_main .con_botm{background-color: #F5F7FA; border-radius: 2px; padding:13px;}
.details_main .con_botm .com_name{margin-left: 9px;}
.details_main .con_botm .con_ahead{width: 88px; height: 50px; border-radius: 2px;}
.details_main .con_botm .com_name .name{font-size: 18px; font-weight: bold; color: #303133;width: 266px;-o-text-overflow: ellipsis;text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.details_main .con_botm .com_name .status{margin-top: 4px;}
.details_main .con_botm .com_name .status i{display: block; width: 21px; height: 21px;border-radius: 4px; margin: 0 auto; color: #fff;font-size: 10px;text-align: center; line-height: 21px;float: left; margin-right: 10px;}
.details_main .con_botm .com_name .status-1{background-color: #8A7AD2;}
.details_main .con_botm .com_name .status-2{background-color: #D4925A;}
.details_main .con_botm .com_name .status-3{background-color: #74AE56;}
.details_main .con_botm .com_name .status-4{background-color: #5F8DD3;}
.details_main .con_botm .com_name i.status-5{color: #ECBB49; font-size: 13px;}
.details_main .con_botm .com_name .status i.disbg{background-color: #909399;}
.details_main .con_botm_img{margin-top: 12px;}
.details_main .con_botm_img img{width: 76px; height: 54px; margin-right: 6px;}
.details_main .con_botm_img img:last-child{margin-right: 0;}

.con_btn{ margin-top: 30px;}
.con_btn span{
    cursor: pointer;
    padding:20px 24px; border-radius: 2px; border-width: 1px;border-style: solid; font-size: 18px; font-weight: bold; margin-right: 8px;}
.con_btn span>i{
    margin-right: 5px;
}
.con_btn .conponent{border-color: #DCDFE6;}
.con_btn .tel{border-color: #5294F9;color: #5294F9;}
.con_btn .yuding{background-color: #5294F9;color: #fff; margin-right: 0;}
.s-detail-tu img{width: 100%;}


/*案例详情--图片轮播*/
.leftBox{
    width: 797px;
    height: 722px;
    float: left;
}
.w{
    width: 764px;
    height: 555px;
}
.normalBox{
    overflow: hidden;
    position: relative;
    border: 1px solid #EBEEF5;
    margin: 16px auto;
}
.normalBox .w{
    display: none;
}
.normalBox img{width: 100%; max-height: 100%;}
.botBox{
    background: white;
    overflow: hidden;
}
.botBox ul li{
    float: left;
    width: 115px;
    height: 115px;
    border: 1px solid #fff;
    border-radius: 2px;
    margin-left: 16px;
    opacity: 0.5;
}
.botBox ul li img{width: 100%; height: 100%;}
.bord{
    border-color: #5294F9 !important;
    opacity: 1 !important;
}
.moveBox{
    width: 200px;
    height: 200px;
    background: rgba(222,0,0,0.4);
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    cursor: move;
}
.magBox{
    width: 400px;
    height: 400px;
    border: 1px solid #5294F9;
    overflow: hidden;
    display: none;
    position:absolute;
    left:782px;
    top:16px;
    z-index:999;
}

.magBox ul li{
    display: none;
    position: absolute;
    top: 0;
    left: 0;
}
#n,.m{
    display: block !important;
}
.box{
    width: 110px;
    margin: auto;
}


/*====适配====*/
@media screen and (max-width: 4096px){

}

@media screen and (min-width: 1900px){
    .index_contain{
        padding: 0 5% 20px;
    }
    .hot li .works_img,
    .s-3d_main .hot li .works_img{
        height: 233px;
        height: calc(((100vw - 20px) * 0.9 - 106px) / 5 / 1.12);
    }
}
@media screen and (max-width: 1440px){

}
@media screen and (max-width: 1200px){
    .banner{
        height: 350px;
    }
}