/*!****** lib.css *******/ /*!-----------------[初始化]--------------*/ *, :after, :before { margin: 0; padding: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; outline: 0 !important; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-tap-highlight-color: transparent; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased } table { border-collapse: collapse; border-spacing: 0 } ol, ul { list-style: none } q:after, q:before { content: '' } fieldset, img { border: 0 } abbr, acronym { border: 0 } .clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0 } .col-c, .col-l, .col_c, .col_l, .l { float: left } .col-r, .col_r, .r { float: right } .c { clear: both } .fix { *zoom: 1 } .fix:after, .fix:before { display: block; content: "clear"; height: 0; clear: both; overflow: hidden; visibility: hidden } em { font-weight: 400; font-style: normal } body { color: #333; font-size: 14px; line-height: 1.5; font-family: 'Microsoft Yahei', "PingFang SC", "Helvetica Neue", Helvetica, Arial, sans-serif } img { max-width: 100%; border: none } input, select, textarea { font-size: 14px; color: #333; border: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; font-family: 'Microsoft Yahei', "PingFang SC", "Helvetica Neue", Helvetica, Arial, sans-serif } input[type=button], input[type=reset], input[type=submit] { cursor: pointer } ::-webkit-input-placeholder { color: #999 } ::-moz-placeholder { color: #999 } ::-ms-input-placeholder { color: #999 } select::-ms-expand { display: none } a { color: #333; text-decoration: none } /*!-----------------[初始化结束]--------------*/ .wp { width: 95%; max-width: 1200px; margin: 0 auto } /*!****************************** -------[=头部]------- ********************************/ /*!****************************** -------[=导航]------- ********************************/ .menuBtn { display: none; position: fixed; top: 12px; right: 12px; width: 30px; height: 30px; cursor: pointer; transition: .3s; -ms-transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; -o-transition: .3s } .menuBtn b { display: block; height: 4px; background-color: #fff; margin: 4px 0; transition: .3s; -ms-transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; -o-transition: .3s } .menuBtn.open b { display: none; margin: 0; position: absolute; left: 0; top: 50%; margin-top: -5px; width: 30px } .menuBtn.open b:first-child { display: block; transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg) } .menuBtn.open b:last-child { display: block; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg) } /*!****************************** -------[=底部]------- ********************************/ /*!****************************** -------[=公用]------- ********************************/ .cur, .cur a { font-size: 12px; color: #5e5e5e; line-height: 20px } .cur { margin: 18px 0 10px 9px; padding-left: 26px } .cur a:hover { color: #ca1318 } .pages { text-align: center; margin: 21px 0 38px } .pages ul { display: inline-block } .pages ul li { float: left; margin: 0 5px } .pages ul li a { display: block; width: 35px; height: 35px; line-height: 35px; text-align: center; color: #555; border: 1px solid #555; border-radius: 50% } .pages ul a:hover, .pages ul li.on a { background-color: #ea3032; border: 1px solid #ea3032; color: #fff } .pages ul li.next, .pages ul li.prev { font-weight: 700; font-family: "宋体"; font-size: 20px; margin: 0 15px } .pages ul li span { display: inline-block; margin-top: 5px; font-weight: 700; font-family: Arial; color: #dadada } /*!****** lib.css end *******/ /*!****** bl *******/ .wp1800 { max-width: 1800px; margin: 0 auto } .g-box { width: 100% } .g-box .bg { position: absolute; top: 0; left: 0; width: 100% } .inner { position: relative; z-index: 2; padding-top: 320px } .main { background-color: #fff; box-shadow: 10px 0 10px rgba(215, 215, 215, .9) } .sy { font-size: 24px; margin-left: 50px; padding-top: 30px; color: #ca0722 } .g-tit { padding: 55px 0; position: relative; text-align: center; font-size: 0 } .g-tit::after { content: ''; position: absolute; top: 50%; width: 100%; left: 0; height: 2px; background-color: #ca0722 } .g-tit .pic { margin-right: 50px; width: 275px; height: 115px } .g-tit h3 { line-height: 115px; font-size: 30px; color: #ca0722; font-weight: 400; display: inline-block; position: relative; padding: 0 40px; background-color: #fff; z-index: 2 } .g-tit h3::before { content: ""; display: block; width: 275px; height: 115px; background: url(../images/tit-xz1.png) no-repeat center; background-size: contain; position: absolute; right: 95%; top: -14px; z-index: 2 } .m-about-xz { overflow: hidden; background-color: #f0f0f0; margin: 0 50px; margin-bottom: 25px } .m-about-xz .pic { width: 850px; height: 541px; position: relative; float: left; margin-right: 35px } .m-about-xz .desc { height: 121px; font-size: 28px; position: absolute; width: 100%; bottom: 0; left: 0; padding: 0 20px; padding-top: 20px; background-color: rgb(255, 255, 255, .7) } .m-about-xz .desc a { display: block } .m-about-xz ul { overflow: hidden; padding-top: 20px } .m-about-xz ul li { margin-bottom: 30px } .m-about-xz .con { display: block; font-size: 24px; background: url(../images/icon-xz1.png) 0 5px no-repeat; height: 75px; padding-left: 50px; background-size: 30px; padding-right: 30px; overflow: hidden; text-overflow: ellipsis; word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; transition: .5s } .m-about-xz .con:hover { color: #ca0722 } .m-about-xz2 { overflow: hidden; margin-left: 45px; margin-right: 30px } .m-about-xz2 .g-tit { background-color: #fff } .m-about-xz2 .col-l { width: 52% } .m-about-xz2 li { margin-bottom: 30px } .m-about-xz2 .con { display: block; overflow: hidden } .m-about-xz2 .pic { width: 240px; height: 180px; float: left; margin-right: 30px } .m-about-xz2 .txt { overflow: hidden; padding-top: 10px } .m-about-xz2 .tit { font-size: 26px; margin-bottom: 8px; transition: .5s } .m-about-xz2 li:hover .tit { color: #ca0722 } .m-about-xz2 .desc { font-size: 22px; line-height: 1.8; color: #9f9d9d; overflow: hidden; text-overflow: ellipsis; word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3 } .m-about-xz2 .col-r { width: 46% } .m-about-xz2 .news a { display: block; height: 75px; overflow: hidden; text-overflow: ellipsis; word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; margin-bottom: 28px; font-size: 26px; color: #434343; padding-left: 40px; position: relative; transition: .5s } .m-about-xz2 .news a:hover { color: #ca0722 } .m-about-xz2 .news a::after { content: ''; width: 20px; height: 20px; position: absolute; background-color: #ff2f2f; border-radius: 50%; top: 10px; left: 0 } .m-about-xz3 { margin-bottom: 67px } .m-about-xz3 ul { overflow: hidden; display: flex; margin: 0 -10px } .m-about-xz3 li { float: left; width: 50%; display: flex; padding-top: 50px; position: relative } .m-about-xz3 .con { margin: 0 10px; position: relative; background-color: #fbd0cf } .m-about-xz3 .box { position: relative; margin: 0 50px; /* overflow: hidden; */ padding-bottom: 110px; padding-top: 110px } .m-about-xz3 li a { display: block; padding-left: 50px; background: url(../images/icon-xz2.png) 0 8px no-repeat; background-size: 30px; font-size: 26px; margin-bottom: 20px; color: #434343; overflow: hidden; text-overflow: ellipsis; word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; transition: .5s } .m-about-xz3 li a:hover { color: #ca0722 } .m-about-xz3 li span { color: #ca0722 } .m-about-xz3 .more { position: absolute; bottom: 10px; right: 20px; float: right; display: block; color: #9f9d9d; height: auto; padding-left: 0; background-image: none } .m-about-xz3 .tit { background: url(../images/tit-xz2.png) center no-repeat; background-size: 250px; width: 250px; height: 88px; text-align: center; font-size: 38px; color: #fff; line-height: 70px; position: absolute; left: 50%; top: -50px; transform: translateX(-50%); z-index: 2; } .m-about-xz4 .bq { font-size: 22px; color: #fff; text-align: center; height: 75px; line-height: 75px; background: url(../images/bj-xz2.png) center no-repeat; background-size: cover } .m-about-xz5 { position: relative; margin-bottom: 30px } .m-about-xz5 .tit { background: url(../images/tit-xz2.png) center no-repeat; background-size: 250px; width: 250px; height: 88px; text-align: center; font-size: 38px; color: #fff; line-height: 70px; position: absolute; left: 117px; top: -40px; overflow: hidden } .m-about-xz5 ul { padding-top: 110px; overflow: hidden } .m-about-xz5 li { float: left; width: 50% } .m-about-xz5 .con { display: block; margin: 0 60px; padding-left: 45px; background: url(../images/icon-xz2.png) 0 5px no-repeat } .m-about-xz5 li { margin-bottom: 40px } .m-about-xz5 li:hover .h4 { color: #ca0722 } .m-about-xz5 .h4 { font-size: 26px; margin-bottom: 10px; color: #000; line-height: 1.3; height: 70px; transition: .5s } .m-about-xz5 .desc { font-size: 22px; color: #9f9d9d; line-height: 1.7; height: 70px } @media only screen and (min-width:1200px) and (max-width:1920px) { .wp1800 { max-width: 93.75vw; margin: 0 auto } .g-box .bg { top: 0; left: 0 } .inner { padding-top: 16.66vw } .main { box-shadow: .52vw 0 .52vw rgba(215, 215, 215, .9) } .sy { font-size: 1.25vw; margin-left: 2.604vw; padding-top: 1.562vw } .g-tit { padding: 2.864vw 0; font-size: 0 } .g-tit::after { content: ''; top: 50%; left: 0; height: .104vw } .g-tit .pic { margin-right: 2.604vw; width: 14.32vw; height: 5.989vw } .g-tit h3 { line-height: 5.989vw; font-size: 1.562vw; font-weight: 400; padding: 0 2.083vw } .g-tit h3::before { content: ""; width: 14.32vw; height: 5.989vw; background: url(../images/tit-xz1.png) no-repeat center; background-size: contain; right: 95%; top: -.729vw } .m-about-xz { margin: 0 2.604vw; margin-bottom: 1.302vw } .m-about-xz .pic { width: 44.27vw; height: 28.17vw; margin-right: 1.822vw } .m-about-xz .desc { height: 6.302vw; font-size: 1.458vw; bottom: 0; left: 0; padding: 0 1.041vw; padding-top: 1.041vw } .m-about-xz ul { padding-top: 1.041vw } .m-about-xz ul li { margin-bottom: 1.562vw } .m-about-xz .con { font-size: 1.25vw; background: url(../images/icon-xz1.png) 0 .26vw no-repeat; height: 3.906vw; padding-left: 2.604vw; background-size: 1.562vw; padding-right: 1.562vw; word-break: break-all; -webkit-box-orient: vertical; -webkit-line-clamp: 2; transition: .5s } .m-about-xz2 { margin-left: 2.343vw; margin-right: 1.562vw } .m-about-xz2 li { margin-bottom: 1.562vw } .m-about-xz2 .pic { width: 12.5vw; height: 9.375vw; margin-right: 1.562vw } .m-about-xz2 .txt { padding-top: .52vw } .m-about-xz2 .tit { font-size: 1.354vw; margin-bottom: .416vw; transition: .5s } .m-about-xz2 .desc { font-size: 1.145vw; line-height: 1.8; word-break: break-all; -webkit-box-orient: vertical; -webkit-line-clamp: 3 } .m-about-xz2 .news a { height: 3.906vw; word-break: break-all; -webkit-box-orient: vertical; -webkit-line-clamp: 2; margin-bottom: 1.458vw; font-size: 1.354vw; padding-left: 2.083vw; transition: .5s } .m-about-xz2 .news a::after { content: ''; width: 1.041vw; height: 1.041vw; border-radius: 50%; top: .52vw; left: 0 } .m-about-xz3 { margin-bottom: 3.489vw } .m-about-xz3 ul { margin: 0 -.52vw } .m-about-xz3 li { padding-top: 2.604vw } .m-about-xz3 .con { margin: 0 .52vw } .m-about-xz3 .box { margin: 0 2.604vw; padding-top: 5.729vw; } .m-about-xz3 li a { padding-left: 2.604vw; background: url(../images/icon-xz2.png) 0 .416vw no-repeat; background-size: 1.562vw; font-size: 1.354vw; margin-bottom: 1.04vw; word-break: break-all; -webkit-box-orient: vertical; -webkit-line-clamp: 2; transition: .5s } .m-about-xz3 .more { height: auto; background-image: none } .m-about-xz3 .tit { background: url(../images/tit-xz2.png) center no-repeat; background-size: 13.02vw; width: 13.02vw; height: 4.583vw; font-size: 1.979vw; line-height: 3.645vw; top: -2.3vw; transform: translateX(-50%) } .m-about-xz4 .bq { font-size: 1.145vw; height: 3.906vw; line-height: 3.906vw; background: url(../images/bj-xz2.png) center no-repeat; background-size: cover } .m-about-xz5 { margin-bottom: 1.562vw } .m-about-xz5 .tit { background: url(../images/tit-xz2.png) center no-repeat; background-size: 13.02vw; width: 13.02vw; height: 4.583vw; font-size: 1.979vw; line-height: 3.645vw; left: 6.093vw; top: -2.083vw } .m-about-xz5 ul { padding-top: 5.729vw } .m-about-xz5 .con { margin: 0 3.125vw; padding-left: 2.343vw; background: url(../images/icon-xz2.png) 0 .26vw no-repeat } .m-about-xz5 li { margin-bottom: 2.083vw } .m-about-xz5 .h4 { font-size: 1.354vw; margin-bottom: .52vw; line-height: 1.3; height: 3.645vw; transition: .5s } .m-about-xz5 .desc { font-size: 1.145vw; line-height: 1.7; height: 3.645vw } } @media only screen and (max-width:1200px) { .m-about-xz .pic { float: none; margin: 0 auto } .m-about-xz ul li { margin-left: 20px } .m-about-xz2 .col-l { width: 100% } .m-about-xz2 .col-r { width: 100% } .m-about-xz3 ul{ display: block; } .m-about-xz3 li { width: 100%; float: none; margin-bottom: 20px; display: block; } .m-about-xz5 li { width: 100%; float: none } .m-about-xz5 .h4 { height: auto } .inner { padding-top: 0 } .g-box .bg { position: static } .main { box-shadow: none } .m-about-xz3 .more{ left: 100px; } } @media only screen and (max-width:950px) { .m-about-xz .pic { width: 100%; height: auto } .m-about-xz .desc { bottom: 5px; font-size: 22px } .g-tit { padding: 20px 0 } .m-about-xz .con { font-size: 20px } .m-about-xz ul li { margin-bottom: 10px } .m-about-xz { margin-bottom: 10px } .m-about-xz2 .tit { font-size: 20px } .m-about-xz2 .desc { font-size: 18px } .m-about-xz2 .news a { font-size: 20px; margin-bottom: 10px; height: auto } .m-about-xz3 li a { font-size: 20px; margin-bottom: 10px; background: url(../images/icon-xz2.png) 0 3px no-repeat } .m-about-xz5 .tit { top: 0; left: 105px } .m-about-xz5 .h4 { font-size: 22px } .m-about-xz5 .desc { height: auto; font-size: 20px } .g-tit h3::before { display: none } .sy { font-size: 22px; padding-top: 10px } .m-about-xz3 .box{ padding-bottom: 50px; } } @media only screen and (max-width:768px) { .g-tit h3 { font-size: 20px; padding: 0 15px; line-height: 55px } .m-about-xz .desc { height: 60px; font-size: 14px; padding-top: 5px } .m-about-xz .con { font-size: 14px; height: auto; padding-right: 10px; padding-left: 22px; background: url(../images/icon-xz1.png) 0 4px no-repeat; background-size: 15px } .m-about-xz ul li { margin-bottom: 15px; margin-left: 10px } .m-about-xz2 .pic { width: 100%; float: none; height: auto } .m-about-xz2 .pic img { width: 100% } .m-about-xz2 .tit { font-size: 18px } .m-about-xz2 .desc { font-size: 16px } .m-about-xz2 .news a { font-size: 16px } .m-about-xz3 li { margin-bottom: 10px } .m-about-xz3 li a { font-size: 16px; height: auto; background-size: 18px; padding-left: 30px } .m-about-xz3 .box { margin: 0 20px; padding-top: 50px } .m-about-xz3 .tit { font-size: 22px; width: 200px; height: auto; background-size: cover; top: -30px; } .m-about-xz3 { margin-bottom: 30px } .m-about-xz2 { margin: 0 10px } .m-about-xz5 .tit { font-size: 22px; width: 200px; height: auto; left: 44px; background-size: cover } .m-about-xz5 ul { padding-top: 91px } .m-about-xz5 .con { margin: 0 10px; background: url(../images/icon-xz2.png) 0 1px no-repeat; background-size: 20px; padding-left: 25px } .m-about-xz5 .h4 { font-size: 18px } .m-about-xz5 .desc { font-size: 15px; line-height: 1.5 } .m-about-xz3 ul { margin: 0 } .m-about-xz3 .con { margin: 0 } .m-about-xz3 .more{ left: 52px } .m-about-xz3 .box{ padding-bottom: 40px } } @media only screen and (max-width:500px) { .m-about-xz { margin: 0 10px } .m-about-xz .desc { font-size: 12px; padding-top: 12px } .g-tit { padding: 0 } .m-about-xz2 .txt { padding-top: 0 } .m-about-xz2 .desc { font-size: 14px; line-height: 1.5 } .m-about-xz2 li { margin-bottom: 20px } .m-about-xz2 .news a::after { width: 15px; height: 15px; top: 6px } .m-about-xz2 .news a { padding-left: 20px } .m-about-xz5 li { margin-bottom: 20px } .m-about-xz5 .desc { font-size: 14px } .sy { display: none } .m-about-xz3 .tit { background-size: 150px; width: 150px; height: auto } .m-about-xz5 .tit { background-size: 150px; width: 150px; height: auto; left: 32px } .m-about-xz5 ul { padding-top: 75px } .m-about-xz3 li { padding-top: 37px } .m-about-xz5 .h4 { font-size: 16px } .m-about-xz4 .bq { font-size: 15px; height: 50px; line-height: 50px } .m-about-xz3 { margin-bottom: 15px } .m-about-xz5 { margin-bottom: 10px } } /*!****** bl end *******/