body{
    background: #f0f4fb;
}
.banner{
    height: 640px;
    background: #7a7ff7;
}
.logo{
    margin: 0 378px 0 0;
}
.logo>img{vertical-align: middle}
.nav li{position:relative;float: left;margin-right: 60px;}
.nav li a{position:relative;display: block;color: #fff;line-height: 100px}
.nav li a:hover{color: #fcc017;transition: 0.3s;}
.nav li.actived a{
    color: #fcc017;
}
.nav li.actived:after{
    content: '';
    position: absolute;
    transform: translate(-50%, -50%);
    top: 75px;
    left: 50%;
    right: 50%;
    display: block;
    height: 2px;
    width: 28px;
    background: #fcc017;
}
.header_btn{
    display: block;
    height: 40px;
    line-height: 40px;
    padding: 0 20px;
    margin: 30px 0 0 20px;
    background: rgba(0,0,0,0.15);
    border-radius: 22px;
    color: #fff;
    box-shadow:0px 1px 4px rgba(0,0,0,0.35);
}
.header_btn img{
    vertical-align: middle;
    transform:scale(0.8);
    margin-right: 8px;
}
.header_btn:hover{
    transition: 0.3s;
    background: rgba(0,0,0,0.2);
}
.banner_left{margin-top: 120px;}
.banner_left>h1{font-size: 30px;line-height:48px;color:#ffffff;margin-bottom: 30px}
.banner_left>p{font-size: 18px;line-height: 36px;color:rgba(255,255,255,0.6);margin-bottom: 60px}
.pro_card{
    margin-top: -55px;
    padding: 25px 0;
    height: 60px;
    background: #fff;
    border-radius: 10px;
}
.pro_card li{float: left;width: calc(33% - 51px);border-right: 1px solid #eee;padding-left:40px}
.pro_card li:last-child{border: none}
.pro_card li img{float: left ;margin-right: 30px}
.pro_card li h3{font-size: 18px;margin-bottom: 15px;margin-top: 8px}
.pro_card li p{font-size: 14px;color: #adafb5}
.pro_con{padding: 100px 0;border-bottom: 1px solid #e5e5e5}
.pro_con_txt{margin-top: 40px;}
.pro_con_txt>h1{font-size: 24px;line-height:44px;margin-bottom: 30px;}
.pro_con_txt>p{font-size: 18px;line-height: 36px;color:#adafb5;margin-bottom: 60px}
section{max-width: none}