@font-face {
  font-family: "SourceHanSansCN-Heavy";
  src: url("/assets/fonts/SourceHanSansK-HeavySub.ttf") format('truetype');
}
@font-face {
  font-family: "SourceHanSansCN-Light";
  src: url("/assets/fonts/SourceHanSansK-LightSub.ttf") format('truetype');
}
@font-face {
  font-family: "WorkSans-Black";
  src: url("/assets/fonts/WorkSans-Black.ttf") format('truetype');
}
@font-face {
  font-family: "WorkSans-Bold";
  src: url("/assets/fonts/WorkSans-Bold.ttf") format('truetype');
}
@font-face {
  font-family: "WorkSans-Medium";
  src: url("/assets/fonts/WorkSans-Medium.ttf") format('truetype');
}


.SourceHanSansCN-Bold{font-family:"SourceHanSansCN-Bold";}
.SourceHanSansCN-Heavy{font-family:"SourceHanSansCN-Heavy";}
.SourceHanSansCN-Light{font-family:"SourceHanSansCN-Light";}
.WorkSans-Black{font-family:"WorkSans-Black";}
.WorkSans-Bold{font-family:"WorkSans-Bold";}
.WorkSans-Medium{font-family:"WorkSans-Medium";}

html,
body {
  color: #000;
  font-size: 12px;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
}

a,a:link,a:visited,a:hover,a:focus {
  text-decoration: none !important;
  color: #fff;
}
ul,li,p{
  padding:0;margin:0;list-style:none
}

.text_r{ text-align: right;}
.text_l{ text-align: left;}
.text_c{ text-align: center;}

.c_f:after{content:""; height:0px; width:0px;clear:both;display:block;overflow: hidden;}
.f_l{float: left;}
.f_r{float: right;}
.position_r{ position: relative;}
.position_a{ position: absolute;}
.nopadding{ padding: 0 !important;}
.nopadding-l{ padding-left: 0 !important;}
.nopadding-r{ padding-right: 0 !important;}
.animated{opacity:0}

#main{position: relative;box-sizing: border-box;}

.page{ overflow: hidden;position: relative; padding-left: 9vw;box-sizing: border-box; }

.page-content{ overflow: hidden;position: relative; max-width: 1744px; min-width: 870px; margin: 0 auto;box-sizing: border-box; padding: 0 83px; }
.swiper-slide{text-align: center;}
#body .leftnav-body,#body .logo-body .logo{background-color: #FF4D00;transition-duration: 1s;} 

#body{transition-duration: 1s;}
#leftnav .leftnav-body{ z-index: 100; min-width: 89px; width: 9vw;position: fixed;z-index: 100;height: 100%;left: 0px;top:0px; display: flex;align-items: center;height: 100%;justify-content:center;}
#leftnav .left-top-logo{ position: absolute; top:0px; width: 100%; text-align: center; padding-top: 30px;}
#leftnav .left-top-logo img{ width: 50%;}

#leftnav .hamburger{cursor: pointer;}
#leftnav .hamburger .line {width: 50px;height: 5px;border-radius: 5px; background-color: #ecf0f1;display: block;margin: 8px auto;-webkit-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
#leftnav #hamburger-1.is-active .line:nth-child(1) {-webkit-transform: translateY(13px) rotate(45deg);-ms-transform: translateY(13px) rotate(45deg); -o-transform: translateY(13px) rotate(45deg);transform: translateY(13px) rotate(45deg);}
#leftnav #hamburger-1.is-active .line:nth-child(2) {opacity: 0;}
#leftnav #hamburger-1.is-active .line:nth-child(3) {-webkit-transform: translateY(-13px) rotate(-45deg);-ms-transform: translateY(-13px) rotate(-45deg);-o-transform: translateY(-13px) rotate(-45deg);transform: translateY(-13px) rotate(-45deg);}

#leftnav .logo-body{  height: 100%;width: 0px;overflow: hidden; position: fixed;left: 0;top:0 ;background-color: rgb(255, 255, 255);z-index: 99;}
#leftnav .logo-body .logo-box{box-sizing: border-box; width: 63%;height: 100%;padding-left:9vw;display: inline-block;vertical-align: top;}
#leftnav .logo-body .logo{transition-duration: 1s;display: flex;justify-content: center; align-items: center;height: 100%;padding-right: 9vw;}
#leftnav .logo-body .logo img{width: 250px;}
#leftnav .logo-body .logo-nav{box-sizing: border-box; height: 100%; width: 36%;display: inline-block;vertical-align: top;padding: 100px;position: relative;}

#leftnav .logo-nav .lang{  text-align: right;}
#leftnav .logo-nav .lang a{ font-size:20px;color:#FF4D00; font-weight: bold;cursor: pointer;}
#leftnav .logo-nav .email{position: absolute;bottom: 8vh; font-size:25px;color:#FF4D00; font-weight: bold;right:100px; background-color: #fff;text-align: right;}
#leftnav .logo-nav .email span{ display: inline-block;}
#leftnav .logo-nav .nav-list{margin-top: 18vh; position: relative;}
#leftnav .logo-nav .nav-list .nav-item{text-align: right; margin-bottom: 25px;}
#leftnav .logo-nav .nav-list a{overflow: hidden; padding: 0 10px; color:#FF4D00;font-size: 25px;font-weight: bold; position: relative; display: inline-block;} 
#leftnav .logo-nav .nav-list .active a{color: #fff !important; background-color: #FF4D00;} 
#leftnav  .account.active img{filter:saturate(0%) brightness(300%); } 
#leftnav .logo-nav .nav-list .account img{height: 26px;transition-duration: 1s;vertical-align: middle;  }
.lang-en #leftnav .logo-nav .nav-list .account img{height: 31px;  }
.lang-en #leftnav .logo-nav .nav-list .account a{position: relative;right: -12px;}
#leftnav .logo-nav .nav-item a::after{content: "";left: 0;top:0; position: absolute;width: 100%;height: 100%; transform-origin: 100% 0;background: #fe3501;transform: translate3d(calc(-100% - 1px),0,0);} 
#leftnav .logo-nav .nav-item a:hover::after{
  transform-origin: 0 0;
  transform: translate3d(calc(100% + 1px),0,0);
  transition: transform .3s cubic-bezier(.32,.625,.58,1)
}




.footer-desc{color:#fff; display: flex;justify-content: space-between;align-items: flex-end;  border-top:1px solid rgba(255, 255, 255, 0.2);padding: 20px 0 85px; font-family:"WorkSans-Medium" ;}
.footer-desc .logo_bottom img{width: 50px;}
.footer-desc .footer-desc-item:nth-child(1){display: flex;justify-content: flex-start;align-items: flex-end;}
.footer-desc .footer-desc-item .user_agreement {margin-left: 1vw;}
.footer-desc .footer-desc-item .user_agreement a{display: inline-block;}
.footer-desc .footer-desc-item .user_agreement img{display: inline-block;vertical-align: middle;}
.fp-tableCell {display: block !important; overflow-y: auto; overflow-x: hidden;}

.topnav{z-index: 98; text-align: right; position: fixed;right: 101px;top:61px;  box-sizing: border-box;transition-duration: 1s;}
.topnav.up{top:-61px;}
.topnav .nav-list {display: inline-block; position: relative;}
.topnav .nav-list .nav-item { cursor: pointer; display: inline-block; vertical-align: middle; padding: 0 18px;font-weight: bold;position: relative;}
.topnav .nav-list .nav-item a{transition-duration: 1s; font-size: 20px; color: #FF4D00; }
.topnav .nav-list .nav-item.account img{height: 21px;transition-duration: 0.3s;position: relative;top:2px; vertical-align: top;}
.lang-en .topnav .nav-list .nav-item.account img{height: 24px;top:2px}
.topnav .nav-status{transition-duration: 0.3s;position: absolute; width: 0; background-color: #FF4D00;height: 5px;bottom:-10px ; left:120px; border-radius: 5px;}
.topnav .userloginstatus {display: inline-block; font-size: 14px;vertical-align: middle;color: #FF4D00;transition-duration: 1s;}
.topnav .userloginstatus .logout{cursor: pointer;}

.slogan-logo{ text-align: center; margin-top: 30vh;}
.slogan-logo .logo{ opacity: 0; display: inline-block;vertical-align: middle;position: relative; transition-duration: 1s; width: 16vw;}
.slogan-logo .logo img{ width: 16vw;}
.slogan-logo .slogan{vertical-align: middle; text-align: left; display: inline-block;opacity: 0; color:#FF4D00 ;font-size: 60px;font-weight: bold; margin-right:6vw;}


#site-loading{ position: fixed; left: 0; right: 0; top:0;bottom: 0; background-color: rgb(10, 1, 1);z-index: 1000;display: flex;justify-content: center; align-items: center;color: #fff;}
#site-loading p{ text-align: center;margin-top: 10px;}
#site-loading p i{
  display: inline-block;
  width: 8px;
  height: 8px;
  vertical-align: middle;
  box-sizing: border-box;
  margin: 0px;
 
}
#site-loading p i:nth-child(1){
  animation-delay: -0.32s;
}
#site-loading p i:nth-child(2){
  animation-delay: -0.64s;
}

.fp-viewing-army_men #leftnav .logo-body .logo { background-color: #1A9D0D;}
.fp-viewing-army_men #leftnav .logo-body .logo-nav a {color: #1A9D0D ;}
.fp-viewing-army_men #leftnav .logo-body .logo-nav .active a {background-color: #1A9D0D !important; color: #fff;}
.fp-viewing-army_men #leftnav .logo-body .logo-nav .email {color: #1A9D0D !important;}
.fp-viewing-army_men #leftnav .logo-body .logo-nav .nav-item a::after {background-color: #1A9D0D !important;}
.fp-viewing-army_men #leftnav .leftnav-body{ background-color: #1A9D0D;}
.fp-viewing-army_men .topnav .nav-list .nav-item a{ color: #fff;}
.fp-viewing-army_men .topnav .nav-status{ background-color: #fff;}
.fp-viewing-army_men .topnav .userloginstatus {display: inline-block; font-size: 14px;vertical-align: middle;color: #fff;}
.fp-viewing-army_men .topnav .nav-list .account img{filter:saturate(0) brightness(100);} 
.fp-viewing-army_men #leftnav  .account img{filter:saturate(70%) brightness(107%)  hue-rotate(81deg); } 




.fp-viewing-lost_in_blue #leftnav .logo-body .logo{ background-color: #063F50;}
.fp-viewing-lost_in_blue #leftnav .logo-body .logo-nav a {color: #063F50 ;}
.fp-viewing-lost_in_blue #leftnav .logo-body .logo-nav .active a {color: #fff !important; background-color: #063F50;}
.fp-viewing-lost_in_blue #leftnav .logo-body .logo-nav .email {color: #063F50 !important;}
.fp-viewing-lost_in_blue #leftnav .logo-body .logo-nav .nav-item a::after {background-color: #063F50 !important;}
.fp-viewing-lost_in_blue #leftnav .leftnav-body{ background-color: #063F50;}
.fp-viewing-lost_in_blue .topnav .nav-list .nav-item a{ color: #fff;}
.fp-viewing-lost_in_blue .topnav .nav-status{ background-color: #fff;}
.fp-viewing-lost_in_blue .topnav .userloginstatus {display: inline-block; font-size: 14px;vertical-align: middle;color: #fff;}
.fp-viewing-lost_in_blue .topnav .nav-list .account img{filter:saturate(0) brightness(100);} 
.fp-viewing-lost_in_blue #leftnav  .account img{filter:saturate(60%) brightness(32%)  hue-rotate(180deg); }

.fp-viewing-lost_in_blue2 #leftnav .logo-body .logo{ background-color: #01778B;}
.fp-viewing-lost_in_blue2 #leftnav .logo-body .logo-nav a {color: #01778B;}
.fp-viewing-lost_in_blue2 #leftnav .logo-body .logo-nav .active a {color: #fff !important; background-color: #01778B;}
.fp-viewing-lost_in_blue2 #leftnav .logo-body .logo-nav .email {color: #01778B !important;}
.fp-viewing-lost_in_blue2 #leftnav .logo-body .logo-nav .nav-item a::after {background-color: #01778B !important;}
.fp-viewing-lost_in_blue2 #leftnav .leftnav-body{ background-color: #01778B;}
.fp-viewing-lost_in_blue2 .topnav .nav-list .nav-item a{ color: #fff;}
.fp-viewing-lost_in_blue2 .topnav .nav-status{ background-color: #fff;}
.fp-viewing-lost_in_blue2 .topnav .userloginstatus {display: inline-block; font-size: 14px;vertical-align: middle;color: #fff;}
.fp-viewing-lost_in_blue2 .topnav .nav-list .account img{filter:saturate(0) brightness(100);}
.fp-viewing-lost_in_blue2 #leftnav  .account img{filter:saturate(68%) brightness(48%)  hue-rotate(13deg); }



.tool-filter{ width: 600px; margin: 0 auto; margin-top: 100px;}
.tool-filter .tips{ color: brown;}