/* header */
.header1{ margin:0; padding:0 ; width:100%; position:absolute; z-index:999; min-width:90rem;}
.headerLogo{ padding:0; margin: 25px 0 0 3.125%; width:155px; height:42px;}
.headerLogo a{ display:block; width:200px; height:45px; background:url(../images/indexlogo_2.png) no-repeat;}
.headerNav{ width: 24px; height: 24px; margin: 18px; position: relative; cursor: pointer;}
.headerNav p{ width: 100%; font-size: 12px; color: #fff; margin-top: 8px; text-align: center;}
.NavIcon-open{ width: 24px; height: 24px;  cursor: pointer;  position: relative; z-index: 1000;  }
.NavIcon-open.active { display: none; }
.NavIcon-open i{ width: 4px; height: 4px; position: absolute; background-color: #fff; transition: all 0.5s ease;}
.NavIcon-open1 i{ background-color: #fff;}
.NavIcon-open i.icon1{ top: 0; left: 0;}
.NavIcon-open i.icon2{ top: 0; left: 10px;}
.NavIcon-open i.icon3{ top: 0; left: 20px;}
.NavIcon-open i.icon4{ top: 10px; left: 0;}
.NavIcon-open i.icon5{ top: 10px; left: 10px;}
.NavIcon-open i.icon6{ top: 10px; left: 20px;}
.NavIcon-open i.icon7{ top: 20px; left: 0;}
.NavIcon-open i.icon8{ top: 20px; left: 10px;}
.NavIcon-open i.icon9{ top: 20px; left: 20px;}
.NavIcon-open:hover i.icon1{ top: 5px; left: 5px;}
.NavIcon-open:hover i.icon7{ top: 15px; left: 5px;}
.NavIcon-open:hover i.icon3{ top: 5px; left: 15px;}
.NavIcon-open:hover i.icon9{ top: 15px; left: 15px;}
.NavIcon-close{  width: 24px; height: 24px; position: relative; left: 44px; top: 44px; cursor: pointer; transition: 400ms; -webkit-transition: 400ms;}
.NavIcon-close { opacity: 0; transition: 0.4s 0s; -webkit-transition: 0.4s 0s; }
.open .NavIcon-close { opacity: 1; transition-delay: 400ms; -webkit-transition-delay: 400ms; }
.NavIcon-close i{ width: 4px; height: 4px; position: absolute; background-color: #ccc; transition: all 0.5s ease;}
.NavIcon-close i.icon1{ top: 0; left: 0;}
.NavIcon-close i.icon2{ top: 5px; left: 5px;}
.NavIcon-close i.icon3{ top: 0; left: 20px;}
.NavIcon-close i.icon4{ top: 15px; left: 5px;}
.NavIcon-close i.icon5{ top: 10px; left: 10px;}
.NavIcon-close i.icon6{ top: 5px; left: 15px;}
.NavIcon-close i.icon7{ top: 20px; left: 0;}
.NavIcon-close i.icon8{ top: 15px; left: 15px;}
.NavIcon-close i.icon9{ top: 20px; left: 20px;}
.NavIcon-close:hover { transform: rotate(720deg); -webkit-transform: rotate(720deg); -o-transform: rotate(720deg); -moz-transform: rotate(720deg); }

.overlay { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; bottom: 0px; right: 0px; z-index: 900; opacity: 0; visibility: hidden; background: transparent; -webkit-transition: 0.4s; -moz-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; backface-visibility: hidden; }
.headerNav-backdrop { position: fixed; overflow: hidden; width: 24px; height: 24px; overflow: hidden; right: 0; top: 0; z-index: 998; }
.headerNav-backdrop .headerNav-overlay { position: absolute; top: 0px; right: 0px; opacity: 0; border-radius: 50%; background-color: #000; width: 24px; height: 24px; }
.headerNav-backdrop.open { position: fixed; width: 580px !important; height: 100%; top: 0px; right: 0px;  }
.headerNav-backdrop.open .headerNav-overlay { opacity: 1; right: 15px; top: 15px; }

.menuInner{ position: fixed; width: 580px; padding: 0px ; height: 100%; top: 0; right: 0; opacity: 0; visibility: hidden; color: #fff; text-align: right; overflow: hidden; z-index: -1; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.menuInner .menu { padding-top: 14% ; }
.menu li{ width: 500px; float: left; margin: 20px 40px; overflow: hidden; }
.menu li a{ color: #ccc; line-height: 42px;}
.menu li p{ float: left; padding-left: 20px; font-size: 42px; width: 360px; text-align: left; text-transform: uppercase; font-weight: bold; position: relative; }
.menu li p i{ display: block; width: 100%; height: 2px; background-color: #e11c1c; position: absolute; margin-top: -1px; top: 50%; left: 0;  transform: translateX(-100%); transition: all 0.8s ease;}
.menu li span{ float: right; font-size: 18px; width: 120px; text-align: right;}
.menu li, .mcontact { transform: translateX(100px); -webkit-transform: translateX(100px); opacity: 0; transition: 0.4s 0s; -webkit-transition: 0.4s 0s; }
.menu-moible-handler { opacity: 0; transition: 0.4s 0s; -webkit-transition: 0.4s 0s; }
.menu li:nth-child(1) { transition-delay: 300ms; -webkit-transition-delay: 300ms; }
.menu li:nth-child(2) { transition-delay: 400ms; -webkit-transition-delay: 400ms; }
.menu li:nth-child(3) { transition-delay: 500ms; -webkit-transition-delay: 500ms; }
.menu li:nth-child(4) { transition-delay: 600ms; -webkit-transition-delay: 600ms; }
.menu li:nth-child(5) { transition-delay: 700ms; -webkit-transition-delay: 700ms; }
.menu li.on a,.menu li:hover a{ color: #fff;}
.menu li.on i,.menu li:hover i{ transform: translateY(0%); opacity: 1; }

.mcontact { transition-delay: 900ms; -webkit-transition-delay: 900ms; }
.mcontact { position: absolute; right: 0; bottom: 40px; width: 500px; height: 60px; padding: 0 40px ; text-align: left;  }
.mcontact .fl{ font-size: 16px; color: #fff; line-height: 30px;}
.mcontact .qq{ float: right; width: 30px; height: 30px; background: url(../images/iconcontact.png) no-repeat; margin: 15px 0;}
.mcontact .qq:hover{ background-position: 0 -30px;}


.mcontact .fl{ float: left;}
.mcontact .fr{ float: right;}

.open .menu li, .open .mcontact { transform: translateX(0); -webkit-transform: translateX(0); opacity: 1; }
.overlay.show { opacity: 1; visibility: visible; }
.menuInner.open { opacity: 1; z-index: 999991; visibility: visible; }

.header.fixed{position:fixed; z-index:98;}
/*.header.fixed .headerLogo a{ display:block; width:155px; height:42px; background:url(../images/indexlogo1_2.png) no-repeat;}*/


@-webkit-keyframes scaleUpDown {
    from { -webkit-transform: scale(1.08); transform: scale(1.08); }
    to { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
}
@keyframes scaleUpDown {
    from { -webkit-transform: scale(1.08); transform: scale(1.08); }
    to { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
}
@-webkit-keyframes empty {
    0% { opacity: 1; }
}
@-moz-keyframes empty {
    0% { opacity: 1; }
}
@keyframes empty {
    0% { opacity: 1; }
}