﻿.wrap_1550{width: 1550px;}
.wrap_1660{width: 1660px;}

.fnt_190{font-size: 1.9rem;}


@media only screen and (min-width:767px) {
    .gg_img01{width: 100%; height:10rem;position: relative;overflow: hidden;}
    .gg_img01_in{width: 100%;
        height: 100%;
        object-fit: cover;
        transform: translateY(-1.5rem)}
    .gg_img01 img { width: 100%;height: 100%;object-fit: cover;}
}



.header-logo {
    width: 2rem;
    vertical-align: middle;
}


.header-logo * {
    fill: #fff;
    transition: stroke-dashoffset 0.5s, transform 0.5s;
}

.header-logo .animate-r {
    stroke: #fff;
    stroke-width:0;
    stroke-dasharray: 50.4;
    
    /* stroke-dashoffset: 0;
    transform: translate(0, 0); */
}

.header-logo .animate-j {
    stroke: #fff;
    stroke-width:0;
    stroke-dasharray: 20.45;
    
    /* 
    transform: translate(0, 0); */
}

.header-logo.blue * {
    fill: #023886;
}

.header-logo.blue .animate-r {
    stroke: #023886;
}

.header-logo.blue .animate-j {
    stroke: #16A7A8;
    fill: #16A7A8;
}


.header-logo * {
    fill: #023886;
}

.header-logo .animate-r {
    stroke: #023886;
}

.header-logo .animate-j {
    stroke: #16A7A8;
}



.lh_top{padding:0.6rem 0;overflow: hidden;}
.lh_logobox{float: right;}
.lh_p{overflow: hidden;float: left;}
.lh_p h3{float: left; line-height: 1em;}
.lh_p span{float: left;color: #a5a5a5;margin-left: 0.12rem;}

.gg_img01{position: relative;}
.gg_img01 .logo3{width: 100%; position:absolute;left: 0;bottom: 0; opacity: 0;transform: translateY(0%);transition:all 1.5s;-webkit-transition:all 1.5s;-moz-transition:all 1.5s;-o-transition:all 1.5s;-ms-transition:all 1.5s;}

.gg_img01 .logo3 * {
    fill: rgba(255, 255, 255, 0.2);
}

/* .gg_img01 .logo3.play {
    animation: animate-banner-logo 2s forwards ease;
} */
.lh_01.play .gg_img01 .logo3{
    bottom: 50%;
        opacity: 1;
        transform: translateY(60%);
}

@keyframes animate-banner-logo {
    0% {
        bottom: 0;
        opacity: 0;
        transform: translateY(0%);
    }

    100% {
        bottom: 50%;
        opacity: 1;
        transform: translateY(60%);
    }
}


.lh_02{margin-top: -1.1rem;z-index: 5; position: relative;}
.lh_project{padding: 0.6rem 0.95rem;padding-left: 0.5rem;background: #fff;}
.lh_project_t{overflow: hidden;margin-bottom: 0.6rem;}
.lh_project_t h3{float: left; line-height: 1.33em;}
.lh_project_t p{text-transform: uppercase;float: right; line-height: 1.25em;padding-top: 0.6rem;position: relative;}
.lh_arrow{position: absolute;top:0;right: 0;width: 0.44rem;height: 0.44rem;}
.lh_arrow::after,.lh_arrow::before{content: "";position: absolute;background: #16a8a9;top:0}
.lh_arrow::after{width: 0.44rem;height: 0.12rem;left: 0;}
.lh_arrow::before{width: 0.12rem;height: 0.44rem;right: 0;}


.lh_project_b{width: 9.8rem;height: 9.2rem;position: relative;display: flex;margin:auto;}
.lh_project_b li{width: 5.6rem;height: 5.6rem;border-radius: 50%;position: absolute;background:none;background-size: 100% 100%;}
.lh_project_b li b{position: absolute;top:0;left: 0;width: 100%;height: 100%;background: url(../images/lh_cicle.png) no-repeat center center;background-size: 100% 100%;}
.lh_project_b li b{animation:mymove 30s linear infinite ;}
@keyframes mymove
{
0%   {transform: rotate(0deg);}
100% {transform: rotate(360deg);}
}


.lh_project_b li dl{padding-top: 2.5rem;width: 3.6rem;}
.lh_project_b li dt{text-align: center;position: relative;margin-bottom: 0.4rem;}
.lh_project_b li dt h3{line-height: 1em;position: relative;z-index: 2;color: #023886;}
.lh_project_b li dt h4{text-transform: uppercase;color: #eaeaea;position: absolute;left: 0;width: 100%;top:30%;    letter-spacing: -6px;}
.lh_project_b li dd{width: 2.8rem; margin:auto; overflow: hidden;    display: flex;justify-content: center;flex-wrap: wrap;}
.lh_project_b li dd p{width: 50%;float: left; text-align: center;margin-bottom: 0.4rem;}
.lh_project_b li dd p:nth-child(1){text-align: left;}
.lh_project_b li dd p:nth-child(2){text-align: right;}

.lh_project_b li:nth-child(1){top:0;left: 50%;margin-left: -2.8rem;}
.lh_project_b li:nth-child(2){bottom:0;left: 0;}
.lh_project_b li:nth-child(3){bottom:0;right: 0;}


.lh_project_b li:nth-child(1) dl{padding-top: 1.6rem;margin:auto;}
.lh_project_b li:nth-child(1) dd p{margin-bottom: 0.2rem;}
.lh_project_b li:nth-child(2) dl{margin-left: 0.5rem;}
.lh_project_b li:nth-child(3) dl{margin-left: 1.4rem;}

.lh_03{background: #023886;color: #fff;}
.lh_03 .left{width: 25%;float: left;padding: 0.7rem 0;padding-left: 1.8rem;    position: sticky; top:0.7rem}
.lh_03 .left h3{line-height: 1.2em;margin-bottom: 1rem;}
.lh_03 .right{width: 75%;float: right; position: relative;}
.reline{width: 1px;height: 100%;background: rgba(255, 255, 255, 0.2);position: absolute;left: 0;top:0;z-index: 9;}
.reline02{left: 33.33%;}
.reline03{left: 66.66%;}

.lh_p01 p{margin-bottom: 0.2rem;}


.lh_view_top li{position: relative;}
.lh_view_top video{position: absolute;top:0;left: 0;width: 100%;height: 100%;object-fit: cover;}

.lh_view_bottom{position: relative;}
.lh_view_bottom dt h3{margin-bottom: 0.2rem;}
.lh_view_bottom dt p{line-height: 1.66em;}
.lh_view_bottom dl{overflow: hidden;padding: 0.45rem 0.3rem 1rem 0.55rem;}
.lh_view_bottom dt{float: left;width:calc(100% - 1.3rem);}
.lh_view_bottom dd{float: right; visibility: hidden;opacity: 0;opacity: 0.3;cursor: pointer; transition:all 0.3s;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;}
.lh_view_bottom li{width:33.33%;float: left;opacity: 0.3;cursor: pointer; transition:all 0.3s;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;}
.lh_cicle_01{width: 1.2rem;height: 1.2rem;position: relative;border-radius: 50%;border: 1px solid rgb(255,255,255,0.2);}
.lh_cicle_01 i{ transform: translate(-50%,-50%) rotate(-90deg) ; -webkit-transform: translate(-50%,-50%) rotate(-90deg);-ms-transform: translate(-50%,-50%) rotate(-90deg);-moz-transform: translate(-50%,-50%) rotate(-90deg);-o-transform: translate(-50%,-50%) rotate(-90deg); position:absolute; left:50%; top:50%; font-size:0.2rem;}

.lh_view_bottom li.on{opacity: 1;}
.lh_view_bottom li.on dd{visibility: visible;opacity: 1;}

.lh_btn div{width: 0.5rem;height: 0.5rem;top:30%;left: auto;right:0.95rem;margin:0;background: none; font-size: 0.2rem; text-align: center;}
.lh_btn div i{transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);-o-transform: translate(-50%,-50%); position:absolute; left:50%; top:50%;}

.lh_btn .swiper-button-next{margin-top: 0.5rem;}
.lh_btn .swiper-button-prev i{transform: translate(-50%,-50%) rotate(180deg); -webkit-transform: translate(-50%,-50%) rotate(180deg);-ms-transform: translate(-50%,-50%) rotate(180deg);-moz-transform: translate(-50%,-50%) rotate(180deg);-o-transform: translate(-50%,-50%) rotate(180deg);}

.lh_04{padding: 1.2rem 0 1.3rem 0;}
.lh_color{width: 11.95rem; height: 7.8rem; max-width: 100%; margin:auto;overflow: hidden;}
.lh_color .left{width: 5.25rem;float:left;height: 100%;color: #023886;background: #f6f6f6;padding: 1rem 0.55rem;position: relative;}
.lh_color .left .lh_color_03{left: 0.55rem;bottom: 1rem;position: absolute;}
.lh_color .right{width: 6.7rem;float:right;color: #fff; position: relative;}
.lh_color_text{position: absolute;left: 0.45rem;top:1.9rem;    z-index: 9;}
.lh_color_text span{display: block;line-height: 1em;font-size: 1.62rem;font-style: italic;}
.lh_color_text span:nth-child(2){margin-left: 0.85rem;}
.lh_color_text em{position: absolute;right: 0;bottom:1.6rem;line-height: 1em;}

.lh_color .right,.lh_color .right ul{height: 100%;}
.lh_color_01{font-family: "Arial";line-height: 1em;margin-bottom: 0.55rem;}
.lh_color_02{line-height: 1.25em;}
.lh_color .right li{position: relative;}
.lh_color .right li:nth-child(1){height: 2.9rem;background: #16a8a9; border-radius: 0 0 0 0.4rem;padding-top: 0.5rem; padding-right: 0.65rem; text-align: right;}
.lh_color .right li:nth-child(2){height: calc(100% - 2.9rem);background: #023886;border-radius: 0.4rem 0 0 0;}
.lh_pubcolor p{line-height: 1em;margin-top: 0.2rem;}
.lh_color .right li:nth-child(2) .lh_pubcolor{position: absolute;right: 0.65rem;bottom: 1rem;}

.lh_05{padding: 1rem 0 3.7rem 0;position: relative;}
.lh_title h3{font-size: 1.9rem;color: #023886;line-height: 1em;margin-bottom: 0.8rem;}
.lh_title p{line-height: 1.6em;}
.lh_lhbg{position: absolute;top:0;left: 0;width: 70%;height: 100%;}
.lh_05 .wrap {position: relative;z-index: 5;}
.lh_jhbox{position: absolute;right: 0; bottom: 0.75rem;width: 14.98rem;z-index: 6;}
.lh_jhbox h2{width: 9.6rem;float: right;margin-bottom: 0.6rem;}
.lh_jhbox ul{overflow: hidden;height: 5.74rem;}
.lh_jhbox li img{width: 100%;}
.lh_jhbox li:nth-child(1){width: 5.18rem; height: 2.87rem; float: left;margin-top: 2.87rem;}
.lh_jhbox li:nth-child(2){width: 9.6rem; height: 100%;float: right;}

.lh_06{padding: 1.35rem 0; padding-bottom: 1.15rem; overflow: hidden;}
.lh_06 .left{float: left;width: calc(100% - 2.6rem);overflow: hidden;}
.lh_06 .right{float: right;text-align: right;width: 2.2rem;}
.lh_le{width: 2rem;float: left;}
.lh_le ul li{cursor: pointer; margin-bottom: 0.24rem;border: 0.03rem solid #023886;border-radius: 0.3rem;overflow: hidden;text-align: center;transition:all 0.3s;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;}
.lh_le ul li p{height: 0.4rem;line-height: 0.4rem;}
.lh_le ul li.on{background: #023886;color: #fff;}

.lh_ce{float: left;width: 2rem;margin-left: 1.1rem;} 

.lh_ce li{display: none;padding-top: 0.6rem; position: relative;}
.lh_ce li.on{display: block;}
.lh_ce li p{line-height: 2em;}
.lh_re{width: 7.08rem;float: right;}
.lh_re li{display: none;}
.lh_re li.on{display: block;}

.lh_07{position: relative;padding-top: 2.7rem; padding-bottom: 0.7rem;}
.lh_07 .wrap{position: relative;z-index: 5;}
.lhbging{position: absolute;top:0;left: 0;width: 100%;}
.lhbging img{width: 100%;opacity: 0.3;}
.lh_asoll{ width:13.6rem; height:7.2rem; background: #000; margin:auto; border: 0.19rem solid #000; border-radius: 0.3rem;overflow: hidden; } 
.lh_asoll img{width: 100%;}
.lh_asoll video{width: 100%;background: #000;}
.lh_line{width: 1px;height: 1.26rem;background: #000;margin:auto;}

.lh_ciclebox{margin-top: -0.3rem;}
.lh_ciclebox h4{text-align: center;padding-top: 0.4rem;}
.lh_ciclebox span{position: relative;margin:auto;width: 0.56rem;height: 0.56rem; display: block;}
.lh_ciclebox b{display: inline-block;width: 0.7rem;height: 0.7rem;border-radius: 50%;border:1px solid #e3e5e5;}
.lh_ciclebox i{display: inline-block;width: 0.15rem;height: 0.15rem;border-radius: 50%;border:1px solid #e3e5e5;}
.lh_ciclebox em{display: inline-block;width: 0.09rem;height: 0.09rem;border-radius: 50%;background: #000;}

.lh_ciclebox b{

-webkit-animation: loading_b 1500ms linear  forwards infinite;
animation: loading_b 1500ms linear  forwards infinite;
}
.lh_ciclebox i{

-webkit-animation: loading 1500ms linear  forwards infinite;
animation: loading 1500ms linear  forwards infinite;

}
.lh_ciclebox em{

/*-webkit-animation: loading_a 1500ms linear forwards infinite;
animation: loading_a 1500ms linear forwards infinite;
*/
}

@-webkit-keyframes loading {
  0% {
    width: 15px;
    height: 15px;
    opacity: 1;
  }

  100% {
     width: 69px;
    height: 69px;
    opacity:0.3;
  }
}

@keyframes loading {
  0% {
    width: 15px;
    height: 15px;
     opacity: 1;
  }

  100% {
     width: 69px;
    height: 69px;
     opacity:0.3;
  }
}

@-webkit-keyframes loading {
  0% {
    width: 9px;
    height: 9px;
    opacity: 1;
  }

  100% {
     width: 50px;
    height: 50px;
    opacity:0.3;
  }
}

@keyframes loading_a {
  0% {
    width: 9px;
    height: 9px;
    opacity: 1;
  }

  100% {
     width: 50px;
    height: 50px;
    opacity:0.3;
  }
}


@-webkit-keyframes loading {
  0% {
    width: 39px;
    height: 39px;
     opacity: 1;
  }

  100% {
     width: 69px;
    height: 69px;
     opacity:0.3;
  }
}
@keyframes loading_b {
  0% {
    width: 39px;
    height: 39px;
     opacity: 1;
  }

  100% {
     width: 89px;
    height: 89px;
     opacity:0.3;
  }
}


/*.index_07 {display: none;}*/
.lh_08{padding: 1.2rem 0;background: #ebecf0;}
.lh_list_out{overflow: hidden;}
.lh_list ul{margin:0 -0.25rem;}
.lh_list li{float: left;width: 50%;margin-bottom: 0.58rem;}
.lh_list dl{margin:0 0.25rem;box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);}

.lh_link{padding-top: 0.8rem;}
.lh_link h3{line-height: 1.25em;text-align: center;margin-bottom: 0.5rem;}
.lh_more a{display: block;width: 1.26rem;height: 1.26rem;border: 1px solid #000;color: #000;border-radius: 50%;margin:auto; position: relative; font-size: 0.36rem;}


.lh_07 ::-webkit-scrollbar {
    width: 0px; background: #ccc; height: 10px;
} /* 这是针对缺省样式 (必须的) */

.lh_07 ::-webkit-scrollbar-track {
background:#ececec; height:2px;
} /* 滚动条的滑轨背景颜色 */

.lh_07 ::-webkit-scrollbar-thumb {
background: #244299; width: 0px;
} /* 滑块颜色 */

.lh_07 ::-webkit-scrollbar-button {
background: #ececec;
} /* 滑轨两头的监听按钮颜色 */

.lh_07 ::-webkit-scrollbar-corner {
background: #ececec;
} /* 横向滚动条和纵向滚动条相交处尖角的颜色 */



@media only screen and (max-width:1366px) {
    .lh_le ul li{margin-bottom: 0.2rem;}
    .lh_le ul li p{height: 0.54rem;line-height: 0.54rem;}
}
@media only screen and (max-width:1024px) {
    .lh_le{width: 3rem;}
    .lh_ce{margin-left: 1.5rem;}
    .lh_03 .left{padding-left: 0.4rem;}
   
}

@media only screen and (max-width:767px) {
    .fnt_190{font-size: 1rem;}
    .lh_p01 p{margin-bottom: 0.1rem;}
    .lh_top{padding-bottom: 0.4rem;}
    .lh_02{margin-top: 0;overflow: hidden;}
    .lh_project{padding: 0.6rem 0;}
    .lh_project_t h3,.lh_project_t p{float: none;}
    .lh_project_t h3{margin-bottom: 0.3rem;}
    .lh_project_t p{text-align: right;}

    .lh_project_b{width: 100%;height: auto;}
    .lh_project_b li{width:60%;height:60%;}
    .lh_project_b li dl{width: 70%;}
    .lh_project_b li dd{width: 80%;}
    .lh_project_b li dl{padding-top: 40%;}
    .lh_project_b li:nth-child(1) dl{padding-top: 28%;}
    .lh_project_b li:nth-child(2) dl{margin-left: 0;}
    .lh_project_b li:nth-child(3) dl{margin-left: 28%;}
    .lh_project_b li dt h4{letter-spacing: 0;}
    .lh_project_b li dd p{margin-bottom: 10px;}
    .lh_project_b li:nth-child(1) dd p{margin-bottom: 10px;}
    .lh_project_b li dt{margin-bottom: 15px;}

    .lh_03 .left,.lh_03 .right{float: none;width: 100%;}
    .lh_03 .left h3 br{display: none;}
    .lh_03 .left h3{margin-bottom: 0.2rem;}
    .lh_03 .left{position: static;margin-bottom: 0.3rem;padding:30px 3%;margin-bottom: 0;}
    .lh_view_bottom{padding: 0 3%;}
    .lh_view_bottom li{width: 50%;}
    .lh_view_bottom dl{padding:5% 10px;}
    .lh_view_bottom dt p br{display: none;}
    .reline02{left: 50%;}
    .reline03,.reline01{display: none;}
    .lh_cicle_01{width: 30px;height: 30px;}
    .lh_view_bottom dt{width: calc(100% - 40px);}
    .lh_view_bottom dt h3{margin-bottom: 5px;}
    .lh_btn div{right: 0px;top:-40px;width: 40px;height: 40px;    background: #023886;}
    .lh_btn .swiper-button-next{margin-top: -41px;}
    .lh_color{width: 100%;}
    .lh_color .left{width: 40%;}
    .lh_color .right{width: 60%;}
    .lh_color .left{padding: 0.4rem;}
    .lh_color .left .lh_color_03{left: 0.4rem;bottom: 0.4rem;}
    .lh_color .right li:nth-child(1){padding-top: 0.2rem;padding-right: 0.4rem;}
    .lh_color .right li:nth-child(2) .lh_pubcolor{bottom: 0.4rem;right: 0.4rem;}
    .lh_color_text span{font-size: 1rem;}
    .lh_color_text em{bottom: 1rem;}
    .lh_asoll{width: 100%;height: 100%; height: 300px;}
    .lh_asoll video{height: 100%;}
    .lh_asoll ul,.lh_asoll li{height: 100%;}
    .lh_08{padding: 0.5rem 0;}
    .lh_link{padding-top: 0.2rem;}
    .lh_link h3{margin-bottom: 0.3rem;}
    .lh_list dl{margin:0 5px;}
    .lh_list ul{margin:0 -5px;}
    .lh_list li{margin-bottom: 10px;}
    .lh_link{padding-top: 30px;}
    .lh_07{padding-top: 1.5rem;}
    .lh_title h3 br{display: none;}
    .lh_title h3{font-size: 0.9rem;}
    .lh_jhbox{position: relative;width: 100%; bottom: auto;padding-top: 0.2rem;}
    .lh_lhbg{width: 100%;height: 30%;}
    .lh_title h3{margin-bottom: 14px;}
    .lh_05{padding:50px 0;padding-bottom: 0;}
    .lh_jhbox h2{width: 94%;float: none;margin:auto;margin-bottom: 0.2rem;}
    .lh_jhbox li:nth-child(1){margin-top: 0;}
    .lh_jhbox li{width: 100%;}
    .lh_jhbox ul{height: auto;}
    .lh_jhbox li:nth-child(1){width: 100%;height: auto;}
    .lh_06{padding:30px 0;}
    .lh_06 .left,.lh_06 .right{float: none;width: 100%;}
    .lh_le{width: 100%;float: none;font-size: 14px;font-weight: normal;margin-bottom: 10px;}
    .lh_le ul li{width:auto; margin-right: 5px; float: left;border-width: 1px;margin-bottom: 10px;}
    .lh_le ul li p{height: 40px;line-height: 40px;padding:0 10px;}
    .lh_le ul{overflow: hidden;}

    .lh_re{width:calc(100% - 110px);}
    .lh_ce{width: 100px;margin:0;}

    .lh_arrow{width: 16px;height: 16px;}
.lh_arrow::after{width: 16px;height:4px;}
.lh_arrow::before{width:4px;height: 16px;}
.lh_ce li{padding-top: 20px;}
.lh_ce li p{line-height: 28px;}
.lh_06 .left{margin-bottom: 10px;}


}
@media only screen and (min-width:768px) {
    .lh_project_b ul{height: auto !important;}  
    .public-img{    display: block;
        position: relative;
        z-index: 1;
        overflow: hidden;}
    .zz {
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        z-index: 3;
        background: #f5f7f9;
    }
}


.lh_color_text02{display: none;}
@media only screen and (min-width:1025px) {
.lh_le ul li:hover{background: #023886;color: #fff;}
.lh_more a:hover{border-color: #023886;background: #023886;color:#fff !important}

.lh_project_b li dl{transition:all 1s;-webkit-transition:all 1s;-moz-transition:all 1s;-o-transition:all 1s;-ms-transition:all 1s;}
.lh_project_b li:hover dl{-webkit-transform: translateY(-0.8rem); -moz-transform: translateY(-0.8rem);-o-transform: translateY(-0.8rem);-ms-transform: translateY(-0.8rem);transform: translateY(-0.8rem);}


/* gasp */


.lh_color .left{opacity: 0;}


.lh_color_01{position: relative;opacity: 0; top:1rem}
.lh_color_02{position: relative;opacity: 0; top:1rem}
.lh_color_03{opacity: 0;}
.lh_color_text{top:2.9rem;opacity: 0;}

.lh_color_04{opacity: 0;}
.lh_color_04 .lh_pubcolor{position: relative; opacity: 0;top:1rem;}

.lh_color_05{opacity: 0;}
.lh_color_05 .lh_pubcolor{opacity: 0;}

.lhbging img{opacity: 1;}


.lh_lhbg{opacity: 0;}
.lh_05 .lh_title h3,.lh_05 .lh_title p,.lh_jhbox h2{position: relative;opacity: 0; top:1rem}
.lhju01,.lhju02{position: relative;opacity: 0;}
.lhju01{left: -1rem;}
.lhju02{right: -1rem;}

.lh_color_text02{color: #023886; display: block;transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);-o-transform: translate(-50%,-50%); position:absolute; left:50%; top:50%;}
}


/* 11 */
span.worm-text {
    opacity: 0;
    transform: translate3d(0px, -30px, 0px);
  }
  
  span.worm-text {
    transition: .5s;
    display: inline-block;
  }
