﻿.onwrap{
    max-width: 1448px;
    margin: 0 auto;
}
.online_page{width: 100%;overflow: hidden;}
.dottitle{margin-bottom: 90px;text-align: center;}
.dottitle h3{color: #333333;font-size: 24px;font-weight: 500;}
.dottitle p{color: #333333;font-size: 18px;margin-top: 10px;}
.online_page .mtitle{color:#333333;font-size: 36px;font-weight: 500;padding-bottom: 46px;border-bottom: 1px solid #e5e5e5;margin-bottom: 64px;}
.onbox1{padding: 58px 0 70px;}
.onbox2{padding: 95px 0 80px;background-color: #f9fafb;}
.onbox3{padding: 95px 0 80px;}
.onbox4{padding: 80px 0 60px;}
.onbox4 .dottitle{margin-bottom: 40px;}
.onbox4 .dottitle h3{color: #333;}
.onbox5{padding: 120px 0 110px;background-color: #f9fafb;}
/* .onbox6{padding: 110px 0 150px;} */
.online_nav{margin: 0 -3px;}
.online_nav li{float: left;padding: 0 3px;width: 20%;}
.online_nav li a{
    display: flex;
    display: -ms-flexbox;
    background-repeat: no-repeat;
    background-position: center right;
    flex-direction: column;
    -ms-flex-direction: column;
    justify-content: center;
    -ms-flex-pack: center;
    height: 181px;
    padding: 0 18px;
    color: #fff;
    font-size: 24px;
    transition: all .3s ease;
}
.online_nav li a:hover{box-shadow: 0px 8px 12px 0px rgba(0,0,0,.1);}
.online_nav li:nth-child(1) a:hover{box-shadow: 0px 8px 12px 0px rgba(235,61,59,.2);}
.online_nav li:nth-child(2) a:hover{box-shadow: 0px 8px 12px 0px rgba(196,113,296,.2);}
.online_nav li:nth-child(3) a:hover{box-shadow: 0px 8px 12px 0px rgba(40,139,226,.2);}
.online_nav li:nth-child(4) a:hover{box-shadow: 0px 8px 12px 0px rgba(253,128,27,.2);}
.online_nav li:nth-child(5) a:hover{box-shadow: 0px 8px 12px 0px rgba(39,166,176,.2);}
.onbox2 .imgs .pic1{text-align: center;}
.onbox2 .imgs .pic2,.onbox2 .imgs .pic3,.onbox2 .imgs .pic4{text-align: center;margin-bottom: 20px;display: none;}
.onbox2 .timg{margin-bottom: 34px;}
.onbox2 .timg .tt{
    background-image: url(../images/line1.png);
    background-repeat: no-repeat;
    background-position: center center;
    color: #0072e8;
    font-size: 20px;
    text-align: center;
    width: 50%;
    margin: auto;
}
.onbox2 .timg .tt span{
    display: inline-block;
    width: 250px;
    background-color: #f9fafb;
    text-align: center;
}
.onbox3 .left{width: 314px;}
.onbox3 .left li+li{margin-top: 60px;}
.onbox3 .left li .icon{
    float: left;
    width: 58px;
    height: 58px;
    text-align: center;
    line-height: 58px;
    background-color: #d3e7f0;
}
.onbox3 .left li .tt{
    overflow: hidden;
    padding-left: 40px;
    color: #333333;
    font-size: 20px;
    line-height: 58px;
}
.onbox3 .pic{overflow: hidden;}
.onbox4 .list{margin:0 -7px;}
.onbox4 .list li{float: left;width: 16.66%;padding: 0 7px;}
.onbox4 .list li .ww{padding: 40px 30px 30px;}
.onbox4 .list li .icon{height: 130px;line-height: 130px;text-align: center;margin-bottom: 60px;}
.onbox4 .list li .t1{
    color: #fff;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 100;
}
.onbox4 .list li .t2{color: #ffffff;font-size: 20px;font-weight: 100;margin-top: 20px;height: 60px;}
.onbox5 .list{margin: 0 -5px;display: flex;display: -ms-flexbox;align-items: stretch;flex-wrap: wrap;}
.onbox5 .list li{
    float: left;
    width: 33.3%;
    padding: 0 5px;
    margin-bottom: 10px;
}
.onbox5 .list li .ww{
    display: flex;display: -ms-flexbox;align-items: center;
    background-color: #fff;
    padding: 40px 0;
    height: 100%;
}
.onbox5 .list li .pic{width: 56%;flex-shrink: 0;text-align: center;}
.onbox5 .list li .pic img{max-width: 100%;max-height: 100%;}
.onbox5 .list li .con{overflow: hidden;padding-left: 2px;padding-right: 15px;flex: 1;}
.onbox5 .list li .t1{color: #333333;font-size: 24px;margin-bottom: 15px;}
.onbox5 .list li .t2{color: #333333;font-size: 16px;line-height: 1.8;}
.onbox5 .list li:nth-child(1) .pic img{max-width:70%;}

















