/*@import url("reset.css");*/
@charset "UTF-8";

#header{position: fixed; width: calc(100vw - 16px); height: auto; background: #fff;
transition: all 0.5s;
    -moz-transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s; z-index: 999;}
#header.nav_up{
  margin-top: -80px;
}

#header.is-inview{
  margin-top: 0px;
}


.headerBox{position:relative; height:85px; display: flex;
    align-items: center;}
.headerBox.container{padding: 0px 60px;}
.logoBox{display: block; position: relative;height:45px;
    margin-right: 10px;
    display: flex;
    align-items: center;
position: relative;
    width:80%;
}
.logoBox a{display: contents;}
.logoBox img{max-height: 100%;max-width: 100%; width: auto!important; height: auto!important;}
.navMenuactive{position: relative;}
.navMenu{position: absolute;
  display: block;
  z-index:1; height:85px; width:85px; background: var(--mainColor1); right: 0px; top: 0px;display: flex;
    align-items: center;
    justify-content: center;transition: all 0.5s;
    -moz-transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;}


.ph_menumain{
  display: block;
  position: fixed; width: 100%; height: 100vh; 
  padding-left:60px; padding-right:60px; 
  left: 0px; top: 0px;
  background: var(--mainColor1menubg);
  transform: translate(-168vw) rotate(-45deg);
  transition: 0.2s cubic-bezier(0.75, 0, 0.25, 1);
  -webkit-transform: translate(-168vw) rotate(-45deg);
  -webkit-transition: 0.2s cubic-bezier(0.75, 0, 0.25, 1);
  -moz-transform: translate(-168vw) rotate(-45deg);
  -moz-transition: 0.2s cubic-bezier(0.75, 0, 0.25, 1);
  -ms-transform: translate(-168vw) rotate(-45deg);
  -ms-transition: 0.2s cubic-bezier(0.75, 0, 0.25, 1);
  z-index: 9;

 /* -webkit-transform:translateX(100%);
    -moz-transform:translateX(100%);
    -ms-transform:translateX(100%);
    transform:translateX(100%);*/
    transition: all 0.5s;
    -moz-transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
 }
 .ph_menumain.active{
  transform: translate(0vw) rotate(0deg);
  transition: 0.2s cubic-bezier(0.75, 0, 0.25, 1);
  -webkit-transform: translate(0vw) rotate(0deg);
  -webkit-transition: 0.2s cubic-bezier(0.75, 0, 0.25, 1);
  -moz-transform: translate(0vw) rotate(0deg);
  -moz-transition: 0.2s cubic-bezier(0.75, 0, 0.25, 1);
  -ms-transform: translate(0vw) rotate(0deg);
  -ms-transition: 0.2s cubic-bezier(0.75, 0, 0.25, 1);
 }
 .ph_menumain .ph_navUl li.menubg{
  width: 100%; height: auto; margin-bottom:4vh;padding-right:100px;
}
.ph_menumain .ph_navUl li:last-child.menubg{ margin-bottom:0;}
 .ph_menumain .ph_navUl li.menubg.current .menuA{ color: #fff!important;}
 .ph_menumain .ph_navUl li.menubg .menuA{font-size:40px;font-weight: bolder;color: rgba(255, 255, 255, 1);position: relative;padding-top:5px;text-transform: uppercase;margin-left:45px; display:flex;line-height:1;}
 .ph_menumain .ph_navUl:hover li.menubg:hover .menuA{ color: rgba(255, 255, 255, 1);}
.ph_menumain .ph_navUl:hover li.menubg .menuA{
   color: rgba(255, 255, 255, 0.35);
}
   .ph_menumain .ph_navUl li.menubg .menuA.huicuren{
    color: rgba(255, 255, 255, 0.5);
  }
  .ph_menumain .ph_navUl li.menubg .menuA.currentco,
  /*.ph_menumain .ph_navUl li.menubg:first-child .menuA,*/
  .ph_menumain .ph_navUl li.menubg .menuA.current,
 .ph_menumain .ph_navUl li.menubg:hover .menuA{color: #fff!important;}
 .ph_menumain .ph_navUl li.menubg .menuA.current i.lineBg{
  content: ""; display: block; position: absolute; width: 18px; height: 3px; left: 0px; top: 0px; background: var(--hovermaincolormenu)!important;}

 .ph_menumain ul.ph_navUl{ flex-wrap:wrap;transform:translateX(0%);
    -webkit-transform:translateX(0%);
    -moz-transform:translateX(0%);
    -ms-transform:translateX(0%);
    transform:translateX(0%);
    transition: all 0.5s;
    -moz-transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
}

/*.ph_menumain li.menubg:first-child .menu_nav{display: block;}*/
 .ph_menumain .menu_nav{
  display: none; 
  top: 0px;
  right:0;
  position: absolute;
  margin-top:0px;
    transform:translateX(100%);
    -webkit-transform:translateX(100%);
    -moz-transform:translateX(100%);
    -ms-transform:translateX(100%);
    transition: all 0s;
    -moz-transition: all 0s;
    -webkit-transition: all 0s;
    -o-transition: all 0s;
}

.ph_menumain .ph_navUl li.menubg:hover .menuA i.lineBg ,
.ph_menumain .ph_navUl li.menubg .menuA.current i.lineBg {
    content: "";
    display: block;
    position: absolute;
    width:25px;
    height:4px;
    background: var(--hovermaincolormenu);
    top:0px;
    left:-45px;
  }
.link_wrap{position: relative;display: flex;    align-items: center; height: 35px;}
.link_wrap .link_item{ margin-left: 20px;position: relative;height:35px;}
/*.link_wrap .link_item:last-child{margin-left:30px;}*/
.link_wrap .link_item span#menu{height:40px;width:40px;}
.link_wrap .link_item #menu i{height:3px;}#menu.active i
.link_wrap a.linA{
   color: var(--mainColor1);
   line-height: 40px;
}
.link_wrap .link_Box {
    display: none;
    position: absolute;
    width: 100%;
    right: 0;
    top: 105%;
    padding: 15px 20px;
    text-align: left;
    background-color: var(--mainColor1);
}
.link_wrap .link_Box.SubsidiariesLinkBox{
  min-width: 100%;
  width: auto;
}
.link_wrap .link_Box.SubsidiariesLinkBox a{
  white-space: nowrap;
}
.link_wrap .link_Box a {
    display: block;
    line-height: 1.2;
    padding: 3px 0;
    color: #fff;
    font-size: 18px;
}
.link_wrap .link_Box a:hover{
  color: var(--hovermaincolormenu)!important;
}
.ph_menumain .menu_nav .menu_navsub a.current{color: #fff!important;}
.ph_menumain .menu_nav .menu_navsub a{position: relative; color: rgba(255, 255, 255, 1); display: block; width: 100%; height: auto; font-size:30px;padding-top:5px;margin:0 0 25px 40px;line-height: 1;}
.ph_menumain .menu_nav .menu_navsub:hover a:hover{ color: #fff!important;}
.ph_menumain .menu_nav .menu_navsub:hover a{
  color: rgba(255, 255, 255, 0.35);
}
.ph_menumain .link_wrap a.linA{font-size:18px; font-weight:bold;background:#fff; border-radius:20px; color: var(--mainColor1); padding:0px 20px;    line-height: 35px; display: block;}
.ph_menumain .link_wrap a.linA i{ font-size:18px; font-weight:bold; margin-left:3px}
.ph_menumain .scrollBox{margin:4vh 0px; position: relative; overflow-y: auto; height:100%;display:flex;
    /*align-items: center;*/}
  /* 设置滚动条的样式 */
.ph_menumain .scrollBox::-webkit-scrollbar {
    width:5px;
}
/* 滚动槽 */
.ph_menumain .scrollBox::-webkit-scrollbar-track {
  -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
  border-radius:10px;
}
/* 滚动条滑块 */
.ph_menumain .scrollBox::-webkit-scrollbar-thumb {
  border-radius:10px;
  background: rgba(0,0,0,0.5);
  -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.5);
}
.ph_menumain .scrollBox::-webkit-scrollbar-thumb:window-inactive {
  background:rgba(255,255,255,0.75);
}
.ph_menumain .scrollBox{
  outline:none;
  scrollbar-color: rgba(0,0,0,0.4) rgba(0,0,0,0.3);
 /* 第一个方块颜色，第二个轨道颜色(用于更改火狐浏览器样式) */
 scrollbar-thumb:rgba(0,0,0,0.3);
 scrollbar-width: thin;
 /* 火狐滚动条无法自定义宽度，只能通过此属性使滚动条宽度变细 */
}
 .ph_menumain .menu_nav .menu_navsub a i.lineBg{
    content: "";
    display: none;
    position: absolute;
    width:25px;
    height:4px;
    background: var(--hovermaincolormenu);
    top:0px;
    left:-40px;
 }
 .ph_menumain .menu_nav .menu_navsub a:hover i.lineBg{
   display: block;
 }
 .ph_linkbox{padding-left: 20px; position: absolute; top:40px; right: 220px;}
 .ph_linkbox a{width: 40px; height: 40px; border-radius: 50%; border:1px solid #fff; margin-right: 15px;display: flex;
    align-items: center;
    justify-content: center;}
   .ph_linkbox a i{color: #fff; font-size: 18px;}
  .ph_menumain .link_wrap .link_Box{background: #fff; }
  .ph_suslang{position: absolute;
    z-index: 8;
    right:120px; top:45px;}
  .ph_menumain .link_wrap .link_Box a{color: var(--mainColor1);}
  i.returnBtn{font-size: 16px; color: #fff; display: none; position: absolute; top: 0px; z-index: 6;}
  .phheaderBot{height:120px;}
  .ph_navBox{height:80%;margin-left: -45px;}
.ph_linkbox .qrBox{
  position: absolute;
  width: 120px;
      right: -27px;
    top: 35px;
  display: none;
}

@media (max-width:1660px){
  .ph_menumain .ph_navUl li.menubg .menuA{
    font-size: 38px;
  }
  .ph_menumain .menu_nav .menu_navsub a{ font-size: 28px;}
}

@media (max-width:1440px){
  .ph_menumain .ph_navUl li.menubg .menuA{
    font-size: 30px;
  }
  .ph_menumain .menu_nav .menu_navsub a{ font-size: 26px;}
}
@media (max-width: 1180px){
  .ph_menumain{height: 100%!important;}
  .ph_menumain .logoBox{display:none!important;}
  .ph_menumain ul.ph_navUl.active{
  transform:translateX(-100%);
    -webkit-transform:translateX(-100%);
    -moz-transform:translateX(-100%);
    -ms-transform:translateX(-100%);
}
    i.returnBtn{display: block;width: 100%;  height:30px; cursor:pointer; position:relative;}
	.phheaderBot{height:100px; padding: 0px 30px;justify-content: end;}
	.ph_suslang{top:33px;right:120px;}
    .ph_menumain li.menubg:first-child .menu_nav,
    .ph_menumain .menu_nav{
      display: none; 
      position: absolute;
        top:0px;
        left: 0px;
        width: 100%;
        transform:translateX(100%);
        -webkit-transform:translateX(100%);
        -moz-transform:translateX(100%);
        -ms-transform:translateX(100%);
        transition: all 0.5s;
        -moz-transition: all 0.5s;
        -webkit-transition: all 0.5s;
        -o-transition: all 0.5s;
    }
	 /*.ph_menumain .ph_navUl li.menubg .menuA{ color:#ffffff;}*/
	 
   	 
   .ph_menumain .menu_nav .menu_navsub a{width:inherit;}
.ph_menumain .menu_nav dl dt .menu_navsub{ display:inherit;}
    .ph_menumain li.menubg:first-child .menu_nav.active,
    .ph_menumain .menu_nav.active{
      display: block;padding-left:0;
    }
    .ph_menumain .ph_navUl li.menubg .menuA{margin-left: 35px; color:#ffffff !important; }
    .ph_menumain ul.ph_navUl{width: 100%;}
    .ph_menumain .menu_nav .menu_navsub a{font-size:24px; color:#ffffff !important; }	
    .ph_menumain .ph_navUl li.menubg{padding-right: 0px; margin-bottom:30px;}
    /*.scrollBox::after{
      content: "";
      display: block;
      position: absolute;
      height: 60px;
      width: 100%;
      bottom: 0px;
      right: 0px;
      background-image: linear-gradient(to top, var(--mainColor1), transparent);
      background-position: center;
      background-blend-mode: normal;
    }*/
	  .ph_menumain .menu_nav .menu_navsub a.current i.lineBg{
      content: "";
      display: block;
      position: absolute;
      width: 20px;
      height: 3px;
      background: var(--hovermaincolormenu);
      top: 0px;
      left: -25px;
   }
    .ph_menumain .scrollBox{    position: relative;display:inherit;
    overflow-y: auto;
    overflow-x: hidden;
    height: 100%;}
    .ph_menumain .scrollBox .scrollBoxMain { position: relative; height: 100%; width: 100%;  overflow-y: auto; overflow-x: hidden;}

    .headerBox.container{ padding: 0px 20px; }
  .ph_menumain{ padding: 0px 0px 0px 20px;}
  .ph_navBox{margin-left:0px;}
  .ph_linkbox{padding-left:0px; right:200px; left:auto;top:32px;}
  .ph_linkbox a{width: 35px; height: 35px;}

  .ph_menumain .menu_nav .menu_navsub a:hover i.lineBg{
      content: "";
      display: block;
      position: absolute;
      width: 20px;
      height: 3px;
      background: var(--hovermaincolormenu);
      top: 0px;
      left: -25px;
   }
   .ph_menumain .ph_navUl li.menubg.current .menu_nav{display: block;}

   .navMenuactive{
     position: absolute;
     height: 36px;
     width: 36px;
     right: 10px;
     top: 33px;
   }
  #menu.active{height: 36px;}
}
@media (max-width:680px){

  .menu_navsub a:hover{color: #fff!important};
    .ph_menumain .menu_nav .menu_navsub a{font-size:18px;margin:0 0 18px 30px;}
   /* .ph_suslang{position:relative; right: auto;top:25px;}
	.link_wrap{margin-left:10px;width: auto;}*/
  .ph_suslang{right: auto; left: 175px;}
  .ph_linkbox{ right: auto; left:50px;}
	.ph_linkbox a{margin-right:5px;}
	.phheaderBot{padding: 0px 0px;}
	.ph_menumain .ph_navUl li.menubg .menuA{ font-size:28px;margin-left: 30px;}   
	.ph_menumain .ph_navUl li.menubg:hover .menuA i.lineBg, 
    .ph_menumain .ph_navUl li.menubg .menuA.current i.lineBg{width:20px;height:3px;left:-30px;}
	.ph_menumain .menu_nav .menu_navsub a i.lineBg{width:20px;height:3px;left:-30px;}
   /* .ph_menumain li.menubg:first-child .menu_nav, .ph_menumain .menu_nav{ top: 0px; height: 100%; overflow-x: hidden; overflow-y: auto; padding-right: 20px;}
	.ph_linkbox { padding-left: 30px; bottom: 0px;}
 	.ph_menumain .ph_navBox{position: relative; width:100%; height: calc(100% - 130px); overflow-x: hidden;}*/
  	.ph_menumain .scrollBox{padding: 2vh 0px 2vh 0px; margin: 0px;}
  	/*.ph_menumain ul.ph_navUl{height:80vh;}*/
  	.link_wrap .link_Box.SubsidiariesLinkBox{width: 275px; left: 0;}
	.link_wrap .link_item:last-child{margin-left:0px;}
 	.ph_menumain .link_wrap .link_Box a{white-space:inherit; display: block;}
  .ph_menumain .menu_nav .menu_navsub a{font-size: 18px;}
}