/* 头部 */

.w1200 {
    margin: 0 auto;
    width: 1200px;
}

.header {
    width: 100%;
    height: 90px;
    min-width: 1200px;
    background:rgba(0,0,0,.2);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
}

.headerBar {
    overflow: hidden;
}

.logo {
    width: 770px;
}

.headerBar .logoImg {
    line-height: 100px
}

.gzh {
    width: 148px;
}

.gzh div {
    margin: 5px 6px 0 0;
}

.gzh img {
    margin-left: 26px
}



.menu {
    height: 150px;
    width: 100%;
    background: rgba(11, 37, 86, 0.8);
    position: absolute;
    top: 60px;
    text-align: center;
    z-index: 999;
}

.menu li {
    width: 10rem;
    height: 150px;
    font-size: 1rem;
    display: inline-block;
}

.menu li a {
    color: #fff;
    display: inline-block;
    width: 100%;
    height: 150px;
}

.js-memu-a {
    width: 100%;
    height: 32px;
    margin: 40px 0 12px 0;
}

.js-hover:hover a {
    color: #ff6600;
}

/*  programme  */
.programme-nav {
    /* display: none; */
    position: absolute;
    top: 90px;
    left: 0;
    height: 200px;
    width: 100%;
    z-index: 10;
    line-height: 200px;
    box-sizing: border-box;
}
.programme-nav .programme-nav-list li {
    float: left;
    width: 25%;
    text-align: center;
}
.programme-nav .programme-nav-list li a{
    color: #222;
}
.programme-nav .programme-nav-list li a:hover{
    color: #ff6600;
}
.programme-nav .programme-nav-list li .a-active{
    color: #ff6600;
}
.programme-nav .programme-nav-list li a img{
    margin-right: 18px;
}

/*  banner */

.banner {
    width: 100%;
    height: 700px;
}

/*.banner .banner-img,.banner img {
		width: 100%;
	}*/

#index .banner {
    width: 100%;
    height: 700px
}

#index .banner .banner-img {
    width: 100%;
    height: 600px
}

.banner .swiper-slide:nth-child(4n+1) .banner-img {
    background: url("../../../img/home/homePC2/banner4.jpg") no-repeat center center;
}

.banner .swiper-slide:nth-child(4n+3) .banner-img {
    background: url("../../../img/home/homePC2/banner1.jpg") no-repeat center center;
}

/* .banner .swiper-slide:nth-child(4n+4) .banner-img {
    background: url("../../../img/home/homePC2/banner5.jpg") no-repeat center center;
}

.banner .swiper-slide:nth-child(4n+5) .banner-img {
    background: url("../../../img/home/homePC2/banner3.jpg") no-repeat center center;
} */

.banner .swiper-slide:nth-child(4n) .banner-img {
    background: url("../../../img/home/homePC2/banner2.jpg") no-repeat center center;
}

.banner .swiper-slide:nth-child(4n+2) .banner-img {
    background: url("../../../img/home/homePC2/banner6.jpg") no-repeat center center;
}

#distributionl .banner .btns {
    padding-top: 330px;
}

.banner .btns {
    width: 626px;
    padding-top: 370px;
}

.banner .btn {
    display: inline-block;
    border: #fff 1px solid;
    color: #fff;
    text-align: center;
    margin: 10px 0 0 10px;
    width: 200px;
    height: 60px;
    line-height: 60px;
    font-size: 20px;
}

.banner .btn:hover {
    background: #ff6600;
    border-color: transparent;
}

.swiper-pagination-custom {
    bottom: 86px;
}

.swiper-pagination-customs {
    display: inline-block;
    width: 60px;
    height: 5px;
    background: #fff;
    opacity: 0.4;
    margin-right: 15px
}

.swiper-pagination-customs-active {
    opacity: 1
}

/*order_from_one 第一部分*/

.sub_small_title {
    font-size: 24px;
    text-align: center;
    margin-bottom: 10px;
}

#index .order_from_one {
    width: 100%;
    background: #F5F7FA;
    min-width: 1200px;
}

#index .order_from_one .one_content {
    border-radius: 10px;
    box-shadow: 0px 2px 20px rgba(0, 0, 0, .2);
    height: 685px;
    margin-top: -70px;
    padding-top: 1px;
    background: #fff;
    position: relative;
    z-index: 2;
    margin-bottom: 121px;
    font-weight:400;
}

.title {
    font-size: 32px;
    color: #222;
    text-align: center;
    margin: 50px 0 36px 0;
}

#index .order_from_one .words {
    padding: 0 140px;
    line-height: 22px;
}

.sub_title {
    font-size: 28px;
    color: #222;
    text-align: center;
    margin-bottom: 20px;
}

#index .sub_title {
    margin-bottom: 0px;
}

#index .severs .icon {
    display: inline-block;
    width: 80px;
    height: 80px;
    border-radius: 40px;
    box-shadow: 0 8px 20px rgba(43, 128, 254, .5);
    margin-bottom: 20px;
}

#index .severs .icon1 {
    background: #1787ff url("../../../img/home/homePC2/img_tg1.png") no-repeat center center;
}

#index .severs .icon2 {
    background: #1787ff url("../../../img/home/homePC2/img_tg2.png") no-repeat center center;
}

#index .severs .icon3 {
    background: #1787ff url("../../../img/home/homePC2/img_tg3.png") no-repeat center center;
}

#index .severs .icon4 {
    background: #1787ff url("../../../img/home/homePC2/img_tg4.png") no-repeat center center;
}

#index .severs .icon5 {
    background: #1787ff url("../../../img/home/homePC2/img_tg5.png") no-repeat center center;
}

#index .severs .icon6 {
    background: #1787ff url("../../../img/home/homePC2/img_tg6.png") no-repeat center center;
}

#index .severs p {
    font-size: 18px;
    color: #222
}

#index .severs li {
    float: left;
    margin-bottom: 40px;
    text-align: center;
    width: 162px;
}

#index .severs li:nth-child(3n+1) {
    margin-left: 154px;
}

#index .severs li+li {
    margin-left: 208px;
}

.index_sub_title {
    padding-bottom: 88px;
    font-size:30px;
    line-height: 1.2;
    color:rgba(34,34,34,1);
}

/*隔行*/

.partition {
    padding-top: 90px;
}

.no_weight {
    font-weight: normal;
}

.partition_tit {
    padding: 38px 44px;
    position: relative;
    box-sizing: border-box;
}

.partition_tit h2 {
    font-size: 28px;
    position: relative;
}

.partition_tit h2::before {
    content: '';
    display: block;
    position: absolute;
    width: 14px;
    height: 36px;
    background: linear-gradient(to right, rgba(55, 187, 255, 1), rgba(41, 117, 255, 1));
    box-shadow: 0px 10px 20px 0px rgba(47, 144, 255, 0.5);
    left: -31px;
    top: 2px;
}

.partition_tit p {
    height: 1px;
    background-color: #ccc;
    margin-left: 330px;
    margin-right: 300px;
    margin-top: 20px;
}

.partition_tit a {
    width: 125px;
    height: 42px;
    border-radius: 21px;
    line-height: 42px;
    text-align: center;
    font-size: 16px;
    color: #333333;
    border: 1px solid #ccc;
}

.partition_tit a:nth-of-type(1) {
    margin-left: 28px;
}

.partition_tit a:hover {
    background-image: linear-gradient(to right, rgba(55, 187, 255, 1), rgba(41, 117, 255, 1));
    box-shadow: 0px 10px 20px 0px rgba(47, 144, 255, 0.5);
    color: #fff;
    border: none;
    width: 127px;
    height: 44px;
}

/* order_from_two  下载三端*/

#index .order_from_two {
    width: 100%;
    overflow: hidden;
    min-width: 1200px;
    height: 600px;
    background: url("https://www.keloop.vip/public/static/img/home/homePC/order_from_two_bg_01.jpg") no-repeat center center;
    background-size: cover;
    padding: 40px 0;
    box-sizing: border-box;
}

#index .dispatchSys {
    background: url("https://www.keloop.vip/public/static/img/home/homePC/order_from_two_bg_04.jpg") center center no-repeat
}

#index .black_bg {
    background-color: #000;
}

.black_bg .eq_code {
    top: 0;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 10;
    background-color: rgba(0, 0, 0, .5);
    display: none;
}

.black_bg .eq_code img {
    display: block;
    margin-top: -178px;
    margin-left: -359px;
    position: fixed;
    top: 50%;
    left: 50%;
}

.order_from_two .catalog {
    width: 300px;
    box-sizing: border-box;
    background-color: #000;
}

.order_from_two .catalog .blue_bg_active {
    background: linear-gradient(to right, rgba(55, 187, 255, 1), rgba(41, 117, 255, 1));
    box-shadow: 0px 10px 20px 0px rgba(47, 144, 255, 0.5);
}

.order_from_two .catalog .blue_bg_active .blue_bg .catalog_item p {
    color: #fff !important;
}
.order_from_two .catalog .blue_bg_active .blue_bg {
    border-bottom: 0 !important;
    border-top: 0;
}
.order_from_two .catalog .blue_bg_active  + li .blue_bg{
    border-top: 0;
}

.order_from_two .catalog ul {
    padding: 30px 0;
}

.order_from_two .catalog ul li {
    background-color: #0F0F0F;
    box-sizing: border-box;
    cursor: pointer;
    width: 100%;
    position: relative;
}

.order_from_two .catalog ul li img {
    position: absolute;
    top: 48px;
    left: 20px;
}

.order_from_two .catalog ul li h3 {
    margin-top: 45px;
    font-size: 20px;
}

.order_from_two .catalog ul li p {
    margin-top: 19px;
    color: #8A8A8A;
    margin-bottom: 45px;
    font-size: 13px;
}

.order_from_two .catalog ul li .catalog_item {
    padding-left: 60px;
    height: 140px;
}

.blue_bg:first-child {
    border-top: 1px solid rgba(204, 204, 204, .5);
}

.order_from_two .catalog ul li:last-child .blue_bg {
    border-bottom: 1px solid rgba(204, 204, 204, .5);
}

.order_from_two .catalog ul li .blue_bg {
    border-top: 1px solid rgba(204, 204, 204, .5);
}

.order_from_two .catalog ul li {
    /* border-bottom: 1px solid rgba(204, 204, 204, .5); */
    padding: 0 28px;
}

.order_from_two .detailed {
    margin-left: 362px;
    display: none;
}

.order_from_two .detailed h2 {
    font-size: 28px;
}

.order_from_two .detailed p {
    margin-top: 35px;
    font-size: 14px;
}

.order_from_two .detailed a {
    display: inline-block;
    width: 140px;
    height: 40px;
    border: 1px solid #ffffff;
    line-height: 40px;
    text-align: center;
    margin-top: 28px;
    margin-right: 32px;
}

.order_from_two .detailed a:hover {
    background-color: #2F93FF;
    border: 1px solid #2F93FF;
}

.left-computer-img {
    background-image: url('../../../img/home/index/index_phones.png');
    width: 320px;
    height: 290px;
    float: left;

}

.bottom-phone-btn-container {
    margin-top: 30px;
}

.right-btn-container {
    margin-left: 370px;
    padding-top: 70px;
}
.right-btn-container > span {
    display: inline-block;
    width: 110px;
    height: 36px;
    line-height: 36px;
    border: 1px solid #fff;
    padding-left: 10px;
    margin-bottom: 22px;
    margin-right: 16px;
}

.icon-img-bg {
    background-image: url('../../../img/home/index/index_icon.png');
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: middle;
    margin-right: 15px;
}

#index .soloveFA {
    width: 100%;
    margin: 70px 0 90px;
}

#index .k_products {
    width: 100%;
    margin-bottom: 70px;
    overflow: hidden;
}

#index .k_products li {
    width: 22.75%;
    height: 390px;
    border-radius: 5px;
    border: 1px #e9ecf2 solid;
    text-align: center;
    float: left;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -moz-box-sizing: border-box;
    position: relative;
}

#index .k_products li:nth-child(1) .kownMore:hover {
    background: -webkit-linear-gradient(right, #694272, #483661);
    color: #fff;
    box-shadow: 0 8px 10px rgba(105, 66, 114, .25);
    border: none;
}

#index .k_products li:nth-child(2) .kownMore:hover {
    background: -webkit-linear-gradient(right, #1bb5f7, #0f72f3);
    color: #fff;
    box-shadow: 0 8px 10px rgba(15, 114, 243, .25);
    border: none;
}

#index .k_products li:nth-child(3) .kownMore:hover {
    background: -webkit-linear-gradient(right, #ffb169, #f46b4f);
    color: #fff;
    box-shadow: 0 8px 10px rgba(244, 99, 112, .25);
    border: none;
}

#index .k_products li:nth-child(4) .kownMore:hover {
    background: -webkit-linear-gradient(right, #4dcba3, #28b56a);
    color: #fff;
    box-shadow: 0 8px 10px rgba(52, 188, 125, .25);
    border: none;
}

#index .k_products li+li {
    margin-left: 3%;
}

#index .soloveFA img,
#index .k_products img {
    width: 100%
}

#index .kownMore {
    width: 120px;
    height: 40px;
    border-radius: 20px;
    border: 1px #c3d0de solid;
    display: inline-block;
    line-height: 40px;
    text-align: center;
    font-size: 14px;
    color: #888d97;
    margin-top: 70px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -moz-box-sizing: border-box;
    position: absolute;
    bottom: 50px;
    left: 50%;
    transform: translateX(-50%);
}

/* 产品中心 */

.tab_nav,
#product .navBar {
    text-align: center;
    height: 60px;
    line-height: 60px;
}

.tab_nav a,
.tab_nav a {
    font-size: 18px;
    color: #222;
    position: relative;
    width: 184px;
    display: inline-block;
    height: 56px;
}

#index .tab_nav a:after,
#product .tab_nav a:after {
    content: '';
    display: inline-block;
    position: absolute;
    width: 0;
    height: 4px;
    background: #1787ff;
    left: 0;
    bottom: -4px;
}

#index .tab_nav a.active:after,
#product .tab_nav a.active:after {
    width: 100%;
    transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -webkit-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
}

.tab_nav a:hover,
#product .tab_nav a:hover {
    color: #1787ff
}

.tab_nav a+a {
    margin-left: 20px
}

#index .nav_content {
    background: #fff;
    margin-top: 19px;
    padding-top: 30px;
    margin-bottom: 20px;
}

#index .nav_content_sh {
    overflow: hidden;
    padding-bottom: 30px;
    height: 670px;
    width: 100%;
}

#index .nav_content_sh ul {
    overflow: visible;
}

#index .nav_content_sh .sh_content {
    padding-top: 50px;
}

#index .nav_content_sh .sh_content.mac_c {
    padding-top: 100px;
    box-sizing: border-box;
}

#index .nav_content_sh .left_content {
    position: relative;
}

#index .sh_content .sh_iphone_pics.mac_c {
    width: 790px;
}

#index .sh_iphone_pics {
    width: 766px;
    height: 512px;
    position: relative;
}

#index .sh_iphone_pics .iphone {
    position: absolute;
    left: 260px;
    top: -16px;
}

.btn_l,
.btn_r {
    display: inline-block;
    width: 60px;
    height: 60px;
    position: absolute;
    top: 226px;
    border-radius: 30px;
    border: 1px #666 solid;
    text-align: center;
    line-height: 60px;
    cursor: pointer;
    z-index: 999;
}

.right_content {
    margin-top: 30px
}

.btn_l {
    left: 150px
}

.btn_l span {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -23px -378px;
    width: 14px;
    height: 24px;
    display: inline-block;
    vertical-align: middle;
}

.btn_l:hover,
.btn_r:hover {
    background: #1787ff;
    border-color: transparent;
}

.btn_l:hover span {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -69px -378px;
}

.btn_r:hover span {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -44px -378px;
}

.btn_r {
    top: 226px;
    right: 138px;
}

.btn_r span {
    background: url("../../../img/home/homePC2/pic.png") no-repeat 1px -378px;
    width: 14px;
    height: 24px;
    display: inline-block;
    vertical-align: middle;
}

.js_phone_silde_explain_item.active a {
    background: -webkit-linear-gradient(left, #3374ff, #45a2ff) !important;
    color: #fff !important;
    border: none !important;
    position: relative;
}

.js_phone_silde_explain_item.active a:after {
    content: '';
    width: 100%;
    height: 100%;
    background: transparent url("../../../img/home/homePC2/img_arrow.png") no-repeat center right;
    right: 0;
    top: 0;
    position: absolute;
    display: inline-block;
}

.js_phone_silde_explain_item.active a img {
    margin: 0 30px 0 16px !important;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -o-transition: .5s;
}

.js_phone_silde_explain_item.active p {
    color: #333 !important;
}

#index .sh_download_title {
    font-size: 20px;
    padding: 16px 40px 60px 0;
    border-top: 4px #1787ff solid;
    width: 210px;
}

#index .right_content li {
    width: 300px;
    height: 50px;
    border-radius: 25px;
    background: #333333;
    color: #fff;
    font-size: 16px;
    line-height: 50px;
    cursor: pointer;
    position: relative;
}

#index .right_content li a {
    display: inline-block;
    width: 100%;
    height: 100%;
}

#index .right_content li+li {
    margin-top: 30px;
}

#index .download_icon {
    width: 32px;
    height: 32px;
    display: block;
    margin: 9px 50px 9px 35px;
    float: left;
}

.pos_a {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -30px;
}

.mac {
    position: absolute;
    left: 48px;
    top: 0;
}

.mac_btn_l {
    left: 50px !important;
    top: 154px !important;
}

.mac_btn_r {
    right: 50px !important;
    top: 154px !important;
}

#index .download_icon_pc {
    background: url("../../../img/home/homePC2/pic.png") no-repeat 0 -334px;
}

#index .download_icon_android {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -42px -334px;
}

#index .download_icon_ios {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -86px -336px;
}

.sh_download_android,
.sh_download_ios {
    position: absolute;
    z-index: 999;
    width: 176px;
    right: 10px;
    top: -178px;
    height: 190px;
    overflow: hidden;
    visibility: hidden;
    opacity: 0;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

#index .sh_download_pc:before,
.sh_download_android:before,
.sh_download_ios:before {
    z-index: 9999;
    content: '';
    display: inline-block;
    border-width: 13px 12px 0 12px;
    border-style: solid;
    border-color: #ff6600 transparent transparent transparent;
    position: absolute;
    top: 176px;
    left: 78px;
}

#index .hover_download:hover {
    background: #ff6600
}

#index .hover_download_android:hover .sh_download_android {
    visibility: visible;
    top: -192px;
    opacity: 1;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

#index .hover_download_ios:hover .sh_download_ios {
    visibility: visible;
    top: -192px;
    opacity: 1;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

#index .sh_download_android img,
.sh_download_ios img {
    border: 8px #ff6600 solid;
    width: 160px;
    height: 160px;
}

.js_phone_slide_c_item {
    /*margin: 16px 0 0 276px;
	display: none;*/
    /*position: absolute;*/
    left: -254px;
}

.js_phone_slide_c_imgs {
    width: 228px;
    height: 534px;
    margin: 16px 0 0 276px;
    position: relative;
    overflow: hidden;
}

.phone_c .js_phone_slide_c_imgs {
    width: 251px;
}

.sh_iphone_pics.mac_c .js_phone_slide_c_imgs {
    width: 477px;
    height: 279px;
    margin: 0px 0 0 161px;
    padding-top: 19px;
}

.sh_iphone_pics.mac_c .js_phone_slide_c_item {
    left: -477px;
}

.phone .js_phone_slide_c_imgs {
    margin: 16px 0 0 174px;
}

.phone .js_phone_slide_c_imgs img {
    margin-top: 0
}

/*.js_phone_slide_c_item.img_mac{
	margin: 19px 0 0 156px;
}*/

.js_phone_slide_c_item.active {
    display: inline-block !important;
    left: 0 !important;
    transition: 0.5s;
}

.js_phone_slide_c_item.moveout {
    left: 477px !important;
    transition: 0.5s;
}

/* order_from_three*/

#index .order_from_three {
    width: 100%;
    overflow: hidden;
    background: #fff;
    padding-top: 180px;
    padding-bottom: 30px;
    min-width: 1200px;
    /* margin-top: 120px; */
}

.order_from_three .w1200 {
    text-align: center;
}

.order_from_three .w1200 h2 {
    font-size: 32px;
    color: #333333;
}

.order_from_three .w1200 p {
    margin-top: 29px;
    font-size: 16px;
}

.order_from_three .w1200 img {
    display: block;
    margin: 60px auto;
}

/* order_from_four*/

#index .order_from_four {
    overflow: hidden;
    background: #fff;
    min-width: 1200px;
    text-align: center;
}

.order_from_four .w1200 {
    padding: 0 100px;
    box-sizing: border-box;
}

.order_from_four .left,
.order_from_four .right {
    width: 360px;
    background: rgba(255, 255, 255, 1);
    border-radius: 5px;
    padding: 50px 43px 20px;
    box-shadow: 0 0 20px #ccc;
    box-sizing: border-box;
    background: url('https://www.keloop.vip/public/static/img/home/homePC/order_from_four_01.jpg') no-repeat;
    margin: 70px 0 60px;
    border-bottom: 1px solid rgba(204, 204, 204, .5);
    height: 600px;
}

.order_from_four .right {
    background: url('https://www.keloop.vip/public/static/img/home/homePC/order_from_four_02.jpg') no-repeat;
}

.order_from_four ul {
    margin-top: 30px;
    height: 280px;
}

.order_from_four ul li {
    margin-top: 15px;
    text-align: left;
    font-size: 14px;
    color: #636976;
    padding-left: 25px;
}

.order_from_four a {
    margin: 48px auto;
    color: #888D97;
    line-height: 40px;
    text-align: center;
    display: block;
    width: 120px;
    height: 40px;
    border-radius: 20px;
    border: 1px solid #888D97;
}

.order_from_four a:hover {
    background: linear-gradient(to right, rgba(15, 114, 243, 1), rgba(27, 181, 247, 1));
    box-shadow: 0px 8px 10px 0px rgba(17, 121, 243, 0.3);
    border: 1px solid rgba(27, 181, 247, 1);
    color: #fff;
}

.order_from_four .right a {
    color: #888D97;
}

.order_from_four .right a:hover {
    background: linear-gradient(to right, rgba(81, 37, 226, 1), rgba(138, 84, 255, 1));
    box-shadow: 0px 8px 10px 0px rgba(88, 43, 229, 0.3);
    border-color: transparent;
    color: #fff;
}

.order_from_four ul li::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #1092FD;
    position: absolute;
    left: 0px;
    top: 6px;
}

.order_from_four .w1200 .right li::before {
    background-color: #6833F8;
}

.order_from_four .w1200 h2 {
    color: #222222;
    font-size: 32px;
}

.order_from_four .w1200 h3 {
    margin-top: 18px;
}

#index .order_from_four .four_content_item {
    width: 300px;
    height: 400px;
    float: left;
    position: relative;
}

#index .four_content_item .mask {
    width: 100%;
    height: 60px;
    position: absolute;
    bottom: 0;
    transition: 0.7s;
    -webkit-transition: .7s;
    -moz-transition: .7s;
    -o-transition: .7s;
}

#index .four_content_item .mask .item_title {
    font-size: 24px;
    color: #fff;
    line-height: 60px;
    text-align: center;
    font-weight: 500;
    transition: 0.7s;
    -webkit-transition: .7s;
    -moz-transition: .7s;
    -o-transition: .7s;
}

#index .four_content_item .mask .item_c {
    color: #fff;
    padding: 0 20px;
    line-height: 22px;
}

#index .four_content_item.xy {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -310px -643px;
}

#index .four_content_item.qx {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -930px -643px;
}

#index .four_content_item.sq {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -1550px -643px;
}

#index .four_content_item.tc {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -2170px -643px;
}

#index .four_content_item.xy .mask {
    background: rgba(210, 71, 0, .7);
}

#index .four_content_item.qx .mask {
    background: rgba(84, 39, 255, .7);
}

#index .four_content_item.sq .mask {
    background: rgba(170, 140, 65, .7);
}

#index .four_content_item.tc .mask {
    background: rgba(255, 96, 22, .7);
}

#index .four_content_item:hover .mask {
    background: rgba(0, 0, 0, .7);
    height: 400px;
    transition: 0.7s;
    -webkit-transition: .7s;
    -moz-transition: .7s;
    -o-transition: .7s;
}

#index .four_content_item:hover .item_title {
    line-height: 80px;
    margin-top: 100px;
    transition: 0.7s;
    -webkit-transition: .7s;
    -moz-transition: .7s;
    -o-transition: .7s;
}

#index .four_content_item.xy:hover {
    background: url("../../../img/home/homePC2/pic.png") no-repeat 0 -643px;
    ;
}

#index .four_content_item.qx:hover {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -620px -643px;
    ;
}

#index .four_content_item.sq:hover {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -1240px -643px;
    ;
}

#index .four_content_item.tc:hover {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -1860px -643px;
    ;
}

.task-box-container img {
    margin-right: 8px;
}

/* footer*/

.footer {
    padding-top: 50px;
    width: 100%;
    height: 370px;
    background: url("../../../img/home/homePC2/footer_bg.png") center center;
    overflow: hidden;
    min-width: 1200px
}

.footer_item {
    float: left;
    height: 260px;
}

.footer .footer_title {
    font-size: 16px;
    color: rgba(255, 255, 255, .5);
    margin-bottom: 40px;
}

.footer_item li,
.footer_item a {
    font-size: 16px;
    color: #fff;
    line-height: 30px
}

.footer_item a:hover {
    text-decoration: underline;
    color: #ff6600
}

.footer .links {
    border-left: 1px #555 solid;
    width: 219px;
    padding-left: 20px
}

.footer .sh_serves,
.footer .kp_sys {
    padding-left: 20px;
    width: 220px;
}

.footer .contact {
    padding-left: 20px;
    width: 260px;
    margin-bottom: 60px;
}

.footer .contact li {
    cursor: pointer;
}

.footer .contact .icon,
#aboutus .icon {
    width: 28px;
    height: 46px;
    display: inline-block;
    margin-right: 16px;
    vertical-align: middle;
}

.footer .contact .icon_tel {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -76px -1045px;
}

.footer .contact .icon_qq {
    background: url("../../../img/home/homePC2/pic.png") no-repeat 0 -1045px;
}

.footer .contact .icon_address {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -152px -1045px;
}

.footer .icon_address~span {
    display: inline-block;
    width: 214px;
}

.footer .contact .hover_tel:hover .icon_tel {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -114px -1045px;
}

.footer .contact .hover_qq:hover .icon_qq {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -38px -1045px;
}

.footer .contact .hover_address:hover .icon_address {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -190px -1045px;
}

.footer p {
    text-align: center;
    color: #fff;
    line-height: 60px;
}

/* 联系方式 */

.contact_info {
    height: 300px;
    background: rgba(255, 255, 255, 1);
    opacity: 0.9;
}

.contact_info>span {
    right: 5%;
    top: 10px;
    width: 40px;
    height: 25px;
    border: 1px solid #ccc;
    font-size: 14px;
    text-align: center;
    line-height: 25px;
    cursor: pointer;
    border-radius: 5px;
}

.contact_info>span:hover {
    background-color: rgba(55, 187, 255, 1);
    color: #fff;
}

.contact_info .left {
    width: 76%;
    text-align: center;
}

.contact_info .left ul li {
    width: 33%;
}

.contact_info .left ul li:last-child {
    border-right: 1px solid #6F98CB;
}

.contact_info h2 {
    height: 19px;
    font-size: 20px;
    font-family: PingFang-SC-Bold;
    color: rgba(51, 51, 51, 1);
    margin-top: 30px;
}

.contact_info .left ul li p {
    height: 16px;
    font-size: 16px;
    font-family: PingFang-SC-Regular;
    color: rgba(51, 51, 51, 1);
    margin-top: 38px;
}

.contact_info ul li a {
    display: block;
    margin: 30px auto 0;
    line-height: 42px;
    color: #fff;
    width: 136px;
    height: 42px;
    background: linear-gradient(to right, rgba(55, 187, 255, 1), rgba(41, 117, 255, 1));
    border-radius: 3px;
    box-shadow: 0px 10px 20px 0px rgba(47, 144, 255, 0.5);
    text-align: center;
}

.contact_info .right {
    width: 20%;
}

.contact_info .right li {
    height: 16px;
    font-size: 16px;
    font-family: PingFang-SC-Regular;
    color: rgba(51, 51, 51, 1);
    margin-top: 38px;
}

.contact_info .right li a {
    margin: 0;
    display: inline-block;
}

.o2o_con_info .left {
    width: 55%;
}

.o2o_con_info .left:nth-of-type(1) {
    width: 20%;
}

.o2o_con_info .left:nth-of-type(1) img {
    margin-top: 25px;
}

.o2o_con_info .left:nth-of-type(1) div {
    border-right: 1px solid #6F98CB;
}

.o2o_con_info .left:nth-of-type(2) ul li {
    width: 49%;
}

/* product */

#product .banner {
    background: url("../../../img/home/homePC2/banner_dd.jpg") no-repeat center center;
}

.tab_switch {
    background-color: #fff;
    position: relative;
}

.tab_switch .w1200 {
    position: absolute;
    top: -60px;
    left: 50%;
    transform: translateX(-50%);
    height: 124px;
    background: rgba(255, 255, 255, 1);
    border-radius: 5px;
    box-shadow:0px 10px 20px 0px rgba(142,178,203,0.35);
}

.tab_switch .w1200 ul {
    height: 124px;
}

.tab_switch .w1200 ul li {
    width: 25%;
    text-align: center;
    cursor: pointer;
    box-sizing: border-box;
}

.tab_switch .w1200 ul .switch_nav {
    border-bottom: 4px solid rgba(23, 135, 255, 1)
}

.tab_switch .w1200 ul li span {
    margin-left: 28px;
    line-height: 120px;
}

.product {
    padding-top: 70px;
    background-color: #fff;
}

.commercial,
.distributionl,
.smallProgram {
    display: none;
}

.commercial .js_tab {
    color: #ccc;
}

.distributionl .js_phone_slide .js_phone_silde_explain,
.smallProgram .js_phone_silde_explain {
    margin-left: 50px;
}

.smallProgram .btn_creat a {
    color: #fff;
    display: block;
    margin: 0 auto;
    width: 400px;
    height: 60px;
    border-radius: 30px;
    box-shadow: 0 8px 20px rgba(43, 128, 254, .5);
    background: #2b80fe;
    line-height: 60px;
    text-align: center;
    font-size: 22px;
}

.nav_content {
    background: #fff;
    position: relative;
}

#index .nav_content {
    height: 670px;
}

#product .nav_content {
    height: 589px;
}

#commercial .nav_content {
    height: 575px;
}

#distributionl .nav_content {
    height: 535px;
}

#smallProgram .nav_content {
    height: 510px;
}

#product .js_tab_contents_item img {
    margin-top: 40px
}
#product .js_tab_contents_item p {
    padding: 30px 0 0;
}

#product .zdy_bg {
    background: url("../../../img/home/homePC2/img_bg_wxpt.jpg") no-repeat center center;
    position: relative;
    height: 811px;
}

#product .zdy_bg .sub_title,
.gps_bg .sub_title {
    color: #fff
}

#product .zdy_bg p,
.gps_bg p {
    color: #d4d2ff
}

#product .phone {
    margin-left: 20px;
    margin-top: 50px;
}

#smallProgram .phone {
    margin-top: 50px;
}

.phone {
    width: 575px;
    position: relative;
    margin-left: 50px;
}

#product .phone {
    width: 540px;
}

.phone_c {
    width: 100%;
    height: 582px;
}

.phone .btn_l {
    left: 60px !important;
}

/*.phone .js_phone_slide_c_item{
	margin:16px 0 0 176px !important;
}*/

.phone .btn_r {
    left: 478px !important;
}

.bw {
    border-color: #fff;
}

.btn_l.bw span {
    background: url(../../../img/home/homePC2/pic.png) no-repeat -69px -378px;
}

.btn_r.bw span {
    background: url(../../../img/home/homePC2/pic.png) no-repeat -44px -378px;
}

.btn_l.bw:hover,
.btn_r.bw:hover {
    background: #fff
}

.btn_l.bw:hover span {
    background: url(../../../img/home/homePC2/img_blue_ar_l.png) no-repeat left center;
}

.btn_r.bw:hover span {
    background: url(../../../img/home/homePC2/img_blue_ar_r.png) no-repeat left center;
}

#product .r_img {
    margin-top: 94px;
}

#product .wave_bg {
    background: url("../../../img/home/homePC2/img_wave.png") no-repeat center center;
    height: 115px;
    width: 100%;
    bottom: 0px;
    position: absolute;
}

#product .gps_bg {
    background: url("../../../img/home/homePC2/img_gps.jpg") no-repeat top left;
    width: 100%;
    height: 679px;
}

#aboutus .icon_tel {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -114px -1045px;
}

#aboutus .icon_qq {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -38px -1045px;
}

#aboutus .icon_address {
    background: url("../../../img/home/homePC2/pic.png") no-repeat -190px -1045px;
}

#aboutus .icon_car {
    background: url("../../../img/home/homePC2/icon_car.png") no-repeat left top;
    background-size: 28px;
    margin-top: 2px;
    height: 90px;
}

.aboutus_address {
    width: 530px;
    height: 210px;
    border-radius: 10px;
    box-shadow: 0 2px 20px rgba(21, 22, 46, .5);
    overflow: hidden;
    background: #fff;
    font-size: 16px;
    position: absolute;
    top: 200px;
    left: 600px;
}

.aboutus_address .ab_ad_title {
    width: 100%;
    height: 60px;
    line-height: 60px;
    text-indent: 20px;
    font-size: 24px;
    color: #fff;
    background: #1787ff;
    margin-bottom: 20px;
}

.aboutus_address ul {
    padding: 0 20px;
}

.aboutus_address p {
    line-height: 30px
}

#product .img img {
    margin-top: 32px;
}

/* commercial*/

#commercial .banner {
    background: url("../../../img/home/homePC2/banner_sh.jpg") no-repeat top center;
}

#commercial .r_img {
    width: 500px
}

#commercial .r_img .r_img_title {
    font-size: 48px;
    color: #222;
    margin-top: 90px;
}

#commercial .r_img ul {
    margin-top: 66px;
    overflow: hidden;
}

#commercial .r_img li {
    width: 146px;
    height: 160px;
    float: left;
    text-align: center;
}

#commercial .sysj li {
    width: 222px;
    height: 320px;
    float: left;
    background: #fff;
    font-size: 28px;
    box-shadow: 0 0 20px rgba(153, 153, 153, .3);
    margin-top: 20px;
}

#commercial .sysj li:last-child {
    background: #3e36ff;
}

/* .pwth p {} */

#commercial .sysj li p:first-child {
    margin-top: 45px;
}

#commercial .sysj li img {
    margin-top: 30px;
}

#commercial .sysj li a {
    display: inline-block;
    margin: 80px 0 0 40px
}

#commercial .sysj li+li {
    margin-left: 22px;
}

#commercial .tab_nav {
    width: 400px;
    height: 48px;
    border-radius: 6px;
    background: rgba(255, 255, 255, .1);
    margin: 0 auto;
    margin-bottom: 10px;
}

#commercial .tab_nav a:hover,
#distributionl .tab_nav a:hover,
#smallProgram .tab_nav a:hover {
    border-color: transparent;
}

#commercial .tab_nav .tab_nav_item.active,
#distributionl .tab_nav .tab_nav_item.active,
#smallProgram .tab_nav .tab_nav_item.active {
    background: url("../../../img/home/homePC2/img_fdms_active.png") no-repeat 0px 0;
    border-color: transparent;
    color: #fff;
}

#commercial .fdms,
#distributionl .psms,
#smallProgram .hyfa {
    background: url("../../../img/home/homePC2/bg_fdms.jpg") no-repeat top center;
    width: 100%;
    height: 770px;
}

#commercial .fdms .sub_title,
.djjk .sub_title,
.djjk p {
    color: #fff;
}

#commercial .nav_content,
#distributionl .nav_content,
#smallProgram .nav_content {
    background: none;
    padding-top: 40px;
}

/*#product .nav_content {*/
    /*padding-top: 30px;*/
/*}*/

#commercial .tab_nav_item,
#distributionl .tab_nav_item,
#smallProgram .tab_nav_item {
    color: #6a6a6a;
    padding: 0;
    width: 200px;
    line-height: 48px;
    display: inline-block;
    vertical-align: top;
    float: left;
    margin: 0;
    position: relative;
}

.tsgn li {
    float: left;
    width: 568px;
    height: 278px;
    margin-top: 50px;
    border: 1px #dae1e6 solid;
}

.tsgn .sub_title,
.kh .sub_title {
    margin-bottom: 0
}

.tsgn li:nth-child(2n+1) {
    margin-right: 40px
}

.tsgn .w1200 {
    padding: 0 10px;
}

.tsgn li:hover {
    border-color: transparent;
    box-shadow: 0 0 30px rgba(0, 43, 172, 0.2);
}

.tsgn li span {
    font-size: 18px;
    display: inline-block;
    width: 260px;
    vertical-align: middle;
    margin-left: 20px;
}

.djjk {
    background: url("../../../img/home/homePC2/bg_ddjk.jpg") no-repeat top center;
    width: 100%;
    height: 672px;
}

.part_box {
    padding: 20px 0 60px 0;
}

.part_box img {
    margin-top: 50px;
}

.part_box:last-child {
    padding-bottom: 20px;
}

.tsgn img {
    margin-top: 0
}

#distributionl .part_box li,
#commercial .part_box li {
    float: left;
    width: 300px;
    margin-top: 22px;
    line-height: 34px;
    margin-bottom: 30px;
}

/*distributionl*/

#distributionl .banner {
    background: url("../../../img/home/homePC2/banner_ps.jpg") no-repeat top center;
}

#distributionl .dtdh {
    background: url("../../../img/home/homePC2/bg_dtdh.jpg") no-repeat top center;
    width: 100%;
    height: 720px;
}

#distributionl .zjmx {
    background: url("../../../img/home/homePC2/bg_zjmx.jpg") no-repeat top center;
    width: 100%;
    height: 709px
}

#distributionl .r_img_title {
    font-size: 28px;
    color: #222;
    padding: 10px 0;
    border-bottom: 4px #1787ff solid;
    width: 114px;
    margin: 50px 0 60px;
}

#distributionl .r_img li,
.r_img li {
    margin-bottom: 28px;
}

#distributionl .r_img a,
.r_img a {
    padding: 10px 30px 10px 0px;
    border: 1px #b3b3b3 solid;
    background: url("../../../img/home/homePC2/bg_123.png") no-repeat top left;
    color: #999;
    border-radius: 5px;
    display: inline-block;
    height: 42px;
    box-sizing: border-box;
}

#distributionl .r_img img,
.r_img img {
    margin: 0 40px 0 6px
}

#distributionl .r_img p,
#smallProgram .r_img p,
#o2o .r_img p {
    margin-top: 10px;
    margin-left: 54px;
    width: 500px;
    color: #999;
}

#distributionl .tab_nav {
    width: 600px;
    height: 48px;
    border-radius: 6px;
    background: rgba(255, 255, 255, .1);
    margin: 0 auto;
    margin-bottom: 10px;
}

#distributionl .tab_nav .tab_nav_item.active p {
    color: #1787ff
}

#distributionl .tab_nav .tab_nav_item.hasline {
    position: relative;
}

#distributionl .tab_nav .tab_nav_item.hasline:after,
#smallProgram .tab_nav .tab_nav_item.hasline:after {
    content: '';
    width: 1px;
    height: 30px;
    background: rgba(255, 255, 255, .1);
    position: absolute;
    right: 0;
    top: 8px;
}

/*new 行业资讯*/

#news .banner {
    background: url("../../../img/home/homePC2/banner_hyzx.jpg") no-repeat center center;
}

#news .main {
    width: 940px;
    padding-top: 60px;
}

#news .main section {
    padding: 30px;
    border-bottom: 1px solid #ccc;
}

#news .main img {
    width: 240px;
    height: 160px;
    margin-right: 20px;
}

#news .main .tittle {
    font-size: 22px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#news .main .sub_tittle {
    font-size: 16px;
    padding-top: 10px;
    max-height: 90px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

#news .main .artic {
    position: relative;
    width: 615px;
    height: 160px;
}

#news .main .time {
    position: absolute;
    bottom: 0;
    left: 0;
    font-size: 14px;
}

#news .aside {
    margin: 80px 0 0 20px;
    box-sizing: border-box;
    padding: 10px 10px 60px;
    width: 240px;
    /* border: 1px solid #CCCCCC; */
}

#news .aside .recomm {
    max-width: 225px;
    display: inline-block;
    /* overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; */
    font-size: 14px;
    padding: 10px 0;
    color: #666;
}
#news .aside .recomm:hover {
    color: #0000ee;
}

#news .article-nav {
    font-size: 16px;
}

/*cases 客户案例*/

#cases .banner_cases {
    background: url("../../../img/home/homePC2/banner_cases.jpg") no-repeat center center;
    background-size: auto 700px;
}

#cases .part img {
    margin-top: 0;
}

#cases .cases_bar {
    padding: 10px;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
}

#cases .case {
    height: 520px;
    position: absolute;
    display: none;
}

#cases .case.active {
    display: block;
}

#cases .case li {
    width: 360px;
    height: 500px;
    float: left;
    box-shadow: 0 0 15px rgba(27, 23, 42, .17);
    background: #fff;
}

#cases .case li img {
    width: 100%;
}

#cases .case li+li {
    margin-left: 50px;
}

#cases .dec {
    padding: 0 20px;
    line-height: 24px;
}

#cases .dec .dec_title {
    font-size: 20px;
    text-align: center;
    line-height: 40px;
    margin-top: 20px;
}

#cases .controllerBtn {
    margin-top: 530px;
}

#cases .cases_btn_l,
#cases .cases_btn_r {
    width: 35px;
    height: 35px;
    border-radius: 18px;
    border: 1px #666 solid;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
}

.case_link {
    color: #1787ff
}

.case_link:hover {
    color: #ff6600;
    text-decoration: underline
}

#cases .cases_btn_l {
    background: url("../../../img/home/homePC2/img_cases_l_b.png") no-repeat center center;
    margin-right: 30px;
}

#cases .cases_btn_l:hover,
#cases .cases_btn_l.active {
    background: #ff6600 url("../../../img/home/homePC2/img_cases_l_w.png") no-repeat center center;
    border-color: transparent;
}

#cases .cases_btn_r:hover,
#cases .cases_btn_r.active {
    background: #ff6600 url("../../../img/home/homePC2/img_cases_r_w.png") no-repeat center center;
    border-color: transparent;
}

#cases .cases_btn_r {
    background: url("../../../img/home/homePC2/img_cases_r_b.png") no-repeat center center;
    margin-left: 30px;
}

#cases .controllerBtn .round {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 4px;
    background: #999;
}

#cases .controllerBtn .round+.round {
    margin-left: 10px;
}

#cases .controllerBtn .round.active {
    background: #ff6600;
}

#cases .kh {
    padding: 0 10px;
}

#cases .kh li {
    float: left;
    width: 358px;
    height: 198px;
    margin-top: 50px;
    border: 1px #dae1e6 solid;
    margin-right: 50px;
}

#cases .kh li:hover {
    border-color: transparent;
    box-shadow: 0 0 20px rgba(0, 43, 172, .2)
}

#cases .kh li:nth-child(3n) {
    margin-right: 0
}

/*aboutus 关于我们*/

#aboutus .banner_aboutus {
    background: url("../../../img/home/homePC2/banner_aboutus.jpg") no-repeat center center;
}

#aboutus .company_h {
    padding: 0 100px;
    box-sizing: border-box;
}

#aboutus .company_h p {
    text-indent: 2em
}

#aboutus .company p {
    line-height: 26px;
}

#aboutus .company {
    background: #fff url("../../../img/home/homePC2/bg_company_h.png") no-repeat bottom center;
    width: 100%;
    overflow: hidden;
    padding-bottom: 0
}

#aboutus .bg_dw {
    background: url("../../../img/home/homePC2/bg_dw.jpg") no-repeat bottom center;
    width: 100%;
    height: 700px;
}

/*advantage 产品优势*/

#advantage .banner_advantage {
    background: url("../../../img/home/homePC2/banner_advantage.jpg") no-repeat center center;
}

#advantage .part {
    padding: 80px 0 50px;
}

#advantage .sys_version {
    padding: 0 10px;
    box-sizing: border-box;
}

#advantage .sys_version_box {
    margin: 50px 50px 40px 0;
    width: 360px;
    height: 480px;
    border-radius: 10px;
    position: relative;
    box-shadow: 0 4px 20px rgba(193, 193, 193, .3);
    float: left;
}

#advantage .sys_version_box:last-child {
    margin-right: 0;
}

.sys_version_box_head {
    width: 100%;
    height: 12px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background: #4080ff;
}

.sys_version_box_logo {
    width: 100%;
    text-align: center;
    height: 60px;
    margin: 20px 0;
}

.sys_version_box_title {
    font-size: 24px;
    text-align: center;
}

.sys_version_box_c {
    margin-top: 30px;
    padding: 0 30px;
}

.sys_version_box_c li {
    line-height: 30px;
}

.list_round {
    display: inline-block;
    height: 6px;
    width: 6px;
    border-radius: 3px;
    background: #4080ff;
    margin-right: 10px;
    vertical-align: top;
    margin-top: 10px;
}

.list_round~span {
    display: inline-block;
    width: 270px;
}

.sys_version_box_btn {
    position: absolute;
    width: 150px;
    height: 50px;
    border-radius: 5px;
    background: #4080ff;
    line-height: 50px;
    text-align: center;
    left: 100px;
    bottom: -25px;
    font-size: 18px;
}

.sys_version_box.bz {
    background: url("../../../img/home/homePC2/bg_bzb.png") no-repeat top center;
}

.sys_version_box.ppdz {
    background: url("../../../img/home/homePC2/bg_ppdzb.png") no-repeat top center;
}

.sys_version_box.dqlm {
    background: url("../../../img/home/homePC2/bg_dqlmb.png") no-repeat top center;
}

.sys_version_box.ppdz .list_round,
.sys_version_box.ppdz .sys_version_box_head,
.sys_version_box.ppdz .sys_version_box_btn {
    background: #ff8442
}

.sys_version_box.dqlm .list_round,
.sys_version_box.dqlm .sys_version_box_head,
.sys_version_box.dqlm .sys_version_box_btn {
    background: #8153ff;
}

/*smallProgram 小程序*/

#smallProgram .banner_smallProgram {
    background: url("../../../img/home/homePC2/banner_smallProgram.jpg") no-repeat center center;
}

#smallProgram .btns {
    margin-left: 20px;
}

#smallProgram .part_box>p {
    line-height: 28px;
}

#smallProgram .r_img {
    margin-top: 60px;
}

#smallProgram .tab_nav {
    width: 1000px;
    height: 48px;
    border-radius: 6px;
    background: rgba(255, 255, 255, .1);
    margin: 0 auto;
    margin-bottom: 10px;
    margin-top: 30px
}

#smallProgram .czlc {
    padding: 0 0 80px;
}

#smallProgram .czlc .sub_title {
    margin-bottom: 10px;
}

/* #smallProgram .btn_creat {
    margin: 50px 0 30px 0
} */

/*o2o*/

#o2o .banner_o2o {
    background: url("../../../img/home/homePC2/o2o_banner.jpg") no-repeat center center;
}

#o2o .banner_o2o .absolute {
    top: 60%;
    left: 0;
}

#o2o .banner_o2o .absolute a {
    display: inline-block;
    border: #fff 1px solid;
    color: #fff;
    text-align: center;
    margin: 10px 0 0 10px;
    width: 200px;
    height: 60px;
    line-height: 60px;
    font-size: 20px;
}

#o2o .o2o-c {
    width: 100%;
    background-size: contain;
    position: relative;
    margin-top: -80px;
}

#o2o .o2o-c h2 {
    text-align: center;
    font-size: 28px;
    font-weight: normal;
}

#o2o .o2o-c .o2o_tit {
    margin: 20px 0 70px;
    text-align: center;
    font-size: 14px;
}

#o2o .o2o-c .o2o_bg {
    background: url("../../../img/home/homePC2/o2o-c_bg.png") no-repeat center center;
    width: 1200px;
    height: 603px;
    border-radius: 10px;
    box-shadow: 0px 5px 20px 0px rgba(104, 159, 227, 0.15);
    margin-top: -60px;
}

#o2o .sys_adv {
    padding-top: 60px;
    padding-bottom: 60px;
    background-color: #fff;
}

#o2o .sys_adv h2 {
    text-align: center;
    font-size: 32px;
}

#o2o .sys_adv .sys_adv_con {
    margin-top: 100px;
    padding-bottom: 15px;
}

#o2o .sys_adv .sys_adv_con .sys_adv_des {
    /*padding-top: 29px;*/
    width: 45%;
}

#o2o .sys_adv .sys_adv_con .sys_adv_des h3 {
    font-size: 24px;
    position: relative;
    font-weight: normal;
    color: #333333;
}

#o2o .sys_adv .sys_adv_con .sys_adv_des h3::before {
    content: '';
    display: block;
    width: 90px;
    height: 12px;
    background: linear-gradient(134deg, rgba(33, 142, 253, 1), rgba(23, 135, 255, 1), rgba(23, 185, 255, 1));
    box-shadow: 0px 8px 20px 0px rgba(43, 128, 254, 0.5);
    position: absolute;
    left: 0;
    top: -30px;
}

#o2o .sys_adv .sys_adv_con .sys_adv_des ul {
    margin-top: 38px;
}

#o2o .sys_adv .sys_adv_con .sys_adv_des ul li {
    margin-top: 17px;
    font-size: 16px;
    color: #333333;
    position: relative;
    padding-left: 40px;
}

#o2o .sys_adv .sys_adv_con .sys_adv_des ul li::before {
    content: '';
    display: block;
    width: 12px;
    height: 12px;
    border: 2px solid rgba(55, 187, 255, 1);
    box-shadow: 0px 5px 10px 0px rgba(47, 144, 255, 0.5);
    position: absolute;
    border-radius: 50%;
    left: 10px;
    top: 2px;
}

#o2o .sys_adv .sys_adv_con .sys_adv_des a {
    margin-top: 42px;
    text-align: center;
    line-height: 42px;
    color: #fff;
    display: block;
    width: 125px;
    height: 42px;
    background: linear-gradient(to right, rgba(55, 187, 255, 1), rgba(41, 117, 255, 1));
    border-radius: 21px;
    box-shadow: 0px 8px 20px 0px rgba(47, 144, 255, 0.5);
}

#o2o .oper_mode .sys_adv_con {
    margin-top: 70px;
}

#o2o .oper_mode .sys_adv_con .sys_adv_des ul {
    margin-top: 0;
}

#o2o .oper_mode .sys_adv_con .sys_adv_des ul li::before {
    border-radius: 0;
    width: 12px;
    height: 32px;
    background: rgba(23, 135, 255, 1);
    box-shadow: 0px 8px 20px 0px rgba(43, 128, 254, 0.5);
    border: 0;
}

#o2o .oper_mode .sys_adv_con .sys_adv_des ul li h4 {
    font-weight: normal;
}

#o2o .oper_mode .sys_adv_con .sys_adv_des ul li p {
    font-size: 16px;
    margin-top: 16px;
    color: #313438;
}

#o2o .oper_mode .sys_adv_con .sys_adv_des {
    width: 50%;
}

#o2o .oper_mode .sys_adv_con .sys_adv_par {
    width: 50%;
}

#o2o .oper_mode .sys_adv_con .sys_adv_par img {
    width: 100%;
}

.o2o_btn {
    text-align: center;
    background-color: #fff;
    padding: 80px 0;
}

.o2o_btn a {
    width: 400px;
    height: 60px;
    background: rgba(23, 135, 255, 1);
    border-radius: 30px;
    box-shadow: 0px 8px 20px 0px rgba(43, 128, 254, 0.5);
    line-height: 60px;
    display: block;
    color: #fff;
    font-size: 22px;
    margin: 0 auto;
}

/*下载弹出框*/

.download_box {
    position: fixed;
    top: 20%;
    left: 50%;
    margin-left: -200px;
    /* box-shadow: 2px 2px 5px #ccc, -2px -2px 5px #ccc;*/
    border-radius: 5px;
    z-index: 99;
}

.close-btn {
    text-align: right;
    position: relative;
    z-index: 999;
}

.close-btn>img {
    z-index: 1000 !important;
}

.erCode-box {
    width: 100%;
    margin-top: -37px;
    text-align: center;
    font-size: 20px;
    color: #333333;
    font-weight: 400;
    padding-bottom: 20px;
}

.erCode-box>img {
    width: 91%;
}

.box_top {
    height: 40px;
    line-height: 40px;
    padding-left: 15px
}

.box_close {
    margin: 5px 10px;
    width: 24px;
    height: 24px;
    line-height: 20px;
    text-align: center;
    font-size: 28px
}

.box_close:hover {
    background: #666;
    color: #fff
}

.download_btn {
    padding: 8px 20px 6px;
    background: #0972AC;
    border-radius: 5px;
    border: none
}

/*分页*/

#page {
    margin: 60px 0;
}

#page a,
#page button {
    padding: 10px 22px;
    background: #efefef;
    margin-right: 5px;
    font-size: 20px;
    color: #333;
}

#page input {
    width: 60px;
    height: 35px;
    background: #efefef;
    border: 1px solid #ccc;
    padding: 2px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

#page button {
    width: 80px;
    height: 44px;
    font-size: 18px;
    border: none;
    font-weight: 400;
}

#page .hover {
    background: #1787ff;
    color: #fff;
}

/*遮罩*/

.ewm_mask {
    width: 100%;
    height: 500px;
    background-color: #000000;
    opacity: .8;
    z-index: 98;
    position: absolute;
    top: 0;
    display: none;
}

.mask {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    background-color: rgba(0, 0, 0, .5);
    display: none;
    z-index: 10;
}

.mask img {
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.noscroll {
    height: 100%;
    overflow: hidden;
}

.swiper-button-next,
.swiper-button-prev {
    transform: translateY(-50%);
}

/*#info*/

#info .info_content {
    font-size: 16px;
    line-height: 28px;
}

#info .info_title {
    margin-bottom: 50px;
}

#info .wrap {
    width: 900px;
    margin: 0 auto;
}

#info .wrap_main {
    float: left;
    width: 640px;
}

#info .article-nav {
    padding: 130px 0 30px 0;
    color: #333;
    font-size: 16px;
}
#info .article-nav a {
    color: #333;
}
#info .article-nav a:hover {
    color: #0000ee;
}
#info .prev-next li {
    padding: 20px 0;
    color: #999;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 48%;
}
#info .prev-next li:last-child{
    text-align: right;
}
#info .prev-next li a{
    color: #999;
}
#info .prev-next li a:hover {
    color: #0000ee;
}

.wrap_tj {
    float: left;
    margin-left: 50px;
    width: 210px;
}

.info_recommend {
    display: block;
    font-size: 14px;
    padding: 10px 0;
    color: #666;
}

.info_recommend:hover {
    color: #0000ee;
}
@media screen and (max-width: 1280px) {
    body {
        zoom: .8;
    }
    .title-line-container .gray-line  {
        height:2px !important;
    }
    /* .banner {
        height: 500px;
    } */
    .banner .swiper-slide:nth-child(6n+1) .banner-img {
        background: url("../../../img/home/homePC2/banner4_sm.jpg") no-repeat center center;
    }
    .banner .swiper-slide:nth-child(6n+3) .banner-img {
        background: url("../../../img/home/homePC2/banner1_sm.jpg") no-repeat center center;
    }
    .banner .swiper-slide:nth-child(6n+4) .banner-img {
        background: url("../../../img/home/homePC2/banner5_sm.jpg") no-repeat center center;
    }
    .banner .swiper-slide:nth-child(6n+5) .banner-img {
        background: url("../../../img/home/homePC2/banner3_sm.jpg") no-repeat center center;
    }
    .banner .swiper-slide:nth-child(6n) .banner-img {
        background: url("../../../img/home/homePC2/banner2_sm.jpg") no-repeat center center;
    }
    .banner .swiper-slide:nth-child(6n+2) .banner-img {
        background: url("../../../img/home/homePC2/banner6_sm.jpg") no-repeat center center;
    }
    #product .banner.banner_product {
        background: url(../../../img/home/homePC2/banner_dd_sm.jpg) no-repeat center center;
    }
    #commercial .banner.banner_sh {
        background: url(../../../img/home/homePC2/banner_sh_sm.jpg) no-repeat center center;
    }
    #distributionl .banner.banner_ps {
        background: url(../../../img/home/homePC2/banner_ps_sm.jpg) no-repeat center center;
    }
    #cases .banner.banner_cases {
        background: url(../../../img/home/homePC2/banner_cases_sm.jpg) no-repeat center center;
    }
    #news .banner {
        /* background: url(../../../img/home/homePC2/banner_hyzx_sm.jpg) no-repeat center center; */
    }
    #aboutus .banner.banner_aboutus {
        background: url(../../../img/home/homePC2/banner_aboutus.jpg) no-repeat center center;
    }
    #advantage .banner.banner_advantage {
        background: url(../../../img/home/homePC2/banner_advantage_sm.jpg) no-repeat center center;
    }
    #smallProgram .banner.banner_smallProgram {
        background: url(../../../img/home/homePC2/banner_smallProgram_sm.jpg) no-repeat center center;
    }
    #o2o .banner.banner_o2o {
        background: url(../../../img/home/homePC2/banner_o2o_sm.jpg) no-repeat center center;
    }
    #o2o .banner .btns {
        padding-top: 300px;
        margin-left: -20px;
    }
    #smallProgram .banner .btns {
        margin-left: 12px;
        padding-top: 270px;
    }
    #aboutus .bg_dw {
        background: url(../../../img/home/homePC2/bg_dw_sm.jpg) no-repeat bottom center;
    }
    #index .banner .btns {
        padding-top: 300px;
    }
    #distributionl .banner .btns {
        padding-top: 270px;
    }
    .banner .btns {
        padding-top: 230px;
        margin-left: 20px;
    }
    .nav a+a {
        margin-left: 5px;
    }
    #product .gps_bg {
        background: url(../../../img/home/homePC2/img_gps_sm.jpg) no-repeat top left;
    }
    .logo {
        width: 570px;
    }
    #index .order_from_one,
    #index .order_from_two,
    #index .order_from_three,
    #index .order_from_four,
    #index .order_from_five,
    .part,
    .footer,
    .header {
        min-width: 1000px !important;
    }
    #index .severs li:nth-child(3n+1) {
        margin-left: 125px;
    }
    #index .severs li+li {
        margin-left: 147px;
    }
    #index .severs li {
        margin-bottom: 30px;
    }
    #index .sh_iphone_pics.mac_c {
        width: 666px !important;
    }
    .mac_btn_l {
        left: 15px !important;
    }
    .mac_btn_r {
        right: 15px !important;
    }
    .sh_iphone_pics.mac_c .js_phone_slide_c_imgs {
        margin: 19px 0 0 96px;
    }
    .js_phone_slide_c_imgs {
        margin: 16px 0 0 159px;
    }
    .phone .js_phone_slide_c_imgs {
        margin: 16px 0 0 126px;
    }
    .mac {
        left: -15px !important;
    }
    #index .sh_iphone_pics {
        width: 556px;
    }
    #index .sh_iphone_pics .iphone {
        left: 145px;
    }
    .btn_l {
        left: 50px;
    }
    .btn_r {
        right: 78px;
    }
    #index .kp_gn .kp_gn_item {
        width: 310px;
        margin-left: 30px;
    }
    #index .gn_item_word_active {
        font-size: 18px;
    }
    #index .gn_item_word_hover {
        font-size: 15px;
    }
    #index .gn_lists .gn_list {
        width: 200px;
    }
    #index .gn_lists .gn_list p {
        margin-left: 6px;
    }
    #index .order_from_four .four_content_item {
        width: 250px;
    }
    .part>.w1200>img,
    .part .img img,
    #commercial .js_tab_contents_item img,
    #distributionl .js_tab_contents_item img,
    #smallProgram .js_tab_contents_item img,
    #product .r_img img,
    #commercial .sysj li img,
    .czlc img,
    #cases .part img,
    #cases .kh li img,
    .js_tab_contents_item>img {
        width: 100%;
    }
    .phone {
        width: 500px;
        margin-left: 0 !important;
    }
    .phone .btn_l {
        left: 10px !important;
    }
    .iphone_large {
        left: 110px !important;
    }
    .phone .btn_r {
        left: 428px !important;
    }
    /*.phone .js_phone_slide_c_item{
		margin: 16px 0 0 127px !important;
	}*/
    #product .r_img {
        width: 500px;
    }
    #aboutus .company_h {
        padding: 0;
    }
    .footer .sh_serves,
    .footer .kp_sys {
        padding-left: 60px;
        width: 190px;
    }
    .footer .links {
        width: 208px;
        padding-left: 40px;
    }
    .footer .contact {
        padding-left: 20px;
        width: 230px;
    }
    .footer .icon_address~span {
        width: 184px;
    }
    #commercial .sysj li {
        width: 190px;
        height: 292px;
    }
    #commercial .sysj li+li {
        margin-left: 12px;
    }
    .tsgn li {
        width: 468px;
    }
    .tsgn li span {
        width: 212px;
        margin-left: 0 !important;
    }
    #distributionl .part_box li,
    #commercial .part_box li {
        width: 220px;
        margin-right: 40px
    }
    #distributionl .part_box li p,
    #commercial .part_box li p {
        margin-left: 0 !important;
    }
    #distributionl .part_box li:last-child,
    #commercial .part_box li:last-child {
        margin-right: 0
    }
    #distributionl .part_box li p:last-child,
    #commercial .part_box li p:last-child {
        line-height: 18px;
    }
    #distributionl .r_img p,
    #smallProgram .r_img p,
    #o2o .r_img p {
        width: 446px;
    }
    #cases .case li {
        width: 320px;
    }
    #cases .case li+li {
        margin-left: 15px;
    }
    #cases .kh li {
        width: 298px;
        height: 166px;
    }
    #advantage .sys_version_box {
        margin: 50px 16px 40px 0;
        width: 316px;
    }
    .sys_version_box_c {
        padding: 0 16px;
    }
    .list_round~span {
        width: 266px;
    }
    .sys_version_box_btn {
        left: 86px;
    }
    .aboutus_address {
        left: 480px;
    }
    #o2o .o2o-c {
        height: 3000px;
    }
    .o2o-phone {
        top: 680px
    }
}

.qcode-demo {
    width: 20px;
    height: 20px;
    margin-left: 10px;
    cursor: pointer;
}

.qrcode-container {
    display: inline-block;
    position: relative;
}

.qrcode-hover {
    display: none;
    padding: 15px;
    position: absolute;
    border: 1px solid #1787ff;
    background-color: #fff;
    top: 30px;
    left: -70px;
}

.qrcode-container:hover .qrcode-hover {
    display: block;
}

.qrcode-hover>h3 {
    padding-bottom: 15px;
    color: #333;
}

.info_content img {
    max-width: 100%;
}