@charset "utf-8";
@font-face {
  font-family: "CenturyGothicbold";
  src: url("../font/CenturyGothicbold.woff2") format("woff2"),
       url("../font/CenturyGothicbold.woff") format("woff"),
       url("../font/CenturyGothicbold.ttf") format("truetype"),
       url("../font/CenturyGothicbold.eot") format("embedded-opentype"),
       url("../font/CenturyGothicbold.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "CenturyGothic";
  src: url("../font/Century Gothic.woff2") format("woff2"),
       url("../font/Century Gothic.woff") format("woff"),
       url("../font/Century Gothic.ttf") format("truetype"),
       url("../font/Century Gothic.eot") format("embedded-opentype"),
       url("../font/Century Gothic.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "montserratSemiBold";
  src: url("../font/montserratSemiBold.woff2") format("woff2"),
       url("../font/montserratSemiBold.woff") format("woff"),
       url("../font/montserratSemiBold.ttf") format("truetype"),
       url("../font/montserratSemiBold.eot") format("embedded-opentype"),
       url("../font/montserratSemiBold.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}
article,aside,dialog,footer,header,section,footer,nav,figure,menu,main{display:block}
*,:before,:after{box-sizing:border-box;}
blockquote,body,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,hr,input,legend,li,ol,p,pre,td,textarea,th,ul{margin:0;padding:0}
img{border:0; display:block; width:100%; max-width:100%;}
ul,dl,li,dt,dd{list-style:none;}
body,html{min-height:100%;}
body{font:14px Arial,"microsoft JhengHei", Helvetica, sans-serif; color:#333333;-webkit-tap-highlight-color:rgba(255,255,255,0); overflow-x:hidden; color:#000;}
pre{font-family:"microsoft JhengHei"; white-space:pre-wrap;word-wrap: break-word;}
a{font-size:14px;text-decoration:none; color:#333333; outline:none; transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.clearfix:after{content:"\200B"; display:block; height:0; clear:both;}
.clearfix{*zoom:1;}/*IE/7/6*/
h1,h2,h3,h4,h5,h6{font-size:100%; font-weight:normal;}
input{outline: none;-webkit-appearance: none;border-radius: 0; font-size:14px;}
input[type="text"],input[type="password"],input[type="search"],textarea,select,input[type="date"]{outline: none; font-family:"microsoft JhengHei";-webkit-appearance: none;border-radius: 0; font-size:14px; display:block; width:100%; border:none; background:none; border:1px solid #dbdbdb; padding:6px 12px; transition:ease .45s;}
input[type="radio"]{display:inline-block; width:20px; height:20px; position:relative; top:2px; margin-right:5px; cursor:pointer;}
input[type="checkbox"]{display:inline-block; width:20px; height:20px; position:relative; top:2px; margin-right:5px; cursor:pointer;}
input::-webkit-input-placeholder {color: #888888;}
input:-moz-placeholder {　color: #888888;}
input::-moz-placeholder {color: #888888;}
input:-ms-input-placeholder {color: #888888;}
textarea{resize:none; overflow:hidden;}
textarea::-webkit-input-placeholder {color: #888888;}
textarea:-moz-placeholder {　color: #888888;}
textarea::-moz-placeholder {color: #888888;}
textarea:-ms-input-placeholder {color: #888888;}
select::-ms-expand { display: none; }
i,em{font-style:normal;}
.left{float:left;}
.right{float:right;}
.lh-flex{display:flex;display:-webkit-flex;flex-direction:row; -webkit-flex-direction:row;flex-wrap:wrap; -webkit-flex-wrap:wrap;}
.container{max-width:1230px; margin:auto; position:relative; padding:0 15px;}
.container800{max-width:830px; margin:auto; position:relative; padding:0 15px;}
.container1400{max-width:1430px; margin:auto; position:relative; padding:0 15px;}
.container1000{max-width:1030px; margin:auto; position:relative; padding:0 15px;}
.container1300{max-width:1330px; margin:auto; position:relative; padding:0 15px;}
.blue{color:#1e4fdb;}
.l-grid-2>li{width:50%; float:left;}
.l-grid-3>li{width:33.333333333333336%; float:left;}
.l-grid-4>li{width:25%; float:left;}
.l-grid-5>li{width:20%; float:left;}
.l-grid-6>li{width:16.666666666666668%; float:left;}
.font12{font-size:12px;}
.font13{font-size:13px;}
.font16{font-size:16px;}
.font18{font-size:18px;}
.font20{font-size:20px;}
.font24{font-size:24px;}
.font26{font-size:26px;}
.font28{font-size:28px;}
.font30{font-size:30px;}
.font36{font-size:36px;}
.font40{font-size:40px;}
.font46{font-size:46px;}
.font60{font-size:60px;}
.font34{font-size:34px;}
.padding30{padding:30px 0;}
.padding40{padding:40px 0;}
.padding60{padding:60px 0;}
.padding80{padding:80px 0;}
.padding100{padding:100px 0;}
.padding120{padding:120px 0}
.padding130{padding:130px 0;}
.padding140{padding:140px 0;}
.padding150{padding:150px 0;}
.bold{font-weight:bold;}
.margin40{margin:40px 0;}
.center{text-align:center;}
.uppercase{text-transform:uppercase;}
.overflow{overflow:hidden;}
.relative{position:relative;}
.img{background-position:center bottom; background-repeat:no-repeat; background-size:cover; width:100%; height:100%; position:absolute; left:0; top:0; width:100%;}
.letter2{letter-spacing:2px; margin-left:-2px;}
.shadows{position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.7); z-index:99; animation:shadows cubic-bezier(0.215,.61,.355,1) .45s;}
.zindex1{z-index:1;}
.zindex2{z-index:2;}
.zindex3{z-index:3;}
.zindex4{z-index:4;}
.zindex5{z-index:5;}
.zindex6{z-index:6;}
.zindex7{z-index:7;}
.zindex8{z-index:8;}
.zindex9{z-index:9;}
.zindex10{z-index:10;}
@keyframes shadows{
  0%{opacity:0;}
  100%{opacity:1;}  
}
.shadows.close{animation:shadows1 cubic-bezier(0.215,.61,.355,1) .45s;}
@keyframes shadows1{
  0%{opacity:1;}
  100%{opacity:0;}  
}
.whitebg{background:#fff;}
.graybg{background:#F7F7F7;}
.white{color:#fff;}
.lhTab .bd>div,.lhTab .bd>ul{display:none;}
video{object-fit: cover; outline:none;}
.lh-public-banner .img{width:100%; height:100%;}
.CenturyGothicbold{font-family:'CenturyGothicbold';}
.CenturyGothic{font-family:'CenturyGothic';}
.montserratSemiBold{font-family:'montserratSemiBold';}
/*分享*/
#bsWXBox{box-sizing:initial;}
#bsBox{box-sizing:initial;}
/*浏览器滚动条*/
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-button:vertical{display:none}
::-webkit-scrollbar-track:vertical{background-color:black}
::-webkit-scrollbar-track-piece{background:#E3E3E3}
::-webkit-scrollbar-thumb:vertical{background-color:#555;border-radius:30px}
::-webkit-scrollbar-thumb:vertical:hover{background-color:#3B3B3B}
::-webkit-scrollbar-corner:vertical{background-color:#535353}
::-webkit-scrollbar-resizer:vertical{background-color:#FF6E00}
/*布局*/
body{display:flex; align-items: center;justify-content: center; width: 100vw; height: 100vh; position: relative; overflow: hidden;}
#app{width: 100%; height: 100%;position: relative;display:flex; align-items: center;justify-content: center; overflow: hidden;}
.logo{position: absolute; left: 0; top: 1vw;width: 25%; animation: fadeInLeft cubic-bezier(0.215,.61,.355,1) 1s;}
.bg{position: absolute;left:0; top:0;width:100%; height: 100%; background-position:center; background-repeat: no-repeat; background-size: cover;}
.clickicon{width: 16vw; height: 17vw; position: absolute; left:15vw; top:15vw; cursor:pointer; animation:dianji ease .65s infinite;}
.clickicon img{width:6vw; position: absolute;left:-2vw; top:50%;}
@keyframes dianji{
  0%,100%{transform: translateX(0);}
  50%{transform: translateX(-10px);}
}
.lh-figure{width:3.125vw; height: 6.406249999999999vw; position: absolute; left:5vw; top: 34.5vw; animation-duration:2s;animation-fill-mode:forwards;animation-timing-function:linear; z-index: 10;}
@keyframes figureBox1{
  0%{transform: translate(0,0);opacity: 1;}
  40%{transform: translate(10vw,0);opacity: 1;}
  80%{transform: translate(10vw,-9vw);opacity: 1;}
  100%{transform: translate(17vw,-9vw); opacity: 1;}
}
@keyframes figureBox2{
  0%{transform: translate(0,0);opacity: 1;}
  30%{transform: translate(9vw,0);opacity: 1;}
  80%{transform: translate(9vw,13vw);opacity: 1;}
  100%{transform: translate(17vw,13vw); opacity: 1;}
}
@keyframes figureBox3{
   0%{transform: translate(0,0);opacity: 1;}
   20%{transform: translate(8vw,0);opacity: 1;}
   80%{transform: translate(8vw,-28vw);opacity: 1;}
   100%{transform: translate(15vw,-28vw);opacity: 1;}
}
@keyframes figureBox4{
   0%{transform: translate(0,0);opacity: 1;}
   20%{transform: translate(7vw,0);opacity: 1;}
   80%{transform: translate(7vw,15vw);opacity: 1;}
   100%{transform: translate(15vw,15vw);opacity: 1;}
}
@keyframes figureBox5{
   0%{transform: translate(0,0);opacity: 1;}
   40%{transform: translate(9vw,0);opacity: 1;}
   80%{transform: translate(9vw,-11vw);opacity: 1;}
   100%{transform: translate(15vw,-11vw);opacity: 1;}
}
@keyframes progressfigureBox1{
    0%{transform: translate(0,0);opacity: 1;}
    100%{transform: translate(10vw,0); opacity: 1;}
}
@keyframes progressfigureBox2{
  0%{transform: translate(0,0);opacity: 1;}
  40%{transform: translate(10vw,0);opacity: 1;}
  60%{transform: translate(10vw,10vw);opacity: 1;}
  100%{transform: translate(21vw,10vw); opacity: 1;}
}
@keyframes progressfigureBox3{
  0%{transform: translate(0,0);opacity: 1;}
  40%{transform: translate(11vw,0);opacity: 1;}
  60%{transform: translate(11vw,9vw);opacity: 1;}
  100%{transform: translate(23vw,9vw); opacity: 1;}
}
@keyframes progressfigureBox4{
  0%{transform: translate(0,0);opacity: 1;}
  50%{transform: translate(15.5vw,0);opacity: 1;}
  80%{transform: translate(15.5vw,9vw);opacity: 1;}
  100%{transform: translate(23vw,9vw); opacity: 1;}
}
@keyframes figure{
  0%{background-position:0% 0%;}
  100%{background-position:0% 100%;}  
}
@keyframes assessmentfigureBox1{
    0%{transform: rotateY(180deg) translate(0,0);opacity: 1;}
    30%{transform:rotateY(180deg) translate(0,-17vw);opacity: 1;}
    60%{transform:rotateY(180deg) translate(17vw,-17vw);opacity: 1;}
    100%{transform:rotateY(180deg) translate(17vw,-8vw); opacity: 1;}
}
@keyframes assessmentfigureBox2{
    0%{transform: rotateY(0) translate(0,0);opacity: 1;}
    20%{transform:rotateY(0) translate(0,-10vw);opacity: 1;}
    40%{transform:rotateY(0) translate(17vw,-10vw);opacity: 1;}
    80%{transform:rotateY(0) translate(17vw,27vw); opacity: 1;}
    100%{transform:rotateY(0) translate(35vw,27vw); opacity: 1;}
}
@keyframes assessmentfigureBox3{
    0%{transform: rotateY(0) translate(0,0);opacity: 1;}
    10%{transform:rotateY(0) translate(3vw,0);opacity: 1;}
    30%{transform:rotateY(0) translate(3vw,-12vw);opacity: 1;}
    50%{transform:rotateY(0) translate(13vw,-12vw);opacity: 1;}
    80%{transform:rotateY(0) translate(13vw,-28vw);opacity: 1;}
    81%{transform:translate(13vw,-28vw) rotateY(180deg);opacity: 1;}
    100%{transform:translate(5vw,-28vw) rotateY(180deg);opacity: 1;}
}
@keyframes assessmentfigureBox4{
    0%{transform: rotateY(180deg) translate(0,0);opacity: 1;}
    40%{transform:rotateY(180deg) translate(24vw,0);opacity: 1;}
    80%{transform:rotateY(180deg) translate(24vw,28vw);opacity: 1;}
    100%{transform:rotateY(180deg) translate(33vw,28vw);opacity: 1;}
}
@keyframes assessmentfigureBox5{
    0%{transform: rotateY(180deg) translate(0,0);opacity: 1;}
    50%{transform:rotateY(180deg) translate(22vw,0);opacity: 1;}
    100%{transform:rotateY(180deg) translate(22vw,-18vw);opacity: 1;}
}
.lh-figure .icon{width:100%; height: 100%;background-position:center top; background-repeat:no-repeat;background-size:100% 800%; animation-duration:.5s;animation-iteration-count:infinite;animation-timing-function:steps(7); }

.lh-footer .menu{position: relative; height: 40px; line-height: 40px; border-radius: 4px;
 background:#99B5C9; color:#fff; font-size: 16px; font-weight: bold;transition: cubic-bezier(0.215,.61,.355,1) .45s; margin-right: 10px;}
.lh-footer .menu em{cursor: pointer; display: block; padding: 0 1vw;}
.lh-footer .menu i{font-size:20px; margin-right: 10px;}
.home a{font-size: 16px;}
.lh-footer{position:fixed; left:0; bottom:0; width:100%; background:#ECECEC; height:60px; padding:10px 2vw; z-index:10!important;}
.home{height:40px; line-height:40px; padding:0 1vw; border-radius:4px; background:#99B5C9; color:#fff; font-size:16px; font-weight:bold; cursor:pointer;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.home a{color:#fff;}
.home i{margin-right:10px; font-size:20px; font-weight:normal;}
.lh-music{margin-left:10px; line-height:40px;}
.lh-music .btn{color:#333; cursor:pointer;}
.lh-music .btn i{font-size:24px;}
.lh-music .current{margin:0 10px; width: 36px; white-space: nowrap;}
.lh-music .progress{width:200px; height:10px; border-radius:30px; background:#C2C2C4; margin-top:15px; position:relative;}
.lh-music .total{margin-left:10px; width: 45px;}
.lh-music .hd{position:absolute; left:0; top:0; width:0%; height:100%; background:#E83C3C; border-radius:30px;}
.lh-text{height:40px; line-height:40px; font-size:16px; font-weight:bold; padding:0 1vw; border-radius:4px; background:#99B5C9; color:#fff; margin-left:10px; cursor:pointer;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-text:hover,.home:hover{background:#79A7C9;}
.lh-hostory-cont{position:absolute; right:0; top:0; width:45%; height:100%; display:flex; align-items:center; justify-content:center; text-align:center;}
.lh-text-layer{position:absolute; left:0; bottom:60px; width:100%; padding:30px 5vw; font-size:24px; line-height:36px; background:#fff; border-top:2px solid #ACD6E1; border-bottom:2px solid #ACD6E1; display:none; color:#000;}
.lh-text:hover .lh-text-layer{display:block;}
.lh-footer .course{height: 40px; line-height: 40px; background: #99B5C9; border-radius: 4px; color:#fff; padding: 0 1vw; float:left; margin-left:10px; font-size: 16px;}
.course-progress{width: 200px; position: relative; color:#000; height: 20px; line-height: 20px; border-radius: 30px; background: #fff; margin:10px 10px 0;}
.course-progress .hd{position: absolute; left:0; top:0; border-radius: 20px; width: 100%; height: 100%; background: #E83C3C;}
.course-progress em{position: absolute; left:0; top:0; z-index: 2; font-size: 12px; text-align: center; width:100%; line-height: 20px;}
.lh-share{margin-left:10px; width: 180px; overflow: hidden; height: 40px; line-height: 40px; border:1px solid #999; position: relative; border-radius: 4px;}
.lh-share input{position: absolute; left:0; top:0; width:100%; height: 100%; padding: 0 40px 0 10px;}
.lh-share i{position: absolute; right:0; top:0; width:30px; height: 40px; font-size:24px; color:#99B5C9;}
.lh-btn span{float:left; margin-left:10px; height: 40px; line-height: 40px; padding: 0 1vw; color:#fff; border-radius: 4px;
 background: #99B5C9; font-size: 16px; cursor: pointer;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-btn span:hover,.lh-footer .menu:hover{background: #79A7C9;}
@keyframes lhZoomIn{
  0%{opacity: 0; transform: scale(.7);}
  100%{opacity: 1; transform: scale(1);}
}
.goOnBtn{position: absolute; right: 2.6vw; bottom: 80px; cursor: pointer; opacity: 0; transform: translateY(100%); animation:fadeInUp cubic-bezier(0.215,.61,.355,1) 1s forwards; animation-delay: 1s;}
.goOnBtn:hover{opacity: .7;}
.progress-text{position:absolute; right: 2.6vw; top:2vw; width: 30%; border:2px dashed #FF9900; border-radius: 30px; font-size: 1.5625vw; padding: 1vw; font-weight: bold; background:rgba(255,255,255,.9); animation:lhZoomIn cubic-bezier(0.215,.61,.355,1) 1s forwards;}
.progress-text:before{content: ''; display: none; width: 106%; height: 110%; border:2px dashed #FF9900; position: absolute; left:-3%; top:-5%; border-radius: 30px;}
.lh-seal{position: absolute; left:30vw; top:-20vw;transition:cubic-bezier(0.215,.61,.355,1) .65s; z-index: 2;width:15vw;}
.lh-seal-complete>div{position: absolute; display: none; width: 12vw;}
.complete1{left: 16vw; top:17vw;}
.complete2{left: 32vw; top:32vw;}
.complete3{left: 48vw; top:3vw;}
.complete4{left: 64vw; top:18vw;}
.complete5{left: 80vw; top:7vw;}
.red{color:#FF3300;}
.lh-seal-complete>div.on{display: block;}
.menu-layer{position: absolute; left:-2vw; bottom: 50px; background: #99B5C9; width: 14vw; padding: 1vw 0; display: none;}
.menu-layer .title{padding: 0 1vw; font-size: 18px; position: relative;}
.menu-layer .title i{position: absolute; right: 1vw; top: 0; cursor: pointer;}
.menu-layer dl dt{padding: 0 1vw; cursor: pointer;}
.menu-layer dl dd{padding: 0 2vw; position: relative; cursor: pointer;}
.menu-layer dl dd:before{content: ''; display:block; width: 4px; height: 4px; border-radius: 50%; background: #fff; position: absolute; left: 1vw; top: 50%; margin-top:-2px;}
.menu-layer dl dd:hover,.menu-layer dl dt:hover{text-decoration: underline;}
.lh-footer .menu.on .menu-layer{display: block;}
.lh-index-bg{width:100%; height:100%; background:url(../img/bg.jpg) no-repeat right top; position:absolute; left:0; top:0;}
.animatexy{animation:animatexy linear 1s forwards;}
.lh-end{position: fixed; left:50%; top:50%; transform:translate(-50%,-50%); border-radius: 4px; background:#fff; padding-bottom: 20px; font-size: 14px; z-index: 1000; animation:Ends cubic-bezier(0.215,.61,.355,1) .45s forwards;}
.lh-end h3{height: 35px;line-height: 35px;background: #F8F8F8; padding: 0 20px; overflow: hidden; position: relative;}
.lh-end h3 i{float:right; cursor: pointer; width: 35px; height: 35px; right: 0; top:0; text-align: center;position: absolute;}
.lh-end .cont{padding: 20px;}
.lh-end a{float:right; padding: 3px 20px; background: #35A1FB; color:#fff; border-radius: 3px; font-size: 12px; margin-right: 20px;}
@keyframes Ends{
  0%{opacity: 0; visibility: hidden;}
  100%{opacity: 1; visibility: visible;}
}
@keyframes animatexy{
  0%{transform:translate(0,0);}
  100%{transform:translate(-100%,100%);}  
}
.lh-index-bg{width:100%; height:100%; background:url(../img/bg.jpg) no-repeat right top; position:absolute; left:0; top:0;}

.lh-index{width:100%; height:100%; position:absolute; left:0; top:0;transition:ease 1s;}
.lh-icon{position:absolute; left:50%; top:50%; background-position:center; background-repeat:no-repeat; background-size:cover;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-icon.icon1{width:27.03125vw; height:16.927083333333336vw; margin:-5vw 0 0 -35vw; cursor:pointer;}
.lh-icon.icon2{width:20.729166666666668vw; height:16.614583333333332vw; margin:-18vw 0 0 -5vw; cursor:pointer;}
.lh-icon.icon3{width:24.375vw; height:15.833333333333332vw; margin:0 0 0 10vw; cursor:pointer;}
.feiji{width:10.416666666666668vw; height:9.322916666666666vw; position:absolute; left:50%; top:50%;filter: grayscale(0); background-position:center; background-repeat:no-repeat; background-size:cover; transform:translate(-50%,-50%);transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.show{ opacity:1; transition-delay:.7s;}
.lh-icon:hover{filter: grayscale(0);}
.lh-icon.icon1 .feiji{transform:translate(-200%,50%) rotate(10deg); opacity:0; visibility:hidden; animation:iconfeijimove cubic-bezier(0.215,.61,.355,1) 1s infinite;}
@keyframes iconfeijimove{
  0%,100%{transform:translate(-200%,50%) rotate(10deg);}
  50%{transform:translate(-190%,40%) rotate(10deg);}
}
.lh-icon.icon1.on .feiji{animation:icon1feiji cubic-bezier(0.215,.61,.355,1) 2s forwards;}
@keyframes icon1feiji{
  0%{transform:translate(-200%,50%) rotate(10deg); opacity:1; visibility:hidden;}
  60%{transform:translate(-200%,-100%) scale(.8) rotate(20deg); opacity:1; visibility:visible;}
  100%{transform:translate(-50%,-50%) scale(.6) rotate(75deg); opacity:0; visibility:visible;}  
}
.lh-icon.icon2 .feiji{animation:iconfeijimove2 cubic-bezier(0.215,.61,.355,1) 1s infinite;}
@keyframes iconfeijimove2{
  0%,100%{transform:translate(-270%,-150%) rotate(55deg);}
  50%{transform:translate(-240%,-150%) rotate(65deg);}
}
.lh-icon.icon2.on .feiji{animation:icon2feiji cubic-bezier(0.215,.61,.355,1) 2s forwards;}
@keyframes icon2feiji{
  0%{transform:translate(-270%,-150%) scale(1) rotate(55deg);}
  40%{transform:translate(-150%,-100%) scale(1) rotate(65deg);}
  100%{transform:translate(-50%,-50%) scale(.6) rotate(65deg); opacity:0; visibility:hidden;} 
}
.lh-icon.icon3 .feiji{animation:iconfeijimove3 cubic-bezier(0.215,.61,.355,1) 1s infinite; display: none;}
@keyframes iconfeijimove3{
  0%,100%{transform:translate(-80%,-250%) rotate(75deg);}
  50%{transform:translate(-70%,-230%) rotate(85deg);}
}
.lh-icon.icon3.on .feiji{animation:icon3feiji cubic-bezier(0.215,.61,.355,1) 2s forwards;}
@keyframes icon3feiji{
  0%{transform:translate(-80%,-250%) scale(1) rotate(75deg); opacity:1; visibility:visible;}
  40%{transform:translate(-70%,-180%) scale(1) rotate(85deg); opacity:1; visibility:visible;}
  100%{transform:translate(-50%,-50%) scale(.6) rotate(85deg); opacity:0; visibility:hidden;} 
}
  @keyframes historyLeft{
    0%{transform: translate(-100%,-50%); opacity: 0;}
    100%{transform: translate(0,-50%); opacity: 1;}
  }

  .lh-history-l{position: absolute; left: 8%; top:50%; transform: translate(-100%,-50%); animation:historyLeft cubic-bezier(0.215,.61,.355,1) 1s forwards; opacity: 0; width: 25%;}
  .lh-history-l .renwu{width: 50%; position: relative; left:50%; transform: translateX(-50%);}
  .lh-history-r{position: absolute; right: 8%; top:50%; transform: translate(-100%,-50%); animation:historyRight cubic-bezier(0.215,.61,.355,1) 1s forwards; opacity: 0; width: 27%;}
  @keyframes historyRight{
    0%{transform: translate(100%,-50%); opacity: 0;}
    100%{transform: translate(0,-50%); opacity: 1;}
  }
  .lh-history-r .renwu{width: 70%;position: relative; left:50%; transform: translateX(-50%);}
  .lh-history-l .text,.lh-history-r .text{width: 100%; position: relative; top:-2vw; animation:historyText cubic-bezier(0.215,.61,.355,1) 1s forwards; opacity: 0; animation-delay: 1s;}

  @keyframes liZoomIn{
    0%{opacity: 0; transform: scale(.5);}
    100%{opacity: 1;transform: scale(1);}
  }
  @keyframes liZoomOut{
    0%{opacity: 1; transform: scale(1);}
    100%{opacity: 0;transform: scale(.5);}
  }
  @keyframes historyText{
    0%{transform: translateY(-100%); opacity: 0;}
    100%{transform: translateY(0); opacity: 1;}
  }
  @keyframes historyA{
    0%{transform:translate(-50%,-50%) scale(.6);opacity: 0;}
    100%{transform:translate(-50%,-50%) scale(1);opacity: 1;}
  }
  @keyframes historyAout{
    0%{transform:translate(-50%,-50%) scale(1);opacity: 1;}
    100%{transform:translate(-50%,-50%) scale(.6);opacity: 0;}
  }
.imgs{background-position: center; background-repeat: no-repeat; background-size: cover;}
.lh-homes{width: 100%; height: 100%;}
.lh-logo{width: 40%; position: absolute; left:0; top:20px; z-index: 1000;}
.lh-fire{position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); cursor: pointer;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-fire-icon{width: 26.041666666666668vw; height: 26.041666666666668vw; background-position: center 0%; background-repeat: no-repeat; background-size: 100% 700%;animation-duration:.7s;animation-iteration-count:infinite;animation-timing-function:steps(6); animation-name: figure;}
.fire-jt{width: 10vw; position: absolute; right: -14vw; top:50%;  animation: fireJt linear .8s infinite;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
@keyframes fireJt{
  0%,100%{transform: translateX(0);}
  50%{transform: translateX(-2vw);}
}
@keyframes fireJt1{
  0%,100%{transform: translate(0,-50%);}
  50%{transform: translate(-2vw,-50%);}
}
@keyframes fireJt3{
  0%,100%{transform: translate(0,-50%);}
  50%{transform: translate(2vw,-50%);}
}
.lh-fire-text{position: absolute; left:0; top:6vw; color:#fff; font-size: 3vw; height: 5.208333333333334vw; line-height: 5.208333333333334vw; text-align: center; padding: 0 3.125vw ;background:#61A9CE; animation-name: textIn; animation-duration: 1s; animation-fill-mode: forwards; animation-timing-function: cubic-bezier(0.215,.61,.355,1);}
@keyframes textOutIn{
  0%,100%{transform: translateX(0);}
  50%{transform: translateX(-100%);}
}
@keyframes textOutIn1{
  0%,100%{transform: translateX(0);}
  50%{transform: translateX(-100%);}
}
.lh-fire-text:after{content: ''; display: block; width: 3.5416666666666665vw; height: 5.208333333333334vw; background: url(../img/icon1.png) no-repeat center; background-size: cover; position: absolute; left:100%; top:0;}
@keyframes textIn{
  0%{transform: translateX(-100%);}
  100%{transform: translateX(0);}
}
.lh-fire-cont{position: absolute; left: 50%; bottom: 10%; color:#fff; transform: translate(-50%,50%); background: #74BDB6; font-size: 2vw; padding: 1.5625vw 4.166666666666666vw; border-radius: 4px; text-align: center; opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-fire-cont:before{content: ''; display: block; width: 98%; height: 90%; border:2px solid #fff; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%);}
.lh-fire-cont.on{transform: translate(-50%,0); opacity: 1; visibility: visible;}
.lh-fire.on{cursor: auto;}
.lh-fire.on .fire-jt{opacity: 0; visibility: hidden;}
.lh-fire-next{position: absolute; right: 30px; bottom: 90px; width: 9.375vw;transition:cubic-bezier(0.215,.61,.355,1) .45s; transform: translateY(100%); opacity: 0; visibility: hidden; cursor: pointer; z-index: 10;}
.lh-fire-next.on{transform: translateY(0); opacity: 1; visibility: visible;}
.lh-fire-tj{position: absolute; left:0; text-align: center; bottom: 10%; width: 100%;}
.lh-fire-tj li{ display: inline-block; margin: 0 2vw; width: 9.21875vw; position: relative; transform: translateY(100%); opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-fire-tj li .jt{width: 5vw; position: absolute; left:85%; top:40%; z-index: 5;animation: fireJt linear .8s infinite;}
.lh-fire-tj li:nth-child(1){transition-delay: .1s;}
.lh-fire-tj li:nth-child(2){transition-delay: .2s;}
.lh-fire-tj li:nth-child(3){transition-delay: .3s;}
.lh-fire-tj li i{position: absolute; left:50%; bottom: 1vw; font-size: 2vw; color:#68CE5B; transform: translateX(-50%); z-index: 2;transition:cubic-bezier(0.215,.61,.355,1) .45s; opacity: 0;}
.lh-fire-tj li i:after{content: ''; display: block; width: 60%; height: 60%; background: #fff; border-radius: 50%; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); z-index: -1;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-fire-tj li:before{content: ''; display: block; width:90%; height: 90%; border-radius: 50%; background: rgba(0,0,0,.7); position: absolute; left:50%; top:50%; transform: translate(-50%,-50%);transition:cubic-bezier(0.215,.61,.355,1) .45s; opacity: 0;}
.Tj .lh-fire-tj li{opacity: 1;transform: translateY(0); visibility: visible;}
.lh-tj-cont{position: absolute; left:50%; top:50%; transform:translate(-50%,-50%); width: 70vw; opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-fire-tj li.end:before{opacity: 1;}
.lh-fire-tj li.end i{opacity: 1;}
.tjLayer .lh-tj-cont{opacity: 1; visibility: visible;}
.hz .lh-fire-tj li{transform:translateY(-100%); opacity: 0; visibility: hidden;}
.hz .lh-fire-tj li:nth-child(1){transform:translate(100%,-100%);}
.hz .lh-fire-tj li:nth-child(3){transform:translate(-100%,-100%);}
.lh-control-btn{width: 20vw; height: 8.229166666666666vw; background-position: center 0%; background-repeat: no-repeat; background-size: 100% 600%;animation-duration:.7s;animation-timing-function:steps(5); animation-name: figure;  animation-fill-mode:forwards;animation-play-state: paused;}
.lh-control{position: absolute; left:50%; top:7.447916666666667vw; transform:translateY(-150%); opacity: 0; visibility: hidden; cursor: pointer;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-control .fire-jt{transform:translateY(-50%); animation: fireJt1 linear .8s infinite; width: 6vw; right: -8vw;}
.hz .lh-control{opacity:1; visibility: visible;transform:translateY(-50%);}
.lh-fire-next1{width: 10.9375vw; position: absolute; right: 30px; bottom: 90px; transform:translateY(100%); opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s;cursor: pointer;}
.lh-fire-box{width: 83.33333333333334vw; height:62.5vw; position: absolute; left:50%; transform:translateX(-50%); top:-20vw;background-position: center 0%; background-repeat: no-repeat; background-size: 100% 800%;animation-duration:.7s;animation-timing-function:steps(7); animation-name: figure;animation-iteration-count:infinite;animation-play-state: paused; opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.Last .lh-fire-next1{opacity: 1; visibility: visible; transform:translateY(0);}
.Last .lh-fire-box{opacity: 1;visibility: visible;animation-play-state: running;}
.Last .lh-fire{opacity: 0; visibility: hidden;}
.lh-fire-tj li.on{cursor: pointer;}
.lh-logo1{position: absolute; top:20px; left:0; padding: 1vw 2.604166666666667vw 1vw 1vw; display: flex; align-items: center;; justify-content: center; border-radius:0 60px 60px 0; background: #ECECEC; font-size:1.6vw; color:#9FA2A1; font-weight: bold;}
.lh-logo1 img{width: 10.416666666666668vw; margin-right: 2vw;}
.lh-logo1 span{position: relative;}
.lh-logo1 span:before{content: ''; display: block; width: 1px; height: 100%; position: absolute; left:-1vw; top:0; background: #9FA2A1;}
.lh-safety-bg{position: absolute; left:0; top:0; width: 100%; height: 100%;}
.lh-safety-item{position: absolute; left:50%; top:9vw;}
.lh-safety-item li{float:left; position: relative; margin: 0 5vw;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-safety-item li .icon{ width: 10.416666666666668vw;}
.lh-safety-item li .jt{width: 7.552083333333333vw; position: absolute; left:-8vw; top:20%; animation: fireJt2 linear .8s infinite;transition:cubic-bezier(0.215,.61,.355,1) .45s; opacity: 0;}
@keyframes fireJt2{
  0%,100%{transform:scale(.5) translateX(0);}
  50%{transform:scale(.5) translateX(2vw);}
}
.openAnimate .lh-safety-bg{animation:openAnimate cubic-bezier(0.215,.61,.355,1) 1s forwards; transform-origin: right top;}
@keyframes openAnimate{
  0%{transform: scale(1);}
  90%{transform: scale(1.3);}
  100%{opacity: 0; visibility: hidden;}
}
.openAnimate .lh-safety-item{animation:openAnimate1 cubic-bezier(0.215,.61,.355,1) 1.5s forwards; transform-origin: right top;}
@keyframes openAnimate1{
  0%{transform: scale(1);}
  100%{transform: scale(2) translate(-2vw,0);}
}
.lh-safety-item li.on .jt{opacity: 1;}
.lh-safety-item li.on{cursor: pointer;}
.lh-safety-child{position: absolute; left: 50%; top:50%; transform: translateY(-50%);}
.lh-safety-child li{position: relative; margin:2vw 0; transform: translateX(20%); opacity: 0; visibility: hidden; }
.lh-safety-child li.on{cursor: pointer;}
.lh-safety-child li .title{width: 32.65625vw; padding: 1vw 0; color:#fff; border-radius: 30px; background: #01B3A5; color:#fff; font-weight: bold; font-size: 2vw; text-align: center;}
.lh-safety-child li .jt{width: 5.208333333333334vw; position: absolute; left:108%; top:50%; transform: translateY(-50%); opacity: 0;transition:cubic-bezier(0.215,.61,.355,1) .45s;animation: fireJt1 linear .8s infinite;}
.lh-safety-child li.on .jt{opacity: 1;}
.Know .lh-safety-item li{transform: translateX(-2vw);}
.Know .lh-safety-item li:nth-child(2){opacity: 0; visibility: hidden;}
.Know .lh-safety-child li{animation: safetyLi cubic-bezier(0.215,.61,.355,1) 1s forwards;}
.Know .lh-safety-child li:nth-child(2){animation-delay: .1s;}
.Know .lh-safety-child li:nth-child(3){animation-delay: .2s;}
.Know .lh-safety-child li:nth-child(4){animation-delay: .3s;}
.Know .lh-safety-child li:nth-child(5){animation-delay: .4s;}
@keyframes safetyLi{
  0%{opacity: 0; visibility: hidden;transform: translateX(20%);}
  100%{opacity:1; visibility:visible;transform: translateX(0);}
}
.lh-tips{font-size: 8vw; white-space: nowrap; color:red; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%) scale(0); font-weight: bold; opacity: 0; animation: tips cubic-bezier(0.215,.61,.355,1) 3s forwards;}
@keyframes tips{
  0%,100%{transform: translate(-50%,-50%) scale(0); opacity: 0;}
  20%,80%{transform: translate(-50%,-50%) scale(1); opacity: 1;}
}
.lh-concept{position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); display: flex; align-items: center; justify-content: center;}
.lh-concept .icon{width: 40.625vw; float:left; margin-right: 5.208333333333334vw;transition:cubic-bezier(0.215,.61,.355,1) .45s; margin-top:4vw; opacity: 0; transform: translateX(-5vw);visibility: hidden;}
.lh-concept .text{width: 46.35416666666667vw; float:right; text-align: center;}
.lh-concept .text .title{font-size: 2.4vw; font-weight: bold; display: inline-block; padding: .5vw 5vw; background: #01B3A5; border-radius: 60px; color:#fff;transition:cubic-bezier(0.215,.61,.355,1) .45s; opacity: 0; transform: translateY(-5vw);visibility: hidden;}
.lh-concept .ccont{background: #01B3A5; color:#fff; padding: 2vw; font-size: 1.4vw; border-radius: 20px; margin-top:2vw; line-height: 2.5vw; text-align: left;transition:cubic-bezier(0.215,.61,.355,1) .45s; opacity: 0; transform: translateY(5vw);visibility: hidden;}
.openConcept .lh-concept .icon,.openConcept .lh-concept .title,.openConcept .lh-concept .ccont{opacity: 1; transform: translate(0,0);visibility:visible;}
@keyframes openConcept{
  100%{opacity: 1; transform: translate(0,0);}
}
@keyframes openConcept1{
  100%{opacity: 0; transform: translate(0,0);}
}
.openConcept .lh-fire-next{opacity: 1; visibility: visible; transform: translateY(0); transition-delay: 1s;}
.lh-fire-next.concept{right: 4vw; bottom: 5vw;}
.lh-concept-jiu{position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); display: flex; align-items: center; justify-content: center;}
.lh-concept-jiu .icon{width: 20vw; margin-right: 5.208333333333334vw;transition:cubic-bezier(0.215,.61,.355,1) .45s;opacity: 0; transform: translateX(-5vw);visibility: hidden;}
.lh-concept-jiu .text{width:59.895833333333336vw;}
.lh-concept-jiu .text dl{margin-top:1.3020833333333335vw;transition:cubic-bezier(0.215,.61,.355,1) .45s; visibility: hidden;opacity: 0;}
.lh-concept-jiu .text dl:nth-child(1){transform: translateY(-5vw);}
.lh-concept-jiu .text dl:nth-child(2){transform: translateY(5vw);}
.lh-concept-jiu .text dt{font-size: 2.4vw; font-weight: bold; float:left; width: 10.5vw; padding: .8vw 0; display: flex; align-items: center; justify-content: center; color:#fff; background: #01B3A5; border-radius: 20px;}
.lh-concept-jiu .text dd{background: #01B3A5; color:#fff; padding: 2vw; font-size: 1.4vw; border-radius: 20px;line-height: 2.5vw; margin-left:2vw; width: 45.83333333333333vw; float:left;}
.Concept1 .lh-concept-jiu .icon,.Concept1 .lh-concept-jiu dl:nth-child(1),.Concept1 .lh-concept-jiu dl:nth-child(2){opacity: 1; visibility: visible; transform: translate(0,0);}
.Concept1 .lh-fire-next{animation:conceptNext cubic-bezier(0.215,.61,.355,1) .45s forwards; animation-delay: 1s; right:9vw; bottom: 6vw;}
@keyframes conceptNext{
  100%{opacity: 1; visibility: visible; transform: translateY(0);}
}
.lh-fire-text.cause{font-size: 2vw; animation-play-state: paused; opacity: 0;}
.lh-cause-img{width: 30vw; margin:2vw auto;transition:cubic-bezier(0.215,.61,.355,1) .45s; opacity: 0; transform: scale(0.5); visibility: hidden;}
.lh-cause-ccont{width: 85vw; margin:auto; border:2px solid #01B3A5; font-size: 1.6vw; padding: 1.5vw; background: #fff; z-index: 2;transition:cubic-bezier(0.215,.61,.355,1) .45s; opacity: 0; visibility: hidden; transform: translateY(100%);}
.lh-cause{padding-top: 11vw;}
.lh-fire-next.cause{right: 10vw; bottom: 20vw;}
.openConcept .lh-fire-text.cause{opacity: 1;animation-play-state: running;}
.openConcept .lh-cause-img{opacity: 1; transform:scale(1); visibility: visible;}
.openConcept .lh-cause-ccont{opacity: 1; visibility: visible; transform: translateY(0);}
.lh-trait-item li{position: absolute; width:28.35820895522388vw; border:1px dashed #666666; background: #fff; border-radius: 10px; padding: 1vw; left:50%; top: 50%; transform: translate(-50%,-50%) scale(1.5); font-size: 1.2vw; height: 14.925373134328357vw; opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.openConcept .lh-trait-item li:nth-child(1){opacity: 1; visibility: visible; animation:traitli1 cubic-bezier(0.215,.61,.355,1) 1s forwards; animation-delay: 1s;}
@keyframes traitli1{
  0%{transform: translate(-50%,-50%) scale(1.5);}
  100%{transform: translate(-45vw,-18vw) scale(1);}
}
.openConcept .lh-trait-item li:nth-child(2){opacity: 1; visibility: visible; animation:traitli2 cubic-bezier(0.215,.61,.355,1) 1s forwards; transition-delay: 2s; animation-delay:3s;}
@keyframes traitli2{
  0%{transform: translate(-50%,-50%) scale(1.5);}
  100%{transform: translate(-50%,-18vw) scale(1);}
}
.openConcept .lh-trait-item li:nth-child(3){opacity: 1; visibility: visible; animation:traitli3 cubic-bezier(0.215,.61,.355,1) 1s forwards; transition-delay: 4s; animation-delay: 5s;}
@keyframes traitli3{
  0%{transform: translate(-50%,-50%) scale(1.5);}
  100%{transform: translate(16.5vw,-18vw) scale(1);}
}
.openConcept .lh-trait-item li:nth-child(4){opacity: 1; visibility: visible; animation:traitli4 cubic-bezier(0.215,.61,.355,1) 1s forwards; transition-delay: 6s; animation-delay: 7s;}
@keyframes traitli4{
  0%{transform: translate(-50%,-50%) scale(1.5);}
  100%{transform: translate(-31vw,0) scale(1);}
}
.openConcept .lh-trait-item li:nth-child(5){opacity: 1; visibility: visible; animation:traitli5 cubic-bezier(0.215,.61,.355,1) 1s forwards; transition-delay: 8s; animation-delay:9s;}
@keyframes traitli5{
  0%{transform: translate(-50%,-50%) scale(1.5);}
  100%{transform: translate(0,0) scale(1);}
}
.openConcept .lh-fire-next.trait{transition-delay: 10s;}
.lh-ask-a{width: 69.85074626865672vw; padding: 2vw; color:#fff; background: #01B3A5;font-size: 2.4vw; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%) scale(1.2); text-indent: 4.8vw;transition:cubic-bezier(0.215,.61,.355,1) .45s; opacity: 0; visibility: hidden;}
.lh-ask-a:before{content: ''; display: block; width: 101%; height: 105%; border:3px solid #01B3A5; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%);}
.lh-ask-b{width: 100%; height: 100%; padding:8vw 18vw; text-align: center; position: absolute; left:0; top:0;}
.lh-ask-b .title{display: inline-block; font-size: 2vw; color:#fff; padding: 1vw 3vw;background: #01B3A5; position: relative;transition:cubic-bezier(0.215,.61,.355,1) .45s; transform: translateY(-100%); opacity: 0; visibility: hidden;}
.lh-ask-b .title:before{content: ''; display: block; width: 102%; height: 115%; border:3px solid #01B3A5; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%);}
.lh-ask-item{margin-top: 4vw; margin-left:-10vw;}
.lh-ask-item li{width: 33.3%; float:left; padding-left:10vw;transition:cubic-bezier(0.215,.61,.355,1) .45s; opacity: 0; visibility: hidden; transform: scale(.3);}
.lh-ask-item li:nth-child(1){transition-delay: .1s;}
.lh-ask-item li:nth-child(2){transition-delay: .2s;}
.lh-ask-item li:nth-child(3){transition-delay: .3s;}
.openConcept .lh-ask-a{opacity: 1; visibility:visible; transform: translate(-50%,-50%) scale(1);}
.Ask1 .lh-ask-b.one .title,.Ask2 .lh-ask-b.two .title,.Ask3 .lh-ask-b.three .title{opacity: 1; visibility: visible; transform: translateY(0);}
.Ask1 .lh-ask-b.one .lh-ask-item li,.Ask2 .lh-ask-b.two .lh-ask-item li,.Ask3 .lh-ask-b.three .lh-ask-item li{opacity: 1; visibility: visible; transform: scale(1);}
.Ask1 .lh-fire-next.ask,.Ask2 .lh-fire-next.ask,.Ask3 .lh-fire-next.ask{opacity: 1; visibility: visible; transform: translateY(0); transition-delay: 1s;}
.lh-ask-b.three .lh-ask-item li{width: 100%;}
.lh-ask-b.two .lh-ask-item li{width:50%;}
.lh-ask-b.two .lh-ask-item li .icon{width:90%; margin:auto;}
.lh-ask-b.two .lh-ask-item li .ccont{width:100%; height: 300px; font-size: 16px; border:1px solid #01B3A5; background: #fff; padding: 10px;  margin-top:10px;}
.lh-safety-child li .title{position: relative;}
.lh-safety-child li .title:after{content: ''; display: block; width: 100%; height: 100%; background: rgba(0,0,0,.4); position: absolute; left:0; top:0; border-radius: 30px; opacity: 0;}
.lh-safety-child li.end .title:after{opacity: 1;}
.lh-tips.measure{width: 69.85074626865672vw; padding: 2vw; color:#fff; background: #01B3A5;font-size: 2.4vw; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); text-indent: 4.8vw;transition:cubic-bezier(0.215,.61,.355,1) .45s;white-space:normal;animation: tips1 cubic-bezier(0.215,.61,.355,1) 1s forwards;}
.lh-tips.measure:before{content: ''; display: block; width: 101%; height: 105%; border:3px solid #01B3A5; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%);}
@keyframes tips1{
  0%{transform: translate(-50%,-50%) scale(0);}
  100%{transform: translate(-50%,-50%) scale(1); opacity: 1; visibility:visible;}
}
.lh-measure-icon{width: 12vw; height: 12vw;background-position: center 0%; background-repeat: no-repeat; background-size: 100% 700%;animation-duration:.7s;animation-iteration-count:infinite;animation-timing-function:steps(6); animation-name: figure; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-measure-item li{position: absolute; left:50%; top:50%; transform: translate(-50%,-50%) scale(.6);transition:cubic-bezier(0.215,.61,.355,1) .45s; opacity: 0; visibility: hidden;}
.lh-measure-item li.on{cursor: pointer;}
.lh-measure-item li.on .jt{display: block;}
.lh-measure-item li.end .iconfont{display: block;}
.lh-measure-item li:nth-child(1){margin-top:-14vw;}
.lh-measure-item li:nth-child(2){margin-left:-20vw;}
.lh-measure-item li:nth-child(3){margin-top:14vw;}
.lh-measure-item li:nth-child(4){margin-left:20vw;}
.lh-measure-item li .name{width: 19.402985074626866vw; height:10.44776119402985vw; background: #01B3A5; border-radius: 6px; position: relative; color:#fff; font-size: 2vw; text-align: center; display: flex; align-items: center; justify-content: center;}
.lh-measure-item li .iconfont{font-size: 2.4vw; position: absolute; left:93%; top:50%; transform:translateY(-50%); color:#3ECEB5; display: none;}
.lh-measure-item li .iconfont:after{content: ''; display: block; width: 80%; height: 80%; border-radius: 50%; background: #fff; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); z-index: -1;}
.lh-measure-item li .name:before{content: ''; display: block; width: 103%; height: 105%; border:2px dashed #01B3A5; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); border-radius: 8px;}
.lh-measure-item li .jt{width: 5.6716417910447765vw; position: absolute; left:110%; top:50%; transform: translate(0,-50%); animation:fireJt1 linear 1s infinite; display: none;}
.lh-measure-item li .jt1{right:110%; left:initial;animation:fireJt3 linear 1s infinite;}
.lh-measure-ccont{width: 76.11940298507463vw; min-height: 22.388059701492537vw;text-align: justify; padding: 2vw; border-radius: 10px; background: #CCCCCC; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%) scale(0); font-size: 2vw; opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-measure-next{width: 11.194029850746269vw; float:right; margin-top:2vw; cursor: pointer;}
.Measure .lh-tips.measure{animation: tips1out cubic-bezier(0.215,.61,.355,1) 1s forwards;}
@keyframes tips1out{
  0%{transform: translate(-50%,-50%) scale(1); opacity: 1; visibility:visible;}
  100%{transform: translate(-50%,-50%) scale(0); opacity: 0; visibility: hidden;}
}
.Measure .lh-measure-icon{opacity: 1; visibility: visible;}
.Measure .lh-measure-item li{opacity: 1; visibility: visible; transform: translate(-50%,-50%) scale(1);}
.Measure .lh-measure-item li:nth-child(1){transition-delay: .1s;}
.Measure .lh-measure-item li:nth-child(2){transition-delay: .2s;}
.Measure .lh-measure-item li:nth-child(3){transition-delay: .3s;}
.Measure .lh-measure-item li:nth-child(4){transition-delay: .4s;}
.measureCcont .lh-measure-ccont{opacity: 1; visibility: visible; transform: translate(-50%,-50%) scale(1);}
.measureNext .lh-fire-next.measure{opacity: 1; visibility: visible; transform: translateY(0);}
.measureNext .lh-measure-icon{transform: scale(0);}
.lh-putout-tip{position: absolute; left:50%; top:7vw; font-size: 2vw; color:#fff; border-radius: 60px; background: #01B3A5; z-index: 3; padding: 8px 20px; transform: translate(-50%,0);}
.lh-putout{position: absolute; left:50%; top:55%; transform: translate(-50%,-50%); text-align: center; width: 100%;}
.lh-putout li{display: inline-block; position: relative; margin: 0 3vw;}
.lh-putout li .icon{width: 8.955223880597014vw; margin:auto;}
.lh-putout li .icon1{width: 14vw; margin:3vw auto 0;transition:cubic-bezier(0.215,.61,.355,1) .45s; cursor: pointer;}
.lh-putout-ccont{position: absolute; left:50%; top:53%; width: 100%; background: rgba(255,255,255,.9); padding: 2vw 0; text-align: center; transform: translate(-50%,-50%); opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s; z-index: 10;}
.lh-putout-ccont .name{display: inline-block; padding: 8px 10vw; font-size: 2.6vw; border-radius: 60px; font-weight: bold; background: #01B3A5; color:#fff;}
.lh-putout-ccont .ccont{width: 80%; padding: 2vw; color:#fff; border-radius: 20px; background:#01B3A5; font-size: 2vw; margin:2vw auto; text-align: left; text-indent: 4vw; min-height: 23vw; display: flex; align-items: center; justify-content: center;}
.lh-putout-ccont .next{width: 11.194029850746269vw; float:right; margin-right: 10%; cursor: pointer;}
.lh-putout li.on .icon1{transform: translateY(-17vw); cursor: auto;}
.openPutOut .lh-putout-ccont{opacity: 1; visibility: visible;}
.lh-escape{position: absolute; left:50%; top:58%; transform: translate(-50%,-50%); width: 100%;}
.lh-escape-item{text-align: center; margin: 1vw 0;}
.lh-escape-item li{width: 17.91044776119403%; position: relative; display: inline-block; padding: 0 1vw;}
.lh-escape-item li .icon{cursor: pointer;}
.lh-escape-item li.on .icon{cursor: auto;}
.lh-escape-item li .iconfont{position: absolute; right: 0; bottom: 0; color:#3ECEB5; font-size: 2vw; z-index: 1; opacity: 0;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-escape-item li .iconfont:after{content: ''; display: block; width: 80%; height: 80%; background:#fff; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); z-index: -1; border-radius: 50%;}
.lh-putout-ccont.escape{width: 95%; background:#01B3A5; padding: 2vw;}
.lh-putout-ccont.escape .icon{width: 50%;}
.lh-putout-ccont.escape .text{width: 50%; padding-left:2vw;}
.lh-putout-ccont.escape .name{padding: 0;}
.lh-putout-ccont.escape .ccont{min-height: 15vw; padding: 0; font-size: 1.2vw; margin:1.2vw auto; align-items: flex-start;}
.lh-escape-item li.on .iconfont{opacity: 1;}
.Meet .lh-safety-item li:nth-child(1){opacity: 0; visibility: hidden;}
.Meet .lh-safety-item li{transform: translateX(-20vw);}
.Meet .lh-safety-child li{animation: safetyLi cubic-bezier(0.215,.61,.355,1) 1s forwards;}
.lh-call-title{font-size: 4vw; color:#FF0000; text-align: center; font-weight: bold; transform: translateY(-100%); opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-call-a{text-align: center; margin-top:6vw;}
.lh-call-a>div{display: inline-block;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-call-a .icon{width: 43.28358208955223vw; margin: 0 1vw; transform: translateX(-20%); opacity: 0; visibility: hidden;}
.lh-call-a .icon1{width: 23vw; margin: 0 1vw; cursor: pointer;transform: translateX(20%); opacity: 0; visibility: hidden;}
.lh-call{position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); width: 100%;}
.openConcept .lh-call-title{opacity: 1; visibility: visible; transform: translateY(0);}
.openConcept .lh-call-a .icon{ transform: translateX(0); opacity: 1; visibility: visible; transition-delay: .45s;}
.openConcept .lh-call-a .icon1{ transform: translateX(0); opacity: 1; visibility: visible; transition-delay: .9s;}
.lh-call-next{font-size: 4vw; padding: 8px 6vw; cursor: pointer; border-radius: 10px; background: #FCE048; color:#906719; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%) scale(0); font-weight: bold; opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.callNext .lh-call-next{opacity: 1; visibility: visible;transform: translate(-50%,-50%) scale(1);}
.lh-callinter{position: absolute; left:50%; top:50%; transform:translate(-50%,-50%) scale(.5); background: #80BDD3; padding:2vw; width: 95%;transition:cubic-bezier(0.215,.61,.355,1) .45s; opacity: 0; visibility: hidden;}
.lh-callinter .icon,.lh-callinter .text{width: 50%}
.lh-callinter .text{padding-left:2vw; color:#fff;}
.lh-callinter .text .name{font-size: 2.5vw;}
.lh-callinter-item{border-top:1px dashed #fff;border-bottom:1px dashed #fff; position: relative; padding: .6vw 0; margin-top:1vw;}
.lh-callinter-item li{font-size: 1vw; cursor: pointer;}
.lh-callinter-item li h2{padding: .6vw 0; position: relative; overflow: hidden; line-height: 22px;}
.lh-callinter-item li i{width: 20px; height:20px; border-radius: 50%; border:3px solid #fff; display: block; float:left; margin-right: 1vw; position: relative;}
.lh-callinter-item li i:before{content: ''; display: block; width: 6px; height: 6px; border-radius: 50%; background: #FFFF00; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%);transition:cubic-bezier(0.215,.61,.355,1) .45s; opacity: 0;}
.lh-callinter-tip{position: absolute; left:0; top:110%; display: none; color:#FFFF33; font-size: 1.5vw;}
.lh-callinter-next,.lh-callinter-next1{width: 10vw; cursor: pointer; float:right; position: absolute; right: 2vw; bottom: 2vw;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.openConcept .lh-callinter{opacity: 1; visibility: visible;transform:translate(-50%,-50%) scale(1);}
.lh-callinter-item li.on i:before{opacity: 1;}
.lh-callinter-next1{opacity: 0; visibility: hidden; transform: translateY(100%);}
.lh-callinter-next1.on{opacity: 1; visibility: visible;transform: translateY(0);}
.lh-callinter-next.out{opacity: 0; visibility: hidden;transform: translateY(-100%);}
.lh-callinter-tip1{position: absolute; left:0; top:110%; display: none; color:#FFFF33; font-size: 1.5vw;}
.lh-callinter .icon.three{width: 20%;}
.lh-equipment-tips{font-size:5vw; color:red; position: absolute; left:0; top:30%; width: 100%; text-align: center; transform: scale(0); opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) 1s;}
.openConcept .lh-equipment-tips{opacity: 1; visibility: visible; transform: scale(1);}
.openConcept .lh-call-next.equipment{transform: translate(-50%,-50%) scale(1); opacity: 1; visibility: visible; border-radius: 20px; color:#663708; transition-delay: 1s;}
.lh-public-title{font-size: 1.5vw; color:#fff; padding:1.5vw; border-radius: 20px; background: #80BDD3; position: absolute; left:50%; top:6vw; transform: translate(-50%,-50%); opacity: 0; visibility: hidden; min-width: 90%; z-index: 3;}
.openConcept .lh-public-title{opacity: 1; visibility: visible;transform: translate(-50%,0);}
.lh-equipment-item{position: absolute; left:50%; top:58%; transform: translate(-50%,-50%); width: 100%; padding: 8vw;}
.lh-equipment-item li{float: left; width: 14.285714285714286%; padding: 1vw; position: relative; cursor: pointer;}
.lh-equipment-item li:last-child{width: 42.85714285714286%; padding:1vw 4vw;}
.lh-equipment-item li i{font-size: 2vw; color:#3ECEB5; position: absolute; left:50%; bottom: 20%; transform: translateX(-50%); opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-equipment-item li i:after{content: ''; display: block; width: 80%; height: 80%; border-radius: 50%; background: #fff; position: absolute; left:50%; top:50%; z-index: -1; transform: translate(-50%,-50%);}
.lh-equipment-item li i.cw{color:#FF6600;}
.lh-equipment-item li .title{padding: 4px 30px; border-radius:30px; background: #FF9966; color:#fff; display: inline-block; position: absolute; left:50%; top:15%; transform: translate(-50%,-50%); opacity: 0; visibility: hidden; white-space: nowrap;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-equipment-item li.end{cursor: auto;}
.lh-equipment-item li.end i{opacity: 1; visibility: visible;}
.lh-equipment-item li.end .title{opacity: 1; visibility: visible; transform: translate(-50%,0);}
.openConcept .lh-fire-next.equipment{opacity: 0; visibility: hidden; transform: translateY(100%); transition-delay: 0s;}
.equipmentNext .lh-fire-next.equipment{opacity: 1; visibility: visible; transform: translateY(0);}
.lh-equipment1-item{padding:8vw 6vw 0;}
.lh-equipment1-item li{width: 25%; float:left; padding: 5vw; display: flex; align-items: center; justify-content: center; cursor: pointer;}
.lh-equipment1-item li.end,.lh-equipment1-item li.pause,.lh-equipment1-item li.active{cursor: auto;}
.lh-equipment1-item li .title{border-radius: 30px; background: #FF9966; font-size: 1vw; text-align: center; color:#fff; padding: 6px 0; margin-bottom: 1vw;}
.lh-equipment1-item li .icon1{position: relative;}
.lh-equipment1-item li .shadow{position: absolute; left:0; top:0; opacity: 0;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-equipment1-text{padding: 0 5vw; margin-left:-2vw;}
.lh-equipment1-text li{ text-align: center; padding-left:2vw;}
.lh-equipment1-text li h3{padding: .5vw 0; border-radius: 30px; background: #80BDD3; color:#fff; font-size: 1vw; position: relative; }
.lh-equipment1-text.hover li{cursor: pointer;}
.lh-equipment1-text.hover li.end h3{cursor: auto;}
.lh-equipment1-text li h3 i{position: absolute; right: 0; top: 50%; transform: translateY(-50%); color:#3ECEB5; font-size: 2vw; opacity: 0;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-equipment1-text li h3 i:after{content: ''; display: block; width: 80%; height: 80%; border-radius: 50%; background: #fff; position: absolute; left:50%; top:50%; z-index: -1; transform: translate(-50%,-50%);}
.lh-equipment1-text li h3 i.cw{color:#FF6600;}
.lh-equipment1-item li.pause .shadow{opacity: 1;}
.lh-equipment1-text li.end h3 i{opacity: 1;}
.requipment2Next .lh-fire-next.equipment{opacity: 1; visibility: visible; transform: translateY(0);}
.lh-equipment3-fire{width: 17.01492537313433vw; height: 17.01492537313433vw;background-position: center 0%; background-repeat: no-repeat; background-size: 100% 700%;animation-duration:.7s;animation-iteration-count:infinite;animation-timing-function:steps(6); animation-name: figure;}
.lh-equipment3-a{width: 42.98507462686567vw; position: relative;}
.lh-equipment3-a .icon1{position: relative;}
.lh-equipment3-a img{position: absolute; right: 0; top:0;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-equipment3-a .icon2{z-index: 3;}
.lh-equipment3-a .icon3{z-index: 4;}
.lh-equipment3-a .icon4{z-index: 2; opacity: 0; transform:scale(0);}
.lh-equipment3{padding: 17vw 27vw 0 20vw;}
.lh-equipment3-fire{position:absolute; top:25vw; left:20vw;transition:cubic-bezier(0.215,.61,.355,1) .45s; transform-origin: center bottom;}
.lh-equpment3-item li{width:1.1940298507462688vw; height:1.1940298507462688vw; border-radius: 50%; background: #FFFF00; position: absolute;  z-index: 10; animation:equpment3Li linear 1s infinite;left:83%; top:5%; cursor: pointer;}
.lh-equpment3-item li:before,.lh-equpment3-item li:after{content: ''; display: block; width: 130%; height: 130%; border-radius: 50%; border:1px solid #FFFF00; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%);}
.lh-equpment3-item li:before{border-width:2px;}
.lh-equpment3-item li:after{width: 160%; height: 160%;}
.lh-equpment3-item li:nth-child(2){left:90%; top:1%;}
.lh-equpment3-item li:nth-child(3){left:46%; top:47%;}
@keyframes equpment3Li{
  0%,100%{transform:scale(1); opacity: 1;}
  50%{transform:scale(.5); opacity: 0;}
}
.lh-equpment3-item li.end{opacity: 0; visibility: hidden;}
.lh-equipment3-fire-item{opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s;}
.lh-equipment3-fire-item li{width:1.1940298507462688vw; height:1.1940298507462688vw; border-radius: 50%; background: #FF0000; position: absolute;  z-index: 10; animation:equpment3Li linear 1s infinite; left:50%; top:30%; cursor: pointer;}
.lh-equipment3-fire-item li:before,.lh-equipment3-fire-item li:after{content: ''; display: block; width: 130%; height: 130%; border-radius: 50%; border:1px solid #FF0000; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%);}
.lh-equipment3-fire-item li:nth-child(2){top:60%;}
.lh-equipment3-fire-item li:nth-child(3){top:90%;}
.equipmentFire .lh-equipment3-fire-item{opacity: 1; visibility: visible;}
.lh-equpment3-c{width:1.1940298507462688vw; height:1.1940298507462688vw; border-radius: 50%; background: #FFFF00; position: absolute;  z-index: 10; animation:equpment3Li linear 1s infinite;left:88%; top:-1%; visibility: hidden; cursor: pointer;}
.lh-equpment3-c:before,.lh-equpment3-c:after{content: ''; display: block; width: 130%; height: 130%; border-radius: 50%; border:1px solid #FFFF00; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%);}
.equipmentFire1 .lh-equpment3-c{visibility: visible;}
.lh-equipment3-a .icon2{transform-origin: 85% 5%;}
.equipmentFire2 .icon2{transform: rotate(5deg);}
.equipmentFire2 .icon4{transform:scale(1); opacity: 1;}
.equipmentFire2 .lh-equipment3-fire{transform: scale(0); transition-delay: .2s;}
.equipmentFire2 .lh-fire-next.equipment{opacity: 1; visibility: visible; transform: translateY(0); transition-delay: 1s;}
.lh-ligature{padding:0 5vw; margin-top:12vw; z-index: 2; position: relative;}
.lh-ligature-img{margin-left:-1vw;}
.lh-ligature-img li{padding-left: 1vw;}
.lh-ligature-img li .icon{cursor: pointer; position: relative;}
.lh-ligature-img li .icon:before{content: ''; display: block; width: 100%; height:100%; border:2px solid red; position: absolute; left:0; top:0;transition:cubic-bezier(0.215,.61,.355,1) .45s; opacity: 0;}
.lh-ligature-img li.on .icon:before{opacity: 1;}
.lh-ligature-img li.end .icon{cursor: auto;}
.lh-ligature-num{margin-top: 10vw;}
.lh-ligature-num span{width: 3vw; height: 3vw; border-radius: 50%; background: #FFCC00; color:#fff; display: flex; align-items: center; justify-content: center; font-size: 1.2vw; margin:auto;}
.lh-ligature-num.hover span{cursor: pointer;}
.lh-ligature-num li.end span{cursor: auto;}
.lh-line{position: absolute; left:0; top:0; width: 100%; height: 100%;}
.lh-ligature-img li.end .icon:before{opacity: 0;}
.lh-fire-next.reset{opacity: 0; visibility: hidden; transform: translateY(100%); transition-delay: 0s;}
.openConcept.lineEnd .lh-fire-next{opacity: 1; visibility: visible; transform: translateY(0);}
.lh-fighting{width: 90%; padding: 2vw; background: #80BDD3; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%);}
.lh-fighting .icon{width: 40%;}
.lh-fighting .text{width: 60%; padding-left:2vw; color:#fff;}
.lh-fighting .ccont{font-size: 1.5vw;}
.lh-fighting .next{width: 8.955223880597014vw; position: absolute; right: 2vw; bottom: 2vw; cursor: pointer;}
.lh-public-title.two{font-size: 1.5vw;}
.lh-ligature1-img{width: 15%;}
.lh-ligature1-num{width: 70%;}
.lh-ligature1-img li{margin:1.5vw 0;}
.lh-ligature1-img li .icon{color:#fff; font-size: 1.2vw; border-radius: 60px; background: #FFC003; padding:10px 0; text-align: center;transition:cubic-bezier(0.215,.61,.355,1) .45s; cursor: pointer;}
.lh-ligature1-num li{margin:.5vw 0; border:1px solid #4EC4F1; background: #fff; font-size:.9vw; position: relative;}
.lh-ligature1-num li span{padding: .6vw; display: block;}
.lh-ligature1-img li.on .icon{background: #BF9003; cursor: auto;}
.lh-ligature1-img li.end .icon{background: #FFC003; cursor: auto;}
.lh-fire-next.fighting1{position:absolute; right: 2vw; top:0; height: 100%; display: flex; align-items: center;}
.lh-fire-next.fighting1.reset{width: auto;}
.lh-fire-next.fighting1.equipment{width: 6vw;}
.lh-ligature1-num.hover li{cursor: pointer;}
.lh-ligature1-num.hover li.end{cursor: auto;}
.lh-ligature1-num li i{position: absolute; right: 0; top:0; width: 20px; height: 25px; line-height: 25px; text-align: center; color:#79B3C8; display: none; z-index: 2;}
.lh-fighting-layer{display: none;}
.lh-evcuate li{position: absolute; left:50%; top:45%; transform: translate(-50%,-50%) scale(0); opacity: 0; width: 41.7910447761194vw;transition:cubic-bezier(0.215,.61,.355,1) 1s;}
.lh-evacuate-next{width: 8.955223880597014vw; position: absolute; left:50%; top:75%; transform: translate(-50%,100%); opacity: 0; visibility: hidden;transition:cubic-bezier(0.215,.61,.355,1) .45s; cursor: pointer;;}
.Evacuate1 .lh-evcuate li:nth-child(1),.Evacuate2 .lh-evcuate li:nth-child(2),.Evacuate3 .lh-evcuate li:nth-child(3),.Evacuate4 .lh-evcuate li:nth-child(4),.Evacuate5 .lh-evcuate li:nth-child(5){transform: translate(-50%,-50%) scale(1); opacity:1;}
.Evacuate1 .lh-evacuate-next{transform: translate(-50%,0); opacity:1; visibility: visible; transition-delay: 1s;}
.Evacuate2 .lh-evcuate li:nth-child(2),.Evacuate3 .lh-evcuate li:nth-child(3),.Evacuate4 .lh-evcuate li:nth-child(4),.Evacuate5 .lh-evcuate li:nth-child(5){transition-delay: 1s;}
.Evacuate2 .lh-evcuate li:nth-child(1){transform: translate(-55vw,-20vw) scale(.5);}
.Evacuate3 .lh-evcuate li:nth-child(2){transform: translate(-32vw,-20vw) scale(.5);transition-delay: 0s;}
.Evacuate4 .lh-evcuate li:nth-child(3){transform: translate(-9vw,-20vw) scale(.5);transition-delay: 0s;}
.Evacuate5 .lh-evcuate li:nth-child(4){transform: translate(14vw,-20vw) scale(.5);transition-delay: 0s;}
.Evacuate2 .lh-evacuate-next{animation:evacuateNext linear 2s forwards;}
.Evacuate3 .lh-evacuate-next{animation:evacuateNext1 linear 2s forwards;}
.Evacuate4 .lh-evacuate-next{animation:evacuateNext2 linear 2s forwards;}
.Evacuate5 .lh-evacuate-next{animation:evacuateNext3 cubic-bezier(0.215,.61,.355,1) .45s forwards;}
@keyframes evacuateNext{
  0%,100%{transform: translate(-50%,0); opacity:1; visibility: visible;}
  10%,90%{transform: translate(-50%,100%); opacity: 0; visibility: hidden;}
}
@keyframes evacuateNext1{
  0%,100%{transform: translate(-50%,0); opacity:1; visibility: visible;}
  10%,90%{transform: translate(-50%,100%); opacity: 0; visibility: hidden;}
}
@keyframes evacuateNext2{
  0%,100%{transform: translate(-50%,0); opacity:1; visibility: visible;}
  10%,90%{transform: translate(-50%,100%); opacity: 0; visibility: hidden;}
}
@keyframes evacuateNext3{
  0%{transform: translate(-50%,0); opacity:1; visibility: visible;}
  100%{transform: translate(-50%,100%); opacity: 0; visibility: hidden;}
}
/*
*transition:cubic-bezier(0.215,.61,.355,1) .45s;
*/
@media screen and (max-width: 980px){
  .lh-hostory-item{height:45%; width:100%; transform: translateY(0); top:0; padding:70px 20px 0 0;}
  .lh-hostory-item li{padding-left:20px; margin-bottom: 20px;}
  .lh-hostory-cont{bottom: 50px; top:initial; padding:20px 30px;}
  .lh-hostory-cont{width:100%; height:50%; font-size:24px;}
  .lh-footer{ z-index: 1000;}
  .lh-text{font-size:12px; height: 35px; line-height: 35px; padding: 0 10px; cursor: pointer;}
  .lh-text-layer{font-size: 12px; line-height: 20px; padding: 15px; border-width:1px; z-index: 100 !important; position:fixed;}
  .Ios .lh-text-layer{padding: 15px 100px 15px 15px;}
  .lh-text:hover .lh-text-layer{display: none;}
  .home,.lh-footer .menu{padding: 0 10px; height: 35px; line-height: 35px; font-size:12px;}
  .home a{font-size: 12px;}
  .lh-footer{height: 50px; padding: 8px 10px;}
  .lh-music{line-height: 35px; margin-left:10px;}
  .lh-music .current,.lh-music .total{font-size:12px;}
  .lh-music .progress{width: 110px; height: 4px; margin-top:15px;}
  .home i{font-size:14px; margin-right:4px;}
  .lh-music .btn i{font-size:16px;}
  .person .head:after{top:-6px; left:4px; height: 6px; width:7px; border-width:2px; display: none;}
  .person .head:before{display: none;}
  .lh-share{display: none;}
  .lh-footer .menu i{float:left; margin-right: 4px; font-size:16px;}
  .menu-layer{width: 100vw; left:0; padding: 15px;}
  .lh-music .current{margin: 0 5px;}
  .lh-music .progress{width: 40px;}
  .lh-music .total{width: 38px; white-space: nowrap;}
  .lh-hostory-item li>div:hover:before{transform: translate(5px,5px);}
  .lh-texing-cont>div{width: 100%; height: 50%;}
  .lh-texing-cont>.lh-texing-r{left:0; top:0; height: calc(50% - 50px);}
  .lh-texing-cont>div.lh-texing-l{bottom: 50px; top:initial; }
  .lh-texing-r>div{padding-top:60px; }
  .lh-texing-img .icon,.lh-texing-a .icon{width: 30%; margin: 0;}
  .lh-texing-r>div.lh-texing-img{left:15px;}
  .lh-texing-a .icon{position:absolute; left:15px; top:60px;}
  .lh-texing-a .text{position: absolute; right:15px; top:60px; width:210px; height: 77px; margin-top:20px;}
  .lh-texing-l .btn>div span{width: 10vw;}
  .lh-texing-l .btn>div.btn1{height: 36%;}
  .lh-texing-l .btn>div.btn2{height: 16%; top:36%;}
  .lh-texing-l .btn>div.btn3{top:52%; height: 48%;}
  .lh-texing-l .btn>div.btn4{width: 9vw; height: 17%; left:50%; top:73%; transform: translateX(-50%);}
  .lh-uniq-jiu img{width: 50%;}
  .lh-hostory-cont .next{right:15px; bottom: 5px; width: 78px; height: 30px; line-height: 30px;}
  .course-progress{width:70px; height: 10px; line-height: 10px;margin: 12px 10px 0;}
  .lh-footer .course .pages{font-size: 12px;}
  .lh-footer .course{height: 35px; line-height: 35px; padding: 0 10px; font-size:12px;}
  .goOnBtn{width:100px;}
  .lh-homes{height: 100%; position: absolute;left:0; top:50%; width:100%; transform: translateY(-50%);} 
  .lh-index-bg{background-size:750px 422px;}
  .menu-layer dl dt{line-height: 18px;}
  .lh-evolution-box{width: 100%; height: 100%; position: relative; overflow: hidden;}
  .lh-texts{width: 260px!important; height: 56px!important; font-size: 12px!important; padding:10px 10px 10px 30px!important;}
  .lh-time{top:20px!important;}
  .lh-loaction-item li .btn span{width: 100%!important; display: block!important; font-size:12px!important; height:16px!important; line-height: 16px!important; margin-top:2px!important;}
  .lh-loaction-item li .btn{bottom: -28px!important;}
  #app{position: absolute;}
  .menu-layer .title{font-size:14px;}
  .course-progress em{line-height: 10px;transform: scale(.8);}
  .lh-history1932 .text{padding: 0 28vh !important;}
  .Ios .lh-nav{width:calc(90% - 60px) !important;}
  .Ios .lh-history-l{left:6% !important;}
  .Ios .lh-history-r{right:10%!important;}
  .Ios .lh-history-btn{left:48% !important;}
  .Ios .lh-history-a{left:48% !important;}
  .Ios .jx{right: 10%!important;}
  .lh-icon.icon1{width: 200px; height: 125px;margin:-50px 0 0 -250px;}
  .lh-icon.icon2{width: 200px;height: 160px;margin:-135px 0 0 -75px;}
  .lh-icon.icon3{width: 200px; height: 130px;    margin: 0 0 0 30px;}
  .feiji{width: 60px; height: 54px;}

  .lh-fire-text{top: 50px; font-size: 14px; height: 30px; line-height: 30px; padding: 0 20px;}
   .lh-fire-text:after{width: 20px; height: 30px;}
   .lh-fire-icon{width: 200px; height: 200px;}
  .lh-fire{top: calc(50% - 50px); z-index: -1;}
  .fire-jt{width: 50px;}
  .lh-fire-cont{bottom: 70px; padding: 20px; font-size: 16px;}
  .lh-fire-next{right: 20px; bottom: 70px; width: 80px;}
  .lh-fire-tj{bottom: 70px;}
  .lh-fire-tj li{width: 80px; margin: 0 10px;}
  .lh-tj-cont{width: 440px; z-index: 200; position: fixed;}
  .lh-fire-tj li i{bottom: 5px; font-size: 20px;}
  .lh-control-btn{width: 150px; height: 62px;}
  .lh-control{top:50px;}
  .lh-control .fire-jt{width: 30px; right:-30px; top:45%;}
  .lh-fire-box{width: 450px; height: 338px; top:-20px;}
  .lh-fire-next1{width: 70px; right: 20px; bottom: 70px;}
  .lh-safety-item li .icon{width: 80px;}
  .lh-safety-item{top:55px; left:53%;}
  .lh-safety-item li .jt{width: 50px; left:-50px;}
  .lh-safety-child li .title{width: 240px; padding: 6px 0; font-size: 16px;}
  .lh-safety-child li{margin: 15px 0;}
  .lh-safety-child li .jt{width: 30px;}
  .lh-tips{font-size: 60px;}
  .lh-concept .icon{width: 200px; margin-right: 20px;}
  .lh-concept .text{width: 400px;}
  .lh-concept .text .title{font-size: 18px; padding: 5px 20px;}
  .lh-concept .ccont{font-size: 14px; line-height: 20px; margin-top:20px; padding: 20px;}
  .lh-fire-next.concept{right:10px; bottom: 54px;}
  .lh-concept{top:42%;}
  .lh-concept-jiu .icon{width: 200px; margin-right: 30px;}
  .lh-concept-jiu .text dt{font-size: 18px; width: 70px; padding: 4px 0;}
  .lh-concept-jiu .text dd{padding: 10px; font-size: 14px; line-height: 20px; margin-left:10px; width: 300px;text-align: justify;}
  .lh-concept-jiu .text dd>div{height: 100px; overflow-y: auto;}
  .lh-concept-jiu .text{width: 400px;}
  .lh-concept-jiu{top:42%;}
  .lh-concept-jiu .text dl{margin-top:10px;}
  .lh-fire-text.cause{font-size: 12px;}
  .lh-cause{padding-top:80px;}
  .lh-cause-img{width: 150px; margin: 10px auto;}
  .lh-cause-ccont{width: 500px; border-width:1px; font-size: 14px; padding: 10px; line-height: 16px;}
  .lh-fire-next.cause{right: 10px; bottom: 60px;}
  .lh-trait-item li{width: 90%; height: auto; padding: 5px; font-size: 12px;transform:translate(-50%,-50%) scale(1.1);}
  @keyframes traitli1{
    100%{transform:translate(-50%,-145px) scale(1);}
  }
  @keyframes traitli2{
    100%{transform:translate(-50%,-110px) scale(1);}
  }
  @keyframes traitli3{
    100%{transform:translate(-50%,-60px) scale(1);}
  }
  @keyframes traitli4{
    100%{transform:translate(-50%,-10px) scale(1);}
  }
  @keyframes traitli5{
    100%{transform:translate(-50%,40px) scale(1);}
  }
  .lh-ask-a{width: 400px; padding: 15px; font-size: 16px; line-height: 24px;}
  .lh-ask-a:before{width: 102%; height: 110%; border-width: 2px;}
  .lh-ask-b{padding: 14vw 27vw;}
  .lh-ask-b .title{font-size: 16px;padding: 5px 10px;}
  .lh-ask-b .title:before{width: 103%; height: 126%; border-width: 2px;}
  .lh-tips.measure{width: 400px; padding: 20px; font-size:16px; text-indent: 24px;}
  .lh-tips.measure:before{width: 102%; height: 108%; border-width:1px;}
  .lh-measure-icon{width: 100px; height: 100px;}
  .lh-measure-item li .name{width: 120px; height: 70px; font-size: 16px;}
  .lh-measure-item li .jt{width: 30px;}
  .lh-measure-item li:nth-child(1){margin-top:-85px;}
  .lh-measure-item li:nth-child(2){margin-left:-120px;}
  .lh-measure-item li:nth-child(3){margin-top:100px;}
  .lh-measure-item li:nth-child(4){margin-left:120px;}
  .lh-measure-item li .name:before{width: 105%; height: 109%; border-width:1px;}
  .lh-measure-ccont{width: 450px; min-height: initial; padding: 20px; font-size: 14px; z-index: 3;}
  .lh-measure-item li{z-index: -1;}
  .lh-measure-next{width: 60px; margin-top:20px;}
  .lh-measure-item li .iconfont{font-size: 24px; left:90%;}
  .lh-putout-tip{top:60px; font-size: 18px;}
  .lh-putout li .icon{width: 50px;}
  .lh-putout li .icon1{width:80px;}
  .lh-putout li .icon1{margin: 20px auto 0;}
  .lh-putout li.on .icon1{ transform: translateY(-97px);}
  .lh-putout-ccont .name{font-size: 16px; padding: 8px 30px;}
  .lh-putout-ccont .ccont{padding: 20px; font-size: 14px; margin: 10px auto; text-indent: 24px; min-height: initial;}
  .lh-putout-ccont .next{width: 60px;}
  .lh-callinter .text .name{font-size: 14px;}
  .lh-callinter-item{padding: 10px 0; margin-top:10px;}
  .lh-callinter-item li{font-size: 14px;}
  .lh-callinter-item li h2{padding: 5px 0; line-height: 14px; line-height: 20px;}
  .lh-callinter-item li i{margin-right: 10px; width: 14px; height: 14px; border-width: 2px; margin-top:4px;}
  .lh-callinter-item li i:before{width: 4px; height: 4px;}
  .lh-callinter-next, .lh-callinter-next1{width: 60px;}
  .lh-callinter-tip,.lh-callinter-tip1{font-size: 12px;}
  .lh-callinter-item li span{float:left; width: calc(100% - 24px);}
  .lh-call-title{font-size: 24px;}
  .lh-call-a{margin-top:30px;}
  .lh-call-a .icon{width: 200px;}
  .lh-call-a .icon1{width: 105px;}
  .lh-call-next{font-size: 24px; padding: 8px 30px;}
  .lh-escape-item li{width: 13%;}
  .lh-putout-ccont.escape .icon{width: 40%;}
  .lh-putout-ccont.escape .text{width: 60%; padding-left:15px;}
  .lh-putout-ccont.escape{padding: 15px; }
  .lh-putout-ccont.escape .ccont{font-size: 12px; margin: 10px 0; min-height: initial; width: 100%; line-height: 16px; height: 112px; overflow-y: scroll;}
  .lh-escape-item li .iconfont{font-size: 24px;}
  .lh-putout-tip{top: 50px; width:80%; font-size: 16px;}
  .lh-putout-ccont{top:56%;}
  .lh-equipment-tips{font-size: 32px;}
  .lh-equipment-tips{top:20%;}
  .lh-public-title{font-size: 14px; padding:5px 10px; top:50px;}
  .lh-equipment-item{top:58%; padding: 0 13vh;}
  .lh-equipment-item li .title{font-size: 12px; padding: 2px 10px; top:10px;}
  .lh-equipment-item li i{font-size: 18px; bottom:12%;}
  .lh-equipment-item li.end .title{transform: translate(-50%,0) scale(.6);}
  .lh-equipment1-item{padding:100px 15% 0;}
  .lh-equipment1-item li{padding: 0 6%; position: relative;}
  .lh-equipment1-item li .title{white-space: nowrap; padding: 0 10px; position: absolute; left:50%; top:0; transform: translateX(-50%); z-index: 2; font-size: 12px;}
  .lh-equipment1-text{padding: 0 10%; margin-top:20px;}
  .lh-equipment1-text li h3{padding: 4px 0; font-size: 14px;}
  .lh-equipment1-text li h3 i{font-size:20px;}
  .lh-equipment3{padding: 15% 27% 0 20%;}
  .lh-equipment3-fire{width: 150px; height: 150px; top:35%; left:20%;}
  .lh-equipment3-a{width: 300px;}
  .lh-equpment3-item li,.lh-equipment3-fire-item li,.lh-equpment3-c{width: 12px; height: 12px;}
  .lh-ligature{margin-top:12%;}
  .lh-ligature-img li{padding-left:10px;}
  .lh-ligature-num span{width: 30px; height: 30px; font-size: 16px;}
  .lh-ligature-num{margin-top: 13%;}
  .lh-fighting{padding: 15px;}
  .lh-fighting .text{padding-left:15px;}
  .lh-fighting .ccont{font-size: 14px;}
  .lh-fighting .next{width: 60px;}
  .lh-ligature1-img li{margin:6px 0;}
  .lh-ligature1-img li .icon{font-size: 12px; padding: 4px 0;}
  .lh-ligature1-num li{margin:5px 0; font-size: 12px;}
  .lh-ligature1-num li span{padding: 0 15px; line-height: 25px; height: 25px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
  .lh-ligature1-num li i{display: block;}
  .lh-fighting-layer{position: fixed; left:50%; top:50%; transform: translate(-50%,-50%); width: 90%; padding: 15px; background: #fff; font-size: 16px; display: none; z-index: 1000; min-height: 50%; align-items: center;}
  .lh-fighting-layer.on{display: flex;}
  .lh-fighting-layer i{position: absolute; right: 0; top:-40px; width: 40px; height: 40px; text-align: center; line-height: 40px; color:#80BDD3; font-size: 24px;}
  .lh-layer-shadow{z-index:999; position: fixed; left:0; top:0; width: 100%; height: 100%; background: rgba(0,0,0,.6); display: none;}
  .lh-layer-shadow.on{display: block;}
  .lh-public-title.two{font-size: 14px;}
  .lh-evacuate-next{width: 60px;}
  .lh-evcuate li{width: 220px;}
  .Evacuate2 .lh-evcuate li:nth-child(1){transform: translate(-76vw,-20vw) scale(.5);}
  .Evacuate3 .lh-evcuate li:nth-child(2){transform: translate(-44vw,-20vw) scale(.5);}
  .Evacuate4 .lh-evcuate li:nth-child(3){transform: translate(-12vw,-20vw) scale(.5);}
  .Evacuate5 .lh-evcuate li:nth-child(4){transform: translate(20vw,-20vw) scale(.5);}
  .lh-logo1{font-size: 14px; padding: 4px 8px 4px 4px;}
  .lh-logo1 img{width: 60px;}
  .Meet .lh-safety-item li{ transform: translateX(-37vw);}
  .lh-callinter-item.three li .lh-callinter-tip{left:105%; top:0; width:45%;}
  .lh-fire-next.fighting1.equipment{width: 8vw;}
  .lh-fire-tj li .jt{width:30px;}
  .lh-ask-b.two .lh-ask-item li .icon{width:60%;}
  .lh-ask-b.two .lh-ask-item li .ccont{height: 100px; font-size:14px;}
  .lh-ask-b.two .lh-ask-item li .ccont>div{overflow-y: scroll; height: 100%;}
}
@media screen and (max-width: 550px){
  .lh-homes{height: 100%; position: absolute;left:0; top:50%; width:100%; transform: translateY(-50%);} 
}
@media screen and (max-width: 375px){
  @keyframes traitli1{
    100%{transform:translate(-50%,-140px) scale(1);}
  }
  @keyframes traitli2{
    100%{transform:translate(-50%,-105px) scale(1);}
  }
  @keyframes traitli3{
    100%{transform:translate(-50%,-55px) scale(1);}
  }
  @keyframes traitli4{
    100%{transform:translate(-50%,12px) scale(1);}
  }
  @keyframes traitli5{
    100%{transform:translate(-50%,62px) scale(1);}
  }
  .lh-fire-next{right:10px; bottom: 60px;}
}
@media screen and (max-width: 340px){
  .course-progress{width:100px;}
}
@media screen and (max-height: 600px){
  .home, .lh-footer .menu{padding: 0 8px;}
  .course-progress{width: 50px;}
  .lh-footer .menu i,.home i{display: none;}
  .lh-footer .menu{margin-right: 5px;}
  .lh-footer .course,.lh-music,.lh-text{margin-left:5px;}
  .lh-concept .icon{width: 120px; margin-right: 10px;}
  .lh-concept .text{width: 300px;}
  .lh-concept .text .title{font-size: 16px;}
  .lh-concept .ccont{font-size: 12px; line-height: 18px; margin-top:10px; padding: 10px;}
  .lh-concept-jiu .icon{width: 100px; margin-right: 10px;}
  .lh-concept-jiu .text dd{font-size: 12px;}
  .lh-concept-jiu .text dt{font-size: 16px; width: 60px;}
  .lh-tips{font-size: 40px;}
  .lh-cause{padding-top:90px;}
  .lh-cause-img{width: 150px;}
  .lh-cause-ccont{width: 400px; font-size: 12px;}
  @keyframes traitli1{
    100%{transform:translate(-50%,-155px) scale(1);}
  }
  .lh-ask-b{padding: 20vw 25vw;}
  .lh-ask-item{margin-top:10vw;}
  .lh-putout-ccont .ccont{padding: 10px; margin: 10px auto;}
  .lh-putout-tip{text-align: center; width: 70%;}
  .lh-callinter .icon{width: 40%;}
  .lh-callinter .text{width: 60%;}
  .lh-callinter .text .name{font-size: 12px;}
  .lh-callinter-item{padding: 5px 0;}
  .lh-callinter-item li{font-size: 12px;}
  .lh-callinter-item li h2{line-height: 18px;}
  .lh-callinter-item li i{margin-top:2px;}
  .lh-ligature1-img{width: 20%;}
  .Fighting1 .lh-public-title{top:10px;}
}