﻿ #weixin{width: 90px;height: 86px;bottom:80px;left:2px;}
.muclose{width: 42px;height: 40px;border:1px solid #fff;padding: 6px 4px 0 4px;position: absolute;right: 40px;top:15px;text-

align: center;}
.muclose img{width: 26px;}
.dddd{margin:44px 0px 44px -3px;position: absolute;z-index:2000;width:40px;text-align: center;font-family: 微软雅

黑;color:#fff;font-size:12px;}

@media (max-width: 1024px) {
.dddd{margin:44px 0px 44px -3px;position: absolute;z-index:2000;width:40px;text-align: center;font-family: 微软雅

黑;color:#fff}
}
#loadhome{
  width: 100%;
  height: 100%;
  background: #fff;
  position: absolute;
 z-index: 80000;
}
#wrapper{
    position: relative;
    width:200px;
    height:2px;
    border:1px solid darkgray;
    position: absolute;
    z-index: 90000;left:50%;
    margin-left: -100px;
    top:50%;
}
#progressbar{
    position: absolute;
    top:50%;
    left:50%;
    margin-left:-101px;
    margin-top:-2px;
    width:182px;
    height:2px;


}
/*在进度条元素上调用动画*/
#fill{
    animation: move 2s;
    text-align: center;
    background-color: #000; height:4px;
}
/*实现元素宽度的过渡动画效果*/
@keyframes move {
    0%{
        width:0;

    }
    100%{
        width:100%;
    }
}

 @media screen ( max-width: 1068px ) and (min-width: 768px) {
 .dddd{margin:44px 0px 44px -3px;}
 }
 
@media screen and (max-width: 767px) and (min-width: 200px){
 .dddd{margin:44px 0px 44px -7px;}
 }
#pab2 .swiper-wrapper .swiper-slide{width: 100%;}
#Hamburger{ position: absolute;z-index: 30000;top:15px;right:40px;}
.nglogo{position: absolute;margin-top: 20%;width: 300px;left: 50%;margin-left: -150px}
.nglogo img{width: 300px;}
.hplogo{margin-top: 15%;}
.hplogo img{width: 200px;}
#HomeRight{width: 20vw;}
#HomeLeft{width: 20vw;}
#HomeRight .swiper-wrapper  .swiper-slide{  
-webkit-transform: skew(7deg);
  -moz-transform:skew(7deg) 
  transform:skew(7deg);
}
#HomeLeft .swiper-wrapper  .swiper-slide{  
-webkit-transform: skew(7deg);
  -moz-transform:skew(7deg) 
  transform:skew(7deg);

}
#HomeRight .swiper-wrapper  .swiper-slide figure{margin-left:-53px;}
#HomeLeft .swiper-wrapper {margin-left:68px;}
.pad21{background-image: url(../images/2.jpg);width: 100%;}
.pad22{background-image: url(../images/3.jpg);width: 100%;}
.pad23{background-image: url(../images/4.jpg);width: 100%;}
.pad24{background-image: url(../images/7.jpg);width: 100%;}
.pad26{background-image: url(../images/6.jpg);width: 100%;}
.pad27{background-image: url(../images/7.jpg);width: 100%;}

.pad31{background-image: url(../images/ph3.jpg);width: 100%;}
.pad32{background-image: url(../images/ph4.jpg);width: 100%;}
.pad33{background-image: url(../images/11.jpg);width: 100%;}
.pad34{background-image: url(../images/ph2.jpg);width: 100%;}
.pad36{background-image: url(../images/ph6.jpg);width: 100%;}
.pad37{background-image: url(../images/ph7.jpg);width: 100%;}


@media (max-width: 1360px) {
#HomeLeft {margin-left:-15px;}
#HomeRight {margin-right:-17px;}
}
@media (max-width: 1199px) {
.pad21{background-image: url(../images/21.jpg);}
.pad22{background-image: url(../images/31.jpg);}
.pad23{background-image: url(../images/41.jpg);}
.pad24{background-image: url(../images/61.jpg);}
.pad26{background-image: url(../images/61.jpg);}
.pad27{background-image: url(../images/71.jpg);}
.Center22{width:120px;margin-left:-90px;position: absolute;margin-top:50px;left:50%;text-align: center;}
.Center23{width:120px;margin-left:-90px;position: absolute;margin-top:50px;left:50%;text-align: center;}
.rotate-style{width:100%;text-align: center;}
.pad31{background-image: url(../images/ph3.jpg);}
.pad32{background-image: url(../images/ph4.jpg);}
.pad33{background-image: url(../images/3p_1.jpg);}
.pad34{background-image: url(../images/ph2.jpg);}
.pad36{background-image: url(../images/ph6.jpg);}
.pad37{background-image: url(../images/ph7.jpg);}

.nglogo{position: absolute;margin-top: 80%;width: 300px;left: 50%;margin-left: -150px;}
.nglogo img{width: 200px;}
.hplogo{margin-top: 60%;}
#HomeRight .swiper-wrapper  .swiper-slide{  
-webkit-transform: skew(0deg);
  -moz-transform:skew(0deg) 
  transform:skew(0deg);
}
#HomeLeft .swiper-wrapper  .swiper-slide{  
-webkit-transform: skew(0deg);
  -moz-transform:skew(0deg) 
  transform:skew(0deg);

}
#HomeLeft .swiper-wrapper {margin-left:0px;}
#HomeRight .swiper-wrapper  .swiper-slide figure{margin-left:0px;}
}

#heilogo{display:none;width:120px;margin-top:20px;margin-left:20px;position: absolute;z-index:20000;  text-indent: -1000px;  

pointer-events: initial;}
#bailogo{display:block;width:120px;margin-top:20px;margin-left:20px;z-index:20000;position: absolute;  text-indent: -1000px;  

pointer-events: initial;}
@media (max-width: 1199px){
#mlogo1{display:none;}
#mlogo2{display:none;}
#mlogo3{display:none;}
#heilogo{display:block;width:80px;position: absolute;  text-indent: -1000px;  pointer-events: initial;}
#bailogo{display:none;width:80px;position: absolute;  text-indent: -1000px;  pointer-events: initial;}
}
#m_logo3,#m_logo2,#m_logo1{dispaly:none}
.nav__trigger {
 border:1px solid #fff;
 }
.nav--active .nav__trigger {
  opacity: 1;border:1px solid #fff;
}
.nav__icon {  background-color: #fff;}
.nav__icon:before,
.nav__icon:after {
  background: #fff;}



.style-1 .nav--active .nav {

          transform: translateX(0);border:1px solid #fff;}


.style-1 .nav--active .nav__icon:before {

        background: #fff;
}
.style-1 .nav--active .nav__icon1:before {

        background: #fff;
}
.style-1 .nav--active .nav__icon:after {

  background: #fff;

}
.style-1 .nav--active .nav__icon1:after {

  background: #fff;
 
}

@media (max-width: 1024px) {
#HomeLeft {margin-left:0px;}

}