body {
  font-family: 'Noto Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.center{

    width: 1680px;

    margin: 0 auto;

}

.flex{

    display: flex;

    display: -webkit-flex;

    justify-content: space-between;

}

.flex_wrap{

    flex-wrap: wrap;

}

.flex_center{

    align-items: center;

}





.img-fluid{width:100%;height:auto;}





.head_top{

    background-color: #0063b5;

    color: white;

    padding: 11px 0;

}

.head_top ul li{

    font-size: 16px;

    padding-left: 24px;

    position: relative;

    margin-right: 40px;

}

.head_top ul li::before{

    content: url(../image/dianhua-icon.png);

    position: absolute;

    top: 0;

    left: 0;

}

.head_top ul li:nth-child(2)::before{

    content: url(../image/youxiang.png);

}

.head_top form {

    margin-left: 840px;

}

.head_top form input{

    padding: 0 10px;

    font-size: 14px;

    color: white;

    width: 140px;

    background: none;

    border: 1px solid white;

    border-radius: 20px;

    height: 22px;

}

.head_top form input::placeholder{

    color: #b3bdc9;

}

.head_top form button{

    width: 24px;

    height: 24px;

    border-radius: 50%;

    border: none;

    padding: 0;

    cursor: pointer;

    margin-left: 12px;

}

.head_top p{

    position: relative;

}

.head_top p::before{

    content: url(../image/diqiu-icon.png);

    position: relative;

    top: 3px;

    left: -8px;

}

.head_top p a{

    color: white;

    font-size: 16px;

}

.head_top p a:hover{

    color: #19366d;

}

.head_bottom{

    padding: 15px 0 15px 0;

}

.head_bottom .nav>li{

    margin-left: 102px;

}

.head_bottom .nav>li>a{

    color: #6c6c6c;
    font-weight: 500;
    font-size: 20px;

}

.head_bottom ul .nav_ac{

    color: #144973;

    position: relative;

}

.head_bottom ul .nav_ac::after{

    content: '';

    display: block;

    width: 100%;

    height: 2px;

    background-color: #0063b5;

    position: absolute;

    bottom: -12px;

    left: 0;

}

.head_bottom ul .nav_ac::before{

    content: '';

    width: 0;

    height: 0;

    border: 8px solid transparent;

   /* border-bottom-color: #0063b5;*/

    position: absolute;

    bottom: -12px;

    left: 50%;

    transform: translateX(-50%);

}



/* �����˵� */



.head_bottom .nav>li{

    position: relative;

}

.head_bottom .nav>li>h3{

    display: none;

    font-size: 30px;

    color: #144973;

    position: absolute;

    top: 12px;

    right: 20px;

    font-weight: 500;

    transition: all .3s;

    transform: rotate(0deg);

}

.erji_nav{

    display: none;

    position: absolute;

    top: 28px;

    left: 50%;

    z-index: 99;

    min-width: 70px;

    text-align: center;

    width: auto;

    transform: translateX(-50%);

}

.erji_nav li{

    background-color: #0063b5;

}

.erji_nav li a{

    display: block;

    text-align: center;

    color: white;

    white-space: nowrap;

    padding: 10px 20px;

}

.erji_nav li:hover{

    background-color: #144973;

}



.head_bottom .flex>img{

    width: 100px;

}







.head_bottom .nav>li::before{

    content: '';

    width: 0;

    height: 0;

    border: 8px solid transparent;

    border-bottom-color: #0063b5;

    position: absolute;

    bottom: -12px;

    left: 50%;

    transform: translateX(-50%);

    display: none;

}



.head_bottom .nav>li:hover::before{

    display: block;

}



.banner .swiper .swiper-slide img{

    width: 100%;

}

.brand{

    background-color: #f4f5f6;

    padding-top: 65px;

    padding-bottom: 74px;

}

.title_index{

    position: relative;

}

.title_index h3{

    font-size: 40px;

    font-weight: 530;

    color: #4c4c4c;

    /*position: absolute;*/

	position: relative;

    top: 0;

    left: 0;

}

.title_index h3 span{

    color: #0063b5;

}

.title_index h4{

    font-size: 40px;

    color: #e4e5e6;

    padding-top: 20px;

}

.title_index a{

    display: inline-block;

    background-color: #0063b5;

    height: 50px;

    line-height: 50px;

    font-size: 17px;

    color: white;

    padding-left: 25px;

    padding-right: 68px;

    position: relative;

}

.title_index a::after{

    content: url(../image/biaoti-jiantou.png);

    position: absolute;

    top: -4px;

    right: 24px;

}

.brand_main{

    margin-top: 60px;

    justify-content: start;

}

.brand_main .item{

    width: 20%;

    overflow: hidden;

    box-sizing: border-box;

    position: relative;

    margin: -1px 0 0 -1px;

    z-index: 1;

    transition: all .3s linear;

    border: 1px solid #eaeff7;

}

.brand_main .item img{

    width: 100%;

    transition: all .3s linear;

}

.brand_main .item:hover {

    box-shadow: 0 10px 30px rgb(0 0 0 / 20%);

    border-color: #0063b5;

    z-index: 2;

}

.brand_main .item:hover img {

    transform: scale(1.1);

}



.youshi{

    padding-top: 70px;

    padding-bottom: 70px;

}

.youshi .youshi_main{
    width: 95%;
    max-width: 1680px;
    margin:60px auto 0;
    justify-content: flex-end;
    position: relative;
}

.youshi .youshi_main .swiper{

    width:100%;
    margin:0 auto;

}

.youshi .youshi_main #swiper_2 h3{

    display: inline-block;

    font-size: 32px;

    color: #0063b5;

    padding-bottom: 28px;

    position: relative;

    margin-bottom: 40px;

}

.youshi .youshi_main #swiper_2 h3::after{

    content: '';

    display: block;

    width: 100%;

    height: 3px;

    background-color: #0063b5;

    position: absolute;

    bottom: 0;

    left: 0;

}

.youshi .youshi_main #swiper_2 p{

    font-size: 20px;

    color: #6b6b6b;

    line-height: 36px;

}

.youshi .youshi_main #swiper_2 .youshi_text{
    width: 47%;
    padding-right: 3%;

}

.youshi .youshi_main #swiper_2 .youshi_img{

    width: 53%;

    overflow: hidden;

}

.youshi .youshi_main #swiper_2 .youshi_img img{

    width: 100%;

}

.youshi .youshi_main #thumbs{

    width: 47%;

    position: absolute;

    bottom: 77px;

    left: 0;

    z-index: 99;

    background-color: rgba(244, 245, 246, .8);

}

.youshi .youshi_main #thumbs .swiper-slide{

    text-align: center;

    color: #144973;

    font-size: 18px;

    padding: 25px 0;

    cursor: pointer;

}

.youshi .youshi_main #thumbs .youshi_icon{

    margin: 0 auto;

    width: 66px;

    overflow: hidden;

    margin-bottom: 15px;

}

.youshi .swiper-slide-thumb-active{

    background-color: #0063b5;

}

.youshi .swiper-slide-thumb-active p{

    color: white;

}

.youshi .swiper-slide-thumb-active img{

    margin-left: -66px;

}





.case{

    position: relative;

}

.case h2{

    position: absolute;

    top: 170px;

    left: 160px;

    z-index: 99;

    color: white;

    font-size: 50px;

    font-weight: 500;

}

.case .swiper-slide .text{

    position: absolute;

    top: 280px;

    left: 160px;

    z-index: 99;

    color: white;

    font-size: 20px;

    line-height: 23px;

	max-width:60%;

}

.case .swiper-slide .text a{

    display: inline-block;

    background-color: #0063b5;

    color: white;

    margin-top: 134px;

    font-size: 18px;

    padding: 16px 30px;

}

.case .swiper-slide .text a::after{

    display: inline-block;

    content: url(../image/biaoti-jiantou.png);

    margin-left: 20px;

    transform: translateY(-3px);

}

.case .case_anniu{

    width: 100%;

    position: absolute;

    bottom: 0;

    left: 0;

    background-color: rgba(255, 255, 255, .8);

    z-index: 99;

}

.case .case_anniu .swiper-slide{

    text-align: center;

    padding: 33px 0;

    cursor: pointer;

    height: 100%;

}

.case .case_anniu .swiper-slide .case_icon{

    width: 88px;

    overflow: hidden;

    margin: 0 auto;

}

.case .case_anniu .swiper-slide p{

    font-size: 22px;

    margin-top: 14px;

}



.case .case_anniu .swiper-slide-thumb-active{

    background-color: #0063b5;

}

.case .case_anniu .swiper-slide-thumb-active p{

    color: white;

}

.case .case_anniu .swiper-slide-thumb-active img{

    margin-left: -88px;

}





.hezuo{

    padding-top: 70px;

    padding-bottom: 80px;

    background-color: #f4f5f6;

}

.hezuo .title_index p{

    font-size: 20px;

    color: #4c4c4c;

    margin-top: 35px;

    margin-bottom: 38px;

}

.hezuo .hezuo_box .item{

    box-sizing: border-box;

    width: 16.667%;

    border: 1px solid #71aaff;

    overflow: hidden;

}



.indexmap{width:840px;}



.foot_top{

    padding: 52px 0;

}

.foot_top ul:first-child li{

    font-size: 20px;

    color: #4a4f54;

    line-height: 46px;

}

.foot_top ul:first-child li:first-child{

    font-size: 26px;

}

.foot_bottom{

    line-height: 58px;

    border-top: 2px solid #e6e6e6;

    font-size: 20px;

   color: #ffffff;
    background-color: #0063b5;

}

.foot_bottom  a{color: #ffffff;}

.foot_bottom ul li a{

    color: #ffffff;

    margin-left: 30px;

}

.foot_bottom ul li a:hover{

    color: #ffffff;

}





@media(max-width: 1700px) {

    html{

        zoom: 0.9;

    }

}

@media(max-width: 1600px) {

    html{

        zoom: 0.85;

    }

}

@media(max-width: 1500px) {

    html{

        zoom: 0.8;

    }

}

@media(max-width: 1400px) {

    html{

        zoom: 0.75;

    }

}

@media(max-width: 1300px) {

    html{

        zoom: 0.7;

    }

}

@media(max-width: 1200px) {

    html{

        zoom: 0.6;

    }

}

@media(max-width: 1100px) {

    html{

        zoom: 0.5;

    }

}