*{margin: 0;padding: 0}


.box2 .banners{width: 1200px;margin:  0 auto}
.box2 .banners .swiper-wrapper .pic img{width: 100%;height: auto}


.box3 .box3-hd{text-align: center;padding: 30px 0}
.box3 .box3-hd span{font-size: 36px;font-weight: bolder;color: darkblue}
.box3 .box3-hd p{color: darkblue}
.box3 .contain{display: flex;flex-direction: row;width: 1200px;margin: 0 auto;justify-content: space-between;padding-bottom: 50px}
.box3 .contain a{text-decoration: none;color: black}
.box3 .contain .left{width: 20%;text-align: center;background-color: darkblue}
.box3 .contain .left .hd p{font-size: 24px;font-weight: bolder;color: white}

.box3 .contain .left .hd{padding: 20px 0;}
.box3 .contain .left .hd .p2{font-size: 16px;font-weight: lighter;color: white}
.box3 .contain .left .it{padding-left:10px;box-sizing:border-box;width:100%;background:url(../images/right.png) no-repeat 98% center;text-align:left;background-size:15px;}
.box3 .contain .left ul{list-style: none}
.box3 .contain .left ul li{width: 80%;background-color: white;line-height: 30px;margin: 10px auto;border-radius: 10px}
.box3 .contain .left dt{width: 80%;margin: 10px auto;line-height: 32px;background-color: #fff;border-radius: 0}
.box3 .contain .left dt a{display: flex;flex-direction: row;color: darkblue}
.box3 .contain .left dt .ip{background-image: url("../images/right.png");width: 32px;height: 32px;display:none;}
/* .box3 .contain .left dt:hover{transform: scale(1.05);transition-duration: 500ms} */
.box3 .contain .right{width: 80%;padding-left:20px;box-sizing:border-box}
.box3 .contain .right p{text-align: center}
.box3 .contain .right ul{width: 100%;display: flex;flex-direction: row;flex-wrap: wrap;justify-content:flex-start}
.box3 .contain .right ul li{width: 33.33%;list-style: none;margin-top: 10px;padding:10px;box-sizing: border-box;}
.box3 .contain .right ul li a{color: darkblue;font-size: 18px;display:block;padding:5px;border: 1px solid #ddd;}
.box3 .contain .right ul li div{width: 100%;height: 185px;margin: 0 auto;padding:10px;}
.box3 .contain .right ul li:nth-child(1){margin-top: 0}
.box3 .contain .right ul li:nth-child(2){margin-top: 0}
.box3 .contain .right ul li:nth-child(3){margin-top: 0}
.box3 .contain .right ul li p{line-height: 40px}
.box3 .contain .right ul li div img{width: 100%;height: auto;max-height:100%;}
.box3 .contain .right ul li:hover{}
.box3 .contain .right ul li:hover a{color: white;background-color: darkblue}
.box3 .contain .right ul li:hover div img{transform: scale(0.9);transition-duration: 1s}



@media (max-width: 767px) {
    .wap_head{display:block;}
    .layout{width:100%;}
    .layout_n{width:100%;}
    .header{display:none;}
    /*  */
    .lm_head_en,.lm_head_ch{font-size:20px}
    .lm_head_ch:after{width:70px;bottom:-10px;}
    .lm_head{margin:20px 0 10px;}
    .lm_head .title{font-size:22px;padding-bottom:10px;}
    /* .lm_head .title::after{width:50px;margin-left:-25px;} */
    .subtitle{font-size:12px;}
    /*  */
    .head .op{display: block}
    .head{padding: 5px}
    .head .h-log{width: 20%}
    .head .h-log img{width: 100%;height: auto}
    .head ul{padding: 0;width: 60%;display: none}
    .head ul li{font-size: 12px}
    .head .rs{padding:0;margin: 0 auto;width: 30%;}
    .head .hd-ft a{font-size: 12px}
    .head .hd-ft{margin-left: 0}
    .head .rs .input{visibility: visible;}
    #mySidenav{display: block;z-index: 1}
    .box2 .banners{z-index: 0;width: 100%}
    .box3 .box3-hd{padding: 10px 5px}
    .box3 span{font-size: 20px}
    .box3 .box3-hd p{font-size: 12px}
    .box3 .contain{width: 100%;flex-wrap: wrap;padding-bottom: 20px}
    .box3 .contain .left{width: 100%;padding:0 10px;margin:10px;}
    .box3 .contain .right{width: 100%}
    .box3 .contain .left .hd{padding-bottom: 0}
    .box3 .contain .left dl{display:flex;flex-wrap: wrap;justify-content: space-between;}
    .box3 .contain .left dt{width: 49%;display: inline-block;}
    .box3 .contain .left ul li{width: 50%}
    .box3 .contain .right ul li{width: 100%}
    .box3 .contain .right ul li:nth-child(1){margin-top: 10px}
    .box3 .contain .right ul li:nth-child(2){margin-top: 10px}
    .box3 .contain .right ul li:nth-child(3){margin-top: 10px}
    .box3 .contain .right ul li:nth-child(9){display: none}
    .box3 .contain .right ul li p{font-size: 14px;line-height: 30px}


}

@media (min-width: 767px) and (max-width: 991px) {
    .head{padding: 10px}
   .head .h-log{overflow: visible}
   .head .h-log img{width: 100%;height: auto}
   .head ul{padding: 0 5px}
   .head ul li{padding: 10px 0}
   .head .rs{right: 35px;width: 130px;}
   .head .rs .input{visibility: visible;}
   .head .hd-ft{width: 30px;}
    .box3{width: 100%;padding: 10px}
    .box3-ft .pic{margin-left: 90px}

    .box2 .banners{width: 100%}
    .box3 .contain{width: 100%}
    .box3 .contain .left dt{width: 90%}

}