@charset "utf-8";
/* CSS Main */

.banner { position: relative; width: 100%; height: 391px; display: flex; align-items: center; justify-content: center;}
.banner .banner-title h2 { color: #ffffff; font-size: 40px; line-height: 1; margin-bottom: 20px;}
.banner .banner-title p { color: #ffffff; font-size: 26px; line-height: 1; opacity: 0.78;}

.ele { width: 1200px; margin: 0 auto;}
.ele .ele-title { padding: 80px 0 40px;}
.ele .ele-title h2 { font-size: 30px; color: #333333; line-height: 1;}
.ele .ele-title p { color: #666666; font-size: 15px; line-height: 1; margin-top: 24px;}

.ele-1 .top { padding: 60px 0 30px; display: flex; align-items: center; justify-content: space-between; text-align: left; overflow: hidden;}
.ele-1 .top h3 { font-size: 22px; color: #333333; line-height: 1;}
.ele-1 .top .search { border: 1px #cccccc solid; border-radius: 3px; width: 390px; height: 38px; line-height: 38px; padding: 0 10px; box-sizing: border-box; position: relative;}
.ele-1 .top .search input { width: 100%; margin: 0;}
.ele-1 .top .search .search-btn { cursor: pointer; display: block; width: 19px; height: 18px; background: url(../img/information/icon-search.png) 0 0 no-repeat; position: absolute; top: 50%; right: 10px; transform: translateY(-50%);}
.ele-1 .ele-inner ul { align-items: flex-start; justify-content: space-between;  flex-wrap: wrap;}
.ele-1 .ele-inner ul li { flex: 0 0 500px; margin-bottom: 40px; padding: 30px 40px; box-shadow: 0 11px 29px rgba(197, 197, 197, 0.19);}
.ele-1 .ele-inner ul li h4 { font-size: 20px; margin-bottom: 10px;}
.ele-1 .ele-inner ul li .article-tips { display: flex; align-items: center; justify-content: flex-start; margin-bottom: 10px;}
.ele-1 .ele-inner ul li .article-tips>div { display: flex; align-items: center; justify-content: flex-start; margin-right: 22px; font-size: 12px; color: #999999;}
.ele-1 .ele-inner ul li .article-tips .date i { display: block; width: 16px; height: 16px; background: url(../img/information/icon-date.png) 0 0 no-repeat; margin-right: 8px;}
.ele-1 .ele-inner ul li .article-tips .name i { display: block; width: 12px; height: 15px; background: url(../img/information/icon-name.png) 0 0 no-repeat; margin-right: 8px;}
.ele-1 .ele-inner ul li .article-tips .view i { display: block; width: 20px; height: 13px; background: url(../img/information/icon-view.png) 0 0 no-repeat; margin-right: 8px;}
.ele-1 .ele-inner ul li .article { text-align: justify; margin-bottom: 30px; line-height: 30px; color: #666666;}
.ele-1 .ele-inner ul li .view-more { display: flex; align-items: center; justify-content: flex-start; color: #333333; width: 80px;}
.ele-1 .ele-inner ul li .view-more i { display: block; width: 11px; height: 7px; background: url(../img/information/icon-more.png) 0 0 no-repeat; margin-left: 8px; transition: 0.4s;}
.ele-1 .ele-inner ul li .view-more:hover { text-decoration: underline;}
.ele-1 .ele-inner ul li .view-more:hover i { transform: translateX(3px);}

.ele-1 .pagination { display: flex; align-items: center; justify-content: center; margin-bottom: 50px;}
.ele-1 .pagination li { margin: 0 5px;}
.ele-1 .pagination li a { display: block; width: 24px; height: 24px; line-height: 24px; border: 1px #2C94FB solid; text-align: center; background: #ffffff; color: #2C94FB;}
.ele-1 .pagination li.active span { display: block; width: 24px; height: 24px; line-height: 24px; border: 1px #2C94FB solid; color: #ffffff; background: #2C94FB; text-align: center;}
.ele-1 .pagination li.disabled span { display: block; width: 24px; height: 24px; line-height: 24px; color: #2C94FB;}
.ele-1 .pagination li:hover a { display: block; width: 24px; height: 24px; line-height: 24px; border: 1px #2C94FB solid; color: #ffffff; background: #2C94FB; text-align: center;}

.loading { display: none; padding: 10px 50px; background: rgba(0, 0, 0, 0.6); color: #ffffff; border-radius: 6px; position: fixed; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%);}
.loading.active { display: block;}