@charset "utf-8";
/* CSS Document */
* {margin:0;padding:0}
h1,h2,h3,h4,h5{font-weight: 500;}
li{list-style: none;}
a{text-decoration: none;color:#6e6e6e;}
img{
    border:none;vertical-align: top;
}
/*B2B2C顶部图片*/
.top_banner{height: 370px;background-color: #3a3434;padding-left:8%;}
.top_banner .tab-text-header{margin-top: 110px;width:35%;}
.top_banner .tab-text-header span{margin: 10px 0;display: inline-block;}
.top_banner .main-header{color: #ffffff;}
.top_banner .main-header hr{background-color: #ffffff;width: 2px;height: 30px;text-align: left;margin: 6px 0 6px 2px;}
.top_banner .main-header .small-tit {font-weight: normal;font-size: 24px;}
.top_banner .main-header .text-tit{font-size: 30px;}
.banner01{background:url(../../image/sub/retail-B2B2C/background3.png);background-repeat:no-repeat;background-position: center top;background-size: cover;}
    /*=======================.m2==============================*/
    
    
    .m2 {
        width: 1211px;
        /*padding-bottom:56px ;*/
        margin-bottom: 50px;
        margin: 0 auto;
        padding-top: 64px;
    }

    .th1 {
        font-size: 30px;
        text-align: center;
        margin-bottom: 26px;
    }

  
    .m55 {
        width: 1200px;
        margin: 0 auto;
        text-align: center;
        height: 430px;
        margin-bottom: 97px;
    }

    .m55 > p {
        font-size: 14px;
        width: 990px;
        margin: 0 auto;
        margin-bottom: 32px;
    }

    .m55 > h2 {
        font-size: 30px;
        margin-bottom: 28px;
        margin-top: 60px;
    }

    .m55 ul li {
        float: left;
    }

    .m55 ul li:nth-of-type(2) {
        padding-left: 83px;
        padding-top: 24px;
        width: 411px;
    }

    .m55 ul li img {
        display: none;
    }
.m55 ul li img:first-of-type {
        display: block;
    }

    .m55 ul li h1 {
        font-size: 24px;
        margin-bottom: 31px;
    }

    .text p {
        height: 80px;
    }

    .m55 ul li > p {
        margin-bottom: 35px;
        text-align: left;
    }

    .btn_list {
        text-align: left;
    }

    .btn_list span {
        width: 87px;
        display: inline-block;
        height: 30px;
        line-height: 30px;
        text-align: center;
        background: #E9E9E9;
        color: #434343;
        margin-right: 20px;
        margin-bottom: 20px;
    }

    .btn_list span:nth-child(4n) {
        margin-right: 0;
    }

    .btn_list span:first-child {
        background: #39ABE8;
        color: #fff;
    }

    /*==========================================================*/
    .m66 {
        height: 408px;
        margin-bottom: 100px;
    }

    .m66x {
        text-align: center;
        width: 1200px;
        position: relative;
        margin: 0 auto;
    }

    .m66x h2 {
        font-size: 16px;
        margin-bottom: 45px;
    }
   
    .btn_list2 {
        position: absolute;
        width: 454px;
        right: 86px;
        bottom: 16px;
        height: 10px;
        z-index: 10;
        cursor: pointer;
    }

    .btn_list2 span {
        display: inline-block;
        width: 58px;
        height: 4px;
        background: #b6d8f7;
        margin: 0 1px;
        cursor: pointer;
    }

    .btn_list2 span:first-child {
        background: #078afe;
    }

    .btn_list2 span:hover {
        background: #078afe;
    }

   
    .new_title h1 {
        color: #333333;
        font-size: 28px;
        line-height: 1;
        text-align: center;
        margin: 60px 0 10px;
    }

    .new_title>p {
        width: 1124px;
        color: #666;
        font-size: 16px;
        margin: 0 auto;
        text-align: center;
        line-height: 28px;
        font-weight: lighter;
    }

    .f-list {
        width: 1200px;
        height: 102px;
        margin: 26px auto 46px;
    }

    .f-list li {
        float: left;
        width: 180px;
        margin: 0 30px;
        text-align: center;
    }

    .f-list li img{
        width: 66px;
        height: 66px;
    }
    
    .f-list li p{
        color: #333333;
        font-size: 16px;
        margin-top: 10px;
    }

    .data-ty{
        width: 100%;
        height: 500px;
        background: url(../../image/sub/retail-B2B2C/sj.png) no-repeat center center;
    }
    
    .data-ty h2{
        color: #FFFFFF;
        font-size: 28px;
        padding-top: 60px;
        text-align: center;
    }
    
    .data-ty p{
        color: #fff;
        font-size: 16px;
        font-weight: lighter;
        text-align: center;
        margin-top: 15px;
    }
    
    #m2 h2{
        color: #343434;
        font-size: 28px;
        margin-top: 60px;
        text-align: center;
    }

    #m2 .x2m>p{
        color: #868585;
        font-size: 16px;
        font-weight: lighter;
        margin-top: 20px;
        text-align: center;
    }

    #m2 .Platform_TAB{
        position: relative;
        width: 1200px;
        margin: 50px auto 120px;
        padding-bottom: 50px;
    }

    .Platform_TAB ul li{
        float: left;
        width: 200px;
        text-align: center;
        transition-timing-function: linear;
        transition: 0.6s;
        cursor: pointer;
    }

    .Platform_TAB li img{
        width: 66px;
        height: 66px;
    }
    
    .Platform_TAB li p{
        color: #333333;
        font-size: 16px;
        margin-top: 18px;
        line-height: 1;
    }

    .Platform_TAB .jiantou{
        transition-timing-function: linear;
        transition: 0.6s;
        position: absolute;
        width: 200px;
        height: 10px;
        bottom: -80px;
        left: 0;
    }

    .PlatList{
        width: 100%;
        height: 500px;
        background: url("../../image/sub/retail-B2B2C/bg1.jpg") no-repeat center center;
        background-size: auto 100%;
    }

    .PlatList .PlatList1{
        padding-top: 94px;
        box-sizing: border-box;
    }

    .PlatList1{
        float: left;
        position: absolute;
        width: 1200px;
        margin: 0 auto;
        padding-top: 39px;
        opacity: 1;
        display: none;
        transition: 0.8s;
    }

    .PlatList1.on{
        /*opacity: 1;*/
        display: block;
    }

    .PlatList1 img.fl{
        width: 623px;
    }

    .PlatList1 div.fl{
        width: 557px;
        margin-left: 18px;
    }
    
    .PlatList1 h3{
        color: #fff;
        font-size: 26px;
    }

    .PlatList1 p{
        color: #fff;
        font-size: 16px;
        line-height: 1;
        margin: 20px 0 40px
    }

    .PlatList1 li{
        float: left;
        width: 128px;
        height: 32px;
        line-height: 30px;
        box-sizing: border-box;
        border: 1px solid #fff;
        border-radius: 4px;
        text-align: center;
        color: #fff;
        font-size: 12px;
        margin: 0 15px 13px 0;
        cursor: pointer;
    }

    .PlatList1 li:nth-child(4n){
        margin: 0 0 13px;
    }

    .PlatList1 a{
        display: block;
        width: 150px;
        height: 50px;
        color: #fff;
        line-height: 48px;
        font-size: 16px;
        border-radius: 10px;
        box-sizing: border-box;
        border: 1px solid #fff;
        text-align: center;
        margin-top: 186px;
    }

    .PlatList1 a:hover{
        background: linear-gradient(45deg,#8939A4,#3F63BA);
        border-color: transparent;
    }
    .sec>h2{
        padding-top: 60px;
        color: #222222;
        font-size: 28px;
        text-align: center;
    }

    .sec>p{
        width: 1250px;
        color: #666666;
        text-align: center;
        font-size: 16px;
        line-height: 28px;
        margin: 15px auto 0;
    }

    .sec>img{
        display: block;
        margin: 20px auto 0;
    }

    .diy img{
        width: 1224px;
    }

    .video{
        width: 100%;
        height: 707px;
        background: url("../../image/sub/retail-B2B2C/bg2.jpg") no-repeat center center;
        background-size: auto 100%;
    }

    .video h2,.video p,.site h2,.site p,.sja h2,.sja p,.zt h2,.zt p{
        color: #fff;
    }

    .video img{
        width: 1029px;
    }

    .zh ul{
        width: 1200px;
        height: 73px;
        margin: 30px auto 0;
        text-align: center;
    }

    .zh ul li{
        display: inline-block;
        margin: 0 25px;
        width: 210px;
        height: 73px;
    }

    .zh ul li img{
        width: 100%;
        height: 100%;
        margin: 0;
    }

    .zh>img{
        width: 1093px;
        margin-bottom: 40px;
    }

    .site{
        width: 100%;
        height: 707px;
        color: #fff;
        background: url("../../image/sub/retail-B2B2C/bg3.jpg") no-repeat center center;
        background-size: auto 100%;
    }

    .site img{
        width: 1248px;
    }

    .sja{
        width: 100%;
        height: 794px;
        color: #fff;
        background: url("../../image/sub/retail-B2B2C/bg4.jpg") no-repeat center center;
        background-size: auto 100%;
    }

    .sja img{
        width: 762px;
    }

    .kf img{
        width: 1028px;
        margin-top: 0;
        margin-bottom: 55px;
    }

    .zt{
        width: 100%;
        height: 794px;
        color: #fff;
        background: url("../../image/sub/retail-B2B2C/bg5.jpg") no-repeat center center;
        background-size: auto 100%;
    }

    .zt img{
        width: 1260px;
    }

    .ts img{
        width: 1096px;
    }

    .dj .dj-main{
        width: 1123px;
        height: 455px;
        margin: 20px auto 0;
    }

    .dj-main img.fl,.dj-main img.fr{
        width: 434px;
        height: 455px;
    }

.fl {float:left}
.fr {float: right}

    .dj-main ul{
        float: left;
        padding-top: 90px;
    }

    .dj-main li{
        width: 229px;
        height: 45px;
        text-align: center;
        line-height: 45px;
        color: #fff;
        font-size: 12px;
        margin: 0 13px 35px;
        background: url("../../image/sub/retail-B2B2C/sec12.png") no-repeat center center;
    }

    .dj a{
        display: block;
        width: 184px;
        height: 34px;
        margin: 17px auto 111px;
        text-align: center;
        font-size: 12px;
        color: #fff;
        line-height: 34px;
        background: url("../../image/sub/retail-B2B2C/sec13.png") no-repeat center center;
    }

    .xls img{
        width: 1000px;
        margin-bottom: 60px;
    }

/*切换组件*/
    .box{
        position: relative;
        width: 1070px;
        overflow: hidden;
        height:288px;
        box-shadow: 1px 0 24px 1px rgba(0,0,0,0.1);
    }
.list{
        width:4800px;
        height: 330px;
        overflow: hidden;
        position: relative;
        transition: 1s;
        transition-timing-function: linear
    }
.libox {
        width: 1200px;
        float: left;
        height: 330px;
        transition: 1s;
        cursor: pointer;
        background: #fff;
        transition-timing-function: linear;
    }
    .libox ul {
        float: left;
        width: 480px;
        height: 288px;
        overflow: hidden;
    }
    .libox>ul img{
        width:100%;
        height:100%;
        margin-right:20px;
    }
.libox ol {
    width: 516px;
    float: left;
    height: 219px;
    padding: 17px 31px 52px 43px;
}
 .libox ol li{
        color: #535353;
        font-size: 12px;
        text-align:left;
    }
    .libox ol li:nth-of-type(1){
        font-size:24px;
    }
    .libox ol li:nth-of-type(1) img{
        width: 85px;
        height: 55px;
        vertical-align: bottom;
        margin-right:20px;
    }
    .libox ol li:nth-of-type(2){
        padding:20px 0 20px 0;
        font-size: 14px;
        font-weight: bold;
    }
    .libox ol li:last-child span{
        margin-left:34px;
    }
    .libox ol li:last-child span img{
        margin-right:9px;
        vertical-align: bottom;
    }
    .libox:nth-of-type(1) ol li:nth-of-type(2){

    }
    .libox ol li:nth-of-type(3){
        margin-bottom:19px;
    }
    .libox:nth-of-type(1) ol li:nth-of-type(4){
        margin-bottom:21px;
    }
.Left{
        position: absolute;
        left: -54px;
        top:61.5%;
        font-size: 40px;
        font-family: Simsun;
        height: 31px;
        color: #398AEF;
        line-height: 31px;
        font-weight: bold;
        z-index: 10;
        user-select: none;
        cursor: pointer;
    }
    .Right{
        position: absolute;
        right:75px;
        top:61.5%;
        font-size: 40px;
        font-family: Simsun;
        height: 31px;
        color: #398AEF;
        line-height: 31px;
        font-weight: bold;
        z-index: 10;
        user-select: none;
        cursor: pointer;
    }


/*内联样式迁移*/
.PlatList .wrap {width: 1200px;margin: 0 auto;height: 100%; overflow: hidden;position: relative;}
.margin-b20 {margin-top:20px;}
.libox ol li {
    color: #535353;
    font-size: 12px;
    text-align: left
}
.tad {
    font-size: 16px !important;
    font-weight: bold;
}