﻿



.header{padding-left: 5%; background: #fff;position: fixed;z-index: 1502;}

/* TOP-menu */

/*导航END*/
.menutog{width:84px;height:84px;position:fixed;right: 0; top:0;background: #005bac; cursor:pointer;z-index:1511}
/* TOP-menu */
.menutog {text-indent: 100%;white-space: nowrap;}
.menuBtn{width:84px; height:48px; bottom:21px; position:absolute; z-index:1092; cursor:pointer;}
.menuBtn .line{-webkit-transition:300ms;-moz-transition:300ms;transition:300ms; width:26px; height:2px; margin:0 0 0 -13px; border-radius:10px; background:#fff; position:absolute; left:50%;}
.menuBtn .line1{ -webkit-transition:300ms 50ms;-moz-transition:300ms 50ms;transition:300ms 50ms; top:12px;}
.menuBtn .line2{ -webkit-transition:300ms 100ms;-moz-transition:300ms 100ms;transition:300ms 100ms; top:22px;width: 35px;left: 41%;}
.menuBtn .line3{ -webkit-transition:300ms 150ms;-moz-transition:300ms 150ms;transition:300ms 150ms; top:32px;}
.menuBtn .line4{ -webkit-transition:300ms 50ms;-moz-transition:300ms 50ms;transition:300ms 50ms; top:22px; opacity:0; margin:-21px 0 0 -37px; -webkit-transform:rotate(45deg);-moz-transform: rotate(45deg);transform: rotate(45deg);background:#fff;}
.menuBtn .line5{ -webkit-transition:300ms;-moz-transition:300ms;transition:300ms; top:22px; opacity:0; margin:-21px 0 0 4px;-webkit-transform:rotate(-45deg);-moz-transform: rotate(-45deg);transform: rotate(-45deg);background:#fff;}
.menuBtnShow .line1{ -webkit-transition:300ms;-moz-transition:300ms;transition:300ms; opacity:0; margin:0 0 0 -41px;}
.menuBtnShow .line2{ -webkit-transition:300ms 50ms;-moz-transition:300ms 50ms;transition:300ms 50ms; opacity:0; margin:0 0 0 7px;}
.menuBtnShow .line3{ -webkit-transition:300ms 100ms;-moz-transition:300ms 100ms;transition:300ms 100ms; opacity:0; margin:0 0 0 -41px;}
.menuBtnShow .line4{ -webkit-transition:300ms 200ms;-moz-transition:300ms 200ms;transition:300ms 200ms; opacity:1; margin:0 0 0 -13px;}
.menuBtnShow .line5{ -webkit-transition:300ms 250ms;-moz-transition:300ms 250ms;transition:300ms 250ms; opacity:1; margin:0 0 0 -13px;}
.menuBtnShow{background: #0F0E0E;}



.lh-nav-toggle{position:fixed; left:0; top:0; width:100vw; height:100vh; z-index:1503; background:#0F0E0E; transition:ease .65s; opacity:0; visibility:hidden;}
.lh-nav-img{width:28%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; float:left; transform:translateX(-100%); transition:ease .65s;}
.lh-nav-item{float:right; width:72%; height:100%; display:flex; align-items:center; justify-content:flex-end; padding: 0px 2%}
.lh-nav-item>div{display:flex; width:100%;}
.lh-nav-item dl{float:left; flex:1;}
.lh-nav-item dl:nth-child(1){width: 7%;}
.lh-nav-item dl dt a{font-size:18px; color:#fff; position:relative;}
.lh-nav-item dl dt a:before{content:''; display:block; width:0; height:2px; background:#76caff; float:left; margin-right:5px; position:relative; top:16px; transform-origin:left center; transition:ease .65s;}
.lh-nav-item dl dt a:hover{color:#76caff;}
.lh-nav-item dl dt a:hover:before{width:20px;}
.lh-nav-item dl dt{margin-bottom:30px; opacity:0;}
.lh-nav-item dl dd{line-height:48px; opacity:0;}
.lh-nav-item dl dd a{color:#cccccc; font-size:16px; position:relative;font-weight: normal; display: block; overflow: hidden; line-height: 20px; padding: 14px 0;}
.lh-nav-item dl dd a:before{content:''; display:block; width:0; height:1px; background:#76caff; float:left; margin-right:5px; position:relative; top:10px; transform-origin:left center; transition:ease .65s;}
.lh-nav-item dl dd a:hover{color:#76caff;}
.lh-nav-item dl dd a:hover:before{width:20px;}
.lh-config-img{width:100%; height:100%; position:absolute; left:0; top:0;}
.lh-config-img .item{background-size:cover; background-repeat:no-repeat; background-position:center center; position:absolute; left:0; top:0; width:100%; height:100%; visibility:hidden; opacity:0; transition:ease 1s; transform:scale(1.2);}
.lh-config-img .item.on{visibility:visible; opacity:1; transform:scale(1);}


.nav2 .lh-nav-btn h2 em{opacity:1; visibility:visible;}
.nav2 .lh-nav-btn h2 span{opacity:0; visibility:hidden;}
.nav2 .lh-nav-btn>span:before{transform:scaleX(0);}
.nav2 .lh-nav-btn i:before{transform:translate(0,10px) rotate(45deg); width:80%;}
.nav2 .lh-nav-btn i:after{transform:translate(0,-10px) rotate(-45deg); width:80%;}
.nav2 .lh-nav-toggle{visibility:visible; opacity:1;}
.nav2 .lh-nav-img{transform:translateX(0);}
.nav2 .lh-nav-item dl dt{animation:fadeInRight linear .35s forwards;}
.nav2 .lh-nav-item dl dd{animation:fadeInUp linear .35s forwards; animation-delay:.1s;}
.nav2 .lh-nav-item dl dd:nth-child(1){animation-delay:.2s;}
.nav2 .lh-nav-item dl dd:nth-child(2){animation-delay:.3s;}
.nav2 .lh-nav-item dl dd:nth-child(3){animation-delay:.4s;}
.nav2 .lh-nav-item dl dd:nth-child(4){animation-delay:.5s;}
.nav2 .lh-nav-item dl dd:nth-child(5){animation-delay:.6s;}
.nav2 .lh-nav-item dl dd:nth-child(6){animation-delay:.7s;}
.nav2 .lh-nav-item dl dd:nth-child(7){animation-delay:.8s;}
.nav2 .lh-nav-item dl dd:nth-child(8){animation-delay:.9s;}
.nav2 .lh-nav-item dl dd:nth-child(9){animation-delay:1.0s;}
.nav2 .lh-nav-item dl dd:nth-child(10){animation-delay:1.1s;}


