*{
    margin:0;
    padding: 0;
}
html{
    font-size: 10px;
}
body{
    font-size: 1.4rem;
    font-family:'微软雅黑';
}
img{
    border: none;
    vertical-align: middle;
}
a{
    text-decoration: none;
    color: inherit;
}
li{
    list-style: none;
}
.clear:after{
    content: '';
    display: block;
    height:0;
    visibility: hidden;
    clear: both;
}
/*初始化结束*/
/*内页通用部分开始*/
@media screen and (max-width: 1600px) and (min-width: 1441px) {
    html{  font-size: 9px;}
    .left_menu p{  margin:0 8.9%;}
}
@media screen and (max-width: 1440px) and (min-width: 1201px) {
    html{  font-size: 7px;}
    .left_menu p{  margin:0 6.9%;}
}
@media screen and (max-width: 1200px) and (min-width: 769px) {
    html{  font-size: 6px;}
    .left_menu p{  margin:0 6.9%;}
}

.main_wrap{
    background-color: #fff;
}
/*左部菜单*/
.left_menu{
    position: fixed;
    left:-14.6%;
    top: 0;
    width:14.6%;
    height:100%;
    text-align: center;
    background-color: #fff;
    z-index:9999999;
    box-shadow: 2px 0px 2px rgba(0,0,0,0.3);
    display: none;
}
.left_menu .shouqi,.left_menu .caidan{
    position: absolute;
    width: 25px;
    padding: 4px 5px;
    height: 64px;
    line-height: 28px;
    font-size: 14px;
    color: #fff;
    background: #1966ff;
    /*right:100%;*/
    top:50%;
    left: 100%;
    margin-top: -32px;
    cursor: pointer;
    display: none;
}
.left_menu .caidan{
    display: block;
}
.left_menu img{
    width:55%;
    margin: 20px;
}
.left_menu img:first-child{
    margin-top:19.6%;
}
.left_menu>ul>li{
    text-align: center;
    font-size:1.6rem;
    color: #424242;
}
.left_menu>ul>li>a{
    display: block;
    line-height:1.9em;
    margin: 0 20%;
    border: 1px solid transparent;
}
.left_menu>ul>li>a.active{
    color: #fff;
    background-color: #424242;
    border-color: #626262;
}
.left_menu>ul>li>a:hover{
    color: #fff;
    background-color: #424242;
    border-color: #626262;
}
.nav_second{
    position: absolute;
    box-sizing: border-box;
    top: 0;
    left:100%;
    width:8.22%;
    height:100%;
    background:#353331;
    width: 0;
    display: none;
}
.nav_second li{
    width:100%;
    position: relative;
    top: 50%;
    transform: translateY(-200%);
}
.nav_second li a{
    display: block;
    font-size:1.4rem;
    color: #fff;
    margin: 0;
    line-height:3.75rem;
}
.nav_second li a:hover{
    background-color: #f45e00;
}

.left_menu .line{
    display: inline-block;
    width: 8px;
    height: 11px;
    border-bottom: 1px solid #626262;
}
.left_menu p{
    margin:0 13.9%;
    border-top: 1px solid #aeaeae ;
    font-size:1.4rem;
    color: #373737;
    line-height: 2.3rem;
}
.left_menu div{
    width:100%;
    position: absolute;
    left: 0;
    bottom:2%;
}

/*右边内容*/
.right_wrap{
    width:100%;
}
/*顶部标题*/
.right_title{
    margin-top:4.58%;
    line-height: 63px;
}
.tit_l{
    float: left;
}
.tit_l span{display: inline-block}
.tit_l span:nth-of-type(1){  font-size:4.3rem;  color: #424242;letter-spacing: 7px}
.tit_l span:nth-of-type(2){  font-size:2.4rem;  color: red;  }
.tit_l span:nth-of-type(3){  font-size:2.4rem;  color: #424242;}
.tit_r{
    float: right;
    line-height: 0px;
    padding-top: 15px;
}
.tit_r a{
    line-height: 3em;
    color: #242424;
    font-size:1.6rem;
}
.tit_r a:last-child{
    color: red;
}
.tit_r span{
    padding:0 2px;
}
.right_con{
    width:100%;
    overflow: hidden;
}
/*内页通用部分结束*/


/*适配各个移动终端*/
/*适配iPad iPadPro*/
@media screen and (min-width: 768px) {
    .open_icon,.close_icon{display: none}
}
@media screen and (max-width:1024px ) and (min-width: 768px)
{
    html{  font-size: 10px;}
    .left_menu{  width:21%;}
    .left_menu{
        position: fixed;
        left:0%;
        top: 0;
        height:100%;
        text-align: center;
        background-color: #fff;
        z-index:555;
        box-shadow: 2px 0px 2px rgba(0,0,0,0.3);
    }
    .left_menu .shouqi,.left_menu .caidan{
        display: none;
    }
    .right_wrap{margin-right: 8%;}
    .news_title i{display: none;}
    .news_con li{width: 47.9%;margin-right: 2.1%}
    .news_con li:nth-of-type(3n){margin-right: 2.1%}
    .news_con li:nth-of-type(2n){margin-right: 0}
    .left_menu .shouqi,.left_menu .caidan{
        display: none;
    }
}
@media screen and (max-width: 767px)
{
    .page-wrap{
        padding-top: 53px !important;
    }

    .left_menu .shouqi,.left_menu .caidan{
        display: none;
    }
    html{  font-size: 7px;}
    .close_icon{
        position: absolute;
        top: 2px;
        left: 2px;
        font-size:1.8rem;
    }
    .phone_overlay{
        width:100%;
        height:100%;
        background: rgba(0,0,0,0.2);
        position: absolute;
        display: none;
        z-index:99;
    }

    .left_menu .shouqi,.left_menu .caidan{
        display: none;
    }
    .left_menu{
        width:0%;
        display: none;
        left:auto;
        right: 0;
    }
    .nav_second{
        left:-50%;
    }
    .left_menu img{width: 40%}
    .left_menu img:first-of-type{ margin-top: 6.6%; }
    .main_wrap .open_icon{
        box-sizing: border-box;
        position: fixed;
        text-align: right;
        color: #fff;
        width:100%;
        height: 36px;
        line-height: 26px;
        background-color: #383737;
        font-size:4.0rem;
        padding: 5px;
        padding-left: 20px;
        z-index:555;
    }
    .main_wrap{
        overflow: hidden;
    }

    .main_wrap .open_icon:before{
        padding-right: 20px;
    }
    .main_wrap .open_icon img{
        float: left;
    }
    .nav_second{
        left:-50%;
    }
    .right_wrap> img{
        margin-top: 0;
    }
    .right_wrap{
        width:94%;
        margin: 0 auto;
        float: none;
       
    }

}

.right_wrap> img{
    width:100%;
    height:auto;
}
.xcx_adv{
    width:62.5%;
    margin:0 auto;
}
.xcx_adv .tit p:first-of-type{
    text-align: center;
    font-size:3.6rem;
    line-height:1.78125em;
    color: #333;
    margin-top:1.278em;
}
.xcx_adv .tit span{
    color: #ff5400;
}
.xcx_adv .tit p:last-of-type{
    font-size:1.8rem;
    color: #999;
    text-align: center;
    line-height:2.22em;
}
.good_wrap{
    width:62.5%;
    margin:0 auto;
}
.good_1,.good_4{
    width:96.83%;
    margin: 0 auto;
}
.good_1 div,.good_4 div{
    width:33.33%;
    float: left;
}
.good_1 div h4,.good_4 div h4{
    font-size: 1.8rem;
    color: #333;
    line-height:2.72em;
    margin-top:1.16em;
    text-align: center;
}
.good_1 div p,.good_4 div p{
    font-size: 1.4rem;
    color: #444;
    line-height:1.71em;
    text-align: center;
}
.good_1 div p:last-of-type,.good_4 div p:last-of-type{
    margin-bottom:4.5em;
}
.good_4 div h4{
    margin-top: 4em;
}
.good_2{
    width: 76.67%;
    float: right;
    border: 2px dashed #a7a7a7;
    border-top-right-radius: 3.8em;
    border-bottom-right-radius: 3.8em;
    border-left:none ;
    height:5.71em;
    position: relative;

}
.good_3{
    width: 76.67%;
    float: left;
    border: 2px dashed #a7a7a7;
    border-top-left-radius: 3.8em;
    border-bottom-left-radius: 3.8em;
    border-right:none ;
    height:5.71em;
    margin-top: -2px;
    z-index:2;
    position: relative;
}
.good_2 img,.good_3 img{
    font-size:1.4rem;
    width:11%;
    position: absolute;
}
.good_2 img:first-of-type{  left:-11%;  top:-56%; }
.good_3 img:last-of-type{  right:-12%;bottom: -56%}
.good_2 img:nth-of-type(2){  left:29.5%;  top:-56%; }
.good_3 img:nth-of-type(2){  right:29.5%;bottom: -56%}
.good_2 img:nth-of-type(3){  left:71.5%;  top:-56%; }
.good_3 img:nth-of-type(1){  right:70.5%;bottom: -56%;}

.case_wrap{
    width: 62.5%;
    margin: 0 auto;

}
.case{
    background:url("../image/xcx_case_bg.jpg") no-repeat;
    background-size: 100% 100%;
    overflow: hidden;
}
.case_tit{  margin-top:3.0rem; color: #fff;text-align:center;}
.case_tit p:first-of-type{
    font-size: 3.6rem;
    line-height:1.611em;
}
.case_tit p:last-of-type{
    font-size:1.8rem;
    line-height:2.1666em;
    margin-bottom: 1em;
}
.case_ass ul{
    text-align: center;
    font-size:1.8rem;
}
.case_ass ul li{
    padding: 0.556em 0;
    width:16.67%;
    display: inline-block;
    color: #fff;
    border: 1px solid #fff;
    border-radius: 6px;
    margin-right:1.5%;
    cursor: pointer;
}

.case_ass ul li p{
    margin: 0.5rem 0;
}

.case_ass li:hover {
    border-color: transparent;
    background-color: #f66a3b;
}
.case_icons{
    width: 81.67%;
    background-color: #fff;
    border-radius: 1%;
    margin: 0 auto;
    margin-top:3em;
    margin-bottom:3em;
    overflow: hidden;
}
.case_icons img{
    width:100%;
}

.xcx_flow{
    width:62.5%;
    margin: 0 auto;
    margin-bottom:16%;
}
.com_tit >h5{
    text-align: center;
    font-size: 3.6rem;
    font-weight:400;
    color: #333;
    line-height:1.4em;
    margin-top:1em;
}
.com_tit h5 span{
    color: #ff5400;
}
.com_tit > p{
    text-align: center;
    font-size:1.8rem;
    color: #666;
    line-height: 1.5em;
}
.xcx_flow_tree{
    width: 90%;
    height: 50px;
    margin:  0 auto;
    margin-top:20%;
    background: url("../image/xcx_flow_bg.jpg") no-repeat ;
    background-size: 100% 100%;
    position: relative;
}
.xcx_flow_tree li:nth-of-type(2){  left:14%;}
.xcx_flow_tree li:nth-of-type(3){  left:28%;}
.xcx_flow_tree li:nth-of-type(4){  left:42%;}
.xcx_flow_tree li:nth-of-type(5){  left:56%;}
.xcx_flow_tree li:nth-of-type(6){  left:70%;}
.xcx_flow_tree li:nth-of-type(7){  left:84%;}

.xcx_flow_tree li:nth-of-type(2n+1){
    position: absolute;
    width:11%;
    text-align: center;
    top: 6px;
}

.xcx_flow_tree li:nth-of-type(2n+2){
    position: absolute;
    width:11%;
    text-align: center;
    bottom: 26px;
}
.xcx_flow_tree li>span{
    display: inline-block;
    font-size:1.4rem;
    width:1.5em;
    height:1.5em;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    line-height:1.5em;
    background-color: #999;
}
.xcx_flow_tree li>i{
    display: block;
    margin: 0 auto;
    width: 0px;
    height:4em;
    border-left: 1px dashed #999;
    color: #999;
}
.xcx_flow_tree .piece{
    background-color: #999;
    border-radius: 4px;
    line-height:1.5em;
    height: 7em;
    text-align: center;
    position: relative;
    padding: 2px;
}
.xcx_flow_tree .tri{
    position: absolute;
    width:0;
    height: 0;
    border-bottom: 12px solid #999;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
}
.xcx_flow_tree .piece span{
    display: block;
    color: #fff;
}
.xcx_flow_tree .piece span:first-of-type{
    font-size:1.6rem;
}
.xcx_flow_tree li:nth-of-type(2n+1)  .tri{
    margin-top: -12px;
    left:50%;
    margin-left: -12px;
}
.xcx_flow_tree li:nth-of-type(2n+2) .tri{
    margin-top: -12px;
    left:50%;
    bottom:0;
    transform: rotateX(180deg);
    margin-left: -12px;
    margin-bottom: -10px;
}
.xcx_flow_tree li:hover p{
    background-color: #00ad56;
}
.xcx_flow_tree li:hover span.tri{
    background: none !important;
    border-bottom: 12px solid #00ad56;
}
.xcx_flow_tree li:hover i{border-color: #00ad56}
.xcx_flow_tree li:hover span:first-of-type{  background-color: #00ad56;}

.xcx_flow_tree li:first-of-type p{
    background-color: #00ad56;
}
.xcx_flow_tree li:first-of-type span.tri{
    background: none !important;
    border-bottom: 12px solid #00ad56;
}
.xcx_flow_tree li:first-of-type i{border-color: #00ad56}
.xcx_flow_tree li:first-of-type span:first-of-type{  background-color: #00ad56;}


.xcx_flow_tree .piece span:nth-of-type(2){
    font-size:2.2rem;
    line-height:1.8em;
}
.xcx_flow_tree .piece span:nth-of-type(3){
    font-size:1.2rem;
    line-height:1.2em;
    text-align: left;
    padding-left: 0.5em;
}

.xcx_platform_wrap{
    width:100%;
    background: url("../image/xcx_platform_bg.jpg") no-repeat;
    background-size: 100% 100%;
    overflow: hidden;
    padding-bottom:3rem;
}
.xcx_platform{
    width:62.5%;
    margin: 0 auto;
    margin-top:3em;
}
.xcx_platform >p{
    margin-bottom:2em;
}
.xcx_platform_wrap ul{
    width:62.5%;
    margin: 0 auto;
}
.xcx_platform_wrap li:nth-of-type(1){  background: url("../image/xcx_platform1.jpg") no-repeat; }
.xcx_platform_wrap li:nth-of-type(2){  background: url("../image/xcx_platform2.jpg") no-repeat;}
.xcx_platform_wrap li:nth-of-type(3){  background: url("../image/xcx_platform3.jpg") no-repeat;}
.xcx_platform_wrap li:nth-of-type(4){  background: url("../image/xcx_platform4.jpg") no-repeat;}
.xcx_platform_wrap li:nth-of-type(5){  background: url("../image/xcx_platform5.jpg") no-repeat;}
.xcx_platform_wrap li{
    width:16.66%;
    height:12.2em;
    float: left;
    background-size:100% 100%;
    overflow: hidden;
}
.xcx_platform_wrap li .l {
    float: left;
    font-size:2.0rem;
    height:100%;
}
.xcx_platform_wrap  .on{
    width: 33.3%;
}
.xcx_platform_wrap  .on .l{
    width: 50%;
}
.xcx_platform_wrap  .on .r{
    width: 50%;
}

.xcx_platform_wrap li .l p{
    font-size:2.4rem;
    color: #fff;
    line-height:2em;
    padding-top:2em;
    padding-left:1em;
}
.xcx_platform_wrap li .l span{
    display: inline-block;
    width:2rem;
    height: 2px;
    background-color: #fff;
    margin-left:1.5em;
    margin-bottom:1em;
}
.xcx_platform_wrap li .r{
    width:0%;
    float: left;
    overflow: hidden;
    height:100%;
}
.xcx_platform_wrap li .r span{
    display: inline-block;
    width:90%;
    font-size:1.8rem;
    text-align: center;
    padding-left:5%;
    margin-top:20%;
    color: #fff;
}
.xcx_slid_wrap{
    width: 1200px;
    margin-left:18.6%;
}
.xcx_slid_ul_wrap{
    background: url("../image/xcx_slid_bg.png") no-repeat center ;
}
.xcx_slid_ul_wrap{
    width: 1200px;
    height:40.667rem;
    line-height:40.25rem;
    overflow: hidden;
    margin: 0 auto;
    position: relative;
}
.xcx_slid_ul{
    position: absolute;
}
.xcx_slid_ul li{
    float: left;
    margin-right: 45px;
    overflow:hidden;
}
.xcx_slid_ul li img{
}
.xcx_slid_ul_wrap div{
    position: absolute;
    width: 50%;
    height:100%;
    z-index: 5;
    text-align: center;
}
#hideImg{
margin-top:0.5em;
}
.xcx_slid_wrap a.btn{
    color: rgba(0,0,0,0.5);
    font-size: 80px;
    font-family:宋体;
    font-weight:800;
    display: none;
}
.xcx_slid_ul_wrap div.r{
    left: 50%;
}
.xcx_slid_ul_wrap div:hover a.btn{
    display: inline;
}
.xcx_contact_wrap{
    background: url("../image/xcx_contact_bg.jpg") no-repeat center;
    background-size: cover;
    padding-bottom:4em;
}
.xcx_contact >h5{
    color: #fff;
    padding-top:2em;
}
.xcx_contact a{
    display: block;
    text-align: center;
    font-size:2.2rem;
    line-height:2em;
    width:7em;
    margin: 0 auto;
    color: #fff;
    background: #f66a3b;
    border-radius: 8px;
    margin-top:2em;
}
.xcx_contact p{
    color: #fff;
}
.bottom_menu{
    display: none;
}
@media screen and ( max-width: 767px) {
    ul.nav{
        line-height:0;
    }
    .main_wrap{
        margin-bottom: 50px;
    }
    .bottom_menu{
        position: fixed;
        bottom: 0;
        left:0;
        width:100%;
        height:50px;
        z-index: 99999;
        display: block;
    }
    .bottom_menu li{
        float: left;
        height:100%;
        line-height: 50px;
        box-sizing: border-box;
        text-align: center;
        font-size:0.16rem;
    }
    .bottom_menu li img{
        height:65%;
        width:auto;
        vertical-align: middle;
        margin-top: -2px;
    }
    .bottom_menu li a{
        font-size:14px;
    }
    .bottom_menu li:first-of-type{
        border-right:1px solid #c8c8c8;

    }
    .bottom_menu li:last-of-type{
        background: #1e1d23;
        color: #fff;
        width:50%;
    }
    .bottom_menu li:not(:last-of-type){
        width:25%;
        border-top:1px solid #c8c8c8;
        background: #fff;
    }

    .bottom_menu li:not(:last-of-type) a{
        color: #393838;
    }

    .left_menu .line{
        height: 1px;
        margin-bottom:5px;
    }
    .left_menu img{
        margin: 0;
        width:35%;
        margin-bottom:10px;
    }
    .right_wrap,.case_wrap,.xcx_flow,.xcx_platform{
        width:100%;
    }
    .xcx_adv,.good_wrap,.xcx_platform_wrap ul{
        width:96%;
    }
    .good_2,.good_3{
        width:84%;
    }
    .good_2 img, .good_3 img{
        width:25%;
    }
    .good_wrap p{
        display: none;
    }
    .good_1 div, .good_4 div{
        margin-bottom:3em;
    }
    .good_2 img:nth-of-type(3){
        left:66.5%;
    }
    .good_3 img:nth-of-type(1){
        right:67.5%;
    }
    .good_3 img:last-of-type{
        right:-10%;
    }
    .case_icons{
        width:99.6%;
    }
    .xcx_flow_tree li{
        width:21%!important;
    }
    .xcx_flow_tree li:nth-of-type(7){
        left:81%;
    }
    .xcx_flow_tree{
        margin-top:40%;
        margin-bottom:35%;
    }
    .xcx_slid_wrap{
	display:none;
    }
    .xcx_platform_wrap li,.xcx_platform_wrap .on{
        width:100%;
    }
    .xcx_platform_wrap li .r{
        width:60%!important;
    }
    .xcx_platform_wrap .on .l{
        width:auto!important;
    }
}
@media screen and ( min-width: 768px) and ( max-width: 1024px){

    .right_wrap,.xcx_platform{
        width:79%;
        margin-left: 21%;
    }
    .case_wrap, .xcx_flow,.xcx_platform{
        width:100%;
        margin-left: 0;
    }
    .xcx_adv,.good_wrap,.xcx_platform_wrap ul{
        width:96%;
    }
    .good_1 div, .good_4 div{
        margin-bottom:3em;
    }
    .good_wrap p{
        display: none;
    }
    .good_2,.good_3{
        width:81%;
    }
    .good_2 img, .good_3 img{
        width:20%;
    }
    .case_icons{
        width:99.6%;
    }
    .xcx_flow_tree li{
        width:21%!important;
    }
    .xcx_flow_tree li:nth-of-type(7){
        left:81%;
    }
    .xcx_flow_tree{
        margin-top:40%;
        margin-bottom:35%;
    }
    .xcx_slid_wrap{
	display:none!important;
    }
    .xcx_platform_wrap li,.xcx_platform_wrap .on{
        width:100%;
        background-repeat: repeat-x!important;
    }
    .xcx_platform_wrap li .r{
        width:60%!important;
    }
    .xcx_platform_wrap .on .l{
        width:auto!important;
    }
    @media screen and ( min-width: 950px) {
        .good_2 img, .good_3 img{
            width:16%;
        }
        .good_2, .good_3{
            width:79%;
        }
    }
}

.dropdown-menu .dropdown-item {
    font-size: 14px;
}

@media (max-width: 960px){
    .xcx_contact >h5 {
        color: #fff;
        padding-top: 1em;
    }
    .xcx_contact_wrap {
        background: url(../image/xcx_contact_bg.jpg) no-repeat center;
        background-size: cover;
        padding-bottom: 1.2em;
    }
  }