@charset "utf-8";
@import url('iconfont.css');
:root { --color:#008f58;
--hovercolor:#007246;
--fontcolor:#111111;
--headercolor:#FFFFFF;
--footercolor:#EEEEEE;
--introcolor:#444444;
--fontsize12:12px;
--fontsize13:13px;
--fontsize14:14px;
--fontsize15:15px;
--fontsize16:16px;
--fontsize17:17px;
--fontsize18:18px;
--fontsize20:20px;
--fontsize22:22px;
--fontsize24:24px;
--fontsize26:26px;
--fontsize28:28px;
--fontsize30:30px;
--fontbold3:300;
--fontbold4:400;
--fontbold5:500;
--fontbold6:600;
--fontbold7:700;
--fontbold8:800;
--fontfamily:'Roboto', 'Lato', 'Open Sans', 'Poppins', 'Oswald', 'Noto Sans', 'Montserrat', arial
}
*, html, body, h4, ul, li, div, p { margin: 0px; padding: 0px; box-sizing: border-box }
aside, section { display: block }
html { margin: 0px; padding: 0px; overflow-x: hidden }
body { margin: 0px auto; padding: 0px; color: var(--fontcolor); font-size: var(--fontsize16); line-height: 1.7; font-family: var(--fontfamily) }
h4 { font-weight: var(--fontbold5); text-transform: capitalize }
li, ul { list-style: none }
img { border: 0px; max-width: 100%; height: auto; vertical-align: bottom }
a { color: var(--fontcolor); text-decoration: none }
a:hover { color: #209f96; }
@font-face { font-family: BlowBrush; font-display: swap; src: url(https://css02.v15cdn.com/m417/fonts/blowbrush-1.ttf) }
.main {/* width:1600px; */ margin: 50px auto }
.flexMain { display: flex; justify-content: space-between }
.side { width: 22% }
.side>div { margin-bottom: 20px }
.side>div:nth-last-child(1) { margin-bottom: 0px }
.side h4 { padding: 12px 0px; color: #FFFFFF; font-size: var(--fontsize22); background: #2d7fd1; text-align: center; line-height: 1 }
.MainList { width: 75% }
.switchPage { display: flex; align-items: center; justify-content: center; flex-wrap: wrap }
.switchPage span { color: #626262 }
.switchPage a, .switchPage span { margin-right: 10px; width: 45px; height: 45px; line-height: 45px; text-align: center; border: 1px solid #EFEFEF; transition: all .2s ease; margin-bottom: 10px }
.switchPage a { color: var(--fontcolor) }
.switchPage .ctxt { background: var(--color); color: #FFFFFF }
.switchPage a:hover { background: var(--color); color: #FFFFFF }
.sideLatestNews ul { clear: both; margin: 0px 10px 10px 10px }
.sideLatestNews ul li { display: flex; justify-content: space-between; margin-top: 20px }
.sideLatestNews ul li>a { width: 26%; display: inline-block }
.sideLatestNews ul li>div { width: 70%; display: flex; align-content: center; align-items: center; flex-wrap: wrap }
.sideLatestNews ul li>div i { color: var(--hovercolor) }
.sideLatestNews ul li>div span { font-size: var(--fontsize13); color: var(--introcolor); line-height: 15px; margin-left: 5px }
.newsList ul { margin-bottom: 60px }
.newsList .news-list-0 li { display: flex; transition: all .3s ease; margin-bottom: 20px; overflow: hidden }
.newsList .news-list-0 li:hover { box-shadow: 0 4px 4px 0 rgba(0,0,0,.06); transform: translateY(-5px) }
.newsList .news-list-0 li .newsItemImg { width: 26% }
.newsList .news-list-0 li .newsItemImg a { height: 100%; display: flex; justify-content: center; align-items: center }
.newsList .news-list-0 li .newsItemContent { width: 74%; background: #FCFCFC; padding: 30px 0px 0px }
.newsList .news-list-0 li .newsItemContent .date { display: inline-flex; border-radius: 10px; overflow: hidden; transform: translateX(-50%); width: 120px; height: 40px; }
.newsList .news-list-0 li .newsItemContent .date>div { width: 50%; display: flex; align-content: center; justify-content: center; flex-wrap: wrap }
.newsList .news-list-0 li .newsItemContent .date .day { font-size: var(--fontsize22); color: #FFFFFF; background: #2d7fd1; line-height: 1; padding: 5px 5px 5px; }
.newsList .news-list-0 li .newsItemContent .date .YY { background: var(--fontcolor) }
.newsList .news-list-0 li .newsItemContent .date .YY span { display: block; line-height: 1; width: 100%; text-align: center; white-space: break-all; overflow: hidden; white-space: break-all; text-overflow: break-all; font-size: 14px; word-break: break-all; color: #FFFFFF; padding: 5px; }
.newsList .news-list-0 li .newsItemContent .content { padding: 0px 30px 20px 60px; box-sizing: border-box }
.newsList .news-list-0 li .newsItemContent .content strong { margin-bottom: 10px; font-size: var(--fontsize18); color: var(--fontcolor); font-weight: var(--fontbold5); transition: all .2s ease; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis; overflow: hidden; text-transform: capitalize }
.newsList .news-list-0 li .newsItemContent .content strong:hover { color: var(--hovercolor) }
.newsList .news-list-0 li .newsItemContent .content p { font-size: var(--fontsize14); color: var(--introcolor); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; text-overflow: ellipsis; overflow: hidden }
.news_titles { font-size: 22px; font-weight: bold; color: #000; }
.news_titles2 { font-size: 16px; color: #555; }

@media(max-width:1650px) {
.main { width: 1400px }
.newsList .news-list-0 li .newsItemContent .content { padding: 10px 20px }
.side h4 { font-size: var(--fontsize22); padding: 15px 0px }
.newsList .news-list-0 li .newsItemContent { padding: 15px 0px 0px }
}

@media(max-width:1450px) {
.main { width: 1200px }
.newsList .news-list-0 li .newsItemContent .content strong { margin-bottom: 0px }
.side h4 { font-size: var(--fontsize18); padding: 12px 0px }
.newsList .news-list-0 li .newsItemContent .content p { -webkit-line-clamp: 2 }
}

@media(max-width:1266px) {
.main { width: 1000px }
.side { display: none }
.MainList { width: 100% }
}

@media(max-width:768px) {
.main { width: 100%; padding: 0px 20px; box-sizing: border-box }
.main { margin: 40px auto }
.newsList .news-list-0 li .newsItemContent .content { padding: 10px 20px }
.newsList .news-list-0 li .newsItemContent { padding-top: 20px }
.newsList .news-list-0 li .newsItemImg { width: 30% }
.newsList .news-list-0 li .newsItemContent { width: 70% }
.newsList .news-list-0 li:hover { transform: none }
}

@media(max-width:500px) {
.main { padding: 0px 15px }
.main { margin: 30px 0px }
.switchPage a, .switchPage span { font-size: var(--fontsize14); width: 30px; height: 30px; line-height: 30px }
.newsList .news-list-0 li .newsItemContent .content p { -webkit-line-clamp: 2 }
.newsList .news-list-0 li .newsItemContent .date { width: 80px; height: 30px }
.newsList .news-list-0 li .newsItemContent .content { padding: 0px 15px 10px }
.newsList .news-list-0 li .newsItemContent .date .day { font-size: var(--fontsize24) }
.newsList .news-list-0 li .newsItemContent .date .YY span { font-size: var(--fontsize12) }
.newsList .news-list-0 li .newsItemContent { padding-top: 10px }
.newsList .news-list-0 li .newsItemImg { width: 35% }
.newsList .news-list-0 li .newsItemContent { width: 65% }
.newsList .news-list-0 li .newsItemContent .content strong { font-size: var(--fontsize14) }
.newsList .news-list-0 li .newsItemContent .content p { font-size: var(--fontsize12) }
}

@media(min-width:769px) and (max-width:1020px) {
.main { max-width: 96% }
}

@media(min-width:769px) {
.newsList .news-list-0 li .newsItemContent .content p { -webkit-line-clamp: initial; max-height: 100% }
}
