#headerM {background:#fff;padding:9px 0; position:relative; width:100%; z-index: 9999; box-sizing:border-box;}
#headerM:after{content:''; display:block; clear:both;}
#top {width:100%; min-width:1240px;  box-shadow:1px 0px 2px rgba(0,0,0,0.1); background:#fff;
	display:inline-block; position:absolute; top:0; padding:20px 0; box-sizing:border-box;
    z-index:99999999999999999999999999;border-bottom:1px solid rgba(255,255,255,0.3);}

#top  p  {width:200px; float:left; margin-left:3%;}
#top  p  img {}

#top div {width:80%; float:right; position:absolute; bottom:80px; right:3%;  text-align:right;  }

nav {width:80%;  float:right;  position:absolute;   bottom:20px; right:4%;  text-align:right;}
nav ul {font-size: 0; margin: 0; padding: 0;}
nav ul li {display: inline-block;  position: relative;}
nav ul li a {display:inline-block; font-size:18px; font-weight:500; line-height:70px; letter-spacing:1px; transition: 0.3s linear; color:#aaa !important; text-align:center;}
nav ul li.on a { color:#093aad  !important}
nav ul li:first-child a{padding:0;}


#headerM >a{display:inline-block;}


nav ul li ul {  display: none;  position: absolute;  width:200px; right:0; text-align:center;}
nav ul li ul li {border-top: 1px solid #444;  display: block;}
nav ul li ul li:first-child { border-top: none; }

nav ul li ul li a {
background: #373737;
display: block;
font-size:14.5px;
line-height:45px;
letter-spacing:-0.5px;
  padding: 0 14px;
color:rgba(255,255,255,.7) !important;
}

nav ul li ul li a:hover { background: #126d9b; }

nav .fa.fa-angle-down { margin-left: 6px; }

.nav_a{position: absolute; top:28%; left:4%;}
#navi_1{display:none;}

.logo{ max-width:200px; width:100%; height:auto; margin-left:10px;}
.logo.logo01{vertical-align:middle; margin-top:22px;}

.logo_wrap{align-items:center;}
.right_logo{margin-left:14px;}
.right_logo img{width:7em;}




	
.navi {height:100%;}
.navi:after{content:''; display:block; clear:both;}
.tab_navi{display:block;}
/* Style the tab */
.navi .tab_navi {
  width: 30%;
  float: left;
  line-height:20px;
  box-sizing:border-box;
  height:100%;
  background:#007dc1;
}

/* Style the buttons inside the tab */
.navi .tab_navi button {
  display: block;
  background-color: inherit;
  color: black;
  padding: 12px 15px;
  width: 100%;
  border: none;
  outline: none;
  text-align: left;
  cursor: pointer;
  transition: 0.2s;
  font-size: 0.9em;
  font-weight:400;
  background:#007dc1;
  color:#fff;
}

/* Change background color of buttons on hover */
.navi .tab_navi button:hover {
  background-color: #fff;
  color:#007dc1;
  font-weight:500;
}

/* Create an active/current "tab button" class */
.navi .tab_navi button.active {
  background-color: #fff;
  color:#007dc1;
  font-weight:600;
}

/* Style the tab content */
.navi .tabcontent {
  width: 70%;
  float: left;
  box-sizing:border-box;
  border-left: none;
}

.cd-nav-container{overflow-y:hidden !important}


.login_alink > ul > li{width:92%; float:left; margin-left:4%; padding:15px 12px; box-sizing:border-box}
.login_alink > ul > li a:nth-child(1){color:#000 !important; border:1px solid #ddd; border-radius:20px; margin-bottom:5px; padding:5px 10px; width:100%; float:left; text-align:center; box-sizing:border-box; line-height:20px; font-size:0.8rem}
.login_alink > ul > li a:nth-child(2){width:100%;color:#fff; border:1px solid #ddd;  float:left; text-align:center; border-radius:20px; padding:5px 10px; box-sizing:border-box; background:#fff; color:#007dc1 !important; line-height:20px; font-size:0.8rem}







#nav  {width:35px; float:left; position:relative; height:30px; background-color:red; margin:5px 0px 0 0px;}
/*nav header  {padding:0px 2.5%; background-color:#fff; height:50px; position: relative;}*/
nav header  {background-color:#fff; height:50px; position: relative !important; border-bottom:none !important}


.navi .navi_t.on > #navi_1{display:block !important;}

.cd-nav-trigger span.ham {
  /* icon created in CSS */
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  width: 25px;
  height: 2px;

  background-color: #fff;
}


header.fixed .cd-nav-trigger span.ham{background-color:#000}







.cd-nav-trigger span.ham2 {
  /* icon created in CSS */
   left: 0%;
  top: 0px;
 right:0px;
 bottom:0px;

  width: 50px;
  height: 50px;
   text-indent:0px;

}
.cd-nav-trigger span.ham::before, .cd-nav-trigger span.ham:after {
  /* upper and lower lines of the menu icon */
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: inherit;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: -webkit-transform 0.2s, width 0.2s;
  -moz-transition: -moz-transform 0.2s, width 0.2s;
  transition: transform 0.2s, width 0.2s;
}
.cd-nav-trigger span.ham::before {
  -webkit-transform-origin: right top;
  -moz-transform-origin: right top;
  -ms-transform-origin: right top;
  -o-transform-origin: right top;
  transform-origin: right top;
  -webkit-transform: translateY(-10px);
  -moz-transform: translateY(-10px);
  -ms-transform: translateY(-10px);
  -o-transform: translateY(-10px);
  transform: translateY(-10px);
}
.cd-nav-trigger span.ham::after {
  -webkit-transform-origin: right bottom;
  -moz-transform-origin: right bottom;
  -ms-transform-origin: right bottom;
  -o-transform-origin: right bottom;
  transform-origin: right bottom;
  -webkit-transform: translateY(10px);
  -moz-transform: translateY(10px);
  -ms-transform: translateY(10px);
  -o-transform: translateY(10px);
  transform: translateY(10px);
}
.no-touch .cd-nav-trigger:hover {
  /* rotate trigger on hover */
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
.no-touch .cd-nav-trigger:hover span::after,
.no-touch .cd-nav-trigger:hover span::before {
  /* animate arrow --> from hamburger to arrow */
  width: 50%;
}
.no-touch .cd-nav-trigger:hover span::before {
  -webkit-transform: translateX(1px) translateY(1px) rotate(45deg);
  -moz-transform: translateX(1px) translateY(1px) rotate(45deg);
  -ms-transform: translateX(1px) translateY(1px) rotate(45deg);
  -o-transform: translateX(1px) translateY(1px) rotate(45deg);
  transform: translateX(1px) translateY(1px) rotate(45deg);
}
.no-touch .cd-nav-trigger:hover span::after {
  -webkit-transform: translateX(1px) translateY(-1px) rotate(-45deg);
  -moz-transform: translateX(1px) translateY(-1px) rotate(-45deg);
  -ms-transform: translateX(1px) translateY(-1px) rotate(-45deg);
  -o-transform: translateX(1px) translateY(-1px) rotate(-45deg);
  transform: translateX(1px) translateY(-1px) rotate(-45deg);
}



/* --------------------------------

xnavigation

-------------------------------- */
.cd-nav-container {
  position: fixed;
  z-index:99999999999999;
  top: 0;
  left: 0;
  width: 90%;
  height: 100%;
  overflow-y: auto;
  background-color: #ffffff;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
  transform: translateX(100%);
 	display:none;


}
.cd-nav-container.is-visible {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
  -webkit-overflow-scrolling: touch;
   display:block;
 }

.cd-close-nav {
  /* 'X' close icon */
  position: absolute;
  height: 44px;
  width: 44px;
  /* set the right position value so that it overlaps the .cd-nav-trigger*/
  right:2%;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  /* image replacement */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  transition: opacity 0.2s;
}
.cd-close-nav::after, .cd-close-nav::before {
  /* lines of 'X' icon */
  content: '';
  position: absolute;
  height: 2px;
  width: 30px;
  left: 50%;
  top: 50%;
  background-color: #333;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.cd-close-nav::after {
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
  -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
  -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
  -o-transform: translateX(-50%) translateY(-50%) rotate(45deg);
  transform: translateX(-50%) translateY(-50%) rotate(45deg);
}
.cd-close-nav::before {
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -o-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}
.no-touch .cd-close-nav:hover {
  opacity: .8;
}

/* --------------------------------

xshadow layer

-------------------------------- */
.cd-overlay {
  /* shadow layer visible when navigation is open */
  position: fixed;
  height: 100%;
  width: 100%;
  z-index:99999999;
  top: 0;
  left: 0;
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.35);
  visibility: hidden;
  opacity: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: opacity 0.4s 0s, visibility 0s 0.4s;
  -moz-transition: opacity 0.4s 0s, visibility 0s 0.4s;
  transition: opacity 0.4s 0s, visibility 0s 0.4s;
}
.cd-overlay.is-visible {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 0.4s 0s, visibility 0s 0s;
  -moz-transition: opacity 0.4s 0s, visibility 0s 0s;
  transition: opacity 0.4s 0s, visibility 0s 0s;
}

/* --------------------------------

xcontent

-------------------------------- */


.navi              {width:100%; background-color:#fff;  float:left;  border-top:1px solid #ddd; }
.navi   .navi_t               {-webkit-text-size-adjust:none; width:100%;  background-color:#fff;  border-bottom:1px solid #ddd; }

.navi   .navi_t  a {
	display:inline-block;
     padding:12px 3%;
    width:100%;
 	color:#666;
	font-size:1.03em; font-weight:600;
	box-sizing:border-box;

}

.navi   .navi_t a:hover	{     color:#333;    }
.navi   .navi_t a:active  {color:#333;    }



.navi   .navi_t_s               {-webkit-text-size-adjust:none; width:100%;  color:#6e6e6e;    border-bottom:1px solid #ddd;     background-color:#f5f5f5; border-bottom:1px solid #ddd;}


.navi   .navi_t_s  a {
	display:inline-block;
     padding:12px 3%;
    width:100%;
 	color:#777;
	font-size:0.95em;
	box-sizing:border-box;

}

.navi   .navi_t_s a:hover	 {color:#6e6e6e;     background-color:#f2f2f2;  }
.navi   .navi_t_s a:active	{  color:#6e6e6e;    background-color:#f2f2f2; }

.nav_bottom_link  {margin-top:2%; margin-left:3%; float:left; }

.navi   .nav_bottom_link  a { color:#999;   text-align:center;  font-size:0.95em;   line-height:2.6em;  margin-right:5px; }

.navi   .nav_bottom_link a:hover	{    color:#999;      }
.navi   .nav_bottom_link a:active	{   color:#999;    }

 a.lang {font-size:.9rem; margin-left:3%; display:inline-block; margin-top:15px}
 a.lang img {margin-right:5px; vertical-align:middle}


@media (max-width:400px){
#headerM{height:63.17px !important}
.logo{max-width:170px}
.cd-nav-trigger{top:20px !important}
.nav_logo_img img{max-width:67% !important}
}