header {background: #fff;}


/*news*/
.news {padding: 70px 0; padding-top: 30px;}
.news h2 {color: #212121; font-size: 32px; font-weight: 700; margin-bottom: 20px;}
.news p {color: #627293; font-size: 14px; line-height: 28px;}
.news .butt {float: right;}

.news .bx {margin-top: 40px; -webkit-transition: 0.3s; transition: 0.3s;}
.news .bx h4 {font-size: 20px; font-weight: 500; color: #2196f2; margin-top: 20px; margin-bottom: 20px;}
.news .bx p {color: #627293; font-size: 14px; line-height: 28px;}
.news .bx img {width: 100%; display: block;}
.news .bx .grid__image {display: block; position: relative; margin: 0 auto;}
.news .bx .grid__image .hov {position: absolute; bottom: 0; left: 0; right: 0; top: 0; background-color: rgb(15 164 228 / 72%); overflow: hidden; width: 100%; height: 100%; -webkit-transform: scale(0); transition: .6s ease;}
.news .bx:hover .grid__image .hov {transform: scale(1);}
.news .bx .grid__image .hov p {color: #fff; font-size: 15px; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); text-align: center;}
.post-date {position: absolute; background-color: #fff; color: #757575; font-size: 12px; bottom: 0; right: 0; padding: 0.5rem 1rem 0.4rem; z-index: 99;}
.line{background: #ccc; width: 100%; height: 1px; margin-top: 20px;}
.news a{ color: #2196f2; font-size: 13px; margin-top: 20px; display: block;  }

@media only screen and (min-width : 1920px) and (max-width : 2560px){

#thumblist{margin-top: 80px}
}
@media only screen and (min-width : 1600px) and (max-width : 1919px){


}
@media only screen and (min-width : 1440px) and (max-width : 1599px){


}
@media only screen and (min-width : 1366px) and (max-width : 1439px){


}
@media only screen and (min-width : 1280px) and (max-width : 1365px){
.about h3 {font-size: 30px;}


}
@media only screen and (min-width : 1200px) and (max-width : 1279px){
.about h3 {font-size: 30px;}


}
@media only screen and (min-width : 1024px) and (max-width : 1199px){
.news {padding: 60px 0; padding-top: 20px;}
.news h2 {font-size: 30px;}
.news .bx h4 {font-size: 18px; margin-top: 15px; margin-bottom: 10px;}


}
@media only screen and (min-width : 768px) and (max-width :1023px){
.news {padding: 50px 0; padding-top: 10px}
.news h2 {font-size: 28px; margin-bottom: 10px;}
.news .butt {float: left; margin-top: 20px;}
.news .bx h4 {font-size: 18px; margin-top: 15px; margin-bottom: 10px;}


}
@media only screen and (min-width : 150px) and (max-width : 767px){
.about {padding: 50px 0;}
.about h3 {font-size: 24px; line-height: 36px; margin-top: 10px; width: 100%;}


.news {padding: 50px 0; padding-top: 10px}
.news h2 {font-size: 24px; margin-bottom: 10px;}
.news .butt {float: left; margin-top: 20px;}
.news .bx h4 {font-size: 18px; margin-top: 15px; margin-bottom: 10px;}

}
@media only screen and (max-width : 375px){



}
@media only screen and (max-width : 360px){



}
@media only screen and (max-width : 320px){



}