.w1200 {
    width: 1200px;
    margin: 0 auto;
}

* {
    position: relative;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    text-decoration: none;
    color: inherit;
}

.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.flex-sb {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.html-top {
    background-color: #e5e5e5;
    height: 42px;
    font-size: 14px;
    color: #878787;
}

.html-top .right img {
    height: 14px;
    margin-right: 4px;
}

.html-top .right a {
    margin-left: 10px;
}

.logo img {
    height: 100%;
}

.logo .right {
    height: 128px;
}

/*  */
.menu {
    background-color: #252525;
}

.menu .item {
    height: 62px;
    line-height: 60px;
    color: #fff;
}
.menu .item a{
    color:#fff;
    font-size: 16px;
}
.menu .item a:hover {
    text-decoration: underline;
}

.menu .index {
    background: linear-gradient(to bottom, #0058d4, #003c92);
    box-sizing: content-box;
    padding-right: 50px;
    margin-right: -50px;
}

.menu .index::before {
    content: '';
    background: linear-gradient(to bottom, #0058d4, #003c92);
    width: 1000px;
    position: absolute;
    height: 60px;
    right: 100%;
}

.menu .index::after {
    content: '';
    /* 必须设置内容为空 */
    position: absolute;
    /* 绝对定位，相对于.parallelogram进行定位 */
    top: 0;
    /* 位于顶部 */
    left: 90%;
    /* 位于左侧，用于产生向左倾斜效果 */
    width: 30px;
    /* 长方形的宽度，决定倾斜的程度 */
    height: 100%;
    /* 高度与.parallelogram相同 */
    background: linear-gradient(to bottom, #0058d4, #003c92);
    transform: skewX(160deg);
    /* 反向旋转以抵消父元素的旋转效果 */
}

/*  */

.mySwiper {
    height: 600px;
}

.mySwiper img {
    min-height: 100%;
    min-width: 100%;
}

.mySwiper .swiper-slide {
    overflow: hidden;
}

/*  */
.search .left {
    font-weight: bold;
    font-size: 15px;
}

.search .left img {
    height: 24px;
}
.search .left span{
    font-weight: normal;
    margin-left: 10px;
}
.search .right {
    border-left: 1px dotted #878787;
}

.search .right input {
    height: 64px;
    border: none;
    padding-left: 20px;
    width: 300px;
}

.search .right .button {
    height: 64px;
    width: 100px;
    background-color: #025caa;
    cursor: pointer;
}

.search .right img {
    height: 30px;
}

.product-center {
    padding: 86px 0;
    background-image: url('./../image/productbg.png');
}

.product-center .title {
    font-weight: bold;
    font-size: 50px;
    text-align: center;
}

.product-center .title span {
    color: #003c92;
}

.product-center .sub-title {
    font-size: 20px;
    color: #878787;
    text-align: center;
}
.product-center  .content{
    align-items: flex-start;
    margin-top: 40px;
}
.product-center .left .name {
    width: 300px;
    height: 102px;
    line-height: 102px;
    background-color: #333333;
    text-align: center;
    color: #fff;
    font-size: 40px;
}

.product-center .left .menus {
    margin-top: 4px;
}

.product-center .left .menus .item {
    font-size: 24px;
}

.product-center .left .menus .item-title {
    display: flex;
    margin-top: 4px;
    padding-left: 20px;
    color: #fff;
    background-color: #0058d4;
    min-height: 60px;
    align-items: center;
    height: 60px;
    cursor: pointer;
    justify-content: space-between;
}
.product-center .left .menus .item-title  span{
    flex: 1;
}
.product-center .left .menus img {
    height: 30px;
    margin-right: 20px;
}
.product-center .left .menus .item  .down{
    height: 20px;
}
.product-center .left .menus .item .er-item {
    display: none;
    background-color: #e5e5e5;
    padding-left: 40px;
    color: #878787;
    margin-top: 4px;
    height: 60px;
    line-height: 60px;
    cursor: pointer;
}
.product-center .left .menus .item .er-item  span{
    color: #333;
    margin-right: 10px;
}
.product-center .left .menus .open .er-item{
    display: block !important;
}

.product-center .left .call-us{
    height: 240px;
    background-color: #0058d4;
    color: #fff;
    flex-direction: column;
     margin-top: 4px;
     font-size: 30px;
}
.product-center .left .call-us img{
    height: 90px;
}

.product-center  .right{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    flex: 1;
    padding-left: 20px;
}
.product-center  .right .item{
    width: 290px;
    background-color: #d4d4d4;
    margin-bottom: 20px;
}
.product-center  .right .item img{
    width: 100%;
    height: 214px;
}
.product-center  .right .item div{
    text-align: center;
    height: 40px;
    line-height: 40px;
}
.hengfu{
    color: #fff;
    background-color: #2e67b4;
    height: 226px;
}
.hengfu .left{
    width: 50%;
}
.hengfu .left .t{
    font-size: 30px;
    color: #2e67b4;
    text-shadow: 
    -1px -1px 0 #fff,
     1px -1px 0 #fff,
    -1px  1px 0 #fff,
     1px  1px 0 #fff;
}
.hengfu .left .note{
    margin-top: 10px;
    color: #fff;
    text-indent: 2em;
    font-size: 14px;
    line-height: 24px;
}
.hengfu .right img{
    height: 60px;
    margin-right: 10px;
}
.hengfu .right .tt{
    font-size: 14px;
}

.hengfu .right .phone{
    font-size: 34px;
}
.hengfu .right .butt{
    width: 110px;
    height: 42px;
    background-color: #333;
    border-radius: 10px;
}

/*  */
.about-us{
    padding: 100px 0;
}
.about-us  .title {
    font-weight: bold;
    font-size: 50px;
    text-align: center;
}

.about-us  .title span {
    color: #003c92;
}

.about-us  .sub-title {
    font-size: 20px;
    color: #878787;
    text-align: center;
}
.about-us .detail{
    height: 375px;
}
.about-us .content{
    margin-top: 200px;
}
.about-us .detail::before{
    width: 480px;
    height: 446px;
    content: '';
    position: absolute;
    z-index: -1;
    background-color:#f6f6f6 ;
    left: -50px;
}
.about-us .detail  img{
    height: 100%;
}
.about-us .detail .left  {
    overflow: hidden;
    height: 100%;
    width: 521px;
}
.about-us .detail .right{
    height: 100%;
    flex: 1;
}

.about-us .detail .bottom{
    height: 120px;
    background-color: #025caa;
    color: #fff;
}
.about-us .detail .right .tit{
    font-size: 30px;
}
.about-us .detail .right .sub{
    font-size: 20px;
    color: #666;
}

.about-us .detail .right .eng{
    position: absolute;
    right: 0px;
    top: -10px;
    color: #d4d4d4;
    font-size: 28px;
    font-weight: bold;
}

.about-us .detail .right .line{
    width: 60px;
    margin-top:10px;
    height: 2px;
    background-color: #003c92;
}
.about-us .detail .right .note{
    text-indent: 2em;
    font-size: 18px;
    line-height: 24px;
    margin-top: 10px;
}
.about-us .detail .right .bottom{
    justify-content: space-around;
}
.about-us .detail .right .bottom .item .num{
    font-size: 40px;
    font-weight: bold;
}
.about-us .detail .right .bottom .item  .num span{
    font-weight: normal;
    font-size: 18px;
}
.about-us .list {
    margin-top: 80px;
}
.about-us .list .item .img{
    width: 282px;
    height: 170px;
    overflow: hidden;
}
.about-us .list .item{
    border-bottom: 1px solid #f3f3f3;
    padding-bottom: 20px;
}
.about-us .list .item img{
    min-width: 100%;
    min-height: 100%;
    width: 100%;
    height: 100%;
}
.about-us .list .item .name{
    margin-top: 20px;
    font-size: 16px;
    text-align: center;
}


/*  */
.hot{
    padding: 100px 0;
    background-color: #f2f2f2;
}
.hot  .title {
    font-weight: bold;
    font-size: 50px;
    text-align: center;
}

.hot  .title span {
    color: #003c92;
}

.hot  .sub-title {
    font-size: 20px;
    color: #878787;
    text-align: center;
}

.hot .it{
    width: 47%;
    background-color: #fff;
}
.hot .content{
    margin-top: 50px;
}

.hot .it  .top img{
    min-height: 100%;
    min-width: 100%;
}
.hot .it .ti{
    background-color: #025caa;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 20px;
    padding: 10px 40px;
    padding-right: 10px;
}
.hot .it .ti .sub{
    font-size: 14px;
    color: #999;
    flex: 1;
    padding-left: 10px;
}
.hot .it .ti .add{
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #01427a;
}
.hot .it .ti .add img{
    width: 10px;
}

.hot .it .top{
    padding: 10px;
}
.hot .it  .top .img{
        width: 210px;
        height: 150px;
        overflow: hidden;
}
.hot .it  .top .img img{
    min-width: 100%;
    min-height: 100%;
    width: 100%;
    height: 100%;
}
.hot .it  .top .rig{
    flex: 1;
    padding-left: 20px;
}
.hot .it  .top .rig .tit{
    font-size: 20px;
}
.hot .it  .top .rig .sub{
    margin-top: 10px;
    font-size: 14px;
    color: #666;
    line-height: 24px;
    text-indent: 2em;
}
.hot .it .line{
    padding: 20px;
    border-bottom: 1px solid #f2f2f2;
    color: #666;
}

/*  */

.footer{
    background-color: #424242;
    padding-top: 40px;
    padding-bottom: 100px;
}
.footer .left {
    display: flex;
    justify-content: space-between;
    align-items: center;flex-wrap: wrap;
    border-top: 1px solid #525252;
    border-bottom: 1px solid #525252;
    padding: 40px 0;
    width: 30%;
    font-size: 14px;
}

.footer .left .men{
    width: 33.3%;
    text-align: center;
    color: #fff;
}
.footer .left .men img{
    height: 10px;
    margin-right: 10px;
}
.footer::before{
    content: '';
    width: 100%;
    background-color: #555555;
    position: absolute;
    left: 0;
    bottom: 50px;
    height: 2px;
}
.footer .mid .qrcode{
    margin-right: 10px;
}
.footer .mid .img{
    display: flex;
    width: 146px;
    height: 146px;
    display: flex;
    justify-content: center;
    align-items: center;

    background: linear-gradient(#fff, #fff) left top,
        linear-gradient(#fff, #fff) left top,
        linear-gradient(#fff, #fff) right top,
        linear-gradient(#fff, #fff) right top,
        linear-gradient(#fff, #fff) left bottom,
        linear-gradient(#fff, #fff) left bottom,
        linear-gradient(#fff, #fff) right bottom,
        linear-gradient(#fff, #fff) right bottom;
        background-repeat: no-repeat;
        display: flex;
        justify-content: center;
        align-items: center;
        box-sizing: border-box;
        border: 1px solid transparent;
        background-size: 2px 10px, 10px 2px,2px 10px,10px 2px;

}
.footer .mid .img img{
    width: 130px;
    height: 130px;
}
.footer .mid .name{
    text-align: center;
    color: #fff;
    margin-top: 10px;font-size: 12px;
}

.footer .right{
    color: #fff;
    padding-left: 20px;
    width: 30%;
}
.footer .right .li{
    margin-top: 4px;
    font-weight: normal;
    font-size: 12px;
}
/*导航栏下拉*/
#navigation  ul.subnavigationlist,#navigation ul.subnavigationlist li ul.subnavigationlist1{display:none; position:absolute; z-index:100;width: 200px;background: #ffffff;border-top-width:3px;border-top-style:solid;
    -webkit-box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.05), -2px 0px 5px 1px rgba(0,0,0,0.05);
    -ms-box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.05),-2px 0px 5px 1px rgba(0,0,0,0.05);
    -o-box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.05),-2px 0px 5px 1px rgba(0,0,0,0.05);
    -moz-box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.05),-2px 0px 5px 1px rgba(0,0,0,0.05);
    box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.05), -2px 0px 5px 1px rgba(0,0,0,0.05)}
#navigation  ul.subnavigationlist li { position: relative;float:left; width: 100%;border-bottom: 1px solid rgba(0,0,0,0.10);text-align: left;text-indent: 0}
#navigation  ul.subnavigationlist li a { position: relative;display: block;padding: 10px 15px;line-height: 24px;font-weight: 400;font-size: 14px;text-transform: capitalize;color: #272727;transition: all 500ms ease;-moz-transition: all 500ms ease;-webkit-transition: all 500ms ease;-ms-transition: all 500ms ease;-o-transition: all 500ms ease;}
#navigation  ul.subnavigationlist li a:hover { background:#003c92; color:#fff; }
#navigation  ul.subnavigationlist li:hover .dropdown-btn{color: #ffffff;}

#navigation ul.subnavigationlist li ul.subnavigationlist1{top:0;left: 200px}

#subnavigationlist_li .dropdown-btn {position: absolute;right: 10px;top: 6px;width: 30px;height: 30px;text-align: center;color: #272727;line-height: 28px;background-size: 20px;cursor: pointer;z-index: 5;}
#navigation ul.navigationlist li a:hover,#navigation ul.navigationlist .current {text-decoration:none; color:#fff;}
/