.mainProCen { width: 100%; max-width: 1200px; position: relative; padding-top: 5.25%; padding-bottom: 3.75%; }
 .mainProCen .left { width: 34.16667%; float: left; color: #3074b3; padding-right: 5%; box-sizing: border-box;}
@media screen and (max-width: 960px) {  .mainProCen .left { float: none; width: 100%; padding-right: 0; margin-bottom: 50px; } }
 .mainProCen .left:before { width: 200%; background: #E7E7E7; z-index: -2; right: 65.83333%; }
@media screen and (max-width: 960px) {  .mainProCen .left:before { display: none; } }
 .mainProCen .left .title { font-size: 44px; margin-bottom: 4.39024%; line-height: 1; margin-top: 12.19512%; position: relative; }
@media screen and (max-width: 1200px) {  .mainProCen .left .title { font-size: 36px; } }
@media screen and (max-width: 960px) {  .mainProCen .left .title { font-size: 30px; } }
@media screen and (max-width: 640px) {  .mainProCen .left .title { font-size: 24px; } }
@media screen and (max-width: 960px) {  .mainProCen .left .title { margin-top: 0; } }
 .mainProCen .left .title:before { position: absolute; top: 0; left: 0; content: ''; width: 5px; height: 80px; margin-left: -18px; background: #3074b3; overflow: hidden; }
 .mainProCen .left p.text { font-size: 16px; line-height: 24px; max-height: 72px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
 .mainProCen .left .lm { color: #3074b3; position: relative; margin-top: 12.19512%; display: inline-block; }
 .mainProCen .left .lm:before { position: absolute; top: 100%; left: 0; content: ''; width: 100%; height: 2px; background: #3074b3; }
 .mainProCen .left .lm:hover:before { width: 0; }
 .mainProCen .right { width: 65.83333%; float: right; padding-left: 7.5%; box-sizing: border-box;}
@media screen and (max-width: 960px) {  .mainProCen .right { float: none; width: 100%; padding-left: 0; } }
 .mainProCen .right .mainScroll .box, .mainProCen .right .mainScroll .line { width:31.5%; }
 .mainProCen .right .mainScroll .box { margin-bottom:15px; }
 .mainProCen .right .mainScroll .box a {display: block;}
 .mainProCen .right .mainScroll .box a img { width: 100%; border-radius: 10px; }
 .mainProCen .right .mainScroll .box a .title { font-size: 20px; color: #000; line-height: 1; margin-top: 11px; margin-bottom: 8px; display: inline-block; }
@media screen and (max-width: 960px){
     .mainProCen .right .mainScroll .box a .title{font-size: 16px;}
}
@media screen and (max-width: 600px){
     .mainProCen .right .mainScroll .box, .mainProCen .right .mainScroll .line{width:47%;}
}
 .mainProCen .right .mainScroll .box a .text { color: #777; line-height: 20px; max-height: 40px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
 .mainProCen .right .mainScroll .box a:hover .title,  .mainProCen .right .mainScroll .box a:hover .text { color: #B82E32; }


 .mainProCen:after,  .mainProCen .left:before { content: ''; height: 100%; top: 0; position: absolute; }