* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

a {
    text-decoration: none;
    color: #333;
}

a:hover {
    text-decoration: none;
}

body {
    font-family: "微软雅黑";
}

ul {
    list-style: none;
}

li {
    list-style: none;
}

.clear {
    clear: both;
    overflow: hidden;
}

.head{
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 0.9875rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    z-index: 9999;
}

.head2{
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 0.9875rem;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}


.head_right_tips{
    width: 0.75rem;
}

.head_right_tips img{
    width: 100%;
    height: auto;
}

.heads{
    width: 90%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: auto;
}
.head_bot{
    width: 85%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.logo{
    width: 3.15rem;
    height: auto;
}
.logo img{
    width: 100%;
}
.nav ul{
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.nav ul li {
    position: relative;
    height: 0.3125rem;
    text-align: center;
}
.nav ul li:last-child{
    border: none;
}
.nav ul a{
    display: block;
    height: 1rem;
    font-size: 0.25rem;
    color: #000;
    white-space: nowrap;
    padding: 0 0.5rem;
}

.nav ul li .detailnav {
    position: absolute;
    top: 0.6625rem;
    left: -50%;
    width: 200%;
    z-index: 999;
    display: none;
    background: #fff;
}

.nav ul li .detailnav li {
    height: 0.4625rem;
    line-height: 0.45rem;
    border-bottom: 1px solid #eeeeee;
    width: 100%;
    background: none;
}

.nav ul li .detailnav li:hover {
    background: none;
}

.nav ul li .detailnav li a {
    font-size: 14px;
    color: #575757;
}

.nav ul li:hover .detailnav {
    display: block;
}
  
.head_top{
    width: 13%;
    display: flex;
    align-items: center;
    font-size: 0.25rem;
    color: #000;
    justify-content: space-between;
}

.language{
    display: flex;
    align-items: center;
    cursor: pointer;
}
.language img{
    margin-right: 10px;
}
  
.head_top .search{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.head_top .search input[type=text]{
    width: 1.3125rem;
    height: 0.25rem;
    font-size: 0.15rem;
    border: 0.0125rem solid #fff;
    border-radius: 0.25rem;
    padding: 0.0625rem;
    background-color: #eeeeee;
}
  
  
.head_top .search input[type=submit]{
    position: absolute;
    top: 0.0375rem;
    right: 0.025rem;
    width: 0.1625rem;
    height: 0.175rem;
    background: url(../images/search.png)center no-repeat;
    border: none;
}

.head_top .search2 input[type=submit]{
    top: 0.125rem;
}

.banner{
    width: 100vw;
}

.banner video{
    width: 100%;
    height: 100vh;
}

.banner img{
    width: 100%;
    height: 100vh;
}
.banner .swiper-slide{
    width: 100%;
}
.bannernum {
    position: absolute;
    bottom: 10%;
    z-index: 9;
    left: 8.5%;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.bannernums {
    float: left;
    font-size: 14px;
    margin-right: 5px;
    transition: all 3s;
    width: 22px;
    height: 22px;
    line-height: 22px;
    text-align: center;
    margin-left: 10px;
    border-radius: 100%;
    color: #666;
}

.bannerLines {
    position: relative;
    width: 150px;
    height: 2px;
    background-color: #4a4b4d7a;
}

.bannerLines::after {
    position: absolute;
    bottom: 0px;
    right: -5px;
    content: '';
    width: 0;
    height: 0;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-bottom: 6px solid #4a4b4d7a;
}

@keyframes backgroundColorChange {
    0% {
        background-color: #fff;
        width: 0px;
        height: 2px;
    }
    100% {
        background-color: #fff;
        width: 150px;
        height: 2px;
    }
}


/* 应用动画到元素 */

.animated-background {
    position: absolute;
    bottom: 10px;
    left: 0;
    animation-name: backgroundColorChange;
    /* 使用动画名 */
    animation-duration: 3s;
    /* 动画时长 */
    animation-iteration-count: infinite;
    /* 动画无限次数播放 */
    z-index: 999;
}

.animated-background span {
    position: absolute;
    top: 50%;
    right: -2px;
    display: block;
    width: 1px;
    height: 1px;
    transform: translateY(-50%);
    border-radius: 100%;
    background-color: #fff;
    border: 1px solid #fff;
}

.bannernums.active {
    color: #fff;
}



.keydown {
    width: 100%;
    text-align: center;
    position: absolute;
    left: 0;
    bottom: 90px;
    z-index: 999;
}
.keydown img {
    -webkit-animation: Tmouse 0.5s cubic-bezier(0.56, 0.01, 0.46, 1) infinite alternate;
    /* animation: Tmouse 0.5s cubic-bezier(0.56, 0.01, 0.46, 1) infinite alternate; */
}

.keydown p {
    font-size: 0.225rem;
    color: #fff;
    margin-top: 0.125rem;
}
@-webkit-keyframes Tmouse {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
    }
    100% {
        -webkit-transform: translateY(-8px);
        -moz-transform: translateY(-8px);
        -ms-transform: translateY(-8px);
        -o-transform: translateY(-8px);
        transform: translateY(-5px);
    }
}

@keyframes Tmouse {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
    }
    100% {
        -webkit-transform: translateY(-8px);
        -moz-transform: translateY(-8px);
        -ms-transform: translateY(-8px);
        -o-transform: translateY(-8px);
        transform: translateY(-8px);
    }
}




.section2{
    background: url(../images/aboutbg.png) 50%;
}

.section3{
    background: url(../images/appbg.png) 50%;
}

.section4{
    background: url(../images/industrybg.png) 50%;
}

.section5{
    background: url(../images/honorbg.png) 50%;
}

.section6{
    background: url(../images/partnerbg.png) 50%;
}

.section7{
    background: url(../images/projectbg.png) 50%;
}

.section8{
    background: url(../images/new_bg.png) 50%;
}

.section9{
    background: url(../images/footbg.png) 50%;
}

.about{
    width: 100%;
}

.abouts{
    width: 90%;
    display: flex;
    justify-content: space-between;
    margin: auto;
}


.ab_title{
    width: 8.375rem;
}
.ab_title p:nth-child(1) {
    font-size: 20px;
    font-family: "Microsoft YaHei";
    color: rgb(0, 0, 0);
    font-weight: bold;
    line-height: 2.3;
    text-align: left;
}
  

.ab_title p:nth-child(2) {
    font-size: 16px;
    font-family: "Microsoft YaHei";
    color: rgb(0, 0, 0);
    line-height: 2.1;
    text-align: left;
}
  

.ab_title span:nth-child(3){
    font-size: 16px;
    font-family: "Microsoft YaHei";
    color: rgb(0, 0, 0);
    line-height: 2.3;
}

.ab_title a:nth-child(4){
    display: flex;
    align-items: center;
    margin-top: 20px;
}

.ab_title a:nth-child(4) div{
    font-size: 14px;
    color: #000;
    border: 1px solid #666;
    padding: 0.125rem 0.25rem;
}

.ab_title a:nth-child(4) img{
    width: 0.7625rem;
    height: 0.7625rem;
}

.ab_cons{
    width: 9.1875rem;
}

.ab_cons img{
    width: 100%;
}


.shuju {
    width: 15%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

.shj{
    border-radius: 15px;
    background-color: rgb(255, 255, 255);
    opacity: 0.8;
    box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.14);
    width: 90%;
    height: 2rem;
}

.sj {
    width: 100%;
    text-align: center;
}

.sj_top {
    font-size: 0.225rem;
    color: #009cc9;
}

.sj_top b {
    font-size: 0.4rem;
    font-weight: bold;
    color: #009cc9;
}

.sj_bot {
    font-size: 0.225rem;
    color: #000;
}

.ab_btm {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    background-color: rgb(255, 255, 255);
    opacity: 0.8;
    box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.14);
    width: 90%;
    height: 2rem;
    margin: 0.375rem auto 0;
}

.ab_btm div{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.ab_btm div:hover {
    transform: translateY(-5px)
}

.ab_btm div img{
    width: 0.475rem;
    height: auto;
}

.ab_btm div p {
    font-size: 0.25rem;
    font-family: "Microsoft YaHei";
    color: rgb(0, 0, 0);
    line-height: 3.45;
    text-align: center;
}
  
.ab_cont{
    width: 1.425rem;
    height: auto;
}


.application {
    width: 100%;
    overflow: hidden;
    margin-top: 0.3125rem;
}

.applications {
    width: 90%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0.3125rem auto 0;
}

.app {
    width: 24.5%;
    position: relative;
}

.apppic img {
    width: 100%;
}

.app:hover .appbefores{
    animation: shake 0.5s;
    animation-iteration-count: 1;
}

.appbefore {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: table;
    text-align: center;
    opacity: 1;
    transition: all 0.6s;
}

.appbefores {
    display: table-cell;
    vertical-align: middle;
}

.apptitle {
    font-size: 0.2125rem;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.apptitle a {
    font-size: 0.225rem;
    color: #fff;
    line-height: 2.722;
    text-align: center;
}
  

.appmore {
    margin-top: 0.1rem;
}

.app:hover .appbefore {
    opacity: 1;
}

.title {
    font-size: 0.375rem;
    font-family: "Microsoft YaHei";
    color: rgb(0, 0, 0);
    font-weight: bold;
    line-height: 2.3;
    text-align: center;
}

.titles {
    font-size: 0.2rem;
    font-family: "Microsoft YaHei";
    color: rgb(153, 153, 153);
    text-align: center;
}
  

.industry{
    width: 90%;
    height: 1.125rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.451);
    border-top: 0.0125rem solid #c9c9c9;
    border-bottom: 0.0125rem solid #c9c9c9;
    margin: 60px auto 0;
}
  
.industry div{
    width: 20%;
    height: 1.125rem;
    line-height: 1rem;
    font-size: 0.225rem;
    color: #fff;
    border-left: 0.0125rem solid #c9c9c9;
    border-right: 0.0125rem solid #c9c9c9;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    cursor: pointer;
}
.industry div img{
    margin-right: 0.125rem;
}
.industry .active {
    background-color: #148cc0;
    box-shadow: 0px 3px 12.35px 0.65px rgba(0, 0, 0, 0.14);
    color: #fff;
}
.industrys{
    width: 100%;
    position: relative;
    margin-top: 30px;
}
.caseswiper{
    width: 90%;
    margin: 0 auto 0;
}
.case_bot{
    width: 100%;
    height: 7.85rem;
    position: relative;
}
.case_bot div {
    width: 35%;
    margin-left: 5%;
    margin-top: 10px;
}
.case_bot div p:nth-child(1) {
    font-size: 0.35rem;
    color: #fff;
    font-weight: bold;
    line-height: 4.786;
    text-align: left;
}
  
  
.case_bot div p:nth-child(2) {
    font-size: 0.2375rem;
    color: #fff;
    line-height: 2.474;
    text-align: left;
}
.case_bot img{
    position: absolute;
    top: 0;
    right: 0;
    width: 14.325rem;
    height: auto;
}

.industry_btm{
    position: absolute;
    left: 10%;
    bottom: 40%;
    z-index: 999;
}
.industry_btm img{
    width: 0.7625rem;
    height: auto;
    margin-right: 0.25rem;
}



.honor{
    width: 100%;
    padding-top: 0.375rem;
    padding-bottom: 0.625rem;
}


#certify {
    position: relative;
    width: 90%;
    margin: 0.375rem auto 0;
}

#certify .swiper-container {
    width: 100%;
    margin: auto;
}

#certify .swiper-slide {
    width: 4.375rem;
    text-align: center;
}

#certify .swiper-slide img {
    display: block;
    margin: auto;
    width: 100%;
}

#certify .swiper-slide p {
    font-size: 0.25rem;
    color: #000;
    margin-top: 0.125rem;
    display: none;
}

#certify .swiper-slide.swiper-slide-active p {
    display: block;
}


.partner{
    width: 100%;
}

.partners{
    width: 90%;
    display: flex;
    justify-content: space-between;
    margin: auto;
}

.par_left .title,
.par_left .titles{
    text-align: left;
    color: #000;
}

.par_cont {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 6.7rem;
    height: 6.25rem;
    font-size: 0.25rem;
    color: rgb(0, 0, 0);
    line-height: 2.75;
}

.par_cont span{
    color: #009cc9;
    font-size: 0.45rem;
}
  
.par_btm {
    width: 2.4125rem;
    height: 0.65rem;
    font-size: 0.2rem;
    text-align: center;
    color: rgb(255, 255, 255);
    line-height: 0.65rem;
    border-radius: 26px;
    background-color: rgb(0, 156, 201);
}

.par_btm a {
    font-size: 0.2rem;
    text-align: center;
    color: rgb(255, 255, 255);
}

.par_right {
    width: 10rem;
    margin-right: 2.5rem;
}

.paritem {
    display: flex;
    justify-content: center;
    font-size: 0;
    text-align: center;
    margin-top: -1.125rem;
}

.paritem:first-child {
    margin-top: 0;
}

.paritem a {
    margin: 0 0.25rem;
}

.parcontainer {
    width: 100%;
    text-align: center;
}

.parcontainer img {
    width: 2.9875rem;
    height: auto;
}
  

.project{
    width: 100%;
}

.projects{
    position: relative;
    width: 100%;
    margin-top: 0.375rem;
}

.project-wrapper img{
    width: 100%;
}

.project-wrapper p{
    font-size: 0.225rem;
    font-family: "Microsoft YaHei";
    color: rgb(0, 0, 0);
    line-height: 3.833;
    text-align: center;
}

.project_btm{
    position: absolute;
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 99;
}

.project_btm_left,
.project_btm_right{
    width: 0.525rem;
    height: auto;
}







.new{
    width: 100%;
}

.news{
    width: 90%;
    display: flex;
    flex-direction: column;
    margin: 0 auto 0;
}

.new_top{
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}
.newstitle_left{
    display: flex;
    align-items: flex-end;
}
.engineering{
    display: flex;
    flex-direction: column;

}

.new_top_right,
.new_top_left{
    width: 0.8rem;
    height: auto;
}

.new_left{
    display: flex;
    align-items: center;
    margin-left: 0.25rem;
}

.new_left div {
    width: 2.1125rem;
    height: 0.5375rem;
    line-height: 0.5375rem;
    font-size: 0.2rem;
    color: #000;
    text-align: center;
    background-color: rgb(255, 255, 255);
    border-radius: 0.25rem;
    cursor: pointer;
    margin: 0 0.125rem;
}
.new_left .active{
    color: #fff;
    background-color: #148cc0;
}

.new_right{
    width: 100%;
    overflow: hidden;
    margin-top: 1rem;
}
.new_bot{
    display: flex;
}

.new_bot img{
    width: 7.0875rem;
    height: auto;
}
.new_det{
    width: 7.075rem;
    height: 3.925rem;
    background: url(../images/new_bot.png) center no-repeat;
    background-size: cover;
    padding: 0.6875rem 0.1875rem 0.25rem 0.375rem;
}

.det_tips {
    font-size: 0.175rem;
    text-align: center;
    color: rgb(0, 70, 145);
    border-radius: 0.0375rem;
    background-color: rgb(230, 237, 246);
    width: 0.6125rem;
    height: 0.375rem;
    line-height: 0.375rem;
}

.det_title {
    font-size: 0.2rem;
    color: rgb(29, 28, 28);
    line-height: 4.125;
}

.det_cont {
    display: -webkit-box;
    font-size: 0.175rem;
    color: rgb(61, 61, 61);
    line-height: 2.114;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

  

.det_btm{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.15rem;
    color: rgb(154, 154, 154);
    line-height: 5;
}

.new_bot_right img:nth-child(1){
    width: 5.625rem;
    height: auto;
}

.new_btn_tips {
    width: 90%;
    font-size: 30px;
    font-family: "Microsoft YaHei";
    color: rgb(0, 0, 0);
    line-height: 1.349;
    text-align: left;
    margin: 0.625rem auto 0;
}
.new_btn_tips span{
    color: #22a9e8;
}



.footb{
    width: 100%;
    background: url(../images/footbg.png) center no-repeat;
}

.footb .foot{
    height: 6.25rem;
}

.foot{
    width: 100%;
    height: 100vh;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.footl{
    width: 100%;
    height: 400px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.foots{
    width: 90%;
    display: flex;
    justify-content: space-between;
    margin: auto;
}

.fonc p:nth-child(1) {
    font-size: 0.25rem;
    color: rgb(0, 0, 0);
    line-height: 1.75;
}
  
.fonc p {
    font-size: 0.175rem;
    color: rgb(0, 0, 0);
    line-height: 2.571;
}

.fcodes{
    display: flex;
    flex-direction: column;
}

.fcodes p {
    font-size: 14px;
    color: rgb(0, 0, 0);
    line-height: 2;
    text-align: center;
}
  
.fcodes img{
    width: 2.05rem;
    height: auto;
}
.fcodes div:nth-child(1){
    margin-right: 0.5rem;
}
.fcode_p p:nth-child(1){
    width: 100%;
    text-align: left;
    font-size: 0.25rem;
    color: rgb(0, 0, 0);
    line-height: 2;
}
.fcode_p p:nth-child(2){
    width: 100%;
    text-align: left;
    font-size: 0.325rem;
    color: rgb(0, 0, 0);
    line-height: 2;
}

  
.copy {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    line-height: 0.9375rem;
    text-align: center;
    font-size: 0.225rem;
    color: #000;
    border-top: 0.0125rem solid #828282;
    z-index: 999;
}

.copy a {
    font-size: 0.225rem;
    color: #000;
    margin: 0 0.125rem;
}




.inabout{
    width: 100%;
    background: url(../images/aboutbg.png) center no-repeat;
    background-size: cover;
    padding: 0.25rem 0 0.375rem 0;
}

.inabout .abouts{
    flex-direction: column;
    margin-top: 0.375rem;
}
.inabout .ab_top{
    font-size: 16px;
    line-height: 2;
    margin-top: 10px;
}
.inabout .ab_title{
    width: 45%;
}

.inabox{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border-top: 1px solid #888;
    margin-top: 60px;
    padding-top: 60px;
}

.inabout .abouts p:nth-child(1) {
    font-size: 0.375rem;
    color: rgb(0, 0, 0);
    font-weight: bold;
    line-height: 2.3;
    text-align: center;
}
  

.inabout .abouts p:nth-child(2) {
    font-size: 0.2rem;
    color: rgb(153, 153, 153);
    line-height: 2.1;
    text-align: center;
}

.tlf{
    font-size: 0.45rem;
    color: #3c3c3c;
}

.ab_title .line{
    width: 12%;
    height: 4px;
    background: #009cc9;
    margin: 20px 0 0 0;
}

.tbtm{
    margin: 30px 0 0 0;
    font-size: 16px;
    line-height: 3.4;
    color: #666;
}

.inabox span{
    font-size: 15px;
    color: rgb(0, 0, 0);
    line-height: 2.3;
}

.ab_btm div a{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.inabox .ab_cons {
    width: 48%;
}

/* .ab_btm div a.active img{
    filter: invert(100%) hue-rotate(270deg);
} */

.ab_btm div a.active p{
    color: #009cc8;
}

.inabout .shuju{
    width: 100%;
    flex-direction: row;
    margin-top: 0.625rem;
}

.licase {
    max-width: 100%;
    overflow: hidden;
    background-color: #f7f7f7;
    margin: auto;
}

.left_case {
    width: 90%;
    margin: 0.25rem auto 0;
}

.rcase_tit,
.rcase_tit a {
    font-size: 0.225rem;
    color: #fff;
    font-weight: bold;
}

.rcase_con {
    font-size: 0.175rem;
    font-family: "Microsoft YaHei";
    color: rgb(255, 255, 255);
    text-transform: uppercase;
    line-height: 2.071;
    text-align: left;
}
  

.lcase {
    float: left;
    width: 40%;
    position: relative;
    transition: all 0.8s;
}

.lcase.active {
    width: 60%;
}

.lcase:last-child {
    margin-right: 0;
}

.lcase img {
    width: 100%;
    height: 7.5rem;
}

.rcase {
    display: none;
    position: absolute;
    left: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0.702;
    width: 100%;
    padding: 15px;
}

.culture{
    width: 100%;
    margin-top: 0.375rem;
}

.cultures{
    width: 80%;
    display: flex;
    justify-content: space-between;
    margin: 20px auto;
}

.culs{
    position: relative;
    width: 4.5rem;
    height: 6.6125rem;
}

.culs .bgm{
    width: 100%;
    height: auto;
}


.culs div{
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}


.culs p {
    font-size: 0.25rem;
    color: rgb(255, 255, 255);
    line-height: 2.1;
    text-align: center;
}

.culs:hover div{
    animation: shake 0.5s;
    animation-iteration-count: 1;
}

@keyframes shake {
    0%, 100% { transform: translateY(0); }
    25% { transform: translateY(-5px); }
    50% { transform: translateY(5px); }
    75% { transform: translateY(-5px); }
}

.architecture{
    width: 100%;
    background-color: #f7f7f7;
    padding: 0.25rem 0;
}


.architectures{
    width: 90%;
    margin: 0.25rem auto 0;
}

.architectures img{
    width: 100%;
    height: auto;
}

.develop {
    width: 100%;
    overflow: hidden;
    background: url(../images/develop.png) center no-repeat;
    padding: 0.375rem 0 0.625rem;
}

.develop .title div:nth-child(2){
    background-color: #fff;
}
.develops {
    width: 85%;
    margin: 0.375rem auto 0;
}
.deve_top {
    width: 100%;
    padding: 0 1rem;
}

.deve_btm {
    width: 100%;
    overflow: hidden;
    padding: 0 1rem;
    position: relative;
    background: url(../images/appline.png) center top 0.225rem no-repeat;
    background-size: 18.125rem 1px;
    margin-top: 0.375rem;
}

.appname {
    width: 1.4125rem;
    height: 0.4625rem;
    line-height: 0.4625rem;
    border-radius: 17px;
    background-color: #009cc8;
    text-align: center;
    font-size: 0.25rem;
    color: #fff;
}

.swiper-slide-active .appcircle {
    border: 0.0375rem solid #fff;
}

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

.deve_btm .swiper-button-prev {
    left: 0.5rem;
    top: -0.0375rem;
    margin-top: 0;
    width: 0.5rem;
    height: 0.5rem;
    background: url(../images/left_app.png) center no-repeat;
    background-size: 0.4rem 0.4rem;
}

.deve_btm .swiper-button-next {
    right: 0.5rem;
    top: -0.0375rem;
    margin-top: 0;
    width: 0.5rem;
    height: 0.5rem;
    background: url(../images/right_app.png) center no-repeat;
    background-size: 0.4rem 0.4rem;
}

.deveTopswiper a{
    position: relative;
    display: block;
    width: 100%;
    height: 2.5rem;
    line-height: 2.5rem;
    border-radius: 7px;
    background-color: rgb(255, 255, 255);
    padding: 0.25rem 0 0.125rem 0.125rem;
}
  
.dev_p1{
    font-size: 16px;
    color: rgb(0, 0, 0);
    line-height: 2.5;
}
  
.dev_p2 {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 0.675rem;
    font-size: 0.3rem;
    color: rgb(20, 140, 192);
    font-weight: bold;
    line-height: 0.675rem;
    text-align: center;
    background-color: #f0f0f0;
}

.fourflex{
    width: 100%;
    padding-top: 0.375rem;
}

.fourflexs{
    width: 90%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 0.25rem auto 0;
}

.fourflexs a{
    overflow: hidden;
    width: 24%;
    margin-right: calc(4% / 3);
    background-color: #fff;
    margin-bottom: 20px;
}

.fourflexs a img{
    width: 100%;
}

.fourflexs a:nth-child(4n){
    margin-right: 0;
}

.fourflexs a p {
    width: 100%;
    height: 0.675rem;
    font-size: 0.225rem;
    color: #000;
    text-align: center;
    line-height: 0.675rem;
    background-color: rgb(255, 255, 255);
}

.fourflexs a:hover img{
    transform: scale(1.1);
}

#dis_video{
    width: 80%;
    margin: 0 auto 30px;
}


.bgf7{
    width: 100%;
    background-color: #f7f7f7;
}

.bgf8{
    width: 100%;
    background-color: #f7f7f7;
}

.hnnor{
    width: 100%;
    background-color: #f7f7f7;
    padding-top: 0.375rem;
}

.hnnors{
    width: 75%;
    margin: 0.25rem auto 0;
}

.hnnors a{
    display: block;
    margin: 0 10px 20px;
}

.hnnors img{
    width: 100%;
}

.hnnors p{
    width: 100%;
    font-size: 14px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 2.3;
}

.honorbox{
    width: 100%;
    display: flex;
}

.honorbox a{
    width: 50%;
}

.hnnorSwiper .swiper-pagination-bullet {
    width: 0.1875rem;
    height: 0.1875rem;
    background: #00559d;
    border-radius: 50%;
    opacity: 1;
}

.hnnorSwiper.swiper-container-horizontal>.swiper-pagination-bullets {
    bottom: 0;
}

.hnnorSwiper.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 0.075rem;
}



.swiper-top{
    width: 100%;
}

.swiper-top img{
    width: 100%;
    height: auto;
}


.product {
    width: 100%;
    background-color: #f7f7f7;
    padding: 0.25rem 0 0.375rem;
}
.products {
    width: 90%;
    margin: 0 auto 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.classify{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.375rem;
}
.classify div{
    width: 3.5rem;
    height: 0.85rem;
    position: relative;
    font-size: 0.225rem;
    font-family: "Microsoft YaHei";
    color: #000;
    line-height: 0.85rem;
    text-align: center;
    background-color: #fff;
    border: 1px solid #e8e8e8;
    white-space: nowrap;
    cursor: pointer;
}

  
.classify div span {
    display: none;
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -10px;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #245cb0;
}
.classify .active{
    color: #fff;
    background-color: #00559d;
}
.classify .active a{
    color: #fff;
}
.classifys {
    display: none;
    margin: 0.25rem 0 0.25rem;
}
.classifys a {
    height: 0.1875rem;
    font-size: 0.2rem;
    font-family: "Microsoft YaHei";
    color: #676767;
    font-weight: bold;
    border-right: 1px solid #676767;
    padding: 0 0.5rem;
    cursor: pointer;
}

  
.classifys a:last-child{
    border: none;
}
.classifys .active{
    color: #245cb0;
}
  


.fourflexs a div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 0.675rem;
    font-size: 0.225rem;
    color: #000;
    text-align: center;
    background-color: rgb(255, 255, 255);
    border-top: 1px solid #f8f8f8;
    padding: 0 10px;
}

.fourflexs a div span{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.fourflexs a div img{
    width: 0.35rem;
    height: auto;
}

.proshow{
    width: 17.5rem;
    display: flex;
    flex-direction: column;
    background-color: #fff;
    margin: 0.125rem auto 0;
    padding: 0.0625rem;
}
  

.proshows{
    display: flex; 
}

.proshows img{
    width: 50%;
    height: auto;
}

.pro_right p:nth-child(1) {
    font-size: 0.3rem;
    font-family: "Microsoft YaHei";
    color: rgb(51, 51, 51);
    font-weight: bold;
    line-height: 4;
}
  
.pro_right p:nth-child(2) {
    font-size: 0.25rem;
    font-family: "Microsoft YaHei";
    color: rgb(102, 102, 102);
    line-height: 2;
}
  
.zixun {
    display: block;
    width: 2.975rem;
    height: 0.725rem;
    font-size: 0.25rem;
    font-family: "Microsoft YaHei";
    color: rgb(255, 255, 255);
    text-align: center;
    line-height: 0.725rem;
    border-radius: 8px;
    background-color: rgb(0, 85, 157);
    cursor: pointer;
    margin-top: 0.375rem;
}

.pro_btn{
    display: flex;
    align-items: center;
}

.pro_btn a{
    width: 3.2625rem;
    height: 2.4375rem;
    margin-right: 0.375rem;
}
.pro_btn a:first-child{
    margin-left: 0.25rem;
}
  
.pro_btn a img{
    width: 100%;
}

.pro_tips{
    width: 17.5rem;
    height: 0.9rem;
    background-color: #fff;
    margin: auto;
}
.pro_tips div {
    width: 2.875rem;
    height: 0.9rem;
    line-height: 0.9rem;
    font-size: 0.25rem;
    text-align: center;
    font-family: "Microsoft YaHei";
    color: rgb(255, 255, 255);
    background-color: rgb(0, 85, 157);
    margin: 0.125rem 0;
}

.proshow_detail{
    width: 17.5rem;
    margin: 0.125rem auto 0;
}

.proshow_detail p{
    font-size: 0.225rem;
    line-height: 2.3;
}
  



.threeflex{
    width: 100%;
    padding: 20px 0 50px 0;
}

.threeflexs{
    width: 90%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 0.25rem auto 0;
}

.threeflexs a{
    width: 16%;
    margin-right: calc(4% / 5);
    margin-bottom: 0.125rem;
}

.threeflexs a img{
    width: 100%;
}

.threeflexs a:nth-child(6n){
    margin-right: 0;
}

.threeflexs a p {
    width: 100%;
    height: 0.675rem;
    font-size: 0.225rem;
    color: #000;
    line-height: 0.675rem;
    background-color: rgb(255, 255, 255);
    padding-left: 0.25rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


.title_img{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.title_img div {
    border-radius: 2px;
    background-color: rgb(7, 41, 104);
    width: 46px;
    height: 5px;
    margin-bottom: 10px;
}
  


/* 联系我 */
.gywm{
    width: 100%;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 0.375rem;
    background-color: #f7f7f7;
}
.gmap{
    width: 80%;
} 
.mapdiv {
    width: 20rem;
    height: 6.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.225rem;
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 3px 4.98px 1.02px rgba(0, 0, 0, 0.1);
    padding: 0 0.25rem;
}
  
.mapdiv .detail{
    width: 20%;
    height: 100%;
    background-color: #fff;
    color: #000;
    padding: 0.375rem 0.25rem;
}
.mapdiv .detail p {
    font-size: 0.2rem;
    font-family: "Microsoft YaHei";
    color: #000;
    padding: 0.125rem 0.1875rem;
}

.mapdiv .detail p:nth-child(1) {
    font-size: 0.45rem;
    font-family: "Microsoft YaHei";
    color: rgb(0, 0, 0);
    line-height: 1.472;
}
  
  
.map1{
    height: 6rem;
}

/* 在线留言 */

.listcontacts {
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #f6f6f6;
    padding: 0.375rem 0;
}

.listcontacts>div {
    width: 20rem;
    overflow: hidden;
    margin-top: 0.375rem;
}



.listcontactsTitle {
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.listcontactsTitle input {
    height: 0.8375rem;
    display: block;
    float: left;
    padding-left: 0.25rem;
    box-sizing: border-box;
    width: 48%;
    font-size: 0.325rem;
    margin-bottom: 0.125rem;
    border: 0.0125rem solid #ccc;
    outline: none;
}
  
.listcontactsTitle input:nth-child(1) {
    background: url(../image/122.png)left 0 no-repeat #fff;
    background-position: 0.1375rem;
}

.listcontactsTitle input:nth-child(2) {
    background: url(../image/123.png)left 0 no-repeat #fff;
    background-position: 0.2125rem;
}

.listcontactsTitle input:nth-child(3) {
    background: url(../image/124.png)left 0 no-repeat #fff;
    background-position: 0.1rem;
}

.listcontactsTitle input:nth-child(4) {
    background: url(../image/125.png)left 0 no-repeat #fff;
    background-position: 0.15rem;
}


.listcontactsTextarea {
    width: 100%;
    border: 0.0125rem solid #ccc;
    background: url(../image/126.png)left 0 no-repeat #fff;
    background-position: 0.15rem 0.2rem;
    padding-left: 0.25rem;
    font-size: 0.325rem;
    padding-top: 0.225rem;
    height: 4.875rem;
    outline: none;
}
  

.listcontactsubmit {
    text-align: center;
    margin-top: 0.125rem;
}

.listcontactsubmit input {
    background: #e62129;
    color: #fff;
    border: 0.0125rem solid #e62129;
    width: 30%;
    height: 0.8375rem;
    font-size: 0.325rem;
}



.recruit{
    width: 100%;
}
.recruits{
    width: 17.5rem;
    margin: auto;
    padding-bottom: 20px;
}

.recruit_tip{
    width: 100%;
    background-color: #eaeaea;
    padding: 0.375rem 0;
}
.recruit_tips{
    width: 17.5rem;
    margin: auto;
}
.recruit_tips p:nth-child(2) {
    font-size: 0.225rem;
    font-family: "Microsoft YaHei";
    color: rgb(0, 0, 0);
    line-height: 2.056;
  }
  .recruit_tips p:nth-child(1) {
    font-size: 0.45rem;
    font-family: "Microsoft YaHei";
    color: rgb(1, 103, 189);
    font-weight: bold;
    line-height: 1.833;
  }
  .recruits p {
    font-size: 0.45rem;
    font-family: "Microsoft YaHei";
    color: rgb(0, 0, 0);
    font-weight: bold;
    line-height: 1.833;
}
.recruit_list{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.recruit_box{
    width: 100%;
    height: 1.0125rem;
    display: flex;
    align-items: center;
    background-color: #b3b3b3;
    padding: 0 0.375rem;
}
.recruit_box div:nth-child(1){
    width: 30%;
    text-align: left;
}
.recruit_box div:nth-child(2){
    width: 20%;
    text-align: left;
}
.recruit_box div:nth-child(3){
    width: 30%;
    text-align: center;
}
.recruit_box div:nth-child(4){
    width: 20%;
    text-align: right;
}
.recruit_box div{
    font-size: 0.225rem;
    font-family: "Microsoft YaHei";
    color: rgb(255, 255, 255);
    line-height: 2.538;
}
.recruit_box2{
    width: 100%;
    height: 1.0125rem;
    display: flex;
    align-items: center;
    background-color: #fff;
    border: 0.025rem solid #e5e4e2;
    padding: 0 0.375rem;
    margin-top: 0.25rem;
}
  
.recruit_box2 div{
    text-align: center;
    font-size: 0.225rem;
    font-family: "Microsoft YaHei";
    color: #000;
    line-height: 2.538;
}

.recruit_box2 div:nth-child(1){
    width: 31%;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.recruit_box2 div:nth-child(2){
    width: 33%;
    text-align: left;
}
.recruit_box2 div:nth-child(3){
    width: 15%;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.recruit_box2 div:nth-child(4){
    width: 18%;
    text-align: right;
}
.recruit_item {
    width: 100%;
}
.recruit_item ul{
    display: none;
}

.recruit_item .cont{
    line-height: 2;
    background-color: #fff;
    padding-left: 20px;
}

.reimg{
    width: 0.5rem;
    height: auto;
}

.network{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.netbox {
    width: 8.5875rem;
    height: 3.6125rem;
    display: flex;
    flex-direction: column;
    border: 0.025rem solid #e5e4e2;
    background-color: rgb(255, 255, 255);
    padding: 0.375rem 0.375rem 0.375rem 0.25rem;
}

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

.net_title img{
    width: 1.9875rem;
    height: auto;
}

.net_title span:nth-child(1) {
    font-size: 0.75rem;
    font-family: "Microsoft YaHei";
    color: rgba(0, 0, 0, 0.102);
    font-weight: bold;
}

.net_title span:nth-child(2) {
    font-size: 0.45rem;
    font-family: "Microsoft YaHei";
    color: rgb(0, 0, 0);
}

.net_cont {
    font-size: 0.35rem;
    font-family: "Microsoft YaHei";
    color: rgb(0, 0, 0);
    line-height: 2.357;
}
  
.newClas{
    width: 100%;
    background-color: #f7f7f7;
}

.newClass{
    width: 90%;
    display: flex;
    margin: auto;
}

.newClass a{
    display: block;
    font-size: 0.225rem;
    color: #000;
    padding: 0.25rem;
}

.newClass a.active{
    color: #009cc9;
}

.information{
    width: 100%;
    background-color: #f7f7f7;
}

.informations{
    width: 90%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 0.25rem auto 0;
}

.informations a{
    width: 32.5%;
    background-color: rgba(255, 255, 255, 0.96);
    padding-top: .125rem;
    overflow: hidden;
    clip-path: polygon(0% 4%, 83% 3%, 175% 106%, -3% 100%);
    margin-right: calc(2.5% / 2);
    margin-bottom: 0.125rem;
}

.informations a img{
    width: 100%;
}

.informations a:nth-child(3n){
    margin-right: 0;
}

.informations a div {
    width: 100%;
    height: 2.2125rem;
    font-size: 0.225rem;
    color: #000;
    text-align: left;
    background-color: rgb(255, 255, 255);
    padding: 0 0.1875rem;
}

.informations a div p:nth-child(1) {
    font-size: 0.225rem;
    font-family: "Microsoft YaHei";
    color: rgb(0, 0, 0);
    line-height: 2.944;
}
.informations a div p {
    font-size: 0.1875rem;
    font-family: "Microsoft YaHei";
    color: rgb(102, 102, 102);
    line-height: 2.267;
}

  
.news_info {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.news_info .info{
    width: 80%;
    font-size: 0.2rem;
    font-family: "Microsoft YaHei";
    color: rgb(102, 102, 102);
    line-height: 2.563;
    text-align: left;
    border-radius: 0.25rem;
    background-color: #fff;
    padding: 0 0.25rem;
    margin: 0.25rem 0;
}

.news_info .info .title2{
    text-align: center;
}

/*  */
#SUBMENU {
    background: #f6f8f9;
    border-bottom: 1px solid #e6e9ee
}

#SUBMENU .list {
    display: flex;
    flex-wrap: wrap;
    gap: 0 4vw
}

#SUBMENU .list li {
    height: 100%
}

#SUBMENU .list li a {
    padding: 0.4rem 0;
    color: #333;
    font-size: 20px;
    display: flex;
    border-bottom: 4px solid rgba(0,0,0,0);
    transition-property: all;
    transition-duration: 0.6s;
    transition-timing-function: "ease";
    transition-delay: "0s"
}

#SUBMENU .list li a:hover {
    border-bottom-color: #009cc8;
}

#SUBMENU .list li a.active {
    border-bottom-color: #009cc8;
    font-weight: 800
}


.D0 {
    background: #fff;
    margin: 1rem 0 0.6rem 0
}

.DEFS{
    width: 80%;
    margin: auto;
}

.D0>.box .t {
    display: flex;
    justify-content: space-between;
    padding: 0 0 0.4rem 0;
    align-items: flex-end
}

.D0>.box .t .hhh .zh {
    font-size: 0.6rem
}

.D0>.box .t .hhh .en {
    font-size: 0.25rem;
    color: #888;
    letter-spacing: 1px;
    margin: 0.0625rem 0 0 0;
    line-height: 1;
    text-transform: uppercase
}

.D0>.box .t .search form input.kw {
    padding: 10px 12px;
    border: 1px solid #ddd;
    margin: 0;
    line-height: 2;
    font-size: 0.2rem;
    width: 20vw;
    max-width: 3.75rem;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='%23000000'%3E%3Cpath d='M 20.5 6 C 12.515556 6 6 12.515562 6 20.5 C 6 28.484438 12.515556 35 20.5 35 C 23.773158 35 26.788919 33.893018 29.220703 32.050781 L 38.585938 41.414062 A 2.0002 2.0002 0 1 0 41.414062 38.585938 L 32.050781 29.220703 C 33.893017 26.788918 35 23.773156 35 20.5 C 35 12.515562 28.484444 6 20.5 6 z M 20.5 10 C 26.322685 10 31 14.677319 31 20.5 C 31 23.295711 29.914065 25.820601 28.148438 27.697266 A 2.0002 2.0002 0 0 0 27.701172 28.144531 C 25.824103 29.912403 23.29771 31 20.5 31 C 14.677315 31 10 26.322681 10 20.5 C 10 14.677319 14.677315 10 20.5 10 z' fill='%23666666'/%3E%3C/svg%3E") no-repeat 95% center;
    background-size: auto 60%
}

.D0>.box .newslist {
    margin: 0.875rem 0 0 0
}

.D0>.box .newslist .li_st {
    margin: 0 0 1rem 0;
    display: flex;
    justify-content: space-between
}

.D0>.box .newslist .li_st:hover .r .more span {
    background: #009cc8;
    border-color: #009cc8;
    color: #fff
}

.D0>.box .newslist .li_st .l {
    width: 46%;
    height: auto
}

.D0>.box .newslist .li_st .l img {
    width: 100%;
    aspect-ratio: 10/6;
    border-radius: 5px;
    -o-object-fit: cover;
    object-fit: cover
}

.D0>.box .newslist .li_st .r {
    width: 50%;
    display: flex;
    flex-direction: column
}

.D0>.box .newslist .li_st .r .title {
    font-size: 20px;
    line-height: 1.6;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-weight: 600;
    text-align: left;
}

.D0>.box .newslist .li_st .r time {
    font-size: 14px;
    color: #777;
    line-height: 2
}

.D0>.box .newslist .li_st .r .ms {
    margin: 0.275rem 0 0 0;
    color: #777;
    line-height: 1.5;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    font-size: 16px
}

.D0>.box .newslist .li_st .r .more {
    margin: auto 0 0 0
}

.D0>.box .newslist .li_st .r .more span {
    display: inline-flex;
    padding: 0.125rem 0.25rem;
    font-size: 16px;
    color: #444;
    border: 1px solid #666;
    transition-property: all;
    transition-duration: 0.6s;
    transition-timing-function: "ease";
    transition-delay: "0s"
}

.D0>.box .newslist .li_li {
    display: flex;
    justify-content: space-between;
    gap: 0.6rem;
    border-bottom: 1px solid #eee;
    padding: 0 0 3vw 0;
    margin: 0 0 3vw 0
}

.D0>.box .newslist .li_li:hover .l time {
    background: #009cc8
}

.D0>.box .newslist .li_li .l {
    min-width: 80px
}

.D0>.box .newslist .li_li .l time {
    display: flex;
    padding: .1rem 0;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-radius: .12rem;
    background: #999;
    transition-property: all;
    transition-duration: 0.6s;
    transition-timing-function: "ease";
    transition-delay: "0s"
}

.D0>.box .newslist .li_li .l time .d {
    font-size: 20px;
    line-height: 1;
    font-weight: 900;
    color: #fff
}

.D0>.box .newslist .li_li .l time .y {
    font-size: 14px;
    color: #fff;
    line-height: 1.4
}

.D0>.box .newslist .li_li .r {
    width: auto;
    flex: 1
}

.D0>.box .newslist .li_li .r .title {
    font-size: 20px;
    font-weight: 600;
    transition-property: all;
    transition-duration: 0.6s;
    text-align: left;
}

.D0>.box .newslist .li_li .r .ms {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1.5;
    margin: .08rem 0 0 0;
    color: #777;
    font-size: 16px;
}
/*  */
.solution{
    width: 100%;
    background-color: #f7f7f7;
}

.solutions {
    width: 21.25rem;
    display: flex;
    flex-direction: column;
    margin: 20px auto 0;
}
  
.solu_box{
    width: 100%;
    height: 6.375rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #fff;
    margin-bottom: 10px;
}

.solu_box img{
    width: 50%;
    height: auto;
}

.solu_right{
    width: 45%;
    margin-right: 2%;
}

.solu_right div:nth-child(1) {
    width: 100%;
    font-size: 0.3rem;
    font-family: "Microsoft YaHei";
    color: rgb(51, 51, 51);
    line-height: 2.708;
    border-bottom: 2px solid #dcdcdc;
}
  
.solu_right div:nth-child(2) {
    font-size: 0.225rem;
    font-family: "Microsoft YaHei";
    color: rgb(51, 51, 51);
    line-height: 2.444;
    margin-top: 10px;
}
  





















#back-to-top {
    position: fixed;
    width: 1.1125rem;
    height: 1.1125rem;
    bottom: 0.25rem;
    right: 0.25rem;
    display: none;
    cursor: pointer;
    z-index: 9999;
}
.mobile-inner-header {
    width: 100%;
    height: 60px;
    display: none;
    line-height: 60px;
    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 22px;
    z-index: 99999;
    top: 0;background-color: #fff;
}

.mobile-inner-header-icon {
    color: #ffffff;
    height: 60px;
    font-size: 25px;
    text-align: center;
    float: right;
    width: 60px;
    position: relative;
    -webkit-transition: background 0.5s;
    -moz-transition: background 0.5s;
    -o-transition: background 0.5s;
    transition: background 0.5s;
    outline: none;
}

.mobile-inner-header-icon:hover {
    background-color: rgba(255, 255, 255, 0.2);
    cursor: pointer;
}

.mobile-inner-header-icon span {
    position: absolute;
    left: calc((100% - 25px) / 2);
    top: calc((100% - 1px) / 2);
    width: 25px;
    height: 1px;
    background-color: rgb(0, 0, 0);
}

.mobile-inner-header img {
    height: 65%;
}

.mobile-inner-header-icon span:nth-child(1) {
    transform: translateY(4px) rotate(0deg);
}

.mobile-inner-header-icon span:nth-child(2) {
    transform: translateY(-4px) rotate(0deg);
}

.mobile-inner-header-icon-click span:nth-child(1) {
    animation-duration: 0.5s;
    animation-fill-mode: both;
    animation-name: clickfirst;
}

.mobile-inner-header-icon-click span:nth-child(2) {
    animation-duration: 0.5s;
    animation-fill-mode: both;
    animation-name: clicksecond;
}

@keyframes clickfirst {
    0% {
        transform: translateY(4px) rotate(0deg);
    }
    100% {
        transform: translateY(0) rotate(45deg);
    }
}

@keyframes clicksecond {
    0% {
        transform: translateY(-4px) rotate(0deg);
    }
    100% {
        transform: translateY(0) rotate(-45deg);
    }
}

.mobile-inner-header-icon-out span:nth-child(1) {
    animation-duration: 0.5s;
    animation-fill-mode: both;
    animation-name: outfirst;
}

.mobile-inner-header-icon-out span:nth-child(2) {
    animation-duration: 0.5s;
    animation-fill-mode: both;
    animation-name: outsecond;
}

@keyframes outfirst {
    0% {
        transform: translateY(0) rotate(-45deg);
    }
    100% {
        transform: translateY(-4px) rotate(0deg);
    }
}

@keyframes outsecond {
    0% {
        transform: translateY(0) rotate(45deg);
    }
    100% {
        transform: translateY(4px) rotate(0deg);
    }
}

.mobile-inner-nav {
    background: #fff;
    width: 100%;
    position: absolute;
    top: 60px;
    left: 0px;
    padding-top: 30px;
    padding-bottom: 80px;
    display: none;
    z-index: 999999999999;
}

.mobile-inner-nav a {
    display: inline-block;
    line-height: 50px;
    text-decoration: none;
    width: 80%;
    margin-left: 10%;
    color: #000;
    border-bottom: solid 1px rgba(0, 0, 0, 0.3);
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    font-weight: 300;
    font-size: 16px;
}

.mobile-inner-nav a:hover {
    color: rgba(255, 255, 255, 0.4);
    border-bottom: solid 1px rgba(255, 255, 255, 0.2);
}

.videos {
    display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
    z-index: 9999;
    background-color: rgba(0, 0, 0, 0.444);
}

.video-box {
    position: absolute;
    top: 20%;
    left: 20%;
    bottom: 20%;
    right: 20%;
    background-color: #000;
}

.video-box video {
    width: 100%;
    height: 100%;
}

.video-back {
    width: 100%;
    margin: 0 auto;
    width: 120px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-radius: 20px;
    background-color: #fff;
    cursor: pointer;
}


#history {
    min-height: 300px;
    padding-top: 0.375rem;
    padding-bottom: 0.75rem;
    background-color: rgba(242,242,242,1)
}

#history .e_html-6 {
    min-height: 0;
    position: relative
}

#history .e_html-6 .m2lcLine {
    width: 2px;
    position: absolute;
    left: 50%;
    margin-left: -1px;
    top: 0;
    bottom: 0;
    background: url(../images/historyline.png) repeat-y center top;
    overflow: hidden
}

#history .e_html-6 .m2lcLine i {
    background: #009cc8;
    position: absolute;
    left: 0;
    top: 0;
    width: 2px;
    height: 0%
}

#history .e_html-6 .m2lcYears {
    text-align: center;
    position: fixed;
    left: 0;
    width: 100%;
    top: 50%;
    transform: translateY(-50%);
    line-height: 480px;
    height: 480px;
    font-size: 480px;
    font-weight: bold;
    color: rgba(0,0,0,0.05);
    display: none
}

#history .e_html-6 .m2lcYr {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    transition: all 0.5s ease-in-out;
    opacity: 0;
    font-family: gm_m
}

#history .e_html-6 .m2lcYr.on {
    opacity: 1
}

#history .e_html-6 .m2lcItems {
    position: relative;
    z-index: 1
}

#history .e_html-6 .m2lcItems li {
    padding-bottom: 25px;
    padding-left: 50%;
    list-style: none
}

#history .e_html-6 .m2lcItems li:nth-child(2n) {
    padding-left: 0;
    padding-right: 50%
}

#history .e_html-6 .m2lcItems li:nth-child(2n) .m2lc_item {
    margin-left: 0;
    margin-right: 63px;
    text-align: right
}

#history .e_html-6 .m2lcItems li:nth-child(2n) .m2lc_yt i {
    left: auto;
    right: -83px
}

#history .e_html-6 .maoLink {
    display: block;
    height: 0;
    overflow: hidden;
    position: relative;
    top: -50vh
}

#history .e_html-6 .m2lc_item {
    margin-left: 63px
}

#history .e_html-6 .m2lc_yt {
    line-height: 40px;
    height: 40px;
    font-family: gm_l;
    font-size: 36px;
    position: relative
}

#history .e_html-6 .m2lc_des {
    font-size: 16px;
    line-height: 32px;
    padding-top: 22px
}

#history .e_html-6 .m2lc_yt i {
    height: 40px;
    width: 40px;
    position: absolute;
    left: -83px;
    top: 0px
}

#history .e_html-6 .m2lc_yt i:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    border: 1px solid #009cc8;
    border-radius: 50%;
    background: #fff;
    transition: all 0.5s ease-in-out;
    opacity: 0
}

#history .e_html-6 .m2lcItems li.on .m2lc_yt i:before {
    opacity: 1
}

#history .e_html-6 .m2lc_yt i:after {
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #009cc8;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    transition: all 0.5s ease-in-out
}

#history .e_html-6 .m2lcItems li.on .m2lc_yt i:after {
    width: 18px;
    height: 18px
}

#history .e_html-6 .m2lc_des p {
    margin-bottom: 28px
}

#history .e_html-6 .m2lc_des span {
    display: inline-block;
    padding-left: 14px;
    position: relative
}

#history .e_html-6 .m2lc_des span:before {
    content: "";
    width: 4px;
    height: 4px;
    background: #009cc8;
    position: absolute;
    left: 0;
    top: 15px;
    border-radius: 50%
}

#history .e_html-6 .slideMenu {
    position: fixed;
    z-index: 6;
    width: 25px;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    display: none!important
}

#history .e_html-6 .slideMenu li {
    height: 40px;
    position: relative
}

#history .e_html-6 .slideMenu_a {
    height: 40px;
    display: block;
    white-space: nowrap;
    position: absolute;
    padding-left: 55px;
    top: 0;
    right: 0;
    color: #bfbfbf;
    padding-right: 50px;
    font: 14px/40px gm_l;
    transition: all 0.5s ease
}

#history .e_html-6 .slideMenu_a:before {
    content: "";
    background: #E6E6E6;
    height: 1px;
    width: 24px;
    position: absolute;
    top: 50%;
    right: 0px;
    transition: all 0.5s ease-in-out
}

#history .e_html-6 .slideMenu_a:hover,#history .slideMenu_a.on {
    font-size: 18px;
    font-weight: bold;
    color: #009cc8;
    padding-right: 70px
}

#history .e_html-6 .slideMenu_a:hover:before,#history .slideMenu_a.on:before {
    background: #009cc8;
    width: 48px
}

#history .e_container-7 {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    background-color: rgba(255,255,255,1);
    padding: 30px 20px;
    margin-top: 20px;
}

#history .e_container-7 > .p_item {
    flex: 1;
    max-width: 100%;
    max-height: 100%
}


#backButton{
    display: none;
    position: fixed;
    right: 0;
    bottom: 30%;
    width: 60px;
    font-size: 16px;
    color: #fff;
    text-align: center;
    background-color: #00559d;
    border-radius: 5px;
    padding: 5px 5px;
    z-index: 999;
}

#toolbar {
    position: fixed;
    z-index: 9999;
    right: 33px;
    bottom: 30%;
}

#toolbar li {
    margin-bottom: 3px;
    font-size: 0;
    width: 57px;
    height: 57px;
    right: 0;
    position: relative;
}

#toolbar li a {
    display: block;
    position: absolute;
    z-index: 9;
    right: 0;
    top: 0;
    width: 57px;
    height: 57px;
    overflow: hidden;
    transition: all .5s ease;
    white-space: nowrap;
    font-size: 0;
}

#toolbar li .iconfont {
    display: inline-block;
    vertical-align: middle;
    width: 57px;
    height: 57px;
    background-color: #009cc8;
    vertical-align: middle;
    text-align: center;
    line-height: 57px;
    color: #fff;
    font-size: 12px;
    padding-top: 15px;
    border-radius: 10px;
}

#toolbar li .wz {
    display: inline-block;
    line-height: 57px;
    font-size: 14px;
    color: #fff;
    vertical-align: middle;
    padding-left: 10px;
}

#toolbar li .ewm-box {
    position: absolute;
    z-index: 1;
    padding: 5px;
    width: 110px;
    right: 120%;
    bottom: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateX(100%);
    transition: all .7s;
}

#toolbar li p {
    margin-bottom: 0;
}

#toolbar li img {
    max-width: 100%;
}

#toolbar li:after {
    content: '';
    position: absolute;
    right: -5px;
    bottom: 20px;
    @include arrow(right,
    5px,
    $themecolor);
}

#toolbar li .icon {
    background-position: -57px -180px;
}

#toolbar li:hover .ewm-box {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    border-radius: 10px;
}

#toolbar .backtop {
    cursor: pointer;
    background-color: #009cc9;
    border-radius: 10px;
    
}

.iconfont {
    color: #fff;
}

#toolbar li:hover a {
    width: 200px;
    background-color: #009cc9;
    border-radius: 10px;
}

#toolbar li:hover .iconfont {
    background-color: #009cc9;
    border-radius: 10px;
}


.icon-iconfontphone {
    background: url(../images/tel1.png) center no-repeat;
    background-position-y:5px; 
}
.icon-iconfontmail {
    background: url(../images/mail.png) center no-repeat;
    background-position-y:5px; 
}

.icon-msnui-qr-code {
    background: url(../images/erwei1.png) center no-repeat;
    background-position-y:5px; 
}

.icon-arrowup {
    background: url(../images/backtop.png) center no-repeat;
    background-color: #009cc8;
    border-radius: 10px;
}