@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;0,900;1,400;1,700&display=swap');

:root {
--white-100: #ffffff;
--yellow-100: #fffae6;
--yellow-500: #FFCD00;
--black-100: #F7F7F7;
--black-300: #B9B9B9;
--black-500: #7C7C7C;
--black-700: #3E3E3E;
--black-900: #000000;
--blue-100: #e6f1ff;
--blue-300: #52AEF9;
--blue-500: #3392FF;
--blue-700: #006BE6;
--blue-900: #0050AA;
--blue-1100: #003c80;
}

html {font-size: 112.5%;} /*18px*/

body {
font-family: 'Lato', sans-serif;
font-weight: 400;
line-height: 1.4;
color: var(--blue-900);
}

p {
font-size: 112.5%;
line-height: 1.4;
padding: 0 0 1em 0;
margin-block-start: 0 !important;
margin-block-end: 0 !important;
}

ul, ol {
font-size: 112.5%;
line-height: 1.4;
margin-block-start: 0;
margin-block-end: 0;
padding-inline-start: 0 !important;
}

ul, ol li {
padding: 0 0 1em 0;
}

h1, h2, h3, h4, h5 {
font-family: 'Lato', sans-serif;
font-weight: 700;
line-height: 1.3;
margin-block-start: 0 !important;
margin-block-end: 0 !important;
padding: 0 0 1em 0;
}

h1 {
margin-top: 0;
font-size: 1.802rem;
}

h2 {font-size: 1.602rem;}

h3 {font-size: 1.424rem;}

h4 {font-size: 1.266rem;}

h5 {font-size: 1.125rem;}

small, .text_small {font-size: 0.889rem;}

hr {
margin: 2em 0;
opacity: 0.2;
}

#content {
animation: transitionIn .8s
}

@keyframes transitionIn {
from { opacity: 0 } to { opacity:1 }
}

#wrapper {
width: 100%;
margin: 0;
}

/* Header */
header {
position: relative;
height: 140px;
min-height: 140px;
border-right: none;
}

#header_left {
display: flex;
justify-content: space-between;
width: 95%;
height: 140px;
min-height: 140px;
}

#logo{
height: 140px;
}

#logo img, #logo_yufe img {
max-height: 140px;
width: auto;
}

#logo img {
max-width: 300px;
}

#logo_yufe img {
max-width: 340px;
}

#title {
height: 140px;
}

#page-title {
display: block;
padding-top: 60px;
text-align: center;
}

#page-title {
position: relative;
top: -10px;
}

#title span#page-title {
margin: 0;
letter-spacing: 0.08em;
font-weight: 900;
}

#header_right {
height: 140px;
margin: 0;
padding: 20px;
}

#language {
display: flex;
justify-content: flex-end;
align-items: center;
}

/* Content */
#content {
width: 70%;
padding: 3em 5em 5em 5em;
}

#content h1 {
border-bottom: 1px solid var(--blue-100);
padding-bottom: .7em;
margin-bottom: .7em !important;
line-height: 1.2;
text-transform: uppercase;
letter-spacing: 0.01em;
}

#content ol {
padding: 0 0 1em 1em !important;
}

#content ul {
padding: 0 0 1em 2em !important;
}

#content ul li {
padding: 0;
}

#content span {
color: var(--black-300);
}

img.img_center {
width: 600px;
height: auto;
margin: 1em auto;
display: block;
}

#content table {
border: 1px;
border-color: var(--black-300) !important;
height: auto !important;
width: 100% !important;
border-collapse: collapse;
}

#content table tr:nth-child(odd) {
background-color: var(--black-100);
}

#content table tr:nth-child(even) {
background-color: var(--white-100);
}

#content table tr:nth-child(1) {
background-color: var(--blue-700);
color: white;
font-weight: 700;
letter-spacing: 0.08em;
}

#content table tr p:nth-child(1) {
padding: 0;
}

#content table tr td {
padding: 1em !important;
border-color: var(--black-300);
}

#content table tr td:nth-child(1) {
width: 20%;
}

#content table tr td:nth-child(3) {
width: 20%;
}

.news {
padding: 0 0 1.2em 0;
border-bottom: 1px solid var(--blue-100);
margin-bottom: 2em;
}

.news_more {
padding: 0.7em 1em;
border: 1px solid var(--blue-100);
background-color: var(--white-100);
margin-top: 2em;
transition: 0.15s;
}

.news_more:hover {
background-color: var(--blue-100);
}

.news_title {
font-weight: bold;
font-size: 130%;
margin-bottom: 0.5em;
}

.navigation {
width: fit-content;
padding: 0.7em 1em;
border: 1px solid var(--blue-100);
background-color: var(--white-100);
margin-bottom: 2em;
transition: 0.15s;
}

.navigation:hover {
background-color: var(--blue-100);
}

.news_photo_m img {
width: 300px;
position: relative;
float: left;
margin-right: 0;
margin-bottom: 15px;
border-right: 30px solid var(--white-100);
}

#banner img {
width: 100%;
object-fit: cover;
object-position: 50% 40%;
height: 360px;
margin: 0;
padding: 0;
display: block;
}

/* Menu */
nav {
width: 30%;
background-color: var(--blue-700);
}

nav ul {
width: auto;
margin: 0;
padding: 0;
font-size: 1em;
}

nav ul li {
background-color: #3392ff;
padding: 1.5em 1.3em 1.3em 2em;
line-height: 0;
border-bottom: 1px solid var(--blue-500);
transition: .3s;
}

nav ul li:last-child {
border-bottom: none;
background-color: var(--blue-900);
}

nav ul li:last-child:hover {
background-color: var(--blue-1100);
}

nav ul li:hover {
background-color: var(--blue-500);
}

nav ul li a {
color: var(--white-100);
font-weight: 700;
letter-spacing: 0.08em;
transition: 0.3s;
}

nav ul li a:hover {
color: var(--white-100);
}

/* Footer */
footer {
position: -webkit-sticky;
position: sticky;
top: 100%;
z-index: 9998;
display: flex;
justify-content: space-between;
align-items: center;
border-spacing: 0;
height: 140px;
padding: 0 3.5em;
width: auto;
}

#footer_title {
display: none;
}

#footer_content p {
margin: 0;
padding: 0;
line-height: 2em;
text-align: right;
}

@media only screen and (max-width: 1024px) {
nav ul {
font-size: .8em;
}

nav ul li {
background-color: var(--blue-700);
padding: 1em 1em .7em 1em;
line-height: 1.25em;
border-bottom: 1px solid var(--blue-500);
transition: .3s;
}

#title span#page-title {
font-size: 100%;
}

#content img {
width: 100%;
height: auto;
}
}

@media screen and (max-width: 930px) {
#wrapper {
max-width: 100%;
}
}

@media screen and (max-width: 768px) {
html {
font-size: 100%;
}

p {
font-size: 100%;
text-align: left !important;
}

ul, ol {
font-size: 100%;
}

#wrapper {
width: 100%;
}

#content {
padding: 2em 3em 3em 3em;
}

#content table {
font-size: 11px;
}
}

@media screen and (max-width: 425px) {
html {font-size: 100%;} /*16px*/

body {
line-height: 1.75;
}

h1, h2, h3, h4, h5 {
font-family: 'Lato', sans-serif;
font-weight: 700;
line-height: 1.3;
}

h1 {
font-size: 1.383rem;
}

h2 {font-size: 1.296rem;}

h3 {font-size: 1.215rem;}

h4 {font-size: 1.138rem;}

h5 {font-size: 1.067rem;}

small, .text_small {font-size: 0.937rem;}

header {
height: 70px;
min-height: 70px;
}

#header_left {
height: 70px;
min-height: 70px;
align-items: center;
}

#header_left > * {
flex-basis: 100%;
}

#logo {
position: relative;
top: 6px;
height: 70px;
}

#title {
height: 70px;
width: 25%;
}

#logo img, #logo_yufe img {
width: 100%;
}

#title span#page-title {
padding-top: 2.4em;
font-size: 80%;
line-height: 1.2;
}

#header_right {
height: 70px;
margin: 0;
padding: 0 1.5em;
display: flex;
flex-direction: row-reverse;
justify-content: space-between;
align-items: center;
background-color: var(--blue-700);
}

#hamburger {
display: block;
color: var(--blue-900);
width: 35px;
height: 35px;
margin: 0;
text-align: center;
border: none;
border-radius: 3px;
background-color: var(--blue-100);
}

#hamburger .fa {
line-height: 2em;
font-size: 18px;
}

#language {
width: 35px;
}

#lang_select {
border: none;
}

#banner img {
height: 260px;
}

#content {
z-index: -1;
width: 100%;
position: relative;
padding: 1.5em 1.5em 1.5em 1.5em;
top: 65px;
}

#content h1 {
font-weight: 900;
}

/*#content-wrapper {
margin-top: 68px;
}*/

.news_photo_m img {
width: 100%;
border-right: none;
}

h1 ~ .news_data {
margin-top: 0;
}

nav.mobile_nav {
z-index: 9999;
position: absolute;
left: 0;
margin-top: 80px;
top: 72px;
display: block;
background-color: var(--yellow-100);
}

nav.mobile_nav ul {
width: 120%;
max-width: 120%;
}

nav ul li {
padding: 1.2em 2em .9em 2em;
}

footer {
height: 70px;
padding: 0 1.5em;
}

#footer_content p {
line-height: 1.5em;
text-align: left;
}
}

@media screen and (max-width: 1024px) and (min-width: 320px) {
#wrapper {
width: 100%;
overflow: hidden;
}
}