.cms-main-content:before {  content:"";  width: 724px; height:1085px; position: absolute; z-index: 0; left:-200px;  top:-60px; animation-delay:2s; animation:style1 4s ease 1 both;  background: url("../images/index/pattern-l.png") no-repeat 0 0; background-size:724px auto;  }
@keyframes style1 {
0% {  margin-left: -150px; margin-top:-100px; -webkit-transform: scale(0.2); transform: scale(0.2);  }
100% { margin-left: -100px;  margin-top:-150px;  -webkit-transform: scale(0.45); transform: scale(0.45);}
}
@-webkit-keyframes style1 {
0% {  margin-left: -150px; margin-top: -100px; -webkit-transform: scale(0.2); transform: scale(0.2);  }
100% { margin-left: -100px;  margin-top:-150px;  -webkit-transform: scale(0.45); transform: scale(0.45);}
}


.cms-main-content:after {  content:""; width: 335px; height:644px; position: absolute; z-index: 0; right: -80px;  top:-160px; animation-delay:300s; animation:style2 6s ease 1 both; background: url("../images/index/pattern-r.png") no-repeat 0 0; background-size:335px auto;  }
@keyframes style2 {
0% {  margin-right: -100px; margin-top: -100px; -webkit-transform: scale(0.5); transform: scale(0.5);  }
100% { margin-right: -50px; margin-top:  0px;  -webkit-transform: scale(0.6); transform: scale(0.6);}
}
@-webkit-keyframes style2 {
0% {  margin-right: -100px; margin-top: -100px; -webkit-transform: scale(0.5); transform: scale(0.5);  }
100% { margin-right: -50px; margin-top:  0px;  -webkit-transform: scale(0.6); transform: scale(0.6);}
}

@media (max-width: 1440px) {
.cms-main-content:before {left:-40px; top:60px;width: 360px; height:540px; background-size:360px auto;  }
.cms-main-content:after {right:-40px; width: 260px; height:520px; background-size:260px auto;  }
}
@media (max-width: 1199.98px) {
.cms-main-content:before {left:0px; top:-20px;width: 280px; height:440px; background-size:280px auto; opacity:.5; }
.cms-main-content:after {right:-60px;  top:-140px; width: 260px; height:520px; background-size:260px auto; opacity:.5;  }
 }

@media (max-width: 767.98px) {
.cms-main-content:before {display: none;}
.cms-main-content:after {display: none;}
    
}



.cms-blog { width: 100%; margin: auto; display: flex; flex-wrap: wrap; flex-direction: row; justify-content: flex-start; align-content: flex-start; }
.cms-blog li{ width: calc(100%/3 - 30px); margin: 30px 15px;   min-height: 510px; max-height:510px;  flex-wrap: wrap; flex-direction: column; position: relative; background-color: #fff;  border-top-left-radius:15px; border-top-right-radius:15px; transition: all 0.3s linear 0s;  overflow: hidden;}
.cms-blog li:hover { box-shadow: 0 1px 35px 0 rgba(0, 0, 0, 0.3);}
.cms-blog li figure { position: relative; overflow: hidden;  width:100%; max-width:100%; height: auto; align-items: flex-start;  transition: all 0.5s ease 0s; }
.cms-blog li figure img { width: 100%; max-width: 100%; height: auto; transition: all 0.3s;}
.cms-blog li:hover figure img { transform: scale(1.1);  opacity: 0.6;}
.cms-blog li figure .cms-blog-icon { position: absolute;  top:10px;  right: 10px; background: #ac0b0b;  color: #fff;  font-weight: bold; border-radius: 100%;  height: 55px; width: 55px; display: flex; flex-direction: column; align-items: center; font-size: 12px; text-transform: uppercase;}
.cms-blog-info{ position: relative; display: flex; flex-wrap: wrap; justify-content: flex-start;  padding:20px; height: auto; max-height:160px;   }
.cms-blog-category {position: relative; top: -40px; left: 0; max-width:60%; max-height:36px;  padding: 8px 15px; color: #fff;  background:#8a5b1e;  font-size:0.875rem; font-weight: bold; overflow: hidden; word-break:break-all;  text-overflow: ellipsis;  display: -webkit-box; -webkit-line-clamp: 1;  -webkit-box-orient: vertical;  border-bottom-left-radius:15px; border-top-right-radius:15px;   }
.cms-blog-title {  width: 100%;  margin-top:-30px; padding: 0 0 10px; color: #6d430d; font-size:1.15rem; font-weight: 700; overflow: hidden; word-break:break-all;  text-overflow: ellipsis;  display: -webkit-box; -webkit-line-clamp: 2;  -webkit-box-orient: vertical; }
#cms-main .cms-blog-info p{ min-height:76px; color: #666; font-size: 0.95rem; line-height: 1.8em;  overflow: hidden; word-break:break-all;  text-overflow: ellipsis;  display: -webkit-box; -webkit-line-clamp: 3;  -webkit-box-orient: vertical;}

@media (max-width: 1199.98px) {
.cms-blog li{ min-height:460px; }
    
}
@media (max-width: 991.98px) {
.cms-blog li{ min-height:420px; }

}

@media (max-width: 767.98px) {
.cms-blog li{display: flex; width: calc(100%/2 - 20px); margin: 30px 10px; padding:0px;  min-height:300px;align-content: flex-start; align-items: flex-start;   }
.cms-blog li figure .cms-blog-icon { top: 20px;  right: 20px; height: 35px; width: 35px;}
.cms-blog-category {position: relative;}
.cms-blog-info  { position: relative; width: 100%; max-height: 160px; padding:5px;  }
.cms-blog-title {  font-size:1rem; margin-bottom:0px;  }
.cms-blog-info p{font-size: 0.85rem; } 
}

.cms-main-post{ display: flex; flex-wrap: wrap; justify-content: center; word-break: break-all; }
.cms-main-post p{display: block;}
.cms-main-post h3{margin: 0;text-align: left; font-size: 1.75rem; line-height: 1.2; font-weight:400;color: #000; }
.cms-main-post-time p time{color:#5359a0; font-size: 0.875rem; font-weight:400;}
.cms-main-post-time p time b{  display: block; font-size:2rem; font-weight: 700; }
.cms-main-post-pagination{ padding: 45px 0;  display: flex;}
.cms-main-post-pagination h2 {  font-size: 1.125rem; font-weight: 400; max-width: 280px; color: #000000;}
.cms-main-post-pagination>div { cursor: pointer; width: 100%; position: relative;  display: flex; align-items: center;}
.cms-main-post-pagination .cms-prev { padding-right: 12px;} 
.cms-prev:after { content: ''; width: 1px;  height: 50px;  background-color: #cccccc; position: absolute; right: 0; top: 6; display: block;}
.cms-prev h2 { margin-left: 24px; margin-right: 12px;}
.cms-prev .cms-btn {  margin-left: auto;}
.cms-prev .cms-btn:before {  order: 1;}
.cms-prev .cms-btn:after {  border-width: 5px 5px 5px 0;}
.cms-next { padding-left: 12px; justify-content: flex-end;}
.cms-next h2 { margin-left: 12px;  margin-right: 24px;}
.cms-next .cms-btn { order: 0; margin-right: auto;}
.cms-next h2 { order: 1;}
.cms-next .cms-main-post-time {order: 2;}
.cms-btn { cursor: pointer; width: 35px;  height: 20px; position: relative; display: flex; align-items: center;}
.cms-btn:before { content: ''; width: 30px; height: 1px; background-color: #31315e; display: block;}
.cms-btn:after { content: ''; width: 0; height: 0; border-style: solid; border-width: 5px 0 5px 5px; border-color: transparent #31315e; display: block;}

 

@media (max-width:767px) {
 .cms-main-post-pagination h2 {display: none;}

}