main { overflow: hidden; zoom: 1 }

.container-xl{ max-width: 100% }

/*banner*/
.banner { position: relative; width: 100%; max-height: 660px; color: #fff; background: linear-gradient(180deg, #ff7a64, #4a84c3); background-repeat: no-repeat; background-size: cover; background-position: top center; overflow: hidden }
.banner:before { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .3) }
.banner.banner-about:before { display: none }
.banner img { display: block; width: 100%; max-width: 100%; height: 34.375vw; object-fit: cover; object-position: center center }
.banner-box { position: absolute; inset: 0; z-index: 2 }
.banner-box>.flex { height: 100%; align-items: center }
.banner-flex { flex-direction: column; align-items: flex-start }
.banner-tit span { font-size: 42px }
.banner-tit h2 { font-weight: 600; font-size: 42px }
.banner-info { position: relative; width: 572px; height: 227px; margin-top: 80px; padding-top: 40px; padding-right: 40px }
.banner-info::before { content: ""; display: block; position: absolute; left: 0; bottom: 86px; width: 85px; height: 3px; background: #bc1e21 }
.banner-info::after { content: ""; position: absolute; top: 0; right: 0; width: 384px; height: 227px; border: 10px solid rgba(255, 255, 255, .3) }
.banner-info p { position: relative; z-index: 1; line-height: 28px; font-size: 16px; text-indent: 2em; text-transform: uppercase }
.banner-info a { position: absolute; right: 35px; bottom: 30px; color: #bc1e21; font-weight: 600 !important; line-height: 24px; padding-bottom: 5px; font-size: 12px; border-bottom: 1px solid #bc1e21 }

.banner.banner-product:before { display: none }

/*submenu*/
.submenu { height: 10vh; background: #fff; border-bottom: 1px solid #dee2e6; text-align: center }
.submenu li { display: inline-block; margin: 0 3.9vw; height: 10vh; line-height: 10vh }
.submenu li a { display: block; position: relative; padding: 0 0px; font-size: 16px; color: rgba(0, 0, 0, .75); height: 100% }
.submenu li a:after { content: ''; display: block; width: 100%; height: 3px; background: #bc1e21; position: absolute; left: 0; bottom: 0; border-radius: 10px 10px 0 0; transform: scaleX(0); transition: ease .65s }
.submenu li a:hover, .submenu li.on a { text-shadow: .002rem 0 0 currentColor; color: #bc1e21 }
.submenu li a:hover:after, .submenu li.on a:after { transform: scaleX(1) }

.mainbox { padding: 5vh 0 8vh; background: #f4f4f8 }
.pagebox, .aboutbox, .fuwubox { padding: 0 0 8vh; background: #f4f4f8 }

/*position*/
.position { padding: 25px 0; font-size: 12px }
.position.pt60 { padding-top: 75px }
.position .iconfont { margin-right: 10px; font-size: 14px }
.position a { padding: 0 5px }
.position a:hover { color: #4a84c3 }

/*list*/
.newslist {  }
.newslist li:nth-child(n+5) { margin-top: 30px }
.newslist li>a { position: relative; display: block; background: #fff; box-shadow: 0 0 24px rgba(0, 0, 0, .12) }
.newslist li>a figure { position: relative; margin: 0; overflow: hidden }
.newslist li>a figure:before { content: ""; display: block; background-size: cover; background-position: 50%; padding-bottom: 66% }
.newslist li>a figure img { display: inline-block; width: 100%; height: 100%; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: all .4s ease; -moz-transition: all .4s ease; transition: all .4s ease; position: absolute; top: 0 }
.newslist li:hover>a figure img { transform: scale3d(1.1, 1.1, 1) }
.newslist li>a .newsinfo { padding: 30px 15px; overflow: hidden }
.newslist li>a .newsinfo h3 { font-weight: 600; font-size: 18px; color: #333 }
.newslist li>a .newsinfo p { margin: 20px 0; line-height: 28px; font-size: 14px; color: #999 }
.newslist li>a .newsinfo time { font-size: 16px; font-family: "tel"; line-height: 1; color: #bc1e21 }
.newslist li>a:after { content: ''; display: block; width: 100%; height: 3px; background: #bc1e21; position: absolute; left: 0; bottom: 0; transform: scaleX(0); transition: ease .65s }
.newslist li>a:hover h3 { color: #bc1e21 }
.newslist li>a:hover:after { transform: scaleX(1) }
.newslist ~ .pagebar{ margin-top: 50px }

.searchlist li>a figure:before { padding-bottom: 100% }

.sollist li:nth-child(n+4) { margin-top: 30px }

.prolist li:nth-child(n+4) { margin-top: 30px }
.prolist li>a { position: relative; display: block; background: #fff; border: 1px solid #dcdcea; transition: ease .65s }
.prolist li>a figure { position: relative; margin: 0; overflow: hidden }
.prolist li>a figure:before { content: ""; display: block; background-size: cover; background-position: 50%; padding-bottom: 100% }
.prolist li>a figure img { display: inline-block; width: 100%; height: 100%; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: all .4s ease; -moz-transition: all .4s ease; transition: all .4s ease; position: absolute; top: 0 }
.prolist li:hover>a figure img { transform: scale3d(1.1, 1.1, 1) }
.prolist li>a h3 { padding: 30px 15px; text-align: center; overflow: hidden; font-size: 18px; color: #333 }
.prolist li>a:hover { box-shadow: 0 0 20px rgba(0, 0, 0, .1); border-color: #fff; color: #bc1e21 }
.prolist li>a:hover h3 { color: #bc1e21 }
.prolist ~ .pagebar { margin-top: 50px }

/*article*/
.article { position: relative; width: 100%; padding: 24px 40px; background: #fff; box-shadow: 0 0 10px -7px rgba(87, 53, 117, 0.13), 0 5px 30px -6px rgba(0, 60, 170, 0.1) }
.article-tit { padding-bottom: 30px; border-bottom: 3px solid #f0f1f2; text-align: center }
.article-tit h1 { font-weight: 600; font-size: 30px; color: rgba(0, 0, 0, .85); line-height: 40px; margin: 25px 0; word-wrap: break-word; word-break: break-all }
.article-tit .profile { font-size: 12px; color: #9199a1; line-height: 24px }
.article-tit .profile span { margin-right: 24px }
.article-tit .profile span i { margin-right: 5px; font-style: normal }
.article-info { overflow: hidden; padding-top: 24px }
.article-info .info { line-height: 1.8; font-size: 16px }
.article-info .info p { text-indent: 0; line-height: 32px; color: #1c1f21 }
.article-info .info img { max-width: 100%; vertical-align: top }
.article-info .info a { color: #4a84c3 }
.article-info .info a:hover { text-decoration: underline }
.article-info .info strong, .article-info .info th { font-weight: bold }
.fanye { margin-bottom: 10px; padding: 10px 0; line-height: 32px; border-top: 1px solid #f0f1f2 }
.fanye strong { color: #4a84c3; font-weight: normal }
.share-custom { margin-top: 30px; text-align: center }
.share-custom a { display: inline-block; width: 50px !important; height: 50px !important; border-radius: 50% !important; line-height: 50px !important; background: #66a2d4 !important; color: #fff !important; text-decoration: none !important; padding: 0 !important; margin: 0 19px !important; opacity: 1; font-size: 30px !important }
.share-custom a.icon-weibo { background: #ea5d5c !important }
.share-custom a.icon-wechat { background: #50b674 !important }
.share-custom a.icon-weibo:hover { background: #ea1c1c !important }
.share-custom a.icon-wechat:hover { background: #1cb452 !important }
.share-custom a.icon-qq:hover { background: #1f7cce !important }
.social-share .icon-wechat .wechat-qrcode { display: none; border: 1px solid #eee; position: absolute; z-index: 9; top: -204px; left: -75px; width: 200px; height: 192px; color: #666; font-size: 12px; text-align: center; background-color: #fff; box-shadow: 0 2px 10px #aaa; transition: all 200ms; -webkit-tansition: all 350ms; -moz-transition: all 350ms }
.social-share .icon-wechat .wechat-qrcode.bottom { top: 40px; left: -84px }
.social-share .icon-wechat .wechat-qrcode.bottom:after { display: none }
.social-share .icon-wechat .wechat-qrcode h4 { font-weight: normal; height: 26px; line-height: 26px; font-size: 12px; background-color: #f3f3f3; margin: 0; padding: 0; color: #777 }
.social-share .icon-wechat .wechat-qrcode .qrcode { width: 105px; margin: 10px auto }
.social-share .icon-wechat .wechat-qrcode .qrcode table { margin: 0 !important }
.social-share .icon-wechat .wechat-qrcode .help p { font-weight: normal; line-height: 16px; padding: 0; margin: 0 }
.social-share .icon-wechat .wechat-qrcode:after { content: ''; position: absolute; bottom: -13px; margin-left: -6px; left: 50%; width: 0; height: 0; border-width: 8px 6px 6px; border-style: solid; border-color: #fff transparent transparent }
.social-share .icon-wechat:hover .wechat-qrcode { display: block }
.go-back { position: relative; font-size: 14px; font-weight: 700; color: rgba(0, 0, 0, .85); text-align: center; margin-top: 50px; line-height: 1; display: block }
.go-back img { vertical-align: middle; margin-right: 10px }
.go-back i { display: inline-block; width: 18px; height: 18px; background: url(../images/return.svg) center no-repeat; background-size: cover; vertical-align: middle; margin-right: 10px }
.go-back:hover i { background-image: url(../images/return_hover.svg) }
.go-back::before { content: ''; display: inline-block; vertical-align: middle; width: 12.637%; height: 1px; background-color: rgba(0, 0, 0, .85); margin-right: 30px }
.go-back::after { content: ''; display: inline-block; vertical-align: middle; width: 12.637%; height: 1px; background-color: rgba(0, 0, 0, .85); margin-left: 30px }

/*single*/
.about-l { position: relative; z-index: 0; padding-top: 64.77% }
.about-l img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover }
.about-l::after { z-index: 2; position: absolute; left: 0; bottom: 0; width: 100%; height: 0.52vw; content: ""; display: block; background-color: #c7161e }
.about-r { display: flex; flex-direction: column; justify-content: center; width: auto; height: 100%; margin: 0 30% 0 3.26%; padding-top: 30px; padding-bottom: 30px }
.about-r h3 { font-weight: 600; color: #333; font-size: 30px }
.about-r .about-count { justify-content: space-between; align-items: center; margin-top: 30px }
.about-r .about-count li { }
.about-r .about-count li p { font-size: 14px }
.about-r .about-count li b { line-height: 1.2 }
.about-r .about-count li span.counter { font-size: 32px; color: #bc1e21 }
.about-r .about-count li sub { font-weight: normal; font-size: 14px }
.about-r .about-info { font-size: 16px }
.about-r .about-info p { text-indent: 2em; margin-top: 20px; line-height: 24px }

.about-hot { justify-content: space-around; align-items: center; padding: 90px 0 82px; color: #777; font-size: 24px }
.about-hot li { position: relative; z-index: 0; border: 2px solid #c7161e; padding: 0.3em 0.5em 0.3em 2em; -moz-border-radius: 0.5em; -webkit-border-radius: 0.5em; border-radius: 0.5em; text-align: center }
.about-hot li figure { position: absolute; left: -1.7em; top: 50%; margin: -1.7em 0 0; width: 3.4em; height: 3.4em; background-color: #c7161e; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; display: flex; justify-content: center; align-items: center }
.about-hot li figure img { width: 1.83em; height: 1.83em; display: block }
.about-hot li span { letter-spacing: 0.05em }
.about-hot li p { letter-spacing: 0.1em; font-size: 0.5em }

.zizhibox { position: relative }
.zizhibox::before { content: ""; display: block; position: absolute; z-index: 0; top: 0; left: 0; width: 100%; height: 47.8%; background-color: #fff }
.zizhibox .row { justify-content: space-between; padding: 13.7% 0 7.2% }
.zizhi-info { }
.zizhi-info h3 { margin-top: 60px; font-weight: 600; color: #333; font-size: 30px }
.zizhi-info p { margin-top: 30px; text-indent: 2em; line-height: 1.8 }
.zizhi-info ul { margin-top: 29.5%; justify-content: space-between }
.zizhi-info ul li { }
.zizhi-info ul li figure { width: 4.72em; height: 4.72em; margin: 0 auto 0.8em; background-color: #c7161e; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; display: flex; justify-content: center; align-items: center }
.zizhi-img figure { position: relative; z-index: 0; margin: 0; padding-top: 108.2% }
.zizhi-img figure img:first-child { position: absolute; z-index: 1; left: 0; top: 0; width: 71.6%; height: 91.5%; object-fit: contain; -moz-box-shadow: 0 0.4em 1.5em rgba(0, 0, 0, .32); -webkit-box-shadow: 0 0.4em 1.5em rgba(0, 0, 0, .32); box-shadow: 0 0.4em 1.5em rgba(0, 0, 0, .32) }
.zizhi-img figure img:last-child { position: absolute; z-index: 0; right: 0; bottom: 0; width: 71.6%; height: 91.5%; object-fit: contain; -moz-box-shadow: 0 0.4em 1.5em rgba(0, 0, 0, .32); -webkit-box-shadow: 0 0.4em 1.5em rgba(0, 0, 0, .32); box-shadow: 0 0.4em 1.5em rgba(0, 0, 0, .32) }
.zizhi-img figure img { transition: 0.6s }
.zizhi-img figure img:hover { transform: scale(1.03) }

.advabox li { margin-top: 30px }
.adva-tit h3 { margin-top: 60px; margin-bottom: 30px; text-align: center; font-weight: 600; color: #333; font-size: 30px }
.adva-item { position: relative; z-index: 0; padding: 10.5% 12.2% 10%; background: #fff }
.adva-item figure { position: absolute; top: 0; margin: 0; margin-top: 10.5%; right: 10.5% }
.adva-item figure img { display: block; width: 3.5em; height: 3.5em; object-fit: contain }
.adva-item h4 { font-weight: bold; font-size: 20px; color: #333 }
.adva-item span { display: block; margin-top: 0.5em; font-weight: bold; color: #777 }
.adva-item .intro { margin-top: 9%; line-height: 1.75; color: #777 }
.adva-item .num { position: absolute; z-index: -1; right: 0.2em; bottom: 0.1em; color: #f4f4f4; letter-spacing: 0.1em; font-size: 180px; line-height: 1em; font-family: "tel"; font-weight: bold }

/*yanfa*/
.yanfabox { background: #f4f4f8 }
.yanfa-item { position: relative; width: 100%; padding: 176px 0 }
.yanfa-item img.yanfabg { display: block; position: absolute; z-index: 0; left: 0; top: 0; width: 100%; height: 56.42%; object-fit: cover }
.yanfa-item .row { justify-content: space-between; align-items: flex-end }
.yanfa-left { }
.yanfa-left span { font-weight: bold; font-size: 30px; color: #333 }
.yanfa-left p { margin-top: 9%; line-height: 1.8; font-size: 16px; text-indent: 2em }
.yanfa-left ul { max-width: 378px; width: 85.3%; margin-top: 9%; justify-content: space-between; align-items: center }
.yanfa-left ul::after { content: ""; display: block; width: 100%; margin-top: -2.36em; padding-top: 49.3%; position: relative; left: 0; z-index: 1; background: url(../images/arc.png) center center no-repeat; background-size: 100.4% 100%; opacity: 0.14 }
.yanfa-left ul li { display: flex; justify-content: center; align-items: center; width: 84px; height: 84px; border-radius: 100%; background: #c7161e }
.yanfa-left a { display: inline-block; margin-top: 5.5%; border-bottom: 2px solid #b3625b; line-height: 1.4; color: #c7161e }
.yanfa-right figure { position: relative; z-index: 0; margin: 0; padding-top: 73.5% }
.yanfa-right figure img { position: absolute; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover }

/*service*/
.servbox { width: 100%; height: 100%; padding: 80px 0 120px; background: #f2f2f6 url(../images/serv_bg.jpg) center center no-repeat; background-size: cover }
.servbox h2 { font-weight: 600; font-size: 30px; text-align: center; color: #333 }
.servbox .servlist { margin-top: 6.9%; width: 100% }
.servbox .servlist ul { position: relative; z-index: 0; width: 100%; height: 451px; background: url(../images/serv_box.png) center no-repeat }
.servbox .servlist ul li { width: 438px; height: 163px; display: flex; flex-direction: column; justify-content: center; align-items: stretch; text-align: left }
.servbox .servlist ul li span { color: #444; font-size: 20px; font-weight: bold }
.servbox .servlist ul li p { color: #666; margin-top: 0.5em; max-height: 7em; overflow: hidden; line-height: 1.75em; font-size: 16px; text-indent: 2em }
.servbox .servlist ul li:nth-child(1) { position: absolute; top: 26px; left: 66px }
.servbox .servlist ul li:nth-child(2) { position: absolute; top: 26px; right: 66px }
.servbox .servlist ul li:nth-child(3) { position: absolute; bottom: 26px; left: 66px }
.servbox .servlist ul li:nth-child(4) { position: absolute; bottom: 26px; right: 66px }
.fuwubox { position: relative }
.fuwubox::before { content: ""; position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 55%; background: #fff }
.custbox { justify-content: space-between; padding: 100px 0 80px }
.cust-left figure { position: relative; z-index: 0; margin: 0; padding-top: 73.5% }
.cust-left figure img { position: absolute; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover }
.cust-right { margin-top: 2.7% }
.cust-right h3 { font-weight: 600; font-size: 30px; color: #333 }
.cust-right p { margin-top: 9%; line-height: 1.8; font-size: 16px }
.cust-right a { display: inline-block; margin-top: 8.7%; border-bottom: 2px solid #b3625b; line-height: 1.4; color: #c7161e }
.stepbox { justify-content: space-between; align-items: flex-start; font-size: 22px }
.stepbox li { display: flex; flex-direction: column; align-items: center; padding-right: 15px; position: relative }
.stepbox li::before { content: ""; position: absolute; top: 20px; right: 0; width: 15px; height: 18px; background: url(../images/arrow.png) no-repeat }
.stepbox li:last-child::before { content: initial }
.stepbox li img { display: block; height: 2.4em; padding: 0 2em }
.stepbox li span { margin-top: 0.5em; font-size: 18px; text-align: center }

/*contact*/
.contact-tit { text-align: center }
.contact-tit span { font-size: 2rem; color: #bc1e21 }
.contact-tit h3 { font-size: 1.25rem; color: #222222; margin: 1vh 0 5vh }
.contact { background: #bc1e21; border: 4px solid #bc1e21 }
.contact .contact-info { display: flex; flex-direction: column; justify-content: center; width: 100%; height: 100%; padding: 0 1.6vw; color: #fff }
.contact .contact-info p { padding: 20px 0 }
.contact .contact-info p.ewm img { display: block; width: auto; max-width: 120px }
.contact .contact-info p.ewm span { font-size: 12px; color: #adc4e5; margin-top: 10px }
.contact .map { height: 500px; overflow: hidden }
.contact .map #allmap { height: 550px }

.message-tit { margin-top: 7vh }
.message .form-item { display: flex; flex-direction: column; align-items: stretch; margin-bottom: 20px }
.message .form-item .form-label { display: block; padding: 9px 0; width: 130px; font-weight: 400; line-height: 20px; text-align: left; font-size: 16px; color: #444 }
.message .form-item .form-label span { color: #e81616; padding-left: 5px }
.message .form-item input, .message .form-item textarea { height: 45px; border: 1px solid #dee2e6; background-color: #fff; width: 100%; font-size: 14px; padding: 5px 10px; border-radius: 5px }
.message .form-item input:focus, .message .form-item textarea:focus { background: #fbfbfb; box-shadow: inset 0 0 9px rgba(204, 204, 204, .39) }
.message .form-item.me-msg textarea { height: 200px; margin-top: 10px; font-size: 14px; line-height: 24px; padding: 25px }
.message .form-list .btn { display: block; width: 160px; height: 50px; margin-left: 15px; border: 1px solid #bc1e21; border-radius: 25px; text-align: center; font-size: 16px; line-height: 50px; background-color: #bc1e21; color: #fff; cursor: pointer }
.message .form-list .btn:hover { background: #fff; border: 1px solid #bc1e21; color: #bc1e21 }

/*pages*/
.pagebar { padding: 10px 0 }
.pagebar .pagination { display: flex; justify-content: center }
.pagebar .pagination a, .pagebar .pagination span { min-width: 36px; height: 36px; line-height: 36px; text-align: center; color: #bc1e21; font-size: 14px; padding: 0 6px; margin: 0 6px; background: #fff; border-radius: 3px; text-decoration: none }
.pagebar .pagination a.page-size { font-size: 20px }
.pagebar .pagination a:hover, .pagebar .pagination a.page-num-current { color: #fff; background: #bc1e21 }
.pageno { padding: 20px 0; text-align: center; font-size: 14px; color: #999 }

/*grid*/
@media only screen and (max-width:1600px){
	.about-r { margin: 0; padding-right: 15px }
	.about-r .about-info { margin-top: 10px; font-size: 14px }
	.about-r .about-info p { margin-top: 5px }
}
@media only screen and (max-width:1400px){
    .servbox .servlist ul li:nth-child(1) { left: 0; padding-right: 20px }
    .servbox .servlist ul li:nth-child(2) { right: 0; padding-left: 20px }
    .servbox .servlist ul li:nth-child(3) { left: 0; padding-right: 20px }
    .servbox .servlist ul li:nth-child(4) { right: 0; padding-left: 20px }
    .servbox .servlist ul li p{ font-size: 14px }
    .stepbox li img { padding: 0 1em }
}
@media only screen and (max-width:1200px){
	.banner-flex { width: 100%; display: flex; flex-direction: row; justify-content: space-between; align-items: center }
	.banner-info { width: 422px; margin-top: 0 }
	.banner-tit span { font-size: 36px }
	.banner-tit h2 { font-weight: 600; font-size: 24px }
	.banner-info::after { width: 184px }

	.about-r h3{ font-size: 28px }
	.about-r .about-count{ margin-top: 20px }
	.about-r .about-info { margin-top: 10px; font-size: 12px }
	.about-r .about-info p { margin-top: 5px }
	.about-r .about-count li span.counter { font-size: 32px }
	.about-r .about-count li sub { font-weight: normal; font-size: 14px }

    .servbox .servlist ul li:nth-child(1) { padding-right: 50px }
    .servbox .servlist ul li:nth-child(2) { padding-left: 50px }
    .servbox .servlist ul li:nth-child(3) { padding-right: 50px }
    .servbox .servlist ul li:nth-child(4) { padding-left: 50px }
}
@media only screen and (max-width:992px){
	.submenu { overflow: hidden; height: 50px }
	.submenu li { height: 50px; line-height: 50px; margin: 0; padding: 0 10px }

    .prolist li>a h3{ font-size: 16px }

	.newslist li { flex: 0 0 33.33333%; max-width: 33.33333% }
	.newslist li:nth-child(n+4) { margin-top: 30px }




	.about-jj{     flex-direction: column }
	.about-jj .col-7, .about-jj .col-5{ flex: 0 0 100%; max-width: 100% }
	.about-r{ padding-left: 15px;}

    .about-hot { padding: 50px 0; font-size: 16px }
    .about-hot li p { letter-spacing: 0; font-size: 0.75em }

	.about-r .about-info { margin-top: 10px; font-size: 16px }
	.about-r .about-info p { margin-top: 15px }
	.about-r .about-count li span.counter { font-size: 32px }
	.about-r .about-count li sub { font-weight: normal; font-size: 14px }

    .zizhi-info h3{ margin-top: 0 }

    .servbox .servlist ul li { width: 40%; height: 210px }
    .servbox .servlist ul li:nth-child(1) { top: 0; padding-right: 50px }
    .servbox .servlist ul li:nth-child(2) { top: 0; padding-left: 50px }
    .servbox .servlist ul li:nth-child(3) { bottom: 0; padding-right: 50px }
    .servbox .servlist ul li:nth-child(4) { bottom: 0; padding-left: 50px }
    .servbox .servlist ul li p { max-height: initial; overflow: initial }

    .cust-right { flex: 0 0 41.66667%; max-width: 41.66667% }
    .stepbox { justify-content: center }

    .yanfa-item { padding: 9.16vw 0 }

    .yanfa-left { flex: 0 0 50%; max-width: 50%;}
    .yanfa-right{ flex: 0 0 50%; max-width: 50%;}
    .yanfa-left ul::after { content: initial }
}
@media only screen and (max-width:768px){
	.banner img { height: 58.66667vw }
	.banner-box>.flex { justify-content: center }
	.banner-flex { justify-content: center }
	.banner-tit { text-align: center }
	.banner-tit span { font-size: 20px }
	.banner-tit h2 { font-weight: 600; font-size: 20px }
	.banner-info { display: none }

	.newslist li { flex: 0 0 50%; max-width: 50% }
	.newslist li:nth-child(n+3) { margin-top: 30px }

	.article{ padding: 24px 15px }
	.article-tit h1{ font-size: 24px }

    .about-hot { font-size: 24px }
    .about-hot li { flex: 0 0 38%; max-width: 38%; margin: 0 6% }
    .about-hot li:nth-child(n+3) { margin-top: 30px }
    .about-hot li p { letter-spacing: 0; font-size: 0.5em }

    .zizhi-info ul { margin-top: 10% }
    .zizhi-info ul li { font-size: 14px }
    .zizhi-info ul li figure { width: 3.72em; height: 3.72em }
    .zizhi-info ul li figure img { width: 30px; height: 30px }

    .servbox { padding: 60px 0 80px }
    .servbox .servlist ul { height: auto; background: none }
    .servbox .servlist ul li { position: initial !important; width: 100%; margin-top: 30px; background: url(../images/serv_left.png) left no-repeat; background-size: 100% 100% }
    .servbox .servlist ul li:nth-child(1) { padding-right: 20% }
    .servbox .servlist ul li:nth-child(2n) { padding-left: 20%; background: url(../images/serv_right.png) right no-repeat; background-size: 100% 100% }
    .servbox .servlist ul li span { font-size: 18px }

    .cust-left, .cust-right { flex: 0 0 100%; max-width: 100% }
    .cust-right{ margin-top: 30px }

    .yanfa-item { padding: 9.16vw 0 }
    .yanfa-item img.yanfabg { display: none;  }
    .yanfa-left, .yanfa-right { flex: 0 0 100%; max-width: 100% }
    .yanfa-left { display: flex; flex-direction: column; align-items: center }
    .yanfa-left span{ font-size: 24px; }
    .yanfa-left p { font-size: 14px; }
    .yanfa-left ul li { width: 72px; height: 72px }
    .yanfa-item:nth-child(1) .yanfa-right, .yanfa-item:nth-child(3) .yanfa-right { margin-top: 30px }
    .yanfa-item:nth-child(2) { padding: 0 }
    .yanfa-item:nth-child(2) .row{ flex-direction: column-reverse; }
    .yanfa-item:nth-child(2) .yanfa-right { margin-top: 30px }



    /*pages*/
	.pagebar { margin-top: 20px }
	.pagebar .page-prev, .pagebar .page-next { margin-top: 10px }
	.pagebar .page-num { display: none }
}
@media only screen and (max-width:576px){
    .prolist li { flex: 0 0 50%; max-width: 50% }
    .prolist li>a h3{ padding: 15px; font-size: 14px }
    .prolist li:nth-child(n+3) { margin-top: 30px }

	.newslist li { flex: 0 0 100%; max-width: 100% }
	.newslist li:nth-child(n+2) { margin-top: 30px }

    .about-r .about-count li span.counter { font-size: 24px }

    .about-hot { padding: 20px 0; font-size: 18px }
    .zizhi-img { margin-top: 30px }

    .fuwubox::before { height: 100% }
    .servbox { padding: 30px 0 40px }
    .servbox .servlist ul li { height: 160px; margin-top: 20px }
    .servbox .servlist ul li span { font-size: 16px }
    .servbox .servlist ul li p { font-size: 12px }
    .stepbox li { margin-top: 20px }
    .stepbox li img { height: 1.6em }
    .custbox { padding: 30px 0 20px }
    .cust-right p { font-size: 14px }

}