﻿@charset "utf-8";
@media screen and (max-width:1200px){
    .w1200{width:100%}
    .head-main{padding:0 30px}
    .nav{margin:0 0 0 70px}
    .title{font-size:30px}
    .about,.case,.product{padding:50px 30px}
    .product-list{box-sizing:border-box}
    .product-item{width:32%;margin-right:1.5%}
    .product-item:last-child{margin-right:0}
    .tabs p{width:25%!important;margin-right:0;border-right:1px solid #fff;box-sizing:border-box}
    .tabs p:last-child{border:0}
    .about{min-height:350px}
}
@media screen and (max-width:1024px){
    .product-item{width:49%;margin-right:2%;margin-bottom:20px}
    .product-item:nth-child(even){margin-right:0}
    .contact-list p{width:100%;border:0;text-align:center;line-height:24px;padding:0}
    .copy-right{margin-top:10px}
}
@media screen and (max-width:768px){
    .banner .swiper-slide{height:500px!important}
    .banner .swiper-pagination{bottom:20px!important}
    .banner .swiper-slide .text h3{font-size:36px}
    .about,.case{padding:30px 10%}
    .product{padding:30px 0}
    .title{font-size:24px}
    .product-item{width:80%;margin:0;margin-bottom:30px;margin-left:auto!important;margin-right:auto!important;float:none}
    .applyJoinMode{height:540px;top:0;left:0;width:100%;margin-top:0;margin-left:0}
    .apply-list input{height:35px;line-height:35px}
    .apply-list .get_code{height:37px;line-height:37px}
    .submit_btn{width:200px!important;height:35px;line-height:35px}
    .area_code{height:35px;line-height:35px}
    .applyJoinMode h4{font-size:16px}
    .apply-list li label{margin-top:5px!important;font-size:14px}
    .check_result{height:35px;line-height:35px}
    .check_list{top:34px}
    .choice_icon{margin-top:13px}
    .check_list li{height:30px;line-height:30px}
    .footer{padding:30px 0}
}
@media screen and (max-width:750px){
    .head{height:60px;padding:0}
    .logo{margin-top:15px}
    .nav{display:none}
    .menu-handler{width:25px;top:21px;display:block;right: 25px;}
    .menu-handler .burger{width:100%;margin:0;left:0;height:3px;border-radius:2px}
    .menu-handler .burger-2{top:7px}
    .menu-handler .burger-3{top:14px}
    .menu-handler.active .burger{background:#2A6AF2}
    .applyMode {overflow-y:scroll;}
    .applyJoinMode{height:100%;overflow-y:scroll;padding:50px 25px 40px;z-index:1002}
    .banner .swiper-slide .text h3{font-size:36px}
    .banner .swiper-slide .text p{font-size:20px}
    .banner .swiper-slide .text{left:15%;padding-right:15px;top:32%}
    .banner .slide-one{background-position:72% bottom;background-size:cover}
    .banner .slide-baas{background-position:72% bottom;background-size:cover}
    .title{background-size:47px 47px;font-size:28px}
    .module_des{margin-bottom:20px;font-size:16px;padding: 0 30px}
    .case-box{display:none}
    .m-case-box{width:100%;display:block}
    .m-case-box img{margin-top:20px}
    .m-case-box li{margin-bottom:20px}
    .m-case-box li>h3{height:60px;background:#E9EFFE;position:relative;text-align:center;line-height:60px;border-radius:4px;color:#2A6AF2;font-size:16px}
    .m-case-box li.active>h3{background:#fff}
    .m-case-box li>h3 i{display:inline-block;width:36px;height:36px;background:url(../images/arrow-down.png) no-repeat center;background-size:cover;position:absolute;top:12px;right:40px}
    .m-case-box li.active>h3 i{background:url(../images/arrow-up.png) no-repeat center;background-size:cover}
    .m-case-box li>h3 span{position:relative}
    .m-case-box li.active>h3 span{color:#333}
    .m-case-box li>h3 span:after,.m-case-box li>h3 span:before{position:absolute;display:inline-block;width:6px;height:6px;background:#2a6af2;content:'';opacity:0;transform:scale(0);transition:0s;top:6px}
    .m-case-box li.active>h3 span:after,.m-case-box li.active>h3 span:before{opacity:1;transform:scale(1);transition:.3s}
    .m-case-box li.active>h3 span:after{right:-15px}
    .m-case-box li.active>h3 span:before{left:-15px}
    .m-case-con{display:none;background:#fff;padding:10px 35px 40px;font-size:14px;line-height:24px}
    .contact-list {padding-left:193px}
    .contact-list p{text-align:left;padding-left:50px;margin-bottom:15px}
    .about{background-size:304%;background-position:37% bottom;padding-bottom:100px}
    .product-item{height:auto;width:372px}
    .copy-right{font-size:12px;margin-top:35px}
    .applyMode li{width:100%;margin-right:0}
    .applyMode label{width:28px}
    .applyMode input{width:calc(100% - 64px)!important}
    .check_mode{width:calc(100% - 43px)!important;margin-left:5px}
    .check_result{width:100%;box-sizing:border-box}
    .check_list{width:100%}
    .applyJoinMode h4{margin-top:20px}
    .input_phone{width:calc(100% - 42px)!important;margin-left:3px}
    .input_phone input{width:calc(100% - 84px)!important}
    .applyJoinMode #contact_code{width:calc(100% - 200px)!important;float:left;margin-left:40px}
    .applyJoinMode .get_code{width:120px!important;float:right}
    .submit_btn{margin-top:20px!important}
    #contact_error_text{float:left}
    .error_text{padding-left:63px!important}
    #error_code{margin-top:40px;padding-left:60px}
    #contact_error_text{padding-left:123px!important}
}
@media screen and (max-width: 676px){
    .contact-list {padding-left: 155px;}
}
@media screen and (max-width: 640px){
    .contact-list { padding-left: 20%;  }
}
@media screen and (max-width: 414px){
    .banner .swiper-slide .text{top: 25%}
    .contact-list { padding-left: 7%; }
}
@media screen and (max-width:380px){
    .contact-list { padding-left:0;  }
    .banner .swiper-slide.slide-one .text {left: 88px;}
    .banner .swiper-slide{height:626px!important}
    .banner .swiper-slide .text{top:20%;left: 13%}
    .banner .slide-pix .text{right:8%}
    .banner .slide-customize{background-position:50% bottom;background-size:cover}
    .product-item{height:auto;width:320px}
    .slide-one{background-image:url(../images/mobile-banner.png)!important}
    .slide-baas{background-image:url(../images/banner-mobile-baas.jpg)!important}
}
@media screen and (max-width: 320px){
    .contact-list p{padding-left:30px; }
    .banner .swiper-slide.slide-one .text {left: 50px;}
    .m-case-box li>h3 i{width: 25px;height: 25px;top: 18px;  right: 26px;}
}
