/* nav */
.nav-menu,.nav-menu ul,.nav-menu li,.nav-menu a { margin: 0; padding: 0; line-height: normal; list-style: none; display: block; position: relative; }
.nav-menu{ display: flex; align-items: center; justify-content: center; }
.nav-menu ul { display: none; position: absolute; top: 100%; z-index: 1; -webkit-transition: opacity .3s; transition: opacity .3s; }
.nav-menu li:hover > ul { display: block;}

.nav-menu li { cursor: default; white-space: nowrap; display: flex; align-items: center; justify-content: center; }
.nav-menu ul li { float: none; }

/* lang */
.nav-menu li.lang { color:#0b2d4e; border-left:1px solid #e5e5e5; padding: 27px 0px 27px 38px; margin:0px 0px 0px 38px; }
.nav-menu li.lang a{ color:#fff; padding: 0px 0px 0px 10px; font-size: var(--font-s05);}
.nav-menu li.lang a:hover,.nav-menu li.lang a:focus,.nav-menu li.lang:hover a{ color:#0b2d4e; }
.nav-menu li.lang .icon {
  width: 45px; 
  height: 45px;
  border: 1px solid #9599b4;
  border-radius: 100%; 
  display: flex; align-items: center; justify-content: center;
  margin: 0 15px 0 0;
}
.nav-menu li.lang .icon:before {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../images/lang.png) no-repeat; display: block;
  background-size: 100% auto; 
}
.nav-menu li.lang > ul > li > a {
  color: #666 !important;
}
@media screen and (max-width: 1450px) {
.nav-menu li.lang { padding: 27px 0px 27px 20px; margin:0px 0px 0px 28px; }
}
@media screen and (max-width: 1350px) {
.nav-menu li.lang a{
  font-size: var(--font-s03);
}
.nav-menu li.lang .icon {
  width: 40px; 
  height: 40px;
  margin: 0 10px 0 0;
}
.nav-menu li.lang .icon:before {
  content: "";
  width: 20px;
  height: 20px;
}
}
@media screen and (max-width: 1200px) {
.nav-menu li.lang { padding: 22px 0px 22px 15px; margin:0px 0px 0px 23px; }
}
@media screen and (max-width: 1150px) {
.nav-menu li.lang { padding: 22px 20px 22px 15px; }
.nav-menu li.lang .text{ display: none; }
}
@media screen and (max-width: 800px) {
.nav-menu li.lang { padding: 22px 25px 22px 10px; }
}
@media screen and (max-width: 600px) {
.nav-menu li.lang { padding: 15px 25px 15px 10px; }
}


/* sub width */
.nav-menu ul { text-align: left;
  padding: 10px 20px; background: #fafafa; box-shadow: 0 0 20px rgb(0 0 0 / 10%);
}

/* root */
.nav-menu a {
  padding: 10px 20px;
  color: #283168;
  font-weight: 600;
  font-size: var(--font-s06);
  line-height: 40px;
  text-decoration: none;
}
@media screen and (max-width: 1650px) {
.nav-menu a {
  font-size: var(--font-s05);
  padding: 10px 10px;
}
}
@media screen and (max-width: 1350px) {
.nav-menu a {
  font-size: var(--font-s04);
  padding: 10px 8px;
}
}
@media screen and (max-width: 1200px) {
.nav-menu a {
  font-size: var(--font-s03);
}
}


/* root: active */
.nav-menu > li > .nav-active { }

/* root: hover/persistence */
.nav-menu a:hover,.nav-menu a:focus,.nav-menu li:hover a {
  color: #ff5e14;
}

/* 2 */
.nav-menu li ul{ text-align: left; 
}
.nav-menu li li a,.nav-menu li:hover li a {
  padding: 8px 10px;
  color: #666;
  font-size: 16px;
  line-height: normal;
}

/* 2: hover/persistence */
.nav-menu li:hover li a:hover,.nav-menu li:hover li a:focus,.nav-menu li:hover li:hover a {
  color: #ff5e14;
}

/* 3 */
.nav-menu li:hover li:hover li a {
  background: #444;
}

/* 3: hover/persistence */
.nav-menu li:hover li:hover li a:hover,.nav-menu li:hover li:hover li a:focus,.nav-menu li:hover li:hover li:hover a {
  background: #333;
}

/* 4 */
.nav-menu li:hover li:hover li:hover li a {
  background: #333;
}

/* 4: hover */
.nav-menu li:hover li:hover li:hover li a:hover,.nav-menu li:hover li:hover li:hover li a:focus {
  background: #222;
}

/* vertical */
.nav-vertical { max-width: 220px; }
.nav-vertical ul { top: 0; left: -9999px; }
.nav-vertical li { width: 100%; float: none; }
.nav-vertical li:hover > ul { left: 100%; }