.model-wrap{ max-width: 1280px; margin: 0 auto;}

.model-header .top .box{ height: 195px;  justify-content: space-between;}
.model-header .top dl{ flex-direction:row-reverse; text-align: right;}
.model-header .top dl dt{ margin-left: 1em;}
.model-header .menu{ background: #fff; border-bottom: 1px solid #004899;}
.model-header .menu .menu-ul{padding-left:9em;background: brown;}
.model-header .menu li{ float: left; margin-right: 4em;}
.model-header .menu li a{ display: block; padding:0.7em 0; position: relative;font-size:1.3em;color: #fff;}
.model-header .menu li.cur a{ color: #004899;}
.model-header .menu li.cur a::after{ content:''; position: absolute;  height: 4px; background: #004a99; left: 2px; right: 2px; top: 75%; border-radius: 2px;}

.model-main{ background: url(/upload/model/01/bg.jpg) center top no-repeat;}

.model1-box{ padding: 5% 0 0;}
.model-title{ position: relative; border-bottom: 2px solid #d8d8d8; padding-bottom: 0.8em; margin-bottom: 1.5em; }
.model-title::after{ content: ''; position: absolute; width: 8em; height: 2px; left: 0; bottom: -2px;background: #1e3b7b;}
.model-title .right i{ margin-left: 0.3em;}

.model1-box .left22{ width: 56.5%; float: left; margin-right: 30px; position: relative;}
.model1-box .left22 .swiper-pagination{ position: absolute; left: auto; right: 1em; bottom: 0.9em; text-align: right; z-index: 10; }
.model1-box .left22 .swiper-pagination-bullet{ background: #fff; opacity: 1; transform: scale(0.6);}
.model1-box .left22 .swiper-pagination-bullet-active{transform: scale(1.2); }
.model1-box .left22 .img_ratio{ padding-top: 56.5%;}
.model1-box .left22 .p{ position: absolute; left: 0; bottom: 0; right: 0; z-index: 2; color: #fff; padding:0.7em 1em; background: rgba(0,0,0,0.7); padding-right: 6em;}

.model1-box .right22{   overflow: hidden; }
.model1-box .right22 ul{ padding:0 0;}
.model1-box .right22 li{   padding-right: 8em; position: relative;}
.model1-box .right22 li:last-child{ border: 0; margin-bottom: 0; padding-bottom: 0;}
.model1-box .right22 li a{ display: block; padding: 0.55em 0;}
.model1-box .right22 li span{ position: absolute; right: 0; top: 50%; transform: translateY(-50%);color: #999;}

.model1-box2{ margin-top: 30px; margin-bottom: 4%; background:#f7f7f7;}
.model1-box2 li{ float: left; width: 33.33%;}
.model1-box2 ul{ margin: 0 ; padding:1em 2em ;}
.model1-box2 li .w{ position: relative; padding: 0.5em 2em 0.5em 1em; }
.model1-box2 li .w::after{ content:''; position: absolute; left: 0;  top: 50%; height: 4px; width: 4px; background-color: #004899; border-radius: 100%;}
.model1-box2 li .w a{ display: block; }

.model2-bk{ padding-bottom: 2%;}
.model2{ width: 66%;margin-right: 20px;float: left;}
.model3{ overflow: hidden;}

.model3-bk1{ overflow: hidden; margin-top: 1.5em;}
.model3-bk1 ul{ background: #f7f7f7; padding: 8px 20px 7px;} 
.model3-bk1 li{ border-bottom: 1px dashed #e5e7e9; padding: 10px 0; }
.model3-bk1 li:last-child{ border: 0;}
.model3-bk1 li .d{ color: #666;}
.model3-bk1 li a{ padding-left: 1em; position: relative; display: block;}
.model3-bk1 li a::after{ content: ' '; left: 0; top: 10px; border-radius: 5px; width: 4px; height: 4px; background: #333; position: absolute;}
.model3-bk1 li a:hover::after{ background:#004999;}


.model2-list-2{ }
.model2-list-2 li{ margin-bottom: 1.6em;}
.model2-list-2 .w{ }
.model2-list-2 .left{ width: 195px;  float: left;  margin-right:2em ;   }
.model2-list-2 .left .img_ratio{ padding-top: 56%; overflow: hidden;}
.model2-list-2 .left .img_ratio img{ transition: 0.3s all;}
.model2-list-2 .left a:hover img{ transform: scale(1.1);}
.model2-list-2 .right{  overflow: hidden;}
.model2-list-2 .right a{ display: block; margin: 0.5em 0;}
.model2-list-2 .right .p2{ margin: 10px 0 ;}
.model2-list-2 .right .from{ color: #999;}
.model2-list-2 .right .dt{ display: inline-block;  background-image: linear-gradient(to right, #1868d5, #2094f4); color: #fff; border-top-right-radius: 10px; border-bottom-left-radius: 10px; padding: 2px 1em;}

.model-4 .list{padding: 1% 0 5%;}
.model-4 .list ul{ margin: 0 -10px;}
.model-4 .list li{ float: left; width: 25%;}
.model-4 .list li .w{ margin: 0 10px 20px; }
.model-4 .list li .w .img_ratio{ padding-top: 56%;}
.model-4 .list li .w p{  padding: 0.2em 0 0;}
.model-4 .list li .w a{ display: block;}

.model-5 .list{padding: 1% 0 5%; overflow: hidden;}
.model-5 .list ul{ margin: 0 -20px;}
.model-5 .list li{ float: left; width: 20%;}
.model-5 .list li .w{ margin: 0 20px 20px; }
.model-5 .list li .w .img_ratio{ padding-top: 61%;}

.model-footer{ background: #edf4fa; border-top: 5px solid #1e86ea;}
.model-footer .model-wrap{ padding: 30px 0; text-align: center;}
.model-footer .t1{ justify-content: center;}
.model-footer .t1 .img{ margin: 0 2em 0 0;}
.model-footer .t1 dl{ width: 300px; background: #ffffff; position: relative; text-align: left;}
.model-footer .t1 dd{ background: #fff; border: 1px solid #eee; box-shadow: 0 0 5px rgba(0,0,0,0.1); position: absolute; left: 0; bottom: 100%; width: 100%; display: none;}
.model-footer .t1 dl:hover dd{ display: block;}
.model-footer .t1 dl:hover dt i{ transform: rotateX(180deg);}
.model-footer .t1 dd a{ padding: 5px 10px; display: block;}
.model-footer .t1 dd a:hover{ background: #004899; color: #fff}
.model-footer .t1 dt{ position: relative; padding:6px 10px; }
.model-footer .t1 dt i{ position: absolute; right: 0; top: 0; bottom: 0; width: 3em; background: #2195f5;}
.model-footer .t1 dt i::after{ content: ''; left: 50%; top: 50%; width: 0; height: 0; border: 5px solid rgba(0,0,0,0); border-top-color: #fff; position: absolute; margin: -3px 0 0 -5px;}
.model-footer .t2{ margin: 1em 0;}
.model-footer .t2 a{ vertical-align: middle; display: inline-block;}
.model-footer .t2 span{ vertical-align: middle; background: #666; width: 1px; height: 1em; display: inline-block; margin: 0 10px;}




 .pad-box{ padding: 2% 0;}
 .art-left{ float: left; width: 300px; margin-right: 40px;}
 .art-left .left-title { background: url(/static/images/leftbg.png) no-repeat; height: 88px; color: #fff; line-height: 80px; padding-left:25px; background-size: 100% 100%;}
 .left-menu li a{ padding: 15px 15px 15px 25px; border-bottom: 1px solid #e5e5e5; border-left: 3px solid #fff;  display: block; position: relative;}
 .left-menu li.ch.open .a,
 .left-menu li.cur a{ border-left-color: #004999; background: #f4f9fc; color: #004899;}
 .left-menu li a.cur{background: #f4f9fc; color: #004899;}
 .left-menu li a::after{ content: ''; position: absolute; right: 15px; top: 50%; margin-top: -5px; background: url(/static/images/jt44.png); background-size: 100%; width: 6px; height: 9px;}
 .left-menu li.cur a::after,
 .left-menu li a.cur::after,
 .left-menu li.open .a::after{background-image: url(/static/images/jt33.png);}
 .left-menu li a:hover{border-left-color: #004999; background: #f4f9fc; color: #004899;}
 .left-menu li .child a{padding: 5px 15px 5px 45px; border: 0;}
 .left-menu li .child{ border-bottom: 1px solid #e5e5e5; padding: 10px 0; display: none;}
 .left-menu li.ch .a::after{ transform: rotate(90deg); margin-top: -2px;}
 .left-menu li.ch.open .child,
 .left-menu li.ch.cur .child{ display: block;}
 .left-menu li.ch.open .a::after{transform: rotate(-90deg);}

 .left-menu.left-menu-guide li.cur a{padding: 15px 15px 15px 25px; }
 .left-menu.left-menu-guide li a{padding: 8px 15px 8px 25px; }

 .art-right{ overflow: hidden;}

 .right-title{ border-bottom: 1px solid #ccc; position: relative; padding-bottom: 15px;}
 .right-title::after{ content: ''; left: 0;  bottom: -2px; height: 3px; width: 40px; background: #cc0100; position: absolute;}
 .right-title .right{ border-radius: 100px; padding-right: 10px; border: 1px solid #ccc; overflow: hidden; }
 .right-title .right input{ border: 0; padding: 5px 10px 5px 20px; width: 170px;}
 .right-title .right input::placeholder{ color: #aaa;}
 .right-title .right button{ background: url(/static/images/ss.png)  no-repeat; width: 17px; height: 17px; background-size: 100%; border: 0;}

 .right-title .right2 a{ background: #004899; color: #fff; padding: 0.5em 1.5em; border-radius: 100px;}
 .right-title .right2 a span{ margin-right: 10px;}
 .right-title .right2 a i{ margin-top: 1px; font-weight: bold;}
 .right-title .right2 a:hover{ background: #cc0100;}

.news-list-1{ padding-top: 20px;}
.news-list-1 .w{ border-bottom: 1px dashed #b8b7b7; padding: 30px; overflow: hidden; display: block;}
.news-list-1 .w:hover{ background: #f4f9fc; border-bottom-color: #f4f9fc;}

.news-list-1 .d{ float: left; line-height: 1.4;  margin-right: 30px;}
.news-list-1 .t{ overflow: hidden;}
.news-list-1 .t h3{ margin-bottom: 8px;}
.news-list-1 .t .p2{ color: #666;}

.page-com{ padding: 4% 0 0; text-align: center;}
.page-com a{ padding: 5px 10px; min-width: 1em; display: inline-block; border: 1px solid #dcdcdc; border-radius: 5px; margin: 0 5px; color: #999;}
.page-com span{ display: inline-block; margin: 0 10px;}
.page-com a.cur,
.page-com a:hover{ color: #004899; border-color: #004899;}

.news-list-2{ padding: 40px 0 0;}
.news-list-2 li{ margin-bottom: 15px;}
.news-list-2 .w{ border: 1px solid #f7f7f7; background: #fefefe;}
.news-list-2 .left{ width: 240px;  float: left;    }
.news-list-2 .left .img_ratio{ padding-top: 66.66%; overflow: hidden;}
.news-list-2 .left .img_ratio img{ transition: 0.3s all;}
.news-list-2 .left a:hover img{ transform: scale(1.1);}
.news-list-2 .right{ padding: 20px; overflow: hidden;}
.news-list-2 .right a{ display: block;}
.news-list-2 .right .p2{ margin: 10px 0 ;}
.news-list-2 .right .from{ color: #999;}
.news-list-2 .right .from span.d{ display: inline-block; margin-left: 2em; padding-left: 1em; background: url(/static/images/data.png) no-repeat left center; background-size: 12px 12px;}

.content-box .pad-box{ padding: 5% 0;}
.content-box .cont2{ justify-content: center; padding: 20px 0 30px; margin-bottom: 30px; border-bottom: 1px solid #d0d0d0;}
.content-box .cont2 span{ margin: 0 1em; }
.content-box .cont2 a{ display: inline-block; width: 25px; height: 25px; margin: 0 4px;}
.content-box .cont2 a.wb{ background: url(/static/images/f1.png);}
.content-box .cont2 a.wx{ background: url(/static/images/f2.png);}

.content-bottom{ padding: 40px 0 50px; border-top: 1px solid #d0d0d0; margin-top: 40px;}
.content-bottom p{ padding: 5px 0;}
.content-bottom .left a:hover{ text-decoration: underline !important;}
.content-bottom .right a{ display: block; padding: 6px 2em; border: 1px solid #d0d0d0; border-radius: 100px;}
.content-bottom .right a:hover{background: #004999; color: #fff; border-color: #004999;}


@media only screen and (max-width:1330px) {
    .model-wrap{ width: 1024px;}
    
}


@media only screen and (max-width:1023px) {
    .model-wrap{ width: auto; margin: 0 20px;}

    .art-left{ display: none;}
    .news-list-2 .left{ width: auto; float: none;}

}

@media only screen and (max-width:750px) {
    .model-title{ padding-top: 1em;}
    .model-header .top .box{ display: block; text-align: center; height: auto; padding: 2em 0;}
    .model-header .menu ul{ padding: 0 ; white-space: nowrap; overflow-x: auto;}
    .model-header .menu ul li{ float: none; display: inline-block; margin-right: 1em;}
    .model-header .top .left{ margin-bottom: 2em;}
    .model-header .top dl{ text-align: center; justify-content: center;}
    .model2,
    .model1-box .left22{ width: auto; margin: 0 auto 2em; float: none;}
    .model1-box2 li{ float: none; width: auto;}
    .model1-box2 ul{ padding: 1em;}
    .model2-list-2 .left{ width: 120px;}
    .model2-list-2 .right .from{ display: none;}
    .model-4 .list li{ width: 50%;}
    .model-5 .list li{ width: 50%;}
    .model-footer .t1{ display: block;}
    .model-footer .t1 .img{ display: inline-block; margin: 0 1em;}
    .model-footer .t1 dl{ display: block; margin: 1em auto;}
    
}