html,body{
    padding: 0;
    margin:0;
    font-family:"微软雅黑"
}
ul{
    list-style: none;
    padding:0;
    margin:0;
}
a{
    text-decoration: none;
}

/************************ 手机 *************************/
@media (min-width: 320px){
    .index-top{
        width:100%;
        height:60px;
    }
    .index-top .index-logo{
        width:60%;
        height:100%;
        line-height: 60px;
        margin:0 auto;
        font-size: 12px;
    }
    .index-top .index-logo a{
        color:black;
    }
    header{
        width:100%;
        height:60px;
        
    }
    .header-top{
        width:100%;
        height:100%;
        margin:0 auto;
        display: flex;
        justify-content: flex-start;
    }
    .header-top .logo{
        height:120px;
        line-height: 60px;
        font-size:12px;
    }
    .header-top .logo a{
        color:#222222;
    }
    .header-ul{
        margin-left: 20px;
        flex:1;
        display: flex;
        justify-content: space-between;
        height:100%;
        line-height: 60px;
        font-size: 12px;
    }
    .header-ul li a{
       
        color:#4C4C4C;
    }
    main{
        width:100%;
    }
    .bgcolor{
        width:100%;
        height:580px;
        background-image: url("../image/index.png");
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }

    .bgcolor-area{
        width:70%;
        height:400px;
        margin:0 auto;
        text-align: center;
        
    }
    .bgcolor-area img{
        width:100px;
        height:100px;
        margin-top: 100px;
    }
    .bgcolor-area-con{
        font-weight: bolder;
        margin-top: 40px;
    }
    .bgcolor-area-zi{
        color:white;
        font-size:14px;
        text-align: center;
        margin-top:5px;
    }
    .bgcolor-button{
        width:105px;
        height:18px;
        margin:0 auto;
        margin-top:20px;
    }
    .bgcolor-button a{
        display: inline-block;
        width:105px;
        height:18px;
        line-height:18px;
        border-radius: 150px;
        color:#ffffff;
        font-size:12px;
        text-align: center;
        background: rgb(0,158,59);
       
    }
    footer{
        width:100%;
        height:144px;
        background:#222222;
    }
    .footer-area{
        display:flex;
        align-items: center;
        width:100%;
        height:100px;
    }
    .footer-area-one{
        width:40%;
        text-align: center;
    }
    .footer-area-one h2{
        color:rgb(73, 110, 232);
        font-size:12px;
        font-weight: bold;
    }
    .footer-area-one div{
        margin-top: 10px;
        color:#e5e5e5;
        font-size:12px;
    }
    .footer-area-one h1{
        color:#13439d;
        font-size:12px;
        font-weight: bold;
    }
    .footer-area-two{
        width:60%;
       
    }
    .footer-ul1{
        display: flex;
        justify-content: space-between;
        width:96%;
    }
    .footer-ul1 li a{
        color:#d9d9d9;
    }
    .footer-ul2{
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;
        width:100%;
        font-size:12px;
    }
    .footer-ul2 li{
        width:25%;
        margin-top:5px;
    }
    .footer-ul2 li a{
        color:#4c4c4c;
    }
    .footer-area2{
        text-align: center;
        color:#999999;
        font-size:12px;
    }
    .footer-area2-span{
        margin-left:10px;
    }
    .footer-phone{
        width:100%;
        height:30px;
        line-height: 30px;
        background:black;
        text-align: center;
    }
    .footer-phone a{
        color: #8b919d;
        font-size: 12px;
    }
    .form{
        position: fixed;
        bottom: 0;
        left:0;
        width:100px;
    }
    .form1{
        position: fixed;
        top:30%;
        left:43%;
        width:100px;
    }
    .form-leave{
        width:100%;
        height:25px;
        background:#00aef3;
        border-radius: 3px 3px 0 0;
        display: flex;
        justify-content: space-between;
    }
    .form-leave-title{
        color: #fff;
        font-size: 12px;
        margin-left: 12px;
        line-height: 25px;
    }
    .form-leave-img{
        width:34px;
        height:20px;
        text-align: center;
    }
    .form-leave-img a{
        width:100%;
        height: 100%;
        display: inline-block;
        line-height: 30px;
    }
    .form-con{
        width:100%;
        height:200px;
        background:#ededed;
        text-align: center;
    }
    .form-con textarea{
        width:90%;
        height:42px;
        resize: none;
        margin-top:5px;
        border-radius: 2px;
        border:1px solid #D5D5D5;
    }
    .input-area{
        width:90%;
        height:18px; 
        margin:0 auto;
        margin-top:10px;
        position: relative;
    }
    .input-area input{
        width:100%;
        height:18px;
        color:#B7B7B7;
        text-indent: 25px;
        border-radius: 2px;
        border:1px solid #D5D5D5;
    }
    .input-icon{
        display:inline-block;
        width:18px;
        height: 16px;
        position: absolute;
        top:3px;
        background-repeat: no-repeat;
        background-size: 70% 70%;
        background-position: center;
    }
    .iconName{
        background-image: url('../image/人.png');
        
    }
    .iconPhone{
        background-image: url('../image/电话.png');
    }.iconEmail{
        background-image: url('../image/邮箱.png');
    }
    .iconSite{
        background-image: url('../image/地址.png');
    }
    .input-area button{
        position: absolute;
        left:0;
        width:40px;
        height:20px;
        border-radius: 5px;
        border:none;
        background:#00AEF3;
        text-align: center;
        color:#FFFFFF;
        font-size: 12px;
    }
    .advertising{
        width:200px;
        height:105px;
        position:fixed;
        top:40%;
        left:25%;
        background-image: url('../image/广告.jpg');
        background-repeat: no-repeat;
        background-size: 100% 100%;
        border-radius: 3px;
    }
    .advertising-close{
        
        text-align: right;
    }
    .advertising-close a {
        display: inline-block;
        width:16px;
        height:16px;
    }
    .advertising-close a img{
        width:100%;
        height:100%;
    }
    .advertising-zi{
        width:65%;
        margin-left: 65px;
    }
    .advertising-zi p{
        text-align: center;
        color:#FFFFFF;
        font-size:12px;
    }
    .advertising-click{
        text-align: right;
        margin-top:20px;
    }
    .advertising-click a{
        display: inline-block;
        width:52px;
        height:24px;
        line-height: 24px;
        border:1px solid #fff;
        text-align: center;
        border-radius: 6px;
        font-size:12px;
        margin-left: 5px;
    }
    .advertising-click-later{
        color:white;
    }
    .advertising-click-now{
        background:white;
        color:#0F8CDC;
    }
    .onLine{
        width:50px;
        height:20px;
        position:fixed;
        top:40%;
        right:0;
    }
    .onLine a{
        display: inline-block;
        width:100%;
        height: 100%;
    }
    .onLine a img{
        width:100%;
        height: 100%;
        border-radius: 5px;
    }
}
/************************ 平板 *************************/
@media (min-width: 768px) {
    .index-top{
        width:100%;
        height:80px;
    }
    .index-top .index-logo{
        width:60%;
        height:100%;
        line-height: 80px;
        font-size: 26px;
    }
    header{
        width:100%;
        height:80px;
        
    }
    .header-top{
        width:100%;
        height:100%;
    }
    .header-top .logo{
        width:30%;
        height:80px;
        line-height: 80px;
        font-size:24px;
    }
    .header-ul{
        width:60%;
        height:100%;
        line-height: 80px;
    }
    main{
        width:100%;
    }
    .bgcolor{
        width:100%;
        height:800px;
    }

    .bgcolor-area{
        width:70%;
        height:1000px;
        margin:0 auto;
    }
    .bgcolor-area img{
        width:250px;
        height:290px;
        margin-top: 150px;
    }
    .bgcolor-area-con{
        font-weight: bolder;
        margin-top: 80px;
    }
    .bgcolor-area-zi{
        font-size:30px;
        text-align: center;
        margin-top:5px;
    }
    .bgcolor-button{
        width:295px;
        height:48px;
        margin:0 auto;
        margin-top:80px;
    }
    .bgcolor-button a{
        width:295px;
        height:48px;
        line-height:48px;
        font-size:16px;
       
    }
    footer{
        width:100%;
        height:344px;
    }
    .footer-area{
        width:100%;
        height:300px;
    }
    .footer-area-one{
        width:50%;
    }
    .footer-area-one h2{
        font-size:30px;
    }
    .footer-area-one div{
        margin-top: 30px;
        font-size:14px;
    }
    .footer-area-one h1{
        font-size:36px;
    }
    .footer-area-two{
        width:50%;    
    }
    .footer-ul1{
        width:350px;
        font-size:14px;
    }
    .footer-ul2{
        width:390px;
        font-size:14px;
    }
    .footer-ul2 li{
        width:25%;
        margin-top:20px;
    }
    .footer-area2{
        font-size:12px;
    }
    .footer-area2-span{
        margin-left:10px;
    }
    .footer-phone{
        width:100%;
        height:30px;
        line-height: 30px;
    }
    .footer-phone a{
        font-size: 14px;
    }
    .clickTop{
        width:42px;
        height:42px;
        position:fixed;
        right:5%;
        bottom:5%;
        background-image: url("../image/03.png");
    }
    .form{
        position: fixed;
        bottom: 0;
        left:0;
        width:200px;
    }
    .form1{
        position: fixed;
        top:30%;
        left:43%;
        width:200px;
    }
    .form-leave{
        width:100%;
        height:35px;
    }
    .form-leave-title{
        font-size: 14px;
        margin-left: 12px;
        line-height: 35px;
    }
    .form-leave-img{
        width:34px;
        height:30px;
    }
    .form-leave-img a{
        width:100%;
        height: 100%;
        line-height: 40px;
    }
    .form-con{
        width:100%;
        height:260px;
    }
    .form-con textarea{
        width:90%;
        height:41px;
        margin-top:10px;
    }
    .input-area{
        width:90%;
        height:30px; 
        margin-top:10px;
        position: relative;
    }
    .input-area input{
        width:100%;
        height:29px;
        text-indent: 30px;
    }
    .input-icon{
        width:36px;
        height: 30px;
        position: absolute;
        top:0;
        background-repeat: no-repeat;
        background-size: auto;
        background-position: center;
    }
    .input-area button{
        position: absolute;
        left:0;
        width:80px;
        height:25px;
    }
    .advertising{
        width:300px;
        height:135px;
        position:fixed;
        top:40%;
        left:35%;
    }
    .advertising button{
        width:82px;
        height:34px;
        border-radius: 5px;
    }
    .advertising-zi{
        width:50%;
        margin-left: 135px;
        margin-top: 20px;
    }
    .advertising-zi p{
        font-size:12px;
    }
    .advertising-click{
        padding-right: 10px;
        margin-top:20px;
    }
    .advertising-click a{
        width:52px;
        height:24px;
        line-height: 24px;
        font-size:12px;
        margin-left: 5px;
    }
    .advertising-click-later{
        color:white;
    }
    .onLine{
        width:140px;
        height:50px;
        position:fixed;
        top:40%;
        right:0;
    }
    .onLine a{
        width:100%;
        height: 100%;
    }
    .onLine a img{
        width:100%;
        height: 100%;
    }
}

/************************ 大屏 *************************/
@media (min-width: 1024px) {
    .index-top{
        width:100%;
        height:120px;
    }
    .index-top .index-logo{
        width:60%;
        height:100%;
        line-height: 120px;
        margin:0 auto;
        font-size: 32px;
    }
    header{
        width:100%;
        height:120px;
        
    }
    .header-top{
        width:60%;
        height:100%;
        margin:0 auto;
    }
    .header-top .logo{
        height:120px;
        line-height: 120px;
        font-size:32px;
    }
    .header-ul{
        width:70%;
        height:100%;
        line-height: 120px;
        font-size: 16px;
    }
    .header-ul li a{
        display: inline-block;
        width:100%;
        height:70%;
        border:2px solid transparent;
    }
    .header-ul li a.li-click{
        color:#1D4EAA;
        border-bottom-color: #1D4EAA;
    }
    main{
        width:100%;
    }
    .bgcolor{
        width:100%;
        height:1000px;
    }

    .bgcolor-area{
        width:70%;
        height:1000px;
        margin:0 auto;
        text-align: center;
    }
    .bgcolor-area img{
        width:250px;
        height:290px;
        margin-top: 150px;
    }
    .bgcolor-area-con{
        font-weight: bolder;
        margin-top: 80px;
    }
    .bgcolor-area-zi{
        font-size:30px;
        text-align: center;
        margin-top:5px;
    }
    .bgcolor-button{
        width:295px;
        height:48px;
        margin:0 auto;
        margin-top:80px;
    }
    .bgcolor-button a{
        width:295px;
        height:48px;
        line-height:48px;
        font-size:16px;
       
    }
    footer{
        width:100%;
        height:344px;
        overflow: hidden;
    }
    .footer-area{
        width:100%;
        height:300px;
    }
    .footer-area-one{
        width:50%;
    }
    .footer-area-one h2{
        font-size:30px;
    }
    .footer-area-one div{
        margin-top: 30px;
        font-size:14px;
    }
    .footer-area-one h1{
        font-size:36px;
    }
    .footer-area-two{
        width:50%;
       
    }
    .footer-ul1{
        width:470px;
        font-size:14px;
    }
    .footer-ul2{
        width:550px;
        font-size:14px;
    }
    .footer-ul2 li{
        width:25%;
        margin-top:20px;
    }
    .footer-area2{
        font-size:12px;
    }
    .footer-area2-span{
        margin-left:10px;
    }
    .footer-phone{
        width:100%;
        height:30px;
        line-height: 30px;
    }
    .footer-phone a{
        font-size: 14px;
    }
    .clickTop{
        width:42px;
        height:42px;
        position:fixed;
        right:5%;
        bottom:5%;
        background-image: url("../image/03.png");
    }
    .form{
        position: fixed;
        bottom: 0;
        left:0;
        width:240px;
    }
    .form1{
        position: fixed;
        top:30%;
        left:43%;
        width:240px;
    }
    .form-leave{
        width:100%;
        height:35px;
    }
    .form-leave-title{
        font-size: 14px;
        margin-left: 12px;
        line-height: 35px;
    }
    .form-leave-img{
        width:34px;
        height:30px;
    }
    .form-leave-img a{
        width:100%;
        height: 100%;
        line-height: 40px;
    }
    .form-con{
        width:100%;
        height:315px;
    }
    .form-con textarea{
        width:90%;
        height:81px;
        margin-top:10px;
    }
    .input-area{
        width:90%;
        height:30px; 
        margin-top:10px;
    }
    .input-area input{
        width:100%;
        height:29px;
        text-indent: 35px;
    }
    .input-icon{
        width:36px;
        height: 30px;
        position: absolute;
        top:0px;
    }
    .input-area button{
        position: absolute;
        left:0;
        width:90px;
        height:30px;
    }
    .advertising{
        width:400px;
        height:175px;
        position:fixed;
        top:40%;
        left:40%;
        transform: translate(-40% -40%);
    }
    .advertising button{
        width:82px;
        height:34px;
    }
    .advertising-zi{
        width:60%;
        margin-left: 135px;
        margin-top: 20px;
    }
    .advertising-zi p{
        font-size:17px;
    }
    .advertising-click{
        margin-top:50px;
    }
    .advertising-click a{
        width:82px;
        height:34px;
        line-height: 34px;
        font-size:13px;
        margin-left: 5px;
    }
    .onLine{
        width:140px;
        height:50px;
        position:fixed;
        top:40%;
        right:0;
    }
    .onLine a{
        display: inline-block;
        width:100%;
        height: 100%;
    }
    .onLine a img{
        width:100%;
        height: 100%;
        border-radius: 5px;
    }
}