@charset "utf-8";
/* CSS Document */
body {background: #f6f6f8;}
.bg01{width: 100%;background: #fff;display: inline-block;}
.banner{margin-top: 0;}
.container{width: 1200px; margin: 0 auto;}
.mtop{margin-top: 20px;}
.mtop120{margin-top: 120px !important;}
.mbottom{margin-bottom: 10px;}

.banner-t{width: 1200px;margin: 0 auto;margin-top: 120px;}
.indexQA{padding: 0;margin-top: 20px;}
.indexQA_title{margin-left: 0;}
.indexQA_item{width: 980px;}
.Iqa_btn{margin-top: 10px;}
.top-title{height: 55px;border-bottom: 1px solid #e3ebf6;font-size: 26px;line-height: 55px;}
.top-title img{float: left;margin-top: 10px;margin-right: 10px;}
.index-videoBox{margin-top: 20px;margin-bottom: 20px;}
.index-videoBox .top-title{margin-bottom: 10px;}
.index-video{background: #f6f6f8;}
.index-video ul{clear: both; overflow: hidden;}
.index-video li{background: #fff;width: 30%; margin: 20px 1.6%;float: left;position: relative;}
.index-video li i{width: 60px; height: 60px; background: url(https://www.21ic.com/we/images/icon_play.png) no-repeat; position: absolute; left: 50%; top: 60px;margin-left: -30px;}
.index-video li img{width: 100%;}
.index-video li p{height: 48px; padding: 0 10px;overflow: hidden;line-height: 48px;text-align: center;}
.block_three{margin-top: 25px;display: inline-block;width: 1200px;}
.block_three .file .topImg{height: 115px;background: #e3000b;display: flex;align-items: center;justify-content: center;}
.block_three .file .topImg h4{text-align: center;margin: 0 auto;font-size: 26px;color: #fff;display: contents;margin-left: 10px;}
.block_three .file .topImg img{display: inline-block;margin: 0 10px;}
.block_three .file {width: 370px; float: left;background: #fff;position: relative;}
.block_three .file ul{padding: 20px 20px 40px;position: relative;height: 134px;}
.block_three .file ul li{background: url(https://www.21ic.com/we/images/icon_wendang.png) no-repeat 0 4px;margin: 4px 0;padding-left: 22px;display: inline-block;    white-space: nowrap;
    text-overflow: ellipsis;overflow: hidden;width: 308px;}
.block_three .file .more{position: absolute; bottom:15px;z-index: 55;left: 105px;}
.block_three .file .more a{width: 160px; height: 44px; line-height: 44px; text-align: center;background: #e3000b;display: block;border-radius: 44px;color: #fff;
/*box-shadow: 0 0 8px #f9a8ab;*/}
.block_three .file .more a:hover{background: #fe3f48;color: #fff;}
.index-about{background: #fff;padding: 30px;margin-top: 25px;clear: both; overflow: hidden;}
.index-about .red{color: #e3000b;margin: 20px 0;}
.index-about p span{color: #e3000b;font-size: 18px;font-weight: bold;}
.index-b li{background: #f6f6f8;width: 560px;float: left;height: 263px;margin-top: 20px;}
.index-b li:nth-child(2n){float: right;}
.a-b-right{float: right;width: 265px;padding: 20px;}
.a-b-right h4{font-size: 18px;font-weight: bold;margin-bottom: 15px;}
.a-b-right p{background: url(../images/icon-arrow.png) no-repeat 0 7px;padding-left: 15px;margin-bottom: 0px;}
.a-b-left{float: left;width: 255px;}
.tit-h{font-size: 18px;color: #fff; margin: 20px 0px 10px; position: relative; padding-left: 17px; font-weight: 400; background: #e3000b;line-height: 38px;}
.tit-h i{width: 20px; height: 20px;background: url(../images/icon-h3.png) no-repeat;display: inline-block;vertical-align: middle;margin-right: 10px;}

.guide_list ul{ clear: both; overflow: hidden;margin-left: -30px;}
.guide_list ul li{width: 247px;height:150px; float:left;background: #fff;margin-left: 30px;padding: 15px;position: relative;overflow:hidden;margin-bottom: 10px;}
.guide_list ul li img{border: 1px solid #ddd;width: 245px;height: 95px;}
.guide_list ul li h4{font-size: 15px;height: 44px; line-height: 22px;overflow: hidden;margin: 6px 0;}
.guide_list ul li p{font-size: 13px;line-height: 22px; color: #888;overflow: hidden; text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;height: 66px;}
.guide_list ul li .link{width: 84px; height: 30px;display: inline-block;text-align: center; line-height: 30px;color: #fff;margin-top: 10px;background: #e3000b;}
.guide_list ul li .link:hover{background: #fe3f48; color: #fff;}
.guide_list ul li a{display: inline-block;}
.guide_list ul li:hover h4{color: #111;}
.guide_list ul li:hover{box-shadow: 0 0 10px 0 rgba(0,0,0,.2);}

.guide_list2025 ul{ clear: both; overflow: hidden;margin-left: -28px;}
.guide_list2025 ul li{width: 249px;float:left;background: #fff;margin-left: 28px;padding: 15px;position: relative;overflow:hidden;margin-bottom: 10px;margin-top: 10px; }
.guide_list2025 ul li img{border: 1px solid #ddd;width: 245px;height:233px;}
.guide_list2025 ul li h4{font-size: 15px;height: 44px; line-height: 22px;overflow: hidden;margin: 6px 0 0;}
.guide_list2025 ul li h4:hover{color: #111;}
.guide_list2025 ul li p{font-size: 13px;line-height: 22px; color: #888;overflow: hidden; text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;height: 66px;}
.guide_list2025 li .link{width: 84px; height: 30px;display: inline-block;text-align: center; line-height: 30px;color: #fff;margin-top: 10px;background: #e3000b;}
.guide_list2025 li .link:hover{background: #fe3f48; color: #fff;}
.guide_list2025 ul li a{display: inline-block;}
.guide_list2025 ul li:hover h4{color: #111;}
.guide_list2025 ul li:hover{box-shadow: 0 0 10px 0 rgba(0,0,0,.2);}
.cpList li h4{font-size:18px!important;height: 24px!important;}
.four_modules .title h3{background: none;}
.search-box{width: 1200px; margin: 120px auto 15px;}
.search-t{border: 1px solid #ccc;width: 100%;display: inline-block;}
.search-t .text{width: 1080px;height: 38px;height: 38px;padding-left: 10px;border: none;font-size: 16px;}
.search-t .btn{width: 100px;height: 38px; background: url(../images/icon-search.png) no-repeat #fff center;border: none;float: right;}
.index-tags{font-size: 16px;margin-top: 10px;height: 26px; overflow: hidden;}
.index-tags a{color: #e3000b;margin: 0 10px;}
.four_modules .title h3{background: none;padding-left: 0;}
.four_modules .title h3 img{width: 140px;}
.btn-series {height: 38px; line-height: 38px;background: #3a4249;text-align: center;font-size: 18px;width: 100%; display: inline-block;margin-top: 20px;}
.btn-series span{color: #fff;position: relative;}
.btn-series span::after{content: "";width: 155px;height: 2px;background: #e3000b;position: absolute; top:29px;left: 50%; margin-left: -78px;}
.series-box{margin-top: 30px;}
.series-box h3{font-size: 18px;margin: 15px 0;}
.series-box ul {clear: both;overflow: hidden;margin-left: -12px;}
.series-box ul li{background: #e3000b;color: #fff;text-align: center;width: 138px; margin-left: 13px;float: left;height:140px;}
.series-box ul li img{margin-top: 8px;}
.series-box ul li p{color: #fff;font-size: 18px;margin-top: 3px;}
.series-box ul li a{width: 100%;display: inline-block;}
.series-box ul li:hover{background: #fe3f48;}
.news_list {background: #fff;padding: 20px;min-height: 500px;}
.news_list b{color: #e3000b;font-weight: normal;}
.page{margin: 20px auto;text-align: center;}
.page b{color: #e3000b;font-weight: 700;}

.flexslider {
        margin: 0px auto 20px;
        position: relative;
        width: 1200px;
        height: 490px;
        overflow: hidden;
        zoom: 1;
    }
    
    .flexslider .slides li {
        width:1200px;
        height:490px;
    }
    
    .flex-direction-nav a {
        width: 70px;
        height: 70px;
        line-height: 99em;
        overflow: hidden;
        margin: -35px 0 0;
        display: block;
        background: url(../images/ad_ctr.png) no-repeat;
        position: absolute;
        top: 50%;
        z-index: 10;
        cursor: pointer;
        opacity: 0;
        filter: alpha(opacity=0);
        -webkit-transition: all .3s ease;
        border-radius: 35px;
    }
    
    .flex-direction-nav .flex-next {
        background-position: 0 -70px;
        right: 0;
    }
    
    .flex-direction-nav .flex-prev {
        left: 0;
    }
    
    .flexslider:hover .flex-next {
        opacity: 0.8;
        filter: alpha(opacity=25);
    }
    
    .flexslider:hover .flex-prev {
        opacity: 0.8;
        filter: alpha(opacity=25);
    }
    
    .flexslider:hover .flex-next:hover,
    .flexslider:hover .flex-prev:hover {
        opacity: 1;
        filter: alpha(opacity=50);
    }
    
    .flex-control-nav {
        width: 100%;
        position: absolute;
        bottom: 10px;
        text-align: center;
    }
    
    .flex-control-nav li {
        margin: 0 2px;
        display: inline-block;
        zoom: 1;
        *display: inline;
    }
    
    .flex-control-paging li a {
        background: url(../images/dot.png) no-repeat 0 -16px;
        display: block;
        height: 16px;
        overflow: hidden;
        text-indent: -99em;
        width: 16px;
        cursor: pointer;
    }
    
    .flex-control-paging li a.flex-active,
    .flex-control-paging li.active a {
        background-position: 0 0;
    }
    
    .flexslider .slides a img {
        width: 100%;
        height: 490px;
        display: block;
    }

.banner-pic01{position: relative;}
.banner-pic01-btn{position: absolute; z-index: 22;top: 293px;left: 60px;}
.banner-pic01-btn a{width: 165px;height: 50px;background: none;display: inline-block;margin-right: 15px;}
.banner-pic01-btn02{position: absolute; z-index: 22;top: 273px;left: 80px;}
.banner-pic01-btn02 a{width: 165px;height: 50px;background: none;display: inline-block;margin-right: 15px;}
.banner-pic01-btn02-2{width: 210px!important;}


.design-list ul { clear: both; overflow: hidden; margin-left: -25px;}
.design-list ul li{width: 280px;height: 255px; float: left; background: #fff; position: relative; margin-left: 25px; margin-bottom: 20px;}
.design-list ul li img{width: 280px; height: 180px;}
.design-list ul li h4{font-size: 15px; height: 44px; line-height: 24px; overflow: hidden; margin: 6px 15px;}
.more-btn{text-align: center;}
.more-btn a {width: 160px;height: 44px; line-height: 44px; text-align: center; background: #e3000b; display: inline-block; border-radius: 44px; color: #fff;}
.more-btn a:hover{background: #fe3f48;color: #fff;}
.s-designs-title{font-size: 18px;border-left: 5px solid #e3000b;padding-left: 15px;margin: 20px 0 10px;}
.s-designs-list{display: inline-block;}
.s-designs-list ul{clear: both;overflow: hidden;margin-left: -30px;}
.s-designs-list ul li{background: #fff;border: 1px solid #e5e5e5;padding: 15px;width: 550px;float: left;margin:10px 0 10px 30px;}
.s-designs-list ul li .l-img{ width: 210px;float: left;height: 165px; overflow: hidden;}
.s-designs-list ul li .l-img img{width: 100%;display: flex; align-items: center;}
.s-designs-list ul li .r-t{width: 325px;float: right;}
.s-designs-list ul li .r-t h4{font-size: 16px;line-height: 22px; height: 44px;overflow: hidden;}
.s-designs-list ul li .r-t p{color: #848484;font-size: 15px;line-height: 22px;height: 66px;margin: 8px 0;overflow: hidden;}
.s-designs-list ul li .Iqa_btn{margin-top: 0;}
.s-designs-list ul li:hover{box-shadow: 0 0 10px 0 rgba(0,0,0,.2);}
.about-text p{text-indent: 2em;}
.about-di{clear: both; overflow: hidden;}
.about-di h4{text-align: left;font-size: 18px;font-weight: bold;}
.about-di p{margin: 15px 0;}
.di-left{width: 300px;float: left;background: #f6f6f8;padding: 25px;}
.di-right{width: 720px;float: right;}
.di-right h4{margin: 20px 0;}
.container-fluid{margin-top: 20px;}
.exhibitors-box{width: 100%;}
.exhibitors-logo{float: left;margin: 10px;height: 180px;}
.slick-slide img{height: auto!important;width: 265px;}
.exhibitors-box .slick-next{right: -50px;}
.exhibitors-box .slick-prev{left: -50px;}
.slick-dots li{width: 10px;}
.slick-prev:before, .slick-next:before{font-size: 60px;color: #ffae1b;}
.slick-prev, .slick-next{width: 47px;height: 47px;text-indent: 99em;overflow: hidden;box-shadow: 0 0 10px #ccc;border-radius: 47px;z-index: 99;top: 40%;}
.slick-next{background: url(../images/icon-left.png) no-repeat;}
.slick-next:hover{background: url(../images/icon-leftH.png) no-repeat;}
.slick-prev{background: url(../images/icon-right.png) no-repeat;}
.slick-prev:hover{background: url(../images/icon-rightH.png) no-repeat;}
.redexpert_title{position: relative;}
.redexpert_right{position: absolute;right: 0;top: 0px;z-index: 99;}
.redexpert_right-1 {float: left;}
.redexpert_right-1 a{width: 140px;height: 60px;background: #e3000b;color: #fff;text-align: center;line-height: 60px;font-size: 18px;margin-right: 10px;display: inline-block;}
.redexpert_right-1 a:hover{background: #fe3f48;color: #fff;}



