.center-block { margin-left: auto; margin-right: auto } .fl { float: left } .fr { float: right } ul:before, ol:before, li:before, dl:before, dt:before, dd:before, div:before, .clearfix:before, ul:after, ol:after, li:after, dl:after, dt:after, dd:after, div:after, .clearfix:after { content: ""; display: table } ul:after, ol:after, li:after, dl:after, dt:after, dd:after, div:after, .clearfix:after { clear: both } a { text-decoration: none } a:link, a:visited { color: #050505 } a:hover, a:active { color: #dd2118 } html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, figure, figcaption, table, th, td img { margin: 0; padding: 0 } a, abbr, acronym, address, big, blockquote, body, caption, cite, code, dd, dl, dt, fieldset, form, h1, time, h2, h3, h4, h5, h6, html, img, ins, kbd, label, legend, li, ol, p, pre, q, s, samp, small, span, strike, strong, ul { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline } html { -webkit-overflow-scrolling: touch; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100% } @font-face { font-family: 'corbel'; src: url("../fonts/corbel.ttf") format("truetype"); font-display: swap } @font-face { font-family: 'corbell'; src: url("../fonts/corbell.ttf") format("truetype"); font-display: swap } body { line-height: 1.5; color: #2b2a28; font-family: "corbel", Helvetica, Arial, sans-serif; font-size: 14px; text-align: left; margin: 0 auto; line-height: 24px; color: #333; font-weight: normal; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased } img { max-width: 100% !important; height: auto !important; border: 0; vertical-align: middle } *, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-touch-callout: none; outline: none } button { border-radius: 0px; -webkit-border-radius: 0px; outline: none } input { border-radius: 0; outline: none } input:-ms-clear { display: none } input, textarea { border: 0; font-family: "微软雅黑" } textarea { resize: none; outline: none } td { word-break: break-all } ul, ol { list-style: none } input:-moz-placeholder, textarea:-moz-placeholder { color: #aab3b7 } input::-moz-placeholder, textarea::-moz-placeholder { color: #aab3b7 } input:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #aab3b7 } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #aab3b7 } .clear { display: block; clear: both; overflow: hidden } .none { display: none } .hidden { width: 100%; overflow: hidden } .wrapper { width: 100%; max-width: 1920px; position: relative; margin-left: auto; margin-right: auto } .wrap { margin-left: auto; margin-right: auto; position: relative } ::selection { background-color: #222; color: white } body { color: #333333; font-size: 16px; line-height: 1.7; font-family: 'Roboto', "Microsoft Yahei"; overflow-x: hidden } .wrap { width: 1000px; margin: 0 auto } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 300; src: local("Roboto Light"), local("Roboto-Light"), url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fCRc4EsA.woff2) format("woff2"); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F } .swt-box { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 999; display: none } .swt-box .con { position: absolute; left: 50%; top: 50%; width: 800px; height: 500px; margin-top: -250px; margin-left: -400px } .swt-box .close { position: absolute; right: 0; top: 0; width: 80px; height: 54px; z-index: 1; cursor: pointer } .g-swt { display: block; width: 100%; height: 100% } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 300; src: local("Roboto Light"), local("Roboto-Light"), url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fABc4EsA.woff2) format("woff2"); unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 300; src: local("Roboto Light"), local("Roboto-Light"), url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fCBc4EsA.woff2) format("woff2"); unicode-range: U+1F00-1FFF } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 300; src: local("Roboto Light"), local("Roboto-Light"), url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fBxc4EsA.woff2) format("woff2"); unicode-range: U+0370-03FF } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 300; src: local("Roboto Light"), local("Roboto-Light"), url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fCxc4EsA.woff2) format("woff2"); unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 300; src: local("Roboto Light"), local("Roboto-Light"), url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fChc4EsA.woff2) format("woff2"); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 300; src: local("Roboto Light"), local("Roboto-Light"), url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fBBc4.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 400; src: local("Roboto"), local("Roboto-Regular"), url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu72xKOzY.woff2) format("woff2"); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 400; src: local("Roboto"), local("Roboto-Regular"), url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu5mxKOzY.woff2) format("woff2"); unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 400; src: local("Roboto"), local("Roboto-Regular"), url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu7mxKOzY.woff2) format("woff2"); unicode-range: U+1F00-1FFF } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 400; src: local("Roboto"), local("Roboto-Regular"), url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu4WxKOzY.woff2) format("woff2"); unicode-range: U+0370-03FF } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 400; src: local("Roboto"), local("Roboto-Regular"), url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu7WxKOzY.woff2) format("woff2"); unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 400; src: local("Roboto"), local("Roboto-Regular"), url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu7GxKOzY.woff2) format("woff2"); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: 'Roboto'; font-style: normal; font-display: swap; font-weight: 400; src: local("Roboto"), local("Roboto-Regular"), url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu4mxK.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: "Impact"; src: url(../fonts/IMPACT.ttf); font-display: swap } @media screen and (min-width: 1025px) { .zoosnet, .return-top { display: none } .head-r ul { display: inline-block; } .head-r ul li { float: left } .head-txt li { font-size: 16px; line-height: 38px; color: #999999 } .head-txt li a { display: block; color: #999999 } .head-txt li:nth-child(2) { margin: 0 30px 0 38px } .share li { margin-left: 10px } .share li:hover { opacity: 0.3 } .head-txt li:hover a, .head-txt li.newon a { color: #f32b1c } nav { padding: 25px 0 20px; background-color: #fff; -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1); box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1); position: relative; z-index: 10 } nav .nav-l { float: left } nav .nav-l li { float: left; margin-right: 50px; font-size: 18px; font-weight: bold } nav .nav-l li a { display: block; border-bottom: 6px solid #e6e6e6; line-height: 32px; color: #ddd } nav .nav-l li:hover a, nav .nav-l li.active a { border-bottom-color: #feaca8 } nav .contact { font-size: 18px; float: right; width: 160px; height: 44px; line-height: 38px; background-color: #f5f5f5; border-radius: 22px; text-align: center; color: #f32b1c; box-shadow: 0 0 10px #cbcbcb inset; border: 2px solid transparent; cursor: pointer; transition: all 0.6s ease; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease } nav .contact:hover { border: 2px solid #cbcbcb; background-color: transparent; transition: all 0.6s ease; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease } .t-top { position: fixed; right: 8px; bottom: 120px; z-index: 99999; cursor: pointer; padding: 19px 12px; background: rgba(35, 34, 34, .8); border-radius: 5px; color: #fff; font-size: 20px; text-align: center; line-height: 1; transition: .5s; display: none; text-transform: uppercase; } .foot-top { background: url(../newimages/index-bg2.jpg) #db261f no-repeat center; overflow: hidden; padding: 100px 0 118px } .foot-top dl { width: 50%; float: left } .foot-top dl:nth-child(1) { padding-right: 10.5% } .foot-top dl:nth-child(2) { padding-left: 4% } .foot-top dl dt { font-size: 54px; color: #232222; text-transform: uppercase; line-height: 1.2; margin-bottom: 35px } .foot-top dl dd { font-size: 18px; color: #232222 } .foot-top dl dd a { color: #232222 } .foot-top dl dd a:hover { color: #ffffff; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 4'%3E%3Cpath fill='none' stroke='%23fff' d='M0 3.5c5 0 5-3 10-3s5 3 10 3 5-3 10-3 5 3 10 3'/%3E%3C/svg%3E") repeat-x 0 100%; background-size: 20px auto; animation: waveMove 1s infinite linear } @keyframes waveMove { from { background-position: 0 100% } to { background-position: -20px 100% } } footer { background: #333 } footer p { color: #fff; font-size: 14px; padding: 10px 0; box-sizing: border-box } .foot-fix, .foot-fix0 { display: none } .searchbox { width: 288px; height: 47px; float: right; position: relative; z-index: 10 } .searchbox .search_form { width: 100%; height: 100%; position: relative; background: #ffffff; box-shadow: 0 0 24px rgba(6, 52, 81, 0.16) inset; border-radius: 60px; overflow: hidden } .searchbox .search_input { width: 100%; height: 100%; display: block; padding-left: 54px; padding-right: 80px; background: url(../newimages/icon_search.png) 20px center no-repeat; background-size: 20px; border: none; font-size: 20px; color: #ff0000; line-height: 47px } .searchbox .search_input::-webkit-input-placeholder { color: #ff0000 } .searchbox .search_input::-moz-placeholder { color: #ff0000 } .searchbox .search_input:-moz-placeholder { color: #ff0000 } .searchbox .search_input:-ms-input-placeholder { color: #ff0000 } .searchbox .search_btn { width: 37px; position: absolute; right: 5px; top: 5px; bottom: 5px; background: #f32b1c; border: none; border-radius: 50%; text-align: center; line-height: 35px; cursor: pointer; transition: all linear 0.2s } .searchbox .search_btn img { width: 16px; vertical-align: middle } .searchbox .search_btn:hover { background: #f32b1c } .searchbox .search_keywords { background: #fbfbfb; border-radius: 26px 26px 13px 13px; position: absolute; left: 0; right: 0; top: 0; z-index: -1; padding-top: 56px; padding-bottom: 10px; overflow: hidden; display: none } .searchbox .search_keywords p, .searchbox .search_keywords .no_result { font-size: 17px; color: #252e41; line-height: 1.6; display: block; padding: 3px 6%; cursor: pointer } .searchbox .search_keywords p a { display: block; color: #252e41 } .searchbox .search_keywords p:hover { background: #ccc; color: #fff } .searchbox .search_keywords p:hover a { color: #fff } .searchbox .search_keywords .no_result { opacity: 0.6; cursor: inherit } .search_title { background: #fafbfd; text-align: center; line-height: 1 } .search_title .wrap { padding-top: 50px; padding-bottom: 65px } .search_title .title { font-size: 40px; color: #222121; font-weight: bold } .search_title .title span { color: #f32b1c } .search_title .text { margin-top: 48px; font-size: 16px; color: #222121 } .search_title .search_box { max-width: 465px; height: 40px; position: relative; z-index: 1; margin: 55px auto 0 } .search_title .search_box .search_form { width: 100%; height: 100%; position: relative; overflow: hidden; border-bottom: 1px solid #f32b1c; border-bottom-right-radius: 20px } .search_title .search_box .search_input { width: 100%; height: 100%; display: block; padding-left: 38px; padding-right: 100px; background: url(../newimages/icon_search.png) 6px center no-repeat; background-size: 19px; border: none; font-size: 20px; color: #ff0000; line-height: 40px } .search_title .search_box .search_input::-webkit-input-placeholder { color: #ff0000 } .search_title .search_box .search_input::-moz-placeholder { color: #ff0000 } .search_title .search_box .search_input:-moz-placeholder { color: #ff0000 } .search_title .search_box .search_input:-ms-input-placeholder { color: #ff0000 } .search_title .search_box .search_btn { width: 88px; position: absolute; right: 0; top: 0; bottom: 0; background: #f32b1c; border: none; border-radius: 50px; text-align: center; line-height: 39px; cursor: pointer; transition: all linear 0.2s } .search_title .search_box .search_btn img { width: 16px; vertical-align: middle } .search_title .search_box .search_btn:hover { background: #f32b1c } .search_title .search_box .search_keywords { background: #f32b1c; border-radius: 0 20px 13px 13px; position: absolute; left: 0; right: 0; top: 40px; z-index: -1; padding-top: 10px; padding-bottom: 10px; overflow: hidden; text-align: left; display: none } .search_title .search_box .search_keywords p, .search_title .search_box .search_keywords .no_result { font-size: 17px; color: #ffffff; line-height: 1.6; display: block; padding: 3px 6%; cursor: pointer } .search_title .search_box .search_keywords p a { display: block; color: #ffffff } .search_title .search_box .search_keywords p:hover { background: #ffffff; color: #f32b1c } .search_title .search_box .search_keywords p:hover a { color: #f32b1c } .search_title .search_box .search_keywords .no_result { opacity: 0.6; cursor: inherit } .search_list .pro-list { width: 100%; float: none } .search_list .pro-list .txt h3 a span { color: red } .right-service01 { position: fixed; right: 0; top: 400px; border-radius: 50%; z-index: 99990; width: 190px } .right-service01 .pic { width: 100%; text-align: center } .right-service01 img { display: inline-block } .right-service01 span { display: block; font-size: 24px; height: 50px; line-height: 42px; background: url(../newimages/swt-bg01.png) no-repeat center; color: #fff; padding-left: 30px; cursor: pointer; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease } .right-service01 a { display: block; height: 52px; line-height: 40px; background: url(../newimages/swt-bg02.png) no-repeat center; font-size: 18px; color: #fff; text-align: center; font-weight: 100; position: relative; margin-top: -6px; margin-left: -18px; z-index: -1; cursor: pointer; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease } .right-service01 span:hover { padding-left: 40px } .right-service01 a:hover { padding-left: 10px } .right-service01 .word { width: 150px; color: #fff; padding: 10px 15px; font-weight: 400; line-height: 1.45; background-color: #ed4d49; left: 160px; top: 65px; margin-top: -30px; -webkit-transition: all 0.3s cubic-bezier(0.86, 0, 0.07, 1); transition: all 0.3s cubic-bezier(0.86, 0, 0.07, 1); -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2); font-size: 14px; border-radius: 3px; position: absolute; transition: .5s; -ms-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; -o-transition: .5s; opacity: 0; filter: alpha(opacity=0) } .right-service01 .word::after { position: absolute; display: block; content: ''; height: 20px; width: 20px; -webkit-box-shadow: none; box-shadow: none; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; z-index: 50; background-color: #ed4d49; -webkit-box-shadow: 3px 3px 10px 0 rgba(255, 37, 29, 0.2); box-shadow: 3px 3px 10px 0 rgba(255, 37, 29, 0.2); right: -6px; top: 50%; margin-top: -10px } .right-service01 .show { left: -115px; opacity: 1; filter: alpha(opacity=100) } .fixed_search { display: none } .body_search_active { padding-top: 0 !important } .logo img { max-width: 200px !important } } @media screen and (max-width: 1024px) { nav, .right-service01 { display: none } .top { height: 1.6rem; padding: .4rem; background-color: #FFF } .logo { float: left } .logo img { display: block; width: 3.41333rem; max-width: 200px !important } .navBtn { float: right; cursor: pointer } .navBtn img { width: 1.01333rem; height: .8rem; margin-top: .13333rem } .search_title { padding: 2.30769rem; background: #fafbfd; text-align: center; line-height: 1 } .search_title .title { font-size: 1.73077rem; color: #222121; font-weight: bold } .search_title .title span { color: #f32b1c } .search_title .text { margin-top: 1.84615rem; font-size: 1rem; color: #222121; line-height: 1.4 } .search_title .search_box { width: 100%; height: 2.53846rem; position: relative; z-index: 30; margin: 2.11538rem auto 0 } .search_title .search_box .search_form { width: 100%; height: 100%; position: relative; overflow: hidden; border-bottom: 1px solid #fa9f00; border-bottom-right-radius: 1.26923rem } .search_title .search_box .search_input { width: 100%; height: 100%; display: block; padding-left: 1.92308rem; padding-right: 9.23077rem; background: url(../newimages/icon_search.png) 0.11538rem center no-repeat; background-size: 1.03846rem; border: none; font-size: 1.15385rem; color: #fa9f00 } .search_title .search_box .search_input::-webkit-input-placeholder { color: #fa9f00 } .search_title .search_box .search_input::-moz-placeholder { color: #fa9f00 } .search_title .search_box .search_input:-moz-placeholder { color: #fa9f00 } .search_title .search_box .search_input:-ms-input-placeholder { color: #fa9f00 } .search_title .search_box .search_btn { width: 8.53846rem; position: absolute; right: 0; top: 0; bottom: 0; background: #fa9f00; border: none; border-radius: 2.69231rem; text-align: center; line-height: 2.53846rem; cursor: pointer; transition: all linear 0.2s } .search_title .search_box .search_btn img { width: 1.92308rem; vertical-align: middle } .search_title .search_box .search_keywords { background: #fa9f00; border-radius: 0 .76923rem .57692rem .57692rem; position: absolute; left: 0; right: 0; top: 2.5rem; z-index: -1; padding-top: .46154rem; padding-bottom: .46154rem; overflow: hidden; text-align: left; display: none } .search_title .search_box .search_keywords p, .search_title .search_box .search_keywords .no_result { font-size: .92308rem; color: #ffffff; line-height: 1.4; display: block; padding: .11538rem 5%; cursor: pointer } .search_title .search_box .search_keywords p a { display: block; color: #ffffff } .search_title .search_box .search_keywords p:hover { background: #ffffff; color: #fa9f00 } .search_title .search_box .search_keywords p:hover a { color: #fa9f00 } .search_title .search_box .search_keywords .no_result { opacity: 0.6; cursor: inherit } .search_list { margin-top: 1.15385rem } .search_list ul li .list-info h2 span { color: red } .zoosnet { display: block; position: fixed; z-index: 999; right: 10px; bottom: 135px; width: 40px; height: 40px; padding: 0 1.2%; line-height: 40px; border-radius: 50%; text-align: center; background-color: rgba(0, 0, 0, 0.6); cursor: pointer; transition: right 0.25s; -moz-transition: right 0.25s; -webkit-transition: right 0.25s; -o-transition: right 0.25s } body { padding-bottom: 1.33333rem } .fixed_search { padding: 0.2rem 0.512rem !important } .fixed_search .searchbox { height: 1.08rem !important } .fixed_search .searchbox .search_input { padding-left: 1.2rem !important; padding-right: 2.6rem !important; background: url(../newimages/m_icon_search.png) 0.38rem center no-repeat !important; background-size: 0.56rem !important; font-size: 0.42rem !important } .fixed_search .searchbox .search_btn { width: 1.7rem !important; right: 0.13077rem !important; top: 0.13077rem !important; bottom: 0.13077rem !important; border-radius: 3.07692rem !important; line-height: 0.78rem !important } .fixed_search .searchbox .search_btn img { width: 0.5rem !important } .body_search_active { padding-top: 1.5rem !important } .fixed_search_active .search_close { width: 1.03rem !important } .fixed_search .searchbox .search_keywords { border-radius: 0.7rem 0.7rem 0.38rem 0.38rem !important; padding-top: 1.15rem !important; padding-bottom: 0.2rem !important } .fixed_search .searchbox .search_keywords p, .fixed_search .searchbox .search_keywords .no_result { padding: 0.12rem 0.58rem !important; font-size: 0.4rem !important } .fixed_search .search_close:before { font-size: 0.42rem !important; line-height: 1.04rem !important } .fixed_search .search_close { height: 1rem !important } } body { max-width: 10000px !important } button { border: none; outline: none } .wrap { width: 69.53vw; margin: 0 auto; overflow: visible; } .iopp_special_title .title { font-size: 2.6vw; color: #ffffff; line-height: 1.16; font-weight: bold; text-align: center } .iopp_special_title .text { font-size: .94vw; color: #ddd; line-height: 1.55556 } .iopp_special1 { position: relative } .iopp_special1 .pc_pic, .iopp_special1 .m_pic { width: 100%; display: block } .iopp_special1 .m_pic { display: none } .iopp_special1 .wrap { position: absolute; left: 0; right: 0; top: 0; bottom: 0 } .iopp_special1 .wrap .wenan { position: absolute; left: 0; top: 50%; transform: translateY(-50%); padding-top: 2.81vw; padding-bottom: 3.13vw } .iopp_special1 .wrap .wenan:before { content: ""; position: absolute; display: block; left: -3.07vw; right: 0; top: 0; bottom: 0; z-index: -1; background: -webkit-linear-gradient(left, #03255d, rgba(3, 37, 93, 0)); border-radius: 1.56vw; opacity: 0.8 } .iopp_special1 .wrap .wenan h1 { font-size: 2.6vw; color: #ffffff; font-weight: bold } .iopp_special1 .wrap .wenan .cs { margin-top: 1.56vw } .iopp_special1 .wrap .wenan .cs p { font-size: 1.04vw; color: #ffffff; line-height: 1.4 } .iopp_special1 .wrap .wenan .cs p span { font-weight: bold } .iopp_special1 .wrap .wenan .cs p+p { margin-top: .78vw } .iopp_special1 .wrap .wenan .zx_btn_box { width: 19.79vw; height: 3.75vw; overflow: hidden; margin-top: 1.61vw; border-radius: .52vw } .iopp_special1 .wrap .wenan .zx_btn_box .btn { width: 50%; height: 100%; float: left; font-size: 1.04vw; line-height: 3.75vw; text-align: center; font-weight: bold } .iopp_special1 .wrap .wenan .zx_btn_box .btn i { height: 100% } .iopp_special1 .wrap .wenan .zx_btn_box .btn i:before { content: ""; width: 1.46vw; height: 100%; display: inline-block; vertical-align: top; margin-right: .52vw; background-position: center center; background-repeat: no-repeat; background-size: 100% } .iopp_special1 .wrap .wenan .zx_btn_box .btn.btn1 { background: #ff791f; background: -webkit-linear-gradient(left, #f28e26, #ff791f); color: #ffffff } .iopp_special1 .wrap .wenan .zx_btn_box .btn.btn1 i:before { background-image: url(../newimages/iron_ore_processing_plant/iopp_special_tb1.png) } .iopp_special1 .wrap .wenan .zx_btn_box .btn.btn2 { background: #ffffff; color: #ff7920 } .iopp_special1 .wrap .wenan .zx_btn_box .btn.btn2 i:before { background-image: url(../newimages/iron_ore_processing_plant/iopp_special_tb2.png) } .iopp_special1 .wrap .wenan .email { display: table; margin-left: .83vw; margin-top: .89vw; padding: .1vw 0 .31vw 2.03vw; background: url(../newimages/iron_ore_processing_plant/iopp_special_tb3.png) left top no-repeat; background-size: 1.35vw; font-size: 1.04vw } .iopp_special1 .wrap .wenan .email span { border-bottom: .1vw solid #fff; color: #ffffff; transition: all linear 0.3s } .iopp_special1 .wrap .wenan .email:hover span { border-bottom: .1vw solid #ff791f; color: #ff791f } .iopp_special2 { position: relative; margin-top: -3.33vw } .iopp_special2 .wrap .list { padding: 4.95vw 1.56vw 2.08vw; overflow: hidden; background: #ffffff; background: rgba(255, 255, 255, 0.8); border-radius: 1.04vw } .iopp_special2 .wrap .list a { width: 20%; float: left; text-align: center } .iopp_special2 .wrap .list a img { width: 100%; display: block } .iopp_special2 .wrap .list a span { min-width: 8.96vw; display: inline-block; margin-top: 1.04vw; padding: .1vw .78vw; border: 1px solid #131521; border-radius: .78vw; font-size: .83vw; color: #131521; font-weight: bold; line-height: 1.25; transition: all linear 0.3s } .iopp_special2 .wrap .list a:hover span { background: #131521; color: #ffffff } .iopp_special3 { margin-top: 5.21vw } .iopp_special3 .wrap { overflow: hidden } .iopp_special3 .fl { width: 45.69288% } .iopp_special3 .fl img { width: 100%; display: block; border-radius: 1.04vw } .iopp_special3 .fr { width: 50.03745% } .iopp_special3 .fr .title { text-align: left } .iopp_special3 .fr .text { margin-top: 1.56vw } .iopp_special3 .fr .text p+p { margin-top: .94vw } .iopp_special4 { margin-top: 6.51vw; background: #1a1e27; } .iopp_special4 .wrap { padding-top: 5.73vw; padding-bottom: 10.42vw; overflow: hidden } .iopp_special4 .title { color: #ffffff } .iopp_special4 .text { margin-top: 3.33vw; overflow: hidden } .iopp_special4 .fl { width: 43.44569%; color: #ffffff } .iopp_special4 .fl p strong { display: table; margin-bottom: .63vw; font-size: 1.04vw } .iopp_special4 .fl p+p { margin-top: 1.72vw } .iopp_special4 .fr { width: 51.98502% } .iopp_special4 .fr img { width: 100%; display: block } .iopp_special5 { margin-top: 3.13vw } .iopp_special5 .list { margin-left: -1.40325%; margin-top: 2.92vw; overflow: hidden; display: flex; flex-wrap: wrap; } .iopp_special5 .list li { width: 23.55982%; float: left; margin-left: 1.40325%; padding: 1.82vw 2.08vw; background: #ffffff; border-radius: 7.66vw 7.66vw 2.4vw 2.4vw } .iopp_special5 .list li i { width: 3.02vw; height: 3.02vw; display: block; margin: 0 auto; background: #131521; border-radius: 50%; font-size: 1.56vw; text-align: center; line-height: 3.02vw; color: #ffffff } .iopp_special5 .list li p { margin-top: 1.41vw; font-size: .94vw; color: #555555; line-height: 1.55556 } .iopp_special6 { margin-top: 7.29vw } .iopp_special6 .list { margin-top: 4.17vw } .iopp_special6 .list dl { margin-top: 3.02vw; position: relative; } .iopp_special6 .list dl dd { width: 49.96255% } .iopp_special6 .list dl dd img { width: 100%; display: block; border-radius: 1.04vw } .iopp_special6 .list dl dt { width: 45.69288%; position: absolute; top: 50%; transform: translateY(-50%); color: #fff } .iopp_special6 .list dl dt h3 { font-size: 2vw; line-height: 1.16; font-weight: bold } .iopp_special6 .list dl dt .cs { margin-top: 1.15vw } .iopp_special6 .list dl dt .cs p { font-size: 1.04vw; line-height: 1.4 } .iopp_special6 .list dl dt .cs p span { font-weight: bold } .iopp_special6 .list dl dt .cs p+p { margin-top: .94vw } .iopp_special6 .list dl dt .zx_btn_box { width: 16.09vw; height: 3.75vw; display: block; margin-top: 2.08vw; background: #ffbb38; border-radius: .52vw; font-size: 1.46vw; color: #ffffff; text-align: center; line-height: 3.75vw; font-weight: bold; cursor: pointer } .iopp_special6 .list dl:nth-child(odd) dt { right: 0 } .iopp_special6 .list dl:nth-child(even) dd { float: right } .iopp_special6 .list dl:nth-child(even) dt { left: 0 } .iopp_special6 .list dl:first-child { margin-top: 0 } .iopp_special7 { margin-top: 7.29vw } .iopp_special7 .iopp_special_title { text-align: center } .iopp_special7 .iopp_special_title .text { width: 39.06vw; display: inline-block; margin-top: 1.56vw } .iopp_special7 .list { width: 61.25vw; margin: 2.08vw auto 0; overflow: hidden; position: relative; font-size: 0; } .iopp_special7 .list:before { content: ""; height: 1px; position: absolute; left: 5.73vw; right: 5.73vw; top: 50%; background: #e1e5e5 } .iopp_special7 .list:after { content: ""; position: absolute; left: 33.33%; right: 33.33%; top: 4.17vw; bottom: 4.17vw; border-left: 1px solid #e1e5e5; border-right: 1px solid #e1e5e5 } .iopp_special7 .list li { width: 33.33%; display: inline-block; vertical-align: top; padding: 2.34vw 5.21vw; font-size: .94vw; color: #ddd; line-height: 1.22222; text-align: center } .iopp_special7 .list li:before { content: ""; width: 1.09vw; height: 1.09vw; display: block; margin: 0 auto .94vw; border: .16vw solid #ffbb38; border-radius: 50% } .iopp_special8 { margin-top: 4.95vw; background: #1a1e27; border-top-right-radius: 10.83vw } .iopp_special8 .wrap { padding-top: 7.81vw; padding-bottom: 5.47vw } .iopp_special8 .iopp_special_title .title { color: #ffffff } .iopp_special8 .sty1 .list { margin-top: 3.75vw; overflow: hidden } .iopp_special8 .sty1 .list p { float: left } .iopp_special8 .sty1 .list p img { width: 100%; display: block; border-radius: 1.04vw } .iopp_special8 .sty1 .list .img1 { width: 43.22097% } .iopp_special8 .sty1 .list .img2 { width: 27.26592%; margin: 0 1.04869% } .iopp_special8 .sty1 .list .img2 span { display: block; padding: 2.81vw 1.46vw 0; font-size: 1.25vw; color: #ffffff; line-height: 1.16667 } .iopp_special8 .sty1 .list .img3 { width: 27.34082% } .iopp_special8 .sty2 { margin-top: 10.42vw; overflow: hidden } .iopp_special8 .sty2 .fl { width: 42%; color: #ffffff } .iopp_special8 .sty2 .fl .title { text-align: left } .iopp_special8 .sty2 .fl .text { margin-top: 1.77vw; color: #ffffff } .iopp_special8 .sty2 .fl .email { margin-top: 2.92vw; font-size: 1.04vw } .iopp_special8 .sty2 .fl .email a { color: #ffffff; font-weight: bold; transition: all linear 0.3s } .iopp_special8 .sty2 .fl .email a:hover { color: #ff791f } .iopp_special8 .sty2 .fl .email span { display: block; margin-top: 1.25vw } .iopp_special8 .sty2 .fl .zx_btn_box { width: 16.09vw; height: 3.96vw; display: block; margin-top: 1.56vw; background: #ffbb38; border-radius: .52vw; font-size: 1.56vw; color: #ffffff; text-align: center; line-height: 3.96vw; font-weight: bold; cursor: pointer } .iopp_special8 .sty2 .fr { width: 54%; padding: 3.33vw 2.29vw 2.6vw; background: #ebefef; border-radius: 1.04vw } .iopp_special8 .sty2 .fr form { overflow: hidden } .iopp_special8 .sty2 .fr .same_input { width: 14.17vw; height: 3.13vw; float: left; margin-bottom: .78vw; position: relative } .iopp_special8 .sty2 .fr .same_input:before { content: ""; width: 3.33vw; height: 3.13vw; display: block; position: absolute; left: 0; top: 0; background-size: 1.51vw; background-position: center center; background-repeat: no-repeat } .iopp_special8 .sty2 .fr .same_input input, .iopp_special8 .sty2 .fr .same_input textarea { width: 100%; height: 100%; display: block; padding-left: 3.33vw; padding-right: .78vw; background: #e1e6e6; border-radius: .31vw; font-size: 1.04vw; color: #000; font-family: "Arial"; line-height: 3.13vw } .iopp_special8 .sty2 .fr .same_input input::-webkit-input-placeholder, .iopp_special8 .sty2 .fr .same_input textarea::-webkit-input-placeholder { color: #999999 } .iopp_special8 .sty2 .fr .same_input input::-moz-placeholder, .iopp_special8 .sty2 .fr .same_input textarea::-moz-placeholder { color: #999999 } .iopp_special8 .sty2 .fr .same_input input:-moz-placeholder, .iopp_special8 .sty2 .fr .same_input textarea:-moz-placeholder { color: #999999 } .iopp_special8 .sty2 .fr .same_input input:-ms-input-placeholder, .iopp_special8 .sty2 .fr .same_input textarea:-ms-input-placeholder { color: #999999 } .iopp_special8 .sty2 .fr .input_cp:before { background-image: url(../newimages/iron_ore_processing_plant/msg-icon01.png) } .iopp_special8 .sty2 .fr .input_name, .iopp_special8 .sty2 .fr .input_tel { float: right } .iopp_special8 .sty2 .fr .input_name:before { background-image: url(../newimages/iron_ore_processing_plant/msg-icon02.png) } .iopp_special8 .sty2 .fr .input_email:before { background-image: url(../newimages/iron_ore_processing_plant/msg-icon03.png) } .iopp_special8 .sty2 .fr .input_email:after { content: "*"; position: absolute; left: .26vw; top: 41%; font-size: 1.35vw; color: red } .iopp_special8 .sty2 .fr .input_tel:before { background-image: url(../newimages/iron_ore_processing_plant/msg-icon04.png) } .iopp_special8 .sty2 .fr .input_text { width: 100%; height: 8.44vw; margin-bottom: 2.34vw } .iopp_special8 .sty2 .fr .input_text:before { background-image: url(../newimages/iron_ore_processing_plant/msg-icon05.png) } .iopp_special8 .sty2 .fr .input_text textarea { padding-top: .94vw; padding-bottom: .94vw; line-height: 1.4 } .iopp_special8 .sty2 .fr .submit { width: 14.74vw; height: 3.18vw; display: block; margin: 0 auto; background: #ffbb38; border-radius: .52vw; font-size: 1.56vw; color: #ffffff; text-align: center; line-height: 3.18vw; font-weight: bold; cursor: pointer } .btn_effect { display: block; position: relative; overflow: hidden; cursor: pointer; transition: all linear 0.3s } .btn_effect i { display: block; transition: all linear 0.3s; transform-style: preserve-3d; transform: translateY(0); transition-property: transform; font-style: normal } .btn_effect i+i { position: absolute; top: 0; left: 0; width: 100%; transform: translate3d(0, 36%, 0) rotateX(-90deg); display: none\9 } .btn_effect:hover i { transform: translate3d(0, -36%, 0) rotateX(90deg); transform: none\9 } .btn_effect:hover i+i { transform: none } @media (max-width: 960px) { body { padding-bottom: 1.17333rem } .wrap { width: 92%; } .top-show { padding: .48rem 0 } .top-show .logo { width: 2.66667rem } .top-show .navBtn { width: 1.06667rem; float: right; display: block } .top-show .head-btn { display: none } .iopp_special_title .title { font-size: .6rem } .iopp_special_title .text { font-size: .37333rem } .iopp_special1 .pc_pic, .iopp_special1 .m_pic { display: none } .iopp_special1 .m_pic { display: block } .iopp_special1 .wrap { position: static } .iopp_special1 .wrap .wenan { position: relative; transform: none; margin-top: .48rem; padding: .6rem 0 .72rem; border-radius: .26667rem } .iopp_special1 .wrap .wenan:before { display: none } .iopp_special1 .wrap .wenan h1 { font-size: .64rem } .iopp_special1 .wrap .wenan .cs { margin-top: .6rem } .iopp_special1 .wrap .wenan .cs p { font-size: .37333rem } .iopp_special1 .wrap .wenan .cs p+p { margin-top: .2rem } .iopp_special1 .wrap .wenan .zx_btn_box { width: 100%; height: 1.17333rem; margin-top: .6rem; border-radius: .2rem } .iopp_special1 .wrap .wenan .zx_btn_box .btn { font-size: .45333rem; line-height: 1.17333rem } .iopp_special1 .wrap .wenan .zx_btn_box .btn i:before { width: .56rem; margin-right: .24rem } .iopp_special1 .wrap .wenan .email { margin-left: .21333rem; margin-top: .4rem; padding: .02667rem 0 .08rem .88rem; background-size: .56rem; font-size: .45333rem } .iopp_special1 .wrap .wenan .email span { border-bottom: .02667rem solid #fff } .iopp_special2 { margin-top: .48rem } .iopp_special2 .wrap .list { display: flex; overflow-x: auto; white-space: nowrap; padding: .4rem .48rem .6rem; border-radius: .26667rem; } .iopp_special2 .wrap .list a { width: auto; display: inline-block; vertical-align: top; } .iopp_special2 .wrap .list a img { width: 5rem; max-width: none !important; } .iopp_special2 .wrap .list a span { min-width: 90%; margin-top: .26667rem; padding: .13333rem .2rem .06667rem; border-radius: .66667rem; font-size: .34667rem } .iopp_special3 { margin-top: 1rem } .iopp_special3 .wrap { overflow: hidden } .iopp_special3 .fl { width: 100%; margin-top: .53333rem } .iopp_special3 .fl img { border-radius: .26667rem } .iopp_special3 .fr { width: 100% } .iopp_special3 .fr .title { text-align: center } .iopp_special3 .fr .text { margin-top: .48rem } .iopp_special3 .fr .text p+p { margin-top: .32rem } .iopp_special4 { margin-top: 1.2rem } .iopp_special4 .wrap { padding-top: 1rem; padding-bottom: 2.93333rem } .iopp_special4 .text { margin-top: .6rem } .iopp_special4 .fl { width: 100% } .iopp_special4 .fl p strong { margin-bottom: .16rem; font-size: .42667rem } .iopp_special4 .fl p+p { margin-top: .48rem } .iopp_special4 .fr { width: 100%; margin-top: .72rem } .iopp_special5 { margin-top: 1rem } .iopp_special5 .list { margin-left: -2%; margin-top: .24rem } .iopp_special5 .list li { width: 48%; height: auto; margin-left: 2%; margin-top: .4rem; padding: .46667rem .48rem; border-radius: 2rem 2rem .4rem .4rem } .iopp_special5 .list li i { width: .88rem; height: .88rem; font-size: .48rem; line-height: .88rem } .iopp_special5 .list li p { margin-top: .32rem; font-size: .37333rem } .iopp_special6 { margin-top: 1.2rem } .iopp_special6 .list { margin-top: .66667rem } .iopp_special6 .list dl { margin-top: .88rem } .iopp_special6 .list dl dd { width: 100% } .iopp_special6 .list dl dd img { border-radius: .26667rem } .iopp_special6 .list dl dt { width: 100%; position: static; transform: none; margin-top: .48rem } .iopp_special6 .list dl dt h3 { font-size: .53333rem } .iopp_special6 .list dl dt .cs { margin-top: .32rem } .iopp_special6 .list dl dt .cs p { font-size: .37333rem } .iopp_special6 .list dl dt .cs p+p { margin-top: .24rem } .iopp_special6 .list dl dt .zx_btn_box { width: 4.8rem; height: 1.06667rem; margin-top: .53333rem; border-radius: .2rem; font-size: .42667rem; line-height: 1.06667rem } .iopp_special6 .list dl:nth-child(even) dd { float: none } .iopp_special7 { margin-top: 1.2rem } .iopp_special7 .iopp_special_title .text { width: 100%; margin-top: .4rem } .iopp_special7 .list { width: 100%; margin-top: .4rem } .iopp_special7 .list:before { width: 1px; height: auto; left: 50%; top: 5%; bottom: 5% } .iopp_special7 .list:after { content: ""; position: absolute; left: 0; right: 0; top: 33.33%; bottom: 33.33%; border: none; border-top: 1px solid #e1e5e5; border-bottom: 1px solid #e1e5e5 } .iopp_special7 .list li { width: 50%; height: 3.25333rem; padding: .6rem .4rem; font-size: .37333rem } .iopp_special7 .list li:before { width: .36rem; height: .36rem; margin-bottom: .32rem; border-width: .05333rem } .iopp_special8 { margin-top: 1rem; border-top-right-radius: 1.2rem } .iopp_special8 .wrap { padding-top: 1rem; padding-bottom: 1rem } .iopp_special8 .sty1 .list { margin-top: .96rem } .iopp_special8 .sty1 .list p img { border-radius: .26667rem } .iopp_special8 .sty1 .list .img2 span { padding: .13333rem 0rem 0; font-size: .32rem; text-align: center } .iopp_special8 .sty2 { margin-top: 1rem } .iopp_special8 .sty2 .fl { width: 100% } .iopp_special8 .sty2 .fl .text { margin-top: .45333rem } .iopp_special8 .sty2 .fl .email { margin-top: .48rem; font-size: .4rem } .iopp_special8 .sty2 .fl .email span { margin-top: .32rem } .iopp_special8 .sty2 .fl .zx_btn_box { width: 4.12rem; height: 1.06667rem; margin-top: .6rem; border-radius: .2rem; font-size: .48rem; line-height: 1.06667rem } .iopp_special8 .sty2 .fr { width: 100%; margin-top: .6rem; padding: .85333rem .6rem; border-radius: .26667rem } .iopp_special8 .sty2 .fr .same_input { width: 100%; height: 1rem; float: none; margin-bottom: .32rem } .iopp_special8 .sty2 .fr .same_input:before { width: 1.06667rem; height: 1rem; background-size: .48rem } .iopp_special8 .sty2 .fr .same_input input, .iopp_special8 .sty2 .fr .same_input textarea { padding-left: 1.06667rem; padding-right: .2rem; border-radius: .08rem; font-size: .37333rem; line-height: 1rem } .iopp_special8 .sty2 .fr .input_name, .iopp_special8 .sty2 .fr .input_tel { float: none } .iopp_special8 .sty2 .fr .input_email:after { left: .06667rem; top: 42%; font-size: .42667rem } .iopp_special8 .sty2 .fr .input_text { height: 2.66667rem; margin-bottom: .6rem } .iopp_special8 .sty2 .fr .input_text textarea { padding-top: .29333rem; padding-bottom: .29333rem; line-height: 1.4 } .iopp_special8 .sty2 .fr .submit { width: 4.12rem; height: 1.06667rem; border-radius: .2rem; font-size: .48rem; line-height: 1.06667rem } }