header .header {
  width: 100%;
  position: relative;
  z-index: 999;
  -webkit-transition-delay: .25s;
  transition-delay: .25s;
}

header .header .topmenu {
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: all 0.35s ease;
  cursor: pointer;
}

header .header .icon-box a {
  margin-left: 2vmin;
}

header .header .icon-box .btn {
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  height: 15px;
  width: 20px;
  cursor: pointer;
  z-index: 99;
}

header .header .icon-box .btn span {
  position: absolute;
  webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  display: block;
  height: 2px;
  width: 100%;
  background: #fff;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

header .header .icon-box .btn span:first-child {
  top: 0;
  -webkit-transform-origin: left center;
  transform-origin: left center;
}

header .header .icon-box .btn span:last-child {
  top: 12px;
  -webkit-transform-origin: left center;
  transform-origin: left center;
}

header .header .icon-box .btn span:nth-child(2) {
  top: 6px;
  -webkit-transform-origin: left center;
  transform-origin: left center;
}

@media (max-width: 1200px) {
  header .header .icon-box .btn[aria-expanded="true"]::after {
    content: "\f124";
  }
}

@media (max-width: 1200px) {
  header .header .icon-box .btn[aria-expanded="true"] span {
    display: none;
  }
}

header .header .container {
  max-width: 95%;
}

@media (max-width: 1299px) {
  header .header .container {
    max-width: 95%;
  }
}

@media (max-width: 767px) {
  header .header .container {
    max-width: 98%;
  }
}

header .header .container .logo {
  width: 238px;
}

@media (max-width: 767px) {
  header .header .container .logo {
    width: 138px;
  }
}

header .header .container .logo a {
  display: block;
}

header .header .container .logo a img {
  max-width: 100%;
  margin: 0 auto;
}

header .header .container .right {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

header .header .container .right .link {
  transition: all 0.35s ease;
}

@media (max-width: 1024px) {
  header .header .container .right .link {
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    position: fixed;
    width: 100%;
    left: 0;
    bottom: 0;
    background: #ffffff;
    justify-content: space-between !important;
  }
  header .header .container .right .link div {
    width: 18%;
  }
}

@media (max-width: 1024px) and (max-width: 767px) {
  header .header .container .right .link div {
    width: auto;
  }
}

@media (max-width: 1024px) {
  header .header .container .right .link div a {
    padding-top: 1rem;
  }
}

header .header .container .right .icon-box a {
  margin-right: 1.5vmin;
}

header .header .container .right .icon-box img {
  width: 5vmin;
}

header .header .container .right .nav-link {
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  position: relative;
  color: black;
}

header .header .container .right .nav-link:hover {
  color: #003374;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-weight: bold;
  font-family: 'Inter-ExtraBold','微軟正黑體';
}

header .header .container .right .nav-link:hover::after {
  width: 100%;
}

header .header .container .right .nav-link::after {
  content: '';
  display: block;
  width: 0;
  height: 2px;
  background: #F15922;
  position: absolute;
  left: 0;
  bottom: -2px;
  transition: all 0.35s ease;
  display: none;
}

header .header .container .right .nav-link a {
  display: block;
  padding: 0.5rem 1.5rem;
  text-align: center;
}

@media (max-width: 1680px) {
  header .header .container .right .nav-link a {
    padding: 0.5rem 0.2rem;
  }
}

@media (max-width: 1366px) {
  header .header .container .right .nav-link a {
    padding: 0.5rem 0.2rem;
  }
}

@media (max-width: 767px) {
  header .header .container .right .nav-link a {
    margin-left: 0;
  }
}

header .header .container .right .nav-link a.active {
  color: #374869;
}

header .header .container .right .nav-link i {
  margin-left: 0.3rem;
}

header .header .mask_background {
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(5px);
  display: none;
  opacity: 0;
  width: 100vw;
  height: 100%;
  z-index: 1000;
}

header .nav-box {
  z-index: 99;
  padding: 0;
  width: 100%;
}

@media (max-width: 1299px) {
  header .nav-box {
    display: none !important;
  }
  .icon-box{display: flex !important;align-items: center;justify-content: center; width: 40px;height: 40px;background: #003374;border-radius: 5px;}
}

@media (max-width: 1366px) {
  header .nav-box .nav {
    justify-content: flex-end !important;
  }
}

header .nav-box .nav .nav-link {
  color: #fff;
  padding: 0.5rem 2rem;
  display: flex;
  align-items: center;
}
header .nav-box .nav .dropdown .nav-link::after{
  content: '';
  display: block;
  content: "\f107";
  font-family: 'FontAwesome';
  display: block;
  margin-left: 10px;
}
@media (max-width: 1440px) {
  header .nav-box .nav .nav-link {
    padding: 0.5rem 1rem;
  }
}

header .nav-box .nav .nav-link:hover {
  color: #FF4800;
}

header .lang {
  margin-left: 40px;
  margin-right: 20px;
  position: relative;
  
}
header .lang span{color: #fff;display: flex;align-items: center;}
header .lang span img{margin-right: 10px;}
header .lang span::after{
  content: "\f107";
  font-family: 'FontAwesome';
  display: block;
  margin-left: 10px;

}
@media (max-width: 1299px) {
  header .lang {
    display: none;
  }
}

header .lang dl {
  position: absolute;
  left: 25px;
  top: 40px;
  display: none;
  z-index: 22;
}
header .lang dl.show{display: block;}
header .lang dl dd a {
  display: block;
  width: 30px;
  height: 30px;
  background: #003374;
  border-radius: 50%;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}

header .social {
  display: flex;
  align-items: center;
}

@media (max-width: 1299px) {
  header .social {
    display: none;
  }
}

header .social a {
  display: inline-block;
  color: #Fff;
  margin-left: 20px;
  transition: all 0.35s ease;
}

header .social a:hover {
  transform: scale(1.1);
}

header .social a i {
  font-size: 24px;
}
header .right{
  width: calc(100% - 20em);
}
header .links {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 1rem;

}

@media (max-width: 1299px) {
  header .links {
    display: none;
  }
}
header .links .location{position: relative;}
header .links .location a {
  display: flex;
  align-items: center;
  color: #ffffff;
  font-size: 18px;
  transition: all 0.35s ease;
}
header .links .location a::after{
  content: "\f107";
  font-family: 'FontAwesome';
  display: block;
  margin-left: 10px;
}
header .links .location a i{margin-right: 10px;}

header .links .location .location-submenu{
  position: absolute;
  left: 0;
  top: 40px;
  width: 400px;
  background: #fff;
  padding: 2rem;
  z-index: 22;
  display: none;
}
header .links .location .location-submenu ul{padding-left: 0; box-sizing: border-box; display: flex;justify-content: space-between;flex-wrap: wrap;}
header .links .location .location-submenu ul li{list-style: none;width: 50%;}
header .links .location .location-submenu ul li a{display: inline-block; color: #000;margin: 10px 0px;position: relative;}
header .links .location .location-submenu ul li a::after{
  content: '';
  display: block;
  width: 0;
  height: 1px;
  background: #143C7D;
  transition: all 0.35s ease;
  position: absolute;
  left: 0;
  bottom: 0;
  margin-left: 0;

}
header .links .location .location-submenu ul li a:hover{color: #143C7D;}
header .links .location .location-submenu ul li a:hover::after{width: 100%;}
header .links .location .location-submenu .see{display: inline-block; position: relative; color: #FF4800;margin-bottom: 1rem;}
header .links .location .location-submenu .see::after{
  content: '';
  display: block;
  width: 0;
  height: 1px;
  background: #FF4800;
  transition: all 0.35s ease;
  position: absolute;
  left: 0;
  bottom: 0;
  margin-left: 0;
}
header .links .location .location-submenu .see:hover::after{
  width: 100%;
}
header .links .location .location-submenu.show{display: block;}
header .links .Enquiry a:hover {
  background: none;
  color: #003374;
}
.links2{display: flex;align-items: center;justify-content: flex-end;}
.links2 .btn-more{background: none;padding: 5px 10px;color: #fff;padding-right: 0;}
.links2 .btn-more img{    filter: invert(50%) brightness(300%);}
.search{display: flex;align-items: center;}
.search i{color: #fff;}
.search::after{
  content: '';
  display: block;
  width: 1px;
  height: 10px;
  background: rgba(255, 255, 255, 0.5);
  margin: 0 15px;
  display: none;
}
.formbox {
  display: none;
}

.formbox form {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 83%;
  margin: 30px auto;
  padding: 30px;
  background: #fff;
  border-radius: 30px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

.formbox form .form-control {
  padding: 15px;
  border: 1px solid #003374;
  border-radius: 5px 0 0 5px;
  border-right: none;
  height: 46px;
  border: none;
  outline: none;
  box-shadow: none;
}
.formbox form .input-box{display: flex;align-items: center; width: calc(100% - 220px);border-bottom: 1px solid #efefef;padding: 1rem 0rem;}
.formbox form .input-box i{color: #000;}
.formbox form button {
  margin: 0;
  padding: 12px 40px;
  width: max-content;
  background: #003374;
  border-radius: 40px;
  border: 1px solid #003374;
  color: #ffffff;
  height: 76px;
}
.formbox form button img{filter: invert(100%) brightness(300);}
.formbox form button:hover {
  color: #ffffff;
}

.sticky {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

.finks {
  position: fixed;
  right: 0;
  top: 35%;
  width: 57px;
  height: 208px;
  z-index: 99;
  background: #003374;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 767px) {
  .finks {
    width: 35px;
    height: 140px;
  }
}

.finks a {
  color: #ffffff;
  writing-mode: vertical-rl;
  /* 文字从上到下，从右到左 */
}

.finks a:hover {
  color: #000;
}

.finks a i {
  margin-top: 20px;
}

.mobile-menu-visible header .header .container .icon-box .btn span:first-child {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 0px;
  left: 4px;
}

.mobile-menu-visible header .header .container .icon-box .btn span:nth-child(2) {
  width: 0;
  opacity: 0;
}

.mobile-menu-visible header .header .container .icon-box .btn span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 20px;
  left: 4px;
}


.opens > .dropdown-menu {
  opacity: 1 !important;
  visibility: visible !important;
  margin-top: 0px;
  display: block;
}

.opens > .sc-dropdown {
  display: block;
  left: 0;
}

@media (max-width: 1800px) {
  header .nav-box .nav .nav-link{padding: 0.5rem 1rem;}
}
@media (max-width: 1330px) {
  header .nav-box .nav .nav-link{padding: 0.5rem;}
}
@media (max-width: 1299px) {
  .open > .dropdown-menu {
   
  }
  .dropdown-menu{border: none;}
  .dropdown-menu li{padding-top: 10px;padding-bottom: 10px;padding-left: 15px;}
  
}
.login-fixed{
  position: fixed;
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2122;
  display: none;
}
.login-fixed.show{display: block;}
.login-fixed .loginback{position: absolute;left: 0;z-index: 1; width: 100%;height: 100%;background: rgba(0, 0, 0, 0.5);}
.login-fixed .inner{overflow-y: scroll; position: relative;z-index: 2; width: 460px;background: #F7F5F1;height: 100%;float: right;padding: 2rem;

  transition: all 500msease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500msease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}
.login-fixed .inner2{width: 700px;}
.login-fixed .inner .closes{display: flex;align-items: center;justify-content: flex-end;}
.login-fixed .inner h2{text-align: center;}
.login-fixed .inner .login-forms .li{padding: 1rem; margin-top: 1rem; background: #fff;border-radius: 3px;display: flex;align-items: center;justify-content: space-between;}
.login-fixed .inner .login-forms .li .spans{width: 90px;}
.login-fixed .inner .login-forms .li input{width: calc(100% - 90px);}
.login-fixed .inner .login-forms .forget {text-align: center;display: block;margin-top: 1rem;}
.login-fixed .inner .login-forms .creat {text-align: center;display: block;margin-top: 1rem;}
.login-fixed .inner .login-forms .submits input{padding: 1rem;text-align: center;color: #fff;margin-top: 1rem; display: block;width: 100%;border-radius: 50px;background: #003374;border: 1px solid #003374;}
.login-fixed .inner .login-forms .submits input:hover{background: none;color: #003374;}


.login-fixed .inner .creat-content h2{text-align: left;}
.login-fixed .inner .creat-forms{} 
.login-fixed .inner .creat-forms .li{padding: 1rem; margin-top: 1rem; background: #fff;border-radius: 3px;display: flex;align-items: center;justify-content: space-between;}
.login-fixed .inner .creat-forms .li .spans{width: 90px;}
.login-fixed .inner .creat-forms .li .spans sub{color: #003374;top: 0;}
.login-fixed .inner .creat-forms .li input{width: calc(100% - 90px);}

.login-fixed .inner .creat-forms .li2 .spans{width: 150px;}
.login-fixed .inner .creat-forms .li2 input{width: calc(100% - 150px);}
.login-fixed .inner .creat-forms .li3{display: flex;justify-content: space-between;}
.login-fixed .inner .creat-forms .li3 .select-input{width: calc(100% - 210px);background: #fff;padding: 1rem;position: relative;}
.login-fixed .inner .creat-forms .li3 .select-input .form-control{border: none;box-shadow: none;padding: 0;}
.login-fixed .inner .creat-forms .li3 .select-input::after{
  content: '';
  width: 15px;
  height: 8px;
  background: url(../img/down_i.svg) no-repeat top center;
  background-size: cover;
  border: none;
  margin-left: 5px;
  filter: invert(100%) brightness(0);
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  

}
.login-fixed .inner .creat-forms .li3 .spans{width: 200px;}
.login-fixed .inner .creat-forms .li3 .checkboxbox{width: calc(100% - 210px);}

.login-fixed .inner .creat-forms .li3 .checkboxbox{margin-top: 10px; display: flex;align-items: center;justify-content: space-between;flex-wrap: wrap;}
.login-fixed .inner .creat-forms .li3 .checkboxbox .checkbox-inline{width: 48%;display: flex;align-items: center;margin-bottom: 0.8rem;}
.login-fixed .inner .creat-forms .li3 .checkboxbox .checkbox-inline .checkbox{
  display: flex;
  align-items: center;
  position: relative;
  cursor: pointer;
  margin-right: 10px;
}
.login-fixed .inner .creat-forms .li3 .checkboxbox .checkbox-inline>span{
   line-height: 1;
   color: #2D2D2D;
}

.login-fixed .inner .creat-forms .li3 .checkboxbox .checkbox-inline input{
  opacity: 0;
  position: relative;
  z-index: 99;
  cursor: pointer;
  zoom: 1.5;

}
.login-fixed .inner .creat-forms .li3 .checkboxbox .checkbox-inline .checkmark{
  width: 22px;
  height: 22px;
  background: #fff;
  border-radius: 3px;
  position: relative;
  border: 1px solid #707070;
}
.login-fixed .inner .creat-forms .li3 .checkboxbox .checkbox-inline .checkmark::after{
  content: "";
  position: absolute;
  top: 43%;
  left: 50%;
  width: 6px;
  height: 12px;
  border: solid #FFFFFF;
  border-width: 0 3px 3px 0;
  -webkit-transform: translate(-50%, -50%) rotate(45deg) scale(0);
  -ms-transform: translate(-50%, -50%) rotate(45deg) scale(0);
  transform: translate(-50%, -50%) rotate(45deg) scale(0);
  -webkit-transition: .2s;
  transition: .2s;
  border-width: 0 2px 2px 0;
}
.login-fixed .inner .creat-forms .li3 .checkboxbox .checkbox-inline input:checked ~ .checkmark{
  border-color: #FFFFFF;
  background: #C0575E;
}
.login-fixed .inner .creat-forms .li3 .checkboxbox .checkbox-inline input:checked ~ .checkmark::after{
  border-color: #FFFFFF;
  -webkit-transform: translate(-50%, -50%) rotate(45deg) scale(0.8);
  -ms-transform: translate(-50%, -50%) rotate(45deg) scale(0.8);
  transform: translate(-50%, -50%) rotate(45deg) scale(0.8);
}



.login-fixed .inner .creat-forms .urla {display: flex;align-items: center;justify-content: center; margin-top: 1rem;}
.login-fixed .inner .creat-forms .urla a{display: flex;align-items: center;}
.login-fixed .inner .creat-forms .urla a:nth-child(1)::after{content: '';display: block;width: 1px;height: 12px;background: #616161;margin: 0 5px;}
.login-fixed .inner .creat-forms .urla :hover{color: #003374;}

.login-fixed .inner .creat-forms .submits input{padding: 1rem;text-align: center;color: #fff;margin-top: 1rem; display: block;width: 100%;border-radius: 50px;background: #003374;border: 1px solid #003374;}
.login-fixed .inner .creat-forms .submits input:hover{background: none;color: #003374;}
@media (max-width: 1440px) {
  .formbox form{max-width: 93%;}
}
@media (max-width: 1280px) {
  .mobile-menu .formbox{top: 0 !important;}
  .formbox form{background: none !important;padding: 0 !important;}
  .mobile-menu .formbox form{padding-left: 0rem !important;box-shadow: none;border: 2px solid #003374;border-radius: 8px;}
  .mobile-menu .formbox{border-radius: 10px !important;}
  .mobile-menu .formbox form button{width: 60px !important;}
  .member-block .formbox form{background: #fff !important;padding: 20px 30px!important;}
  .formbox form .form-control{height: 100%;border-radius: 0;}
  .mobile-menu .formbox form button{height: auto;padding: 12px 20px;}
  .mobile-menu .formbox form input{border-radius: 10px 0 0 10px;}


}
@media (max-width: 568px) {
  .login-fixed .inner{width: 100%;}
  .login-fixed .inner .creat-forms .li3{flex-wrap: wrap;}
  .login-fixed .inner .creat-forms .li3 .spans{width: 100%;}
  .login-fixed .inner .creat-forms .li3 .select-input{width: 100%;margin-top: 0.5rem;}
  .login-fixed .inner .creat-forms .li3 .checkboxbox{width: 100%;margin-top: 0.5rem;}
  .formbox{top: 80px;}
  .formbox form button{padding: 12px;height: 56px;}
  .mobile-menu .formbox{top: 0px !important;}
  .formbox form .input-box{width: calc(100% - 120px) !important;}
  .formbox form .form-control{font-size: 18px !important;}
}

