@media screen and (min-width: 320px){
/* header */
.submenu_top {position: relative;}
.langs {position: absolute; top: 50%; left:145px;width: 60px; height: 30px; line-height: 30px; border:1px solid #ddd; font-size: 15px; color: #333; transform: translateY(-50%); text-align: center; cursor: pointer}
.mo_submenu .langs .list {display: none; background: rgba(255,255,255,0.6); }
.mo_submenu .langs .list a {position: static; float: unset; width: auto; margin: auto;}
.mo_submenu > ul > li > a.no_sub {background: none}
.mo_submenu > ul > li > a.no_sub {background: none}
/* footer */
.footer_info div {padding-top: 0}
.footer_info div p {margin-top: 10px}
.relation_box {height: auto}
.relation_box>div {height: auto; text-align: left;}
.relation_box>div div ul {z-index: 200}
.relation_box>div div:nth-child(1) {width: 100% !important; border: 0;}
.relation_box>div div ul li a {padding: 14px; height: auto; line-height: 1.5; text-indent: unset}
}

@media screen and (min-width: 740px){
.submenu_top img {width: 180px}
.mo_submenu .langs {left: 220px; width: 90px; height: 45px; line-height: 45px; font-size: 24px;}

/* footer */
.relation_box>div div ul li a {padding: 0; height: 50px; line-height: 50px; text-indent: 20px;}
}

@media screen and (min-width: 1024px){
.header_wrap nav ul li > ul {height: 160px}
.header_wrap nav > ul > li:last-child {width: auto} 
.header_wrap nav ul li > ul > li > div > a {line-height: 1.25}
.header_wrap .submenu {height: 160px}
.header_wrap .submenu> ul > li {border:0}
.header_wrap .submenu> ul > li:hover {background: #fff}
.header_wrap .submenu> ul > li:nth-child(4) {width: 200px}
.header_wrap .submenu> ul > li:nth-child(4):hover {background: #fafafa}
.header_wrap .submenu> ul > li:last-child {width: 148px} 
.header_wrap .submenu> ul > li > div > a {line-height: 1.25}
.nav_mak {height: 160px}  

@keyframes fold {
	0%{opacity: 1; height: auto; transform: translateY(0);}
	100%{opacity: 0; height: 0; transform: translateY(-10px);}
}
@keyframes unfold {
	0%{opacity: 0; height: 0; transform: translateY(-10px);}
	100%{opacity: 1; height: auto; transform: translateY(0);}
}

.langs {left: auto; right: 3%;}
.langs .list {opacity: 0; overflow: hidden; height: 0; transform: translateY(-10px); animation: fold 0.5s ease}
.langs .list a {color: #333; transition: all 0.5s ease}
.langs:hover .list {opacity: 1; height: auto; transform: translateY(0); animation: unfold 0.5s ease}
.langs .list a:hover  {color: #053f6f}
}
@media screen and (min-width: 1200px){
.header_wrap nav ul li {width: 160px}
.header_wrap .submenu> ul > li:last-child {width: 50px}
.langs {right: 2%}
.relation_box>div div:nth-child(1) {width: 555px}  

/* footer */
.footer_info div p {margin-top: 0}
}

@media screen and (min-width: 1600px){
.header_wrap nav > ul > li:last-child {width: 200px}
.header_wrap nav ul li {width: 200px}
.header_wrap nav ul li > ul {height: 200px}
.header_wrap nav ul li > ul > li > div > a {line-height: 1.5}
.header_wrap nav ul li > ul > li > div.menudiv2 {top: 86px}
.nav_mak {z-index: 500; height: 200px;}
.header_wrap .submenu {position: absolute; margin: 0; width: 100%; height: 200px}
.header_wrap .submenu> ul > li {width: 200px; border: 0;}
.header_wrap .submenu> ul > li > div > a {line-height: 1.5}
.header_wrap .submenu> ul > li:nth-child(4) {width: 200px}
.header_wrap .submenu> ul > li:last-child {width: 200px}
.header_wrap .submenu> ul > li > div.menudiv1 {top: 35px}
.header_wrap .submenu> ul > li > div.menudiv2 {top: 92px}
}

