@charset "UTF-8";
/*绉诲姩绔€傞厤*/
@media only screen and (min-device-width: 100px) and (max-device-width: 667px) and (orientation : portrait) {
    /*iPhone 6 Portrait*/
    /*--------------------------------------------------鍐呴〉閫氱敤椤甸潰寮€濮?-----------------------------------------------------------------*/
    .X{
        width: 100%;
        overflow-x: hidden;
    }
    #X{
        margin-top: -0.9rem;
    }
    /*banner*/
    .Xbanner{
        width: 100%;
        height: 3rem;
        position: relative;
        overflow: hidden;
    }
    .Xbanner .banner-bj{
        width: 100%;
        height: 3rem;
        background-image: url("../img/X/banner-1.jpg");
        background-position: top center;
        background-size: cover;
        transform: scale(1.2);
        transition: all 3s;
    }
    .Xbanner .banner-bj.on{
        transform: scale(1);
    }
    .Xbanner .title{
        color: #fff;
        position: absolute;
        top: 1.45rem;
        left: 0;
        right: 0;
        /*transform: translateX(-50%);*/
        /*margin-left: -1.26rem;*/
    }
    .Xbanner .title div{
        font-size: 0.32rem;
        line-height: 0.32rem;
        text-align: center;
    }
    .Xbanner .title p{
        text-align: center;
        margin-top: 0.18rem;
        font-size: 0.18rem;
        line-height: 0.18rem;
        letter-spacing: 0.06rem;
        text-transform: uppercase;
        font-family: 'HelveticaNeueLTStd-Th';
    }
    .Xbanner .shu{
        width: 0.04rem;
        height: 0.5rem;
        background-color: #e7110f;
        position: absolute;
        top: 3.78rem;
        left: 50%;
        transform: translateX(-50%);
    }
    .Xbanner .shu::before{
        content: '';
        width: 0.04rem;
        height: 0;
        background-color: #fff;
        position: absolute;
        top: 0;
        left: 0;
    }
    .Xbanner .shu.on::before{
        height: 0.35rem;
        transition: all 1s;
    }
    .Xbanner .bottom{
        width: 100%;
        height: 0.5rem;
        display: flex;
        justify-content: space-between;
        position: absolute;
        left: 0;
        bottom: 0;
        background-color: rgba(0,0,0,.4);
    }
    .Xbanner .bottom div:nth-child(1){
        /*flex: 1;*/
        /*background-color: rgba(0,0,0,.3);*/
        display: none;
    }
    .Xbanner .bottom div:nth-child(2) .breadcrumb{
        /*width: 8.5rem;*/
        height: 100%;
        line-height: 0.5rem;
        font-size: 0.14rem;
        color: #7e8c97;
        /*background-color: rgba(0,0,0,.3);*/
        /*display: flex;*/
        display: block;
    }
    .Xbanner .bottom div:nth-child(2) .breadcrumb p{
        float: left;
        text-indent: 0.2rem;
        display: none;
    }
    .Xbanner .bottom div:nth-child(2) .breadcrumb ul{
        /*display: flex;*/
        margin-left: 0.2rem;
    }
    .Xbanner .bottom div:nth-child(2) .breadcrumb ul li{
        float: left;
    }
    .Xbanner .bottom div:nth-child(2) .breadcrumb ul > li + li:before {
        color: #7e8c97;
        content: ">";
        padding: 0 0.2rem;
    }
    .Xbanner .bottom div:nth-child(2) .breadcrumb ul li a:hover{
        color: #fff;
    }
    /*.Xbanner .bottom div:nth-child(2) .breadcrumb ul li a:visited,*/
    /*.Xbanner .bottom div:nth-child(2) .breadcrumb ul li a:link,*/
    .Xbanner .bottom div:nth-child(2) .breadcrumb ul li a:active{
        color: #7e8c97;
    }
    .Xbanner .bottom div:nth-child(2) .breadcrumb ul li.active{
        color: #fff;
    }
    .Xbanner .bottom div:nth-child(3){
        /*flex: 1;*/
        /*background-color: rgba(0,0,0,.3);*/
        display: none;
    }
    /*鍐呭*/
    .Xtext{
        width: 100%;
        /*display: flex;*/
        background-color: #f3f3f3;
        /*justify-content: space-between;*/
        position: relative;
        min-height: 7rem;
    }
    .Xtext .Xtext-left{
        /*flex: 1;*/
        width: 49%;
        /*background: #0f538a;*/
        /*float: left;*/
        position: absolute;
        left: 0;
        top: 0;
        display: none;
    }
    .Xtext .Xtext-1200{
        position: relative;
        z-index: 888;
        padding: 0 0.2rem;
    }
    .Xtext .Xtext-1200 .title.about{
        font-size: 0.18rem;
        color: #404049;
        font-weight: bold;
        height: 0.6rem;
        line-height: 0.9rem;
        /*background-image: url("../img/X/about.png");*/
        background-repeat: no-repeat;
        /*margin-top: 0.8rem;*/
        overflow: hidden;
        position: relative;
    }
    .Xtext .Xtext-1200 .center-flex{
        width: 100%;
        background-color: #fff;
        padding-bottom: 0.2rem;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-left{
        width: 4.5rem;
        height: 6.3rem;
        box-shadow: 0 0.2rem 0.2rem rgba(0,0,0,.2);
        margin: 0 0 0 -0.8rem;
        position: relative;
        top: 1.5rem;
        float: left;
        overflow: hidden;
        display: none;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-left .num{
        color: #fff;
        position: absolute;
        top: 0.3rem;
        right: 0.3rem;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-left .num span{
        float: left;
        display: block;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-left .num .num-one{
        font-size: 0.2rem;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-left .num .num-two{
        font-size: 0.14rem;
        margin-top: 0.05rem;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-left ul li{
        float: left;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-left .btn{
        position: absolute;
        right: 0;
        bottom: 0;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-left .btn div{
        width: 0.55rem;
        height: 0.55rem;
        background-color: #fff;
        float: left;
        cursor: pointer;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-left .btn div:hover{
        background-color: #135091;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-left .btn div i{
        text-align: center;
        line-height: 0.55rem;
        font-size: 0.3rem;
        color: #2f2522;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-left .btn div i:hover{
        color: #fff;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-left .btn .btn-left{

    }
    .Xtext .Xtext-1200 .center-flex .center-flex-left .btn .btn-right{

    }
    .Xtext .Xtext-1200 .center-flex .center-flex-text{
        width: 100%;
        font-size: 0.14rem;
        line-height: 0.3rem;
        text-indent: 2em;
        text-align: justify;
        color: #63636a;
        float: left;
        margin: 0.4rem 0 0 0;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-text p{
        padding-bottom: 0.3rem;
        /*margin-bottom: 0.3rem;*/
        position: relative;
    }
    /*.Xtext .Xtext-1200 .center-flex .center-flex-text p:not(:last-child)::before{*/
    /*content: '';*/
    /*width: 100%;*/
    /*height: 1px;*/
    /*background-color: #ececec;*/
    /*position: absolute;*/
    /*bottom: 0;*/
    /*left: 0;*/

    /*}*/
    .Xtext .Xtext-1200 .center-flex .center-flex-right{
        width: 2.5rem;
        height: 3.4rem;
        background: #135091;
        background: -webkit-gradient(linear, left top, left bottom, from(#135091), to(#118ad9));
        background: -webkit-linear-gradient(top, #135091, #118ad9);
        background: -o-linear-gradient(top, #135091, #118ad9);
        background: linear-gradient(top, #135091, #118ad9);
        box-shadow: 0 0.2rem 0.2rem rgba(0,0,0,.2);
        position: fixed;
        z-index: 99999;
        float: right;
        top: 0.7rem;
        right: 0.2rem;
        overflow: hidden;
        transition: all .3s;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right.on{
        width: 0.4rem;
        height: 0.4rem;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right .ul-toggle{
        display: block;
        width: 0.4rem;
        height: 0.4rem;
        background-color: #135091;
        position: absolute;
        z-index: 99999;
        top: 0;
        right: 0;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right .ul-toggle.on i{
        transform: rotate(315deg);
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right .ul-toggle i{
        text-align: center;
        line-height: 0.4rem;
        font-size: 0.25rem;
        color: #fff;
        transition: all .3s;
    }
    /*.Xtext .Xtext-1200 .center-flex .center-flex-right::before{*/
    /*content: "About Us";*/
    /*position: absolute;*/
    /*bottom: 1.1rem;*/
    /*left: -0.65rem;*/
    /*width: 2.5rem;*/
    /*font-size: 0.5rem;*/
    /*color: rgba(255,255,255,.1);*/
    /*transform:rotate(90deg);*/
    /*}*/
    .Xtext .Xtext-1200 .center-flex .center-flex-right > img{
        position: absolute;
        left: 0.25rem;
        bottom: 0.3rem;
        display: none;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right ul{
        font-size: 0.16rem;
        line-height: 0.16rem;
        padding: 1rem 0.3rem 0 0.25rem;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right ul li{
        margin-bottom: 0.44rem;
        overflow: hidden;
        /*display: flex;*/
        /*justify-content: space-between;*/
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right ul .cur div{
        /*flex: 1;*/
        float: left;
        width: 1.3rem;
        height: 1px;
        position: relative;
        margin-top: 0.08rem;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right ul li div::before{
        content: '';
        width: 0;
        height: 1px;
        background-color: #fff;
        position: absolute;
        top: 0;
        left: 0;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right ul .cur div::before{
        width: 90%;
        transition: all 1s;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right ul li a{
        color: #b1d7ff;
        display: block;
        overflow: hidden;
        position: relative;
        float: right;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right ul li.cur a{
        color: #fff;
    }
    .new-nei .Xtext .Xtext-1200 .center-flex .center-flex-right ul li a::before{
        content: '';
        width: 100%;
        height: 1px;
        background-color: #b1d7ff;
        position: absolute;
        top: 0.08rem;
        left: -100%;
        transition: all .4s;
        z-index: 999;
    }
    .new-nei .Xtext .Xtext-1200 .center-flex .center-flex-right ul li a::before{
        top: 0.32rem;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right ul li.cur a::before{
        transition: all 0s;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right ul li a:hover::before{
        left: 0;
        background-color: #fff;
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right ul li.cur a:hover::before{
        background-color: rgba(255,255,255,0);
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right ul li a:hover{
        color: #fff;
        /*text-decoration: line-through;*/
    }
    .Xtext .Xtext-1200 .center-flex .center-flex-right ul .cur{
        transition: all 0s;
        color: #fff;
    }
    .Xtext .Xtext-right{
        /*flex: 1;*/
        width: 49%;
        height: 100%;
        /*background-color: #00cd2c;*/
        /*float: right;*/
        position: absolute;
        right: 0;
        top: 0;
        display: none;
    }
    .Xtext .Xtext-right div{
        background-color: #fff;
    }
    .pinpai .Xtext .Xtext-1200::before{
        height: 0.6rem;
    }

    /*--------------------------------------------------鍐呴〉閫氱敤椤甸潰缁撴潫------------------------------------------------------------------*/

}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation : landscape) {
    /*iPhone 6 landscape*/
}

@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation : portrait) {
    /*iPhone 6+ Portrait*/
}

@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation : landscape) {
    /*iPhone 6+ landscape*/
}

@media only screen and (max-device-width: 640px), only screen and (max-device-width: 667px), only screen and (max-width: 480px){
    /*iPhone 6 and iPhone 6+ portrait and landscape*/
}
@media only screen and (min-device-width: 300px) and (max-device-width: 320px) and (orientation : portrait) {
    /*iPhone 5 Portrait*/
}