/* about */

.about{

    width: 100%;

/*    height: 820px;*/

    padding: 58px 0 0;

    background: url("../images/about_bg.jpg") top center no-repeat;

    background-size: 100% 565px;

    box-sizing: border-box;

}

.about_tit{

    overflow: hidden;

}

.about_tit .about_hr{

    float: left;

    width: 6px;

    height: 60px;

    background-color: #0071db;

    margin-top: 10px;

}

.about_tit2{

    float: left;

    margin-left: 15px;

    margin-top: 10px;

}

.about_tit2 h3{

    font-family: Arial-BoldMT;

    font-size: 38px;

    font-weight: bold;

    line-height: 30px;

    color: #333333;

}

.about_tit2 h4{

    font-size: 20px;

    line-height: 30px;

    letter-spacing: 8px;

    color: #333333;

    margin-top: 5px;

}

.about_more{

    float: right;

    width: 84px;

    height: 84px;

    background-color: #0071db;

    text-align: center;

    line-height: 84px;

    font-size: 16px;

    color: #ffffff;

    display: block;

}

.about_bot{

    margin-top: 32px;

    overflow: hidden;

}

.about_bot1{

    float: left;

    width: 558px;

    padding-top: 186px;

    box-sizing: border-box;

}

.about_bot1 p{

    font-size: 14px;

    line-height: 30px;

    color: #2b323a;

    height: 120px;

    overflow: hidden;

    text-overflow: ellipsis;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp:4;

}

.arrow{

    display: block;

    margin-top: 26px;

    width: 42px;

    height: 26px;

}

.arrow img{

    width: 42px;

    height: 26px;

}

.about_bot2{

    float: right;

    width: 564px;

    height: 348px;

    overflow: hidden;

}

.about_bot2 li{

    width: 138px;

    height: 348px;

    background-color: #2b323a;

    padding: 10px;

    box-sizing: border-box;

    float: left;

    margin-right: 4px;

}

.about_bot2 li:last-child{

    margin-right: 0;

}

.about_bot2 li a{

    width: 118px;

    height: 328px;

    border: dashed 1px rgba(255,255,255,.4);

    padding: 68px 0 0;

    box-sizing: border-box;

    display: block;

    text-align: center;

}

.about_bot2 li img{

    margin: auto;

    display: block;

}

.about_bot2 li span{

    font-size: 24px;

    line-height: 30px;

    letter-spacing: 6px;

    color: #ffffff;

    margin-top: 25px;

    display: block;

    text-align: center;

    padding: 0 46px;

    box-sizing: border-box;

}

.about_bot2 li:hover{

    background-color: #0071db;

    transition: all .5s ease-out;

    -webkit-transition: all .5s ease-out;

    -moz-transition: all .5s ease-out;

}

.about_img{

    width: 100%;

    height: 258px;

    background: url("../images/about_img.jpg") center center no-repeat;

    background-size: 100% 100%;

    padding: 22px 0;

    box-sizing: border-box;

    margin-top: 45px;

}

.swiper-about{

    height: 214px;

}

.swiper-about .swiper-slide{

    width: 280px;

    height: 214px;

    margin-right: 16px;

    position: relative;

    float: left;

}

.swiper-about .swiper-slide a,.swiper-about .swiper-slide img{

    display: block;

    width: 100%;

    height: 214px;

}

.swiper-about .swiper-slide .about_zz{

    background: rgba(0,0,0,.4);

    text-align: center;

    line-height: 214px;

    font-size: 16px;

    color: #eef1f6;

    padding: 0 5px;

    box-sizing: border-box;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    position: absolute;

    bottom: 100%;

    left: 0;

}

.swiper-about .swiper-slide:hover .about_zz{

    bottom: 0;

    transition: all .8s ease-out;

}

/* news */

.news{

    padding: 68px 0 66px;

}

.block1-1{

    float: right;

    width: 110px;

    height: 204px;

    background-color: #0071db;

    text-align: center;

    padding-top: 70px;

    box-sizing: border-box;

}

.block1-1 p{

    font-size: 16px;

    font-weight: bold;

    line-height: 34px;

    color: #fff;

}

.block1-1 img{

    display: block;

    width: 19px;

    height: 18px;

    margin: 16px auto 0;

}

.block3-2{

    width: 598px;

    height: 204px;

    border: solid 1px #bfbfbf;

    float: left;

    padding: 11px 30px 12px 11px ;

    box-sizing: border-box;

    position: relative;

}

.block3-2 .news_img img,.block3-2 .news_img{

    width: 280px;

    height: 181px;

    display: block;

    float: left;

}

.block3-2 > div{

    width: calc(100% - 280px);

    padding-left: 20px;

    box-sizing: border-box;

    float: left;

}

.block3-2 .news_tit{

    font-size: 16px;

    line-height: 38px;

    color: #666666;

    display: block;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    cursor: pointer;

}

.block3-2 p{

    font-size: 14px;

    line-height: 24px;

    color: #666666;

    margin-top: 10px;

    height: 72px;

    overflow: hidden;

    text-overflow: ellipsis;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 3;

}

.block3-2 h5{

    font-family: ArialMT;

    font-size: 14px;

    line-height: 38px;

    color: #666666;

    margin-top: 25px;

}

.block3-2 .news_add{

    display: block;

    width: 42px;

    height: 42px;

    position: absolute;

    bottom: 0;

    right: 0;

}

.block3-3{

    float: left;

    width: 420px;

    margin-left: 32px;

}

.block3-3 li{

    font-size: 14px;

    line-height: 38px;

    color: #666666;

}

.block3-3 li span{

    width: 6px;

    height: 6px;

    background-color: #0071db;

    border-radius: 50%;

    margin-right: 12px;

    display: inline-block;

}

.block3-3 li a{

    display: inline-block;

    width: 72%;

    color: #666666;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    vertical-align: middle;

}

.block3-3 li i{

    font-family: ArialMT;

    font-size: 14px;

    line-height: 38px;

    color: #666666;

    float: right;

}

.block3-3 li:hover a,.block3-2:hover .news_tit{

    color: #0071db;

    transition: all .5s ease-out;

}

/* case */

.case{

    width: 100%;

    height: 668px;

    background: url("../images/case_bg.jpg") center center no-repeat;

    background-size: cover;

    padding: 86px 0 66px;

    box-sizing: border-box;

}

.case_top{

    text-align: center;

}

.case_top h4{

    font-family: ArialMT;

    font-size: 40px;

    line-height: 40px;

    color: #ffffff;

}

.case_top h4 span{

    font-weight: bold;

}

.case_top h3{

    font-size: 22px;

    color: #ffffff;

    margin-top: 5px;

}

.case_top h3 span{

    width: 27px;

    height: 1px;

    background-color: #ffffff;

    display: inline-block;

    vertical-align: middle;

    margin: 0 12px;

}

.case_bottom{

    width: 100%;

    height: 402px;

    overflow: hidden;

    margin-top: 45px;

}

.swiper-case{

    width: 100%;

    height: 302px;

}

.swiper-case .swiper-slide{

    width: 400px;

    height: 302px;

    margin-right: 30px;

}

.swiper-case .swiper-slide:first-child{

    margin-left: -100px;

}

.swiper-case .swiper-slide a,.swiper-case .swiper-slide img{

    display: block;

    width: 100%;

    height: 302px;
    cursor: url("../images/btn.png"),auto;
}

.swiper-case .swiper-slide a.case_zz{

    width: 100%;

    height: 302px;

    background-color: rgba(0,0,0,.6);

    padding-top: 120px;

    box-sizing: border-box;

    position: absolute;

    bottom: 100%;

    left: 0;
    cursor: url("../images/btn.png"),auto;
}

.swiper-case .swiper-slide b{

    font-size: 20px;

    color: #ffffff;

    display: block;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    padding: 0 5px;

    box-sizing: border-box;

    text-align: center;

}

.swiper-case .swiper-slide  span{

    display: block;

    width: 90px;

    height: 26px;

    border: solid 1px #ffffff;

    text-align: center;

    line-height: 26px;

    font-size: 14px;

    color: #ffffff;

    margin: 15px auto 0;

}

.swiper-case .swiper-slide:hover a.case_zz{

    bottom: 0;

    transition: all .5s ease-out;

}

.case_bot2{

    margin-top: 55px;

    text-align: center;

}

.case_bot2 a{

    width: 120px;

    height: 38px;

    background-image: linear-gradient(0deg,

    #cb8705 0%,

    #e8c101 100%),

    linear-gradient(

            #cc8905,

            #cc8905);

    background-blend-mode: normal,

    normal;

    display: inline-block;

    text-align: center;

    line-height: 38px;

    font-size: 14px;

    color: #ffffff;

    margin-right: 20px;

}

.case_bot2 a.case_more{

    width: 120px;

    height: 38px;

    border: solid 1px #ffffff;

    background: transparent;

}



/* product */

.product{

    padding: 65px 0;

}

.pro_top h4,.pro_top h4 span,.pro_top h3{

    color: #333333;

}

.pro_top h3 span{

    background: #333;

}

.product_bot{

    overflow: hidden;

    height: 656px;

    margin-top: 36px;

}

.product_bot1{

    width: 212px;

    height: 656px;

    overflow: hidden;

    float: left;

}

.pro_bot1-1{

    border-top: 7px solid #0071db;

    height: 127px;

    background-color: #2b323a;

    text-align: center;

    padding-top: 35px;

    box-sizing: border-box;

}

.pro_bot1-1 h4{

    font-size: 26px;

    font-weight: bold;

    line-height: 30px;

    color: #ffffff;

}

.pro_bot1-1 h5{

    font-size: 18px;

    line-height: 30px;

    color: #ffffff;

    margin-top: 5px;

}

.pro_bot1-2{

    margin-top: 16px;

}

.pro_bot1-2 li{

    width: 212px;

    height: 58px;

    border: solid 1px #bfbfbf;

    box-sizing: border-box;

    margin-top: 7px;

    line-height: 56px;

    padding: 0 5px 0 22px;

    position: relative;

    font-size: 0;

}

.pro_bot1-2 li span{

    display: inline-block;

    width: 8px;

    height: 8px;

    background-color: #0071db;

    vertical-align: middle;

}

.pro_bot1-2 li a{

    width: calc(100% - 30px);

    margin-left: 16px;

    display: inline-block;

    vertical-align: middle;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    font-size: 16px;

    color: #333333;

}

.pro_bot1-2 li i {

    display: block;

    width: 0;

    height: 100%;

    background-color: #0071db;

    position: absolute;

    top: 0;

    left: 0;

    z-index: -1;

}

.pro_bot1-2 li:hover{

    border: 0;

}

.pro_bot1-2 li:hover span{

    background: #fff;

    transition: all .5s ease-out;

}

.pro_bot1-2 li:hover a{

    color: #ffffff;

    transition: all .5s ease-out;

}

.pro_bot1-2 li:hover i{

    width: 100%;

    transition: all 1s ease-out;

}

.product_bot2{

    float: left;

    margin-left: 10px;

    width: calc(100% - 222px);

    height: 655px;

    overflow: hidden;

    position: relative;

}

.pro_bot2-1{

    position: absolute;

    top: 0;

    right: 0;

    width: 306px;

    height: 106px;

}

.pro_tit{

    overflow: hidden;

    line-height: 32px;

}

.pro_tit p{

    width: 66px;

    text-align: center;

    font-size: 16px;

    color: #333333;

    float: left;

    margin-right: 45px;

}

.pro_tit p.pro_hot{

    color: #0071db;

    border-bottom: 4px solid #0071db;

}

.pro_tit a{

    float: right;

    font-size: 14px;

    color: #666666;

}

.pro_search{

    margin-top: 20px;

    width: 306px;

    height: 46px;

    border: solid 1px #0071db;

    box-sizing: border-box;

    font-size: 0;

}

.pro_search input{

    width: calc(100% - 40px);

    height: 100%;

    border: 0;

    background: transparent;

    font-size: 14px;

    padding: 0 10px;

    box-sizing: border-box;

}

.pro_search input::placeholder{

    color: #666;

}

.pro_search input::-webkit-input-placeholder{

    color: #666;

}

.pro_search input::-moz-placeholder{

    color: #666;

}

.pro_search input::-ms-input-placeholder{

    color: #666;

}

.pro_search .btnn{

    width: 32px;

    height: 32px;

    vertical-align: middle;

    cursor: pointer;
    background: url("../images/search.png") center center no-repeat;

}

.pro_img{

    float: left;

    width: 306px;

    height: 248px;

    margin-left: 20px;

    margin-bottom: 34px;

}

.pro_img a.pro_imgs{

    width: 100%;

    height: 200px;

    overflow:hidden;

}

.pro_img a,.pro_img img{

    display: block;

    width: 100%;

    height: 100%;

}

.pro_img a.pro_txt{

    width: 100%;

    height: 48px;

    line-height: 48px;

    text-align: center;

    background-color: #2b323a;

    padding: 0 5px;

    box-sizing: border-box;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    font-size: 14px;

    color: #ffffff;

}

.pro_img1{

    width: 632px;

    height: 373px;

}

.pro_img1 a.pro_imgs{

    width: 100%;

    height: 326px;

}

.pro_img2{

    margin-top: 125px;

}

.pro_img:nth-child(5),.pro_img2:nth-child(2){

    margin-right: 0;

}

.pro_img:hover .pro_imgs{

    border: 2px solid  #0071db;

    box-sizing: border-box;

    transition: all 0.4s;

}

.pro_img:hover a.pro_txt{

    background: #0071db;

    transition: all 0.4s;

}

.pro_img:hover img{

    transform: scale(1.1,1.1) ;

    -ms-transform: scale(1.1,1.1) ;

    -webkit-transform: scale(1.1,1.1) ;

    -o-transform: scale(1.1,1.1) ;

    -moz-transform: scale(1.1,1.1);

    transition: all 0.4s;

    -moz-transition: all 0.4s;

    -webkit-transition: all 0.4s;

    -o-transition: all 0.4s;

}

.ys{

    width: 100%;

    height: 800px;

    background-color: #eef1f6;

    padding: 96px 0 102px;

    box-sizing: border-box;

}

.ys_bottom{

    margin-top: 56px;

    overflow: hidden;

}

.ys_bot1{

    width: 356px;

    height: 468px;

    background: #fff;

    float: left;

    margin-right: 65px;

    text-align: center;

    position: relative;

}

.ys_bot1:nth-child(3){

    margin-right: 0;

}

.ys_bot1 img{

    width: 356px;

    height: 270px;

    display: block;

}

.ys_desc{

    width: 356px;

    height: 198px;

    background: #fff;

    color: #333333;

    padding: 36px 30px 24px;

    box-sizing: border-box;

    position: absolute;

    bottom: 0;

    left: 0;

}

.ys_desc h4{

    font-family: Humanist777BT-LightB;

    font-size: 50px;

    line-height: 45px;

    margin-bottom: 35px;

    display: none;

}

.ys_desc h5{

    font-size: 24px;

    line-height: 30px;

}

.ys_desc p{

    font-size: 14px;

    line-height: 30px;

    margin-top: 20px;

}

.ys_bot1:hover .ys_desc{

    height: 282px;

    color: #ffffff;

    background: rgba(0,113,219,.8);

    transition: all .8s ease-out;

}

.ys_bot1:hover h4{

    display: block;

}

/* block */

.block{

    width: 100%;

    height: 325px;

    background: url("../images/block2.jpg") center center no-repeat;

    padding: 45px 0 46px;

    text-align: center;

    box-sizing: border-box;

}

.block p{

    font-size: 30px;

    color: #ffffff;

}

.block p b{

    font-size: 36px;

}

.block h5{

    font-size: 24px;

    line-height: 24px;

    color: #ffffff;

    margin-top: 20px;

}

.block_input{

    margin-top: 25px;

}

.block_input input{

    width: 324px;

    height: 60px;

    background-color: #ffffff;

    border-radius: 4px;

    padding: 0 18px;

    box-sizing: border-box;

    margin-right: 18px;

    float: left;

    font-size: 14px;

   /* color: #666666;*/

}

.block_input button{

    width: 171px;

    height: 60px;

    background-color: #ffffff;

    box-shadow: 0 3px 7px 0 rgba(0, 0, 0, 0.28);

    border-radius: 8px;

    border: 0;

    font-size: 16px;

    color: #333333;

    cursor: pointer;

}

.block_input input::placeholder{

    color: #666666;

}

.block_input input::-webkit-input-placeholder{

    color: #666666;

}

.block_input input::-moz-placeholder{

    color: #666666;

}

.block_input input::-ms-input-placeholder{

    color: #666666;

}

/* news */

.news2{

    height: 520px;

    padding-top: 95px;

    box-sizing: border-box;

    background: url("../images/news_bg.jpg") center center no-repeat;

    background-size: cover;

    overflow: hidden;

}

.news2-1{

    width: 280px;

    height: 426px;

    background: url("../images/news_tit.jpg") no-repeat;

    padding-top: 172px;

    padding-left: 75px;

    box-sizing: border-box;

    float: left;

}

.news2-1 h4{

    font-family: ArialMT;

    font-size: 64px;

    line-height: 60px;

    color: #ffffff;

}

.news2-1 h3{

    font-size: 28px;

    line-height: 30px;

    color: #ffffff;

    margin-top: 14px;

}

.news2-2{

    float: left;

    width: 285px;

    height: 100%;

    margin-left: 40px;

    overflow: hidden;

}

.news_tit{

    font-size: 22px;

    font-weight: bold;

    line-height: 32px;

    color: #333333;

}

.news2-21{

    margin-top: 10px;

}

.news2-21 li{

    height: 88px;

    padding: 18px 0 16px;

    border-bottom: 1px solid #bfbfbf;

    box-sizing: border-box;

}

.news2-21 li > a{

    display: block;

    width: 100%;

    font-size: 16px;

    line-height: 28px;

    color: #333333;

    padding: 0 3px;

    box-sizing: border-box;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.news2-21 li span{

    font-family: ArialMT;

    font-size: 14px;

    line-height: 28px;

    color: #999999;

    display: block;

}

.news_more{

    width: 78px;

    height: 26px;

    border: solid 1px #666666;

    text-align: center;

    line-height: 26px;

    font-size: 14px;

    color: #666666;

    margin-top: 50px;

}



.news2-3{

    float: right;

    width: 535px;

}

.news2-31{

    margin-top: 10px;

}

.news2-31 li{

    height: 88px;

    padding: 18px 0 16px;

    border-bottom: 1px solid #bfbfbf;

    box-sizing: border-box;

    font-size: 16px;

    line-height: 28px;

    color: #333333;

}

.news2-31 li > div{

    overflow: hidden;

}

.news2-31 li span{

    float: left;

}

.news2-31 li a,.news2-31 li p{

    float: left;

    overflow: hidden;

    width: 95%;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.news_more:hover{

    border: solid 1px #0071db;

    color: #0071db;

    transition: all .5s ease-out;

}

.news_more:hover a,.news2-21 li:hover > a,.news2-31 li:hover a{

    color: #0071db;

    transition: all .5s ease-out;

}