@charset "utf-8"; /*! Important comments included in minified output. https://www.bocweb.cn/ 2021-03-15 ©2021 博采网络 ALL RIGHTS RESERVED. 博采网络 */ .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .footer4 .footer-top .leftbox .linkbox .wximg:before, .header4 .linkbox .wximg:before, .header4 .linkbox .telbox:before, .m-bocweb-header3 .linkbox .wximg:before, .m-bocweb-header3 .linkbox .telbox:before { content: ""; height: 0; width: 0; overflow: hidden; } .simple-form-basic, .simple-text, .simple-textarea, .simple-select, .n-news .formtab .input, .contact-list2 .ulbox .input1, .contact-list2 .ulbox .input2 { border: 1px solid #ccc; padding: 4px; vertical-align: middle; } .simple-form-basic:focus, .simple-text:focus, .simple-textarea:focus, .simple-select:focus, .n-news .formtab .input:focus, .contact-list2 .ulbox .input1:focus, .contact-list2 .ulbox .input2:focus { outline: 0 none; } .simple-text { height: 18px; -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; transition: border linear 0.2s, box-shadow linear 0.2s; -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); } .simple-text:focus { border-color: rgba(82, 168, 236, 0.8); -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6); } .simple-textarea { height: 18px; -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; transition: border linear 0.2s, box-shadow linear 0.2s; -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); height: 80px; width: 500px; vertical-align: top; } .simple-textarea:focus { border-color: rgba(82, 168, 236, 0.8); -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6); } .simple-select { *margin-top: 5px; *margin-bottom: 5px; *vertical-align: top; } .reset-radio-checkbox { margin: 0 5px 0 0; padding: 0; font-size: 13px; *width: 13px; *height: 13px; } /** * 1. Set default font family to sans-serif. * 2. Prevent iOS text size adjust after orientation change, without disabling * user zoom. * 0. sassCore's style */ html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ overflow-y: scroll; /* 0 */ -webkit-overflow-scrolling: touch; /* 0 */ } /** * 1. Remove default margin * 0. sassCore's style. */ body { margin: 0; /* 1 */ font-size: 12px; /* 0 */ line-height: 2; /* 0 */ color: #333; /* 0 */ background-color: #fff; /* 0 */ } /* HTML5 display definitions ========================================================================== */ /** * Correct `block` display not defined for any HTML5 element in IE 8/9. * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. * Correct `block` display not defined for `main` in IE 11. */ article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } /** * 1. Correct `inline-block` display not defined in IE 8/9. * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. * 3. Correct `inline-block` display in IE 6/7. */ audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ *display: inline; /* 3 */ *zoom: 1; /* 3 */ } /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /** * Address `[hidden]` styling not present in IE 8/9/10. * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. */ [hidden], template { display: none; } /* Links ========================================================================== */ /** * 1. Remove the gray background color from active links in IE 10. * 2. Improve readability when focused and also mouse hovered in all browsers. * 0. sassCore's style. */ a { background: transparent; /* 1 */ /* 0 */ text-decoration: none; color: #08c; } a:active, a:hover { outline: 0; /* 2 */ } a:hover { color: #006699; } /* Text-level semantics ========================================================================== */ /** * Address styling not present in IE 8/9/10/11, Safari, and Chrome. */ abbr[title] { border-bottom: 1px dotted; } /** * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */ b, strong { font-weight: bold; } /** * Address styling not present in Safari and Chrome. */ dfn { font-style: italic; } /** * Address styling not present in IE 8/9. */ mark { background: #ff0; color: #000; } /** * Address inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* Embedded content ========================================================================== */ /** * 1. Remove border when inside `a` element in IE 8/9/10. * 2. Improve image quality when scaled in IE 7. * 0. sassCore's style. */ img { border: 0; /* 1 */ vertical-align: middle; /* 0 */ -ms-interpolation-mode: bicubic; /* 2 */ } /** * Correct overflow not hidden in IE 9/10/11. */ svg:not(:root) { overflow: hidden; } /* Grouping content ========================================================================== */ /** * Address differences between Firefox and other browsers. */ hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } /** * 1. Contain overflow in all browsers. * 2. Improve readability of pre-formatted text in all browsers. */ pre { overflow: auto; /* 1 */ white-space: pre; /* 2 */ white-space: pre-wrap; /* 2 */ word-wrap: break-word; /* 2 */ } /** * 1. Address odd `em`-unit font size rendering in all browsers. * 2. Correct font family set oddly in IE 6, Safari 4/5, and Chrome. */ code, kbd, pre, samp { font-family: monospace, monospace; /* 1 */ _font-family: 'courier new', monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Forms ========================================================================== */ /** * Known limitation: by default, Chrome and Safari on OS X allow very limited * styling of `select`, unless a `border` property is set. */ /** * 1. Correct color not being inherited. * Known issue: affects color of disabled elements. * 2. Correct font properties not being inherited. * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */ button, input, optgroup, select, textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ } /** * Address `overflow` set to `hidden` in IE 8/9/10/11. */ button { overflow: visible; } /** * Address inconsistent `text-transform` inheritance for `button` and `select`. * All other form control elements do not inherit `text-transform` values. * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. * Correct `select` style inheritance in Firefox. */ button, select { text-transform: none; } /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type * `input` and others. * 4. Remove inner spacing in IE 7 without affecting normal text inputs. * Known issue: inner spacing remains in IE 6. */ button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ *overflow: visible; /* 4 */ } /** * Re-set default cursor for disabled elements. */ button[disabled], html input[disabled] { cursor: default; } /** * Remove inner padding and border in Firefox 4+. */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } textarea:focus, input:focus { outline: none; } /** * Address Firefox 4+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ input { line-height: normal; } /** * It's recommended that you don't attempt to style these elements. * Firefox's implementation doesn't respect box-sizing, padding, or width. * * 1. Address box sizing set to `content-box` in IE 8/9/10. * 2. Remove excess padding in IE 8/9/10. * 3. Remove excess padding in IE 7. * Known issue: excess padding remains in IE 6. */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ *height: 13px; /* 3 */ *width: 13px; /* 3 */ } /** * Fix the cursor style for Chrome's increment/decrement buttons. For certain * `font-size` values of the `input`, it causes the cursor style of the * decrement button to change from `default` to `text`. */ input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Address `appearance` set to `searchfield` in Safari and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari and Chrome * (include `-moz` to future-proof). */ input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; } /** * Remove inner padding and search cancel button in Safari and Chrome on OS X. * Safari (but not Chrome) clips the cancel button when the search input has * padding (and `textfield` appearance). */ input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration, input[type="text"] { -webkit-appearance: none; } /** * Define consistent border, margin, and padding. */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /** * 1. Correct `color` not being inherited in IE 8/9/10/11. * 2. Remove padding so people aren't caught out if they zero out fieldsets. * 3. Correct alignment displayed oddly in IE 6/7. */ legend { border: 0; /* 1 */ padding: 0; /* 2 */ *margin-left: -7px; /* 3 */ } /** * 1. Remove default vertical scrollbar in IE 8/9/10/11. * 0. sassCore's style */ textarea { overflow: auto; /* 1 */ resize: vertical; /* 0 */ } /** * Don't inherit the `font-weight` (applied by a rule above). * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */ optgroup { font-weight: bold; } /* Tables ========================================================================== */ /** * Remove most spacing between table cells. */ table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } /** * Address CSS quotes not supported in IE 6/7. */ q { quotes: none; } html, button, input, select, textarea { font-family: "Source Han Sans CN", "Noto Sans S Chinese Light", "Microsoft Yahei", "Microsoft YaHei Light", "Pingfang sc regular", "Helvetica Neue", Helvetica, Tahoma, sans-serif; } h1, h2, h3, h4, h5, h6, p, figure, form, blockquote { margin: 0; } ul, ol, li, dl, dd { margin: 0; padding: 0; } ul, ol { list-style: none outside none; } h1, h2, h3 { line-height: 2; font-weight: normal; } h1 { font-size: 18px; } h2 { font-size: 15.6px; } h3 { font-size: 14.04px; } h4 { font-size: 12px; } h5, h6 { font-size: 10.2px; text-transform: uppercase; } input:-moz-placeholder, textarea:-moz-placeholder { color: #ccc; } input::-moz-placeholder, textarea::-moz-placeholder { color: #ccc; } input:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #ccc; } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #ccc; } html { overflow: hidden; overflow-y: scroll; } button, input, textarea, select { border: none; border-radius: 0; outline: none; padding: 0; } * { box-sizing: border-box; -webkit-font-smoothing: antialiased; } img { display: block; max-width: 100%; } .clear { clear: both; } .f-cb { zoom: 1; } .f-cb:after { display: block; height: 0; clear: both; visibility: hidden; overflow: hidden; content: "."; } .fl { float: left; } .fr { float: right; } .por { position: relative; } .poa { position: absolute; } .pof { position: fixed; } .poa-f { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .ovh { overflow: hidden; } .noselect { -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; } .dn { display: none; } .w-f { width: 100%; } .h-f { height: 100%; } .loader { width: 50px; height: 50px; position: fixed; top: 50%; left: 50%; margin: -25px 0 0 -25px; font-size: 10px; border-top: 2px solid rgba(0, 0, 0, 0.08); border-right: 2px solid rgba(0, 0, 0, 0.08); border-bottom: 2px solid rgba(0, 0, 0, 0.08); border-left: 2px solid rgba(0, 0, 0, 0.5); border-radius: 50%; animation: spinner 700ms infinite linear; } .loader.white { border-top: 2px solid rgba(255, 255, 255, 0.08); border-right: 2px solid rgba(255, 255, 255, 0.08); border-bottom: 2px solid rgba(255, 255, 255, 0.08); border-left: 2px solid rgba(255, 255, 255, 0.5); } @keyframes spinner { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /*手机上a链接有黑色透明底怎么去掉 给a加这个样式*/ a { -webkit-tap-highlight-color: rgba(255, 0, 0, 0); } select, input { outline: none; } /*ie 去掉自带关闭*/ input::-ms-clear { display: none; } /*网站单位设置*/ @media only screen and (min-width: 360px) { html { font-size: 26px !important; } } @media only screen and (min-width: 435px) { html { font-size: 30px !important; } } /*@media only screen and(min-width: 500px) { html { font-size: 36px!important } }*/ @media (min-width: 769px) { html { font-size: 34px !important; } } @media only screen and (min-width: 1024px) { html { font-size: 28px !important; } } @media only screen and (min-width: 1200px) { html { font-size: 30px !important; } } @media only screen and (min-width: 1440px) { html { font-size: 34px !important; } } @media only screen and (min-width: 1680px) { html { font-size: 40px !important; } } ::-moz-selection { background: red; color: #fff; } ::selection { background: red; color: #fff; } ::-webkit-scrollbar { width: 5px; height: 5px; } ::-webkit-scrollbar-track { background: rgba(0, 0, 0, 0.1); } ::-webkit-scrollbar-thumb { background: #8bc120; } ::-webkit-scrollbar-thumb:window-inactive { background: #8bc120; } ::-webkit-scrollbar-thumb:vertical:hover { background: #8bc120; } /*==常用颜色==*/ .col-fff { color: #fff; } .col-000 { color: #000; } .col-111 { color: #111; } .col-222 { color: #222; } .col-333 { color: #333; } .col-444 { color: #444; } .col-555 { color: #555; } .col-666 { color: #666; } .col-777 { color: #666; } .col-888 { color: #666; } .col-999 { color: #999; } /*==常用字号==*/ .tit-12 { font-size: 12px; line-height: 2; } .tit-13 { font-size: 13px; line-height: 2; } .tit-14 { font-size: 14px; line-height: 2; } .tit-15 { font-size: 15px; line-height: 2; } .tit-16 { line-height: 1.8; font-size: 16px; } .tit-17 { line-height: 1.8; font-size: 17px; } .tit-18 { line-height: 1.8; font-size: 18px; } .tit-19 { line-height: 1.8; font-size: 19px; } .tit-20 { line-height: 1.8; font-size: 20px; } .tit-21 { line-height: 1.8; font-size: 21px; } .tit-22 { line-height: 1.8; font-size: 22px; } .tit-23 { line-height: 1.8; font-size: 23px; } .tit-24 { line-height: 1.8; font-size: 24px; } .tit-25 { line-height: 1.8; font-size: 25px; } .tit-26 { line-height: 1.8; font-size: 26px; } .tit-27 { line-height: 1.8; font-size: 27px; } .tit-28 { line-height: 1.8; font-size: 28px; } .tit-29 { line-height: 1.8; font-size: 29px; } .tit-30 { line-height: 1.8; font-size: 30px; } .tit-31 { line-height: 1.8; font-size: 31px; } .tit-32 { line-height: 1.8; font-size: 32px; } .tit-33 { line-height: 1.8; font-size: 33px; } .tit-34 { line-height: 1.8; font-size: 34px; } .tit-35 { line-height: 1.8; font-size: 35px; } .tit-36 { line-height: 1.8; font-size: 36px; } .tit-37 { line-height: 1.8; font-size: 37px; } .tit-38 { line-height: 1.8; font-size: 38px; } .tit-39 { line-height: 1.8; font-size: 39px; } .tit-40 { line-height: 1.8; font-size: 40px; } .tit-41 { line-height: 1.8; font-size: 41px; } .tit-42 { line-height: 1.8; font-size: 42px; } .tit-43 { line-height: 1.8; font-size: 43px; } .tit-44 { line-height: 1.8; font-size: 44px; } .tit-45 { line-height: 1.8; font-size: 45px; } .tit-46 { line-height: 1.8; font-size: 46px; } .tit-47 { line-height: 1.8; font-size: 47px; } .tit-48 { line-height: 1.8; font-size: 48px; } .tit-49 { line-height: 1.8; font-size: 49px; } .tit-50 { line-height: 1.8; font-size: 50px; } .tit-51 { line-height: 1.8; font-size: 51px; } .tit-52 { line-height: 1.8; font-size: 52px; } .tit-53 { line-height: 1.8; font-size: 53px; } .tit-54 { line-height: 1.8; font-size: 54px; } .tit-55 { line-height: 1.8; font-size: 55px; } .tit-56 { line-height: 1.8; font-size: 56px; } .tit-57 { line-height: 1.8; font-size: 57px; } .tit-58 { line-height: 1.8; font-size: 58px; } .tit-59 { line-height: 1.8; font-size: 59px; } .tit-60 { line-height: 1.8; font-size: 60px; } .tit-61 { line-height: 1.8; font-size: 61px; } .tit-62 { line-height: 1.8; font-size: 62px; } .tit-63 { line-height: 1.8; font-size: 63px; } .tit-64 { line-height: 1.8; font-size: 64px; } .tit-65 { line-height: 1.8; font-size: 65px; } .tit-66 { line-height: 1.8; font-size: 66px; } .tit-67 { line-height: 1.8; font-size: 67px; } .tit-68 { line-height: 1.8; font-size: 68px; } .tit-69 { line-height: 1.8; font-size: 69px; } .tit-70 { line-height: 1.8; font-size: 70px; } .tit-71 { line-height: 1.8; font-size: 71px; } .tit-72 { line-height: 1.8; font-size: 72px; } .tit-73 { line-height: 1.8; font-size: 73px; } .tit-74 { line-height: 1.8; font-size: 74px; } .tit-75 { line-height: 1.8; font-size: 75px; } .tit-76 { line-height: 1.8; font-size: 76px; } .tit-77 { line-height: 1.8; font-size: 77px; } .tit-78 { line-height: 1.8; font-size: 78px; } .tit-79 { line-height: 1.8; font-size: 79px; } .tit-80 { line-height: 1.8; font-size: 80px; } @media (max-width: 1681px) { /*==常用字号==*/ .tit-12 { font-size: 12px; } .tit-13 { font-size: 13px; } .tit-14 { font-size: 13px; } .tit-15 { font-size: 14px; } .tit-16 { font-size: 15px; } .tit-17 { font-size: 16px; } .tit-18 { font-size: 17px; } .tit-19 { font-size: 18px; } .tit-20 { font-size: 18px; } .tit-21 { font-size: 19px; } .tit-22 { font-size: 20px; } .tit-23 { font-size: 21px; } .tit-24 { font-size: 22px; } .tit-25 { font-size: 23px; } .tit-26 { font-size: 24px; } .tit-27 { font-size: 25px; } .tit-28 { font-size: 26px; } .tit-29 { font-size: 27px; } .tit-30 { font-size: 27px; } .tit-31 { font-size: 28px; } .tit-32 { font-size: 29px; } .tit-33 { font-size: 30px; } .tit-34 { font-size: 31px; } .tit-35 { font-size: 32px; } .tit-36 { font-size: 33px; } .tit-37 { font-size: 34px; } .tit-38 { font-size: 35px; } .tit-39 { font-size: 36px; } .tit-40 { font-size: 37px; } .tit-42 { font-size: 38px; } .tit-43 { font-size: 39px; } .tit-44 { font-size: 40px; } .tit-45 { font-size: 41px; } .tit-46 { font-size: 42px; } .tit-47 { font-size: 43px; } .tit-48 { font-size: 44px; } .tit-50 { font-size: 45px; } .tit-51 { font-size: 46px; } .tit-52 { font-size: 47px; } .tit-53 { font-size: 48px; } .tit-54 { font-size: 49px; } .tit-55 { font-size: 50px; } .tit-56 { font-size: 51px; } .tit-57 { font-size: 52px; } .tit-58 { font-size: 53px; } .tit-59 { font-size: 54px; } .tit-60 { font-size: 54px; } .tit-61 { font-size: 55px; } .tit-62 { font-size: 56px; } .tit-63 { font-size: 57px; } .tit-64 { font-size: 58px; } .tit-65 { font-size: 59px; } .tit-66 { font-size: 60px; } .tit-67 { font-size: 61px; } .tit-68 { font-size: 62px; } .tit-69 { font-size: 63px; } .tit-70 { font-size: 62px; } .tit-71 { font-size: 63px; } .tit-72 { font-size: 64px; } .tit-73 { font-size: 65px; } .tit-74 { font-size: 66px; } .tit-75 { font-size: 67px; } .tit-76 { font-size: 68px; } .tit-77 { font-size: 69px; } .tit-78 { font-size: 70px; } .tit-79 { font-size: 71px; } .tit-80 { font-size: 72px; } } @media (max-width: 1481px) { /*==常用字号==*/ .tit-13 { font-size: 12px; } .tit-14 { font-size: 12px; } .tit-15 { font-size: 13px; } .tit-16 { font-size: 14px; } .tit-17 { font-size: 15px; } .tit-18 { font-size: 16px; } .tit-19 { font-size: 17px; } .tit-20 { font-size: 18px; } .tit-20 { font-size: 16px; } .tit-21 { font-size: 17px; } .tit-22 { font-size: 18px; } .tit-23 { font-size: 19px; } .tit-24 { font-size: 20px; } .tit-25 { font-size: 21px; } .tit-26 { font-size: 22px; } .tit-27 { font-size: 23px; } .tit-28 { font-size: 24px; } .tit-29 { font-size: 25px; } .tit-30 { font-size: 26px; } .tit-31 { font-size: 25px; } .tit-32 { font-size: 26px; } .tit-33 { font-size: 27px; } .tit-34 { font-size: 28px; } .tit-35 { font-size: 29px; } .tit-36 { font-size: 30px; } .tit-37 { font-size: 31px; } .tit-38 { font-size: 32px; } .tit-39 { font-size: 33px; } .tit-40 { font-size: 34px; } .tit-41 { font-size: 35px; } .tit-42 { font-size: 36px; } .tit-43 { font-size: 37px; } .tit-44 { font-size: 38px; } .tit-45 { font-size: 37px; } .tit-46 { font-size: 38px; } .tit-47 { font-size: 39px; } .tit-48 { font-size: 40px; } .tit-49 { font-size: 41px; } .tit-50 { font-size: 42px; } .tit-51 { font-size: 43px; } .tit-52 { font-size: 44px; } .tit-53 { font-size: 45px; } .tit-54 { font-size: 46px; } .tit-55 { font-size: 47px; } .tit-56 { font-size: 48px; } .tit-57 { font-size: 49px; } .tit-58 { font-size: 50px; } .tit-59 { font-size: 51px; } .tit-60 { font-size: 52px; } .tit-61 { font-size: 51px; } .tit-62 { font-size: 52px; } .tit-63 { font-size: 53px; } .tit-64 { font-size: 54px; } .tit-65 { font-size: 55px; } .tit-66 { font-size: 56px; } .tit-67 { font-size: 57px; } .tit-68 { font-size: 58px; } .tit-69 { font-size: 59px; } .tit-70 { font-size: 60px; } .tit-71 { font-size: 55px; } .tit-72 { font-size: 56px; } .tit-73 { font-size: 57px; } .tit-74 { font-size: 58px; } .tit-75 { font-size: 59px; } .tit-76 { font-size: 60px; } .tit-77 { font-size: 61px; } .tit-78 { font-size: 62px; } .tit-79 { font-size: 63px; } .tit-80 { font-size: 64px; } } @media (max-width: 1281px) { /*==常用字号==*/ .tit-13 { font-size: 12px; } .tit-14 { font-size: 12px; } .tit-15 { font-size: 12px; } .tit-16 { font-size: 13px; } .tit-17 { font-size: 16px; } .tit-18 { font-size: 15px; } .tit-19 { font-size: 16px; } .tit-20 { font-size: 17px; } .tit-22 { font-size: 18px; } .tit-24 { font-size: 19px; } .tit-25 { font-size: 20px; } .tit-26 { font-size: 21px; } .tit-27 { font-size: 22px; } .tit-28 { font-size: 23px; } .tit-29 { font-size: 24px; } .tit-30 { font-size: 25px; } .tit-31 { font-size: 26px; } .tit-32 { font-size: 27px; } .tit-33 { font-size: 24px; } .tit-34 { font-size: 25px; } .tit-35 { font-size: 26px; } .tit-36 { font-size: 27px; } .tit-37 { font-size: 28px; } .tit-38 { font-size: 29px; } .tit-39 { font-size: 30px; } .tit-40 { font-size: 31px; } .tit-41 { font-size: 32px; } .tit-42 { font-size: 33px; } .tit-43 { font-size: 34px; } .tit-44 { font-size: 35px; } .tit-45 { font-size: 36px; } .tit-46 { font-size: 37px; } .tit-47 { font-size: 38px; } .tit-48 { font-size: 39px; } .tit-49 { font-size: 40px; } .tit-50 { font-size: 38px; } .tit-51 { font-size: 39px; } .tit-52 { font-size: 40px; } .tit-53 { font-size: 41px; } .tit-54 { font-size: 42px; } .tit-55 { font-size: 43px; } .tit-56 { font-size: 44px; } .tit-57 { font-size: 45px; } .tit-58 { font-size: 46px; } .tit-59 { font-size: 47px; } .tit-60 { font-size: 48px; } .tit-61 { font-size: 49px; } .tit-62 { font-size: 50px; } .tit-63 { font-size: 51px; } .tit-64 { font-size: 52px; } .tit-65 { font-size: 53px; } .tit-66 { font-size: 54px; } .tit-67 { font-size: 55px; } .tit-68 { font-size: 56px; } .tit-69 { font-size: 57px; } .tit-70 { font-size: 58px; } .tit-71 { font-size: 51px; } .tit-72 { font-size: 52px; } .tit-73 { font-size: 53px; } .tit-74 { font-size: 54px; } .tit-75 { font-size: 55px; } .tit-76 { font-size: 56px; } .tit-77 { font-size: 57px; } .tit-78 { font-size: 58px; } .tit-79 { font-size: 59px; } .tit-80 { font-size: 60px; } } @media (max-width: 1024px) { .tit-24 { font-size: 16px; } .tit-25 { font-size: 17px; } .tit-26 { font-size: 18px; } .tit-27 { font-size: 19px; } .tit-28 { font-size: 20px; } .tit-29 { font-size: 21px; } .tit-30 { font-size: 22px; } .tit-31 { font-size: 23px; } .tit-32 { font-size: 24px; } .tit-33 { font-size: 21px; } .tit-34 { font-size: 22px; } .tit-35 { font-size: 23px; } .tit-36 { font-size: 24px; } .tit-37 { font-size: 25px; } .tit-38 { font-size: 26px; } .tit-39 { font-size: 27px; } .tit-40 { font-size: 28px; } .tit-41 { font-size: 29px; } .tit-42 { font-size: 30px; } .tit-43 { font-size: 31px; } .tit-44 { font-size: 32px; } .tit-45 { font-size: 33px; } .tit-46 { font-size: 34px; } .tit-47 { font-size: 35px; } .tit-48 { font-size: 36px; } .tit-49 { font-size: 37px; } .tit-50 { font-size: 34px; } .tit-51 { font-size: 35px; } .tit-52 { font-size: 36px; } .tit-53 { font-size: 37px; } .tit-54 { font-size: 38px; } .tit-55 { font-size: 39px; } .tit-56 { font-size: 40px; } .tit-57 { font-size: 41px; } .tit-58 { font-size: 42px; } .tit-59 { font-size: 43px; } .tit-60 { font-size: 44px; } .tit-61 { font-size: 45px; } .tit-62 { font-size: 46px; } .tit-63 { font-size: 47px; } .tit-64 { font-size: 48px; } .tit-65 { font-size: 49px; } .tit-66 { font-size: 50px; } .tit-67 { font-size: 51px; } .tit-68 { font-size: 52px; } .tit-69 { font-size: 53px; } .tit-70 { font-size: 54px; } .tit-71 { font-size: 47px; } .tit-72 { font-size: 48px; } .tit-73 { font-size: 49px; } .tit-74 { font-size: 50px; } .tit-75 { font-size: 51px; } .tit-76 { font-size: 52px; } .tit-77 { font-size: 53px; } .tit-78 { font-size: 54px; } .tit-79 { font-size: 55px; } .tit-80 { font-size: 56px; } } @media (max-width: 768px) { .tit-16 { font-size: 12px; } .tit-18 { font-size: 14px; } .tit-20 { font-size: 16px; } .tit-33 { font-size: 20px; } .tit-34 { font-size: 21px; } .tit-35 { font-size: 22px; } .tit-36 { font-size: 23px; } .tit-37 { font-size: 24px; } .tit-38 { font-size: 25px; } .tit-39 { font-size: 26px; } .tit-40 { font-size: 24px; } .tit-41 { font-size: 25px; } .tit-42 { font-size: 26px; } .tit-43 { font-size: 27px; } .tit-44 { font-size: 28px; } .tit-45 { font-size: 29px; } .tit-46 { font-size: 30px; } .tit-47 { font-size: 31px; } .tit-48 { font-size: 32px; } .tit-49 { font-size: 33px; } .tit-50 { font-size: 28px; } .tit-51 { font-size: 29px; } .tit-52 { font-size: 30px; } .tit-53 { font-size: 31px; } .tit-54 { font-size: 32px; } .tit-55 { font-size: 33px; } .tit-56 { font-size: 34px; } .tit-57 { font-size: 35px; } .tit-58 { font-size: 36px; } .tit-59 { font-size: 37px; } .tit-60 { font-size: 36px; } .tit-61 { font-size: 37px; } .tit-62 { font-size: 38px; } .tit-63 { font-size: 39px; } .tit-64 { font-size: 40px; } .tit-65 { font-size: 41px; } .tit-66 { font-size: 42px; } .tit-67 { font-size: 43px; } .tit-68 { font-size: 44px; } .tit-69 { font-size: 45px; } .tit-70 { font-size: 46px; } .tit-70 { font-size: 42px; } .tit-71 { font-size: 43px; } .tit-72 { font-size: 44px; } .tit-73 { font-size: 45px; } .tit-74 { font-size: 46px; } .tit-75 { font-size: 47px; } .tit-76 { font-size: 48px; } .tit-77 { font-size: 49px; } .tit-78 { font-size: 50px; } .tit-79 { font-size: 51px; } .tit-80 { font-size: 52px; } } /*正文字号*/ .conbox-14 { font-size: 14px; line-height: 1.8; } .conbox-15 { font-size: 15px; line-height: 1.8; } .conbox-16 { font-size: 16px; line-height: 1.8; } .conbox-17 { font-size: 17px; line-height: 1.8; } .conbox-18 { font-size: 18px; line-height: 1.8; } .conbox-19 { font-size: 19px; line-height: 1.8; } .conbox-20 { font-size: 20px; line-height: 1.8; } .conbox-21 { font-size: 21px; line-height: 1.8; } .conbox-22 { font-size: 22px; line-height: 1.8; } .conbox-23 { font-size: 23px; line-height: 1.8; } .conbox-24 { font-size: 24px; line-height: 1.8; } @media (max-width: 1481px) { .conbox-18 { font-size: 16px; } .conbox-20 { font-size: 18px; } .conbox-24 { font-size: 20px; } } @media (max-width: 1281px) { .conbox-14 { font-size: 13px; } .conbox-16 { font-size: 14px; } .conbox-18 { font-size: 15px; } .conbox-20 { font-size: 15px; } .conbox-24 { font-size: 16px; } } /*弹性盒样式*/ .f-no { display: flex; flex-flow: row wrap; } .f-no-b-center { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; } .f-no-b-start { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: flex-start; } .f-no-b-stretch { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: stretch; } .f-no-c-center { display: flex; flex-flow: row wrap; justify-content: center; align-items: center; } .f-no-c-start { display: flex; flex-flow: row wrap; justify-content: center; align-items: flex-start; } .f-no-c-stretch { display: flex; flex-flow: row wrap; justify-content: center; align-items: stretch; } .f-no-s-center { display: flex; flex-flow: row wrap; justify-content: flex-start; align-items: center; } .f-no-s-end { display: flex; flex-flow: row wrap; justify-content: flex-start; align-items: flex-end; } .f-no-s-stretch { display: flex; flex-flow: row wrap; justify-content: flex-start; align-items: stretch; } .f-no-end-start { display: flex; flex-flow: row wrap; justify-content: flex-end; } .f-no-col { display: flex; flex-flow: column wrap; } .f-no-col-b-center { display: flex; flex-flow: column wrap; justify-content: space-between; align-items: center; } .f-no-col-c-center { display: flex; flex-flow: column wrap; justify-content: center; align-items: center; } .f-no-col-s-center { display: flex; flex-flow: column wrap; justify-content: flex-start; align-items: center; } .f-no-col-s-end { display: flex; flex-flow: column wrap; justify-content: flex-start; align-items: flex-end; } .f-no-col-c-start { display: flex; flex-flow: column wrap; justify-content: center; align-items: flex-start; } .f-no-col-b-start { display: flex; flex-flow: column wrap; justify-content: space-between; align-items: flex-start; } .f-no-col-end-start { display: flex; flex-flow: column wrap; justify-content: flex-end; align-items: flex-start; } /*响应隐藏样式*/ .pc-block { display: block; } .pc-block-768 { display: block; } .pc-block-767 { display: block; } .m-block { display: none; } .m-block-767 { display: none; } .m-block-768 { display: none; } @media (max-width: 1024px) { .pc-block { display: none; } .m-block { display: block; } } @media (max-width: 768px) { .pc-block-768 { display: none; } .m-block-768 { display: block; } } @media (max-width: 767px) { .pc-block-767 { display: none; } .m-block-767 { display: block; } } /*常用样式类名*/ .poa-middle { left: 0; top: 0; bottom: 0; right: 0; margin: auto; } .tran-middle { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .text-hide { word-break: keep-all; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .img-cover { background-size: cover; background-position: center center; background-repeat: no-repeat; } .pointer { cursor: pointer; } .bgtop { background-position: top; } .containbg { background-repeat: no-repeat; background-size: contain; background-position: center; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } .text-justif { text-align: justify; } .text-nowrap { white-space: nowrap; } .text-lowercase { text-transform: lowercase; } .text-uppercase { text-transform: uppercase; } .text-capitalize { text-transform: capitalize; } .text-bold { font-weight: bold; } .centerh { position: absolute; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .centerv { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .centerblock { margin-left: auto; margin-right: auto; } .shadow1 { box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.15); } .full { width: 100%; height: 100%; } .fullw { width: 100%; } .fullh { height: 100%; } .fullvh { height: 100vh; } .top { top: 0; } .btm { bottom: 0; } .lt { left: 0; } .rt { right: 0; } .block { display: block; } .inlineblock { display: inline-block; } .notrans { -webkit-transition-duration: 0s !important; -o-transition-duration: 0s !important; transition-duration: 0s !important; } .no-hover { pointer-events: none !important; cursor: default; } .trans3d0 { -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .round { border-radius: 50%; } .mt0 { margin-top: 0; } .mb0 { margin-bottom: 0; } .in-block { display: inline-block; *display: inline; *zoom: 1; } /*网站主体区域宽度样式*/ .w100 { width: 100%; } .w1720 { max-width: 1720px; width: 90%; margin: 0 auto; } .w1500 { width: 1500px; margin: 0 auto; } @media (max-width: 1580px) { .w1500 { width: 94%; } } .w1300 { width: 1300px; margin: 0 auto; } @media (max-width: 1350px) { .w1300 { width: 94%; } } .w1080 { width: 1080px; margin: 0 auto; } @media (max-width: 1100px) { .w1080 { width: 94%; } } .w1070 { width: 1070px; margin: 0 auto; } @media (max-width: 1100px) { .w1070 { width: 94%; } } /*分页样式*/ .wpage { text-align: center; background: #fff; padding: .5rem 0; margin: 40px 0 0; } .page { font-size: 14px; font-weight: bold; line-height: 22px; text-align: center; clear: both; display: inline-block; } .page a { text-decoration: none; color: #d2d2d2; width: 38px; height: 38px; line-height: 38px; margin: 0 2px; background: transparent; display: block; float: left; transition: 0.5s cubic-bezier(0.6, 0.2, 0.1, 1); } .page a.active { background: #8bc120; color: #fff; transition: 0.5s cubic-bezier(0.6, 0.2, 0.1, 1); } .page span.laypage_curr { width: 38px; height: 38px; line-height: 38px; margin: 0 2px; display: inline-block; background: #8bc120; color: #fff; transition: 0.5s cubic-bezier(0.6, 0.2, 0.1, 1); } .page a:hover { text-decoration: none; color: #fff; background: #8bc120; transition: 0.5s cubic-bezier(0.6, 0.2, 0.1, 1); } /*分页样式end*/ @media (max-width: 767px) { .wrap { padding: 30px; } } .wrap-sm { padding: 30px; } @media (max-width: 767px) { .wrap-sm { padding: 15px; } } .wrap-xs { padding: 20px; } @media (max-width: 767px) { .wrap-xs { padding: 10px; } } .p-v-xs { padding-top: 20px; padding-bottom: 20px; } @media (max-width: 767px) { .p-v-xs { padding-top: 10px; padding-bottom: 10px; } } .p-v-sm { padding-top: 30px; padding-bottom: 30px; } @media (max-width: 767px) { .p-v-sm { padding-top: 20px; padding-bottom: 20px; } } .p-v-md { padding-top: 60px; padding-bottom: 60px; } @media (max-width: 959px) { .p-v-md { padding-top: 40px; padding-bottom: 40px; } } @media (max-width: 767px) { .p-v-md { padding-top: 30px; padding-bottom: 30px; } } .p-v-lg { padding-top: 100px; padding-bottom: 100px; } @media (max-width: 959px) { .p-v-lg { padding-top: 70px; padding-bottom: 70px; } } @media (max-width: 767px) { .p-v-lg { padding-top: 50px; padding-bottom: 50px; } } .p-h-sm { padding-left: 30px; padding-right: 30px; } @media (max-width: 767px) { .p-h-sm { padding-left: 20px; padding-right: 20px; } } .pt0 { padding-top: 0; } .pb0 { padding-bottom: 0; } .m-v-lg { margin-top: 100px; margin-bottom: 100px; } @media (max-width: 959px) { .m-v-lg { margin-top: 70px; margin-bottom: 70px; } } @media (max-width: 767px) { .m-v-lg { margin-top: 50px; margin-bottom: 50px; } } .m-b-xxs { margin-bottom: 5px; } .m-b-xs { margin-bottom: 10px; } .m-b-sm { margin-bottom: 20px; } @media (max-width: 767px) { .m-b-sm { margin-bottom: 15px; } } .m-b-md { margin-bottom: 30px; } @media (max-width: 767px) { .m-b-md { margin-bottom: 20px; } } .m-b-lg { margin-bottom: 60px; } @media (max-width: 767px) { .m-b-lg { margin-bottom: 40px; } } .m-b-xl { margin-bottom: 100px; } @media (max-width: 959px) { .m-b-xl { margin-bottom: 70px; } } @media (max-width: 767px) { .m-b-xl { margin-bottom: 50px; } } .m-t-xxs { margin-top: 5px; } .m-t-xs { margin-top: 10px; } .m-t-sm { margin-top: 20px; } @media (max-width: 767px) { .m-t-sm { margin-top: 15px; } } .m-t-md { margin-top: 30px; } @media (max-width: 767px) { .m-t-md { margin-top: 20px; } } .m-t-lg { margin-top: 60px; } @media (max-width: 767px) { .m-t-lg { margin-top: 40px; } } .m-r-xxs { margin-right: 5px; } .m-r-xs { margin-right: 10px; } .m-r-sm { margin-right: 20px; } @media (max-width: 767px) { .m-r-sm { margin-right: 10px; } } .m-l-xxs { margin-left: 5px; } .m-l-xs { margin-left: 10px; } .m-l-sm { margin-left: 20px; } @media (max-width: 767px) { .m-l-sm { margin-left: 10px; } } @media (max-width: 767px) and (orientation: portrait) { .phone-v-fullw { width: 100%; } .phone-v-p0 { padding: 0; } } /*常用css3动画样式*/ .trans { -webkit-transition: all .4s; -o-transition: all .4s; transition: all 0.4s; } .trans2 { -webkit-transition: all 0.4s cubic-bezier(0.77, 0, 0.175, 1); -o-transition: all 0.4s cubic-bezier(0.77, 0, 0.175, 1); transition: all 0.4s cubic-bezier(0.77, 0, 0.175, 1); } .trans-md { -webkit-transition: all .8s; -o-transition: all .8s; transition: all 0.8s; } .trans-md2 { -webkit-transition: all 0.8s cubic-bezier(1, 0, 0, 1); -o-transition: all 0.8s cubic-bezier(1, 0, 0, 1); transition: all 0.8s cubic-bezier(1, 0, 0, 1); } /*loadering动画样式2*/ .anim-loader { animation: loader 1829ms linear infinite, loader_dash 2156ms ease-in-out infinite; } .anim-fade-out { -webkit-animation: fade_out .5s ease forwards; animation: fade_out 0.5s ease forwards; } /*模块加载的loading-2*/ .ajax-loader { background: rgba(0, 0, 0, 0.2); visibility: hidden; opacity: 0; z-index: 1036; } .tt-ajax-loader .ajax-loader { visibility: visible; opacity: 1; } .tt-ajax-loader .ajax-loader .loader-icon .line { -webkit-animation: loader 1829ms linear infinite,loader_dash 2156ms ease-in-out infinite; animation: loader 1829ms linear infinite, loader_dash 2156ms ease-in-out infinite; } /*end*/ /*入场动画样式*/ .cssanimations .anim_emt, .cssanimations .anim_group .anim_item { visibility: hidden; } .cssanimations .anim_emt.visb, .cssanimations .anim_group .anim_item.visb { visibility: inherit; } .anim_emt.start { -webkit-animation-duration: .6s; animation-duration: .6s; -webkit-animation-timing-function: ease; animation-timing-function: ease; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .anim_emt.start.scale_up { -webkit-animation-name: mk_scale; animation-name: mk_scale; } .anim_emt.start.fade_in { -webkit-animation-name: mk_fade; animation-name: mk_fade; } .anim_emt.start.r_to_l { -webkit-animation-name: mk_right_to_left; animation-name: mk_right_to_left; } .anim_emt.start.l_to_r { -webkit-animation-name: mk_left_to_right; animation-name: mk_left_to_right; } .anim_emt.start.t_to_b { -webkit-animation-name: mk_top_to_bottom; animation-name: mk_top_to_bottom; } .anim_emt.start.b_to_t { -webkit-animation-name: mk_bottom_to_top; animation-name: mk_bottom_to_top; } .slide_anim { visibility: hidden; } .slide_anim.start { visibility: visible; } .slide_anim.b_to_t.start { -webkit-animation: mk_bottom_to_top .6s; animation: mk_bottom_to_top 0.6s; } .anim_emt.palx_img.start { overflow: hidden; -webkit-animation-name: tt_palx_wrap; animation-name: tt_palx_wrap; } .anim_emt.palx_img.start .img-wrap { -webkit-animation: tt_palx_img .6s; animation: tt_palx_img 0.6s; } @keyframes tt_palx_wrap { 0% { -webkit-transform: translateY(30px); transform: translateY(30px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes tt_palx_img { 0% { -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes loader { to { -webkit-transform: rotate3d(0, 0, 1, 360deg); transform: rotate3d(0, 0, 1, 360deg); } } @keyframes loader_dash { from { stroke-dasharray: 0 150; stroke-dashoffset: 0; } to { stroke-dasharray: 100 150; stroke-dashoffset: -140; } } @keyframes line_w100 { to { left: 100%; } } @keyframes rotate_360 { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes fade_out { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fade_in { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fade_out_in { 0%,100% { opacity: 1; } 50% { opacity: 0; } } @keyframes mk_scale { 0% { -webkit-transform: scale(0.5); transform: scale(0.5); opacity: 0; } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } } @keyframes mk_fade { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes mk_left_to_right { 0% { -webkit-transform: translateX(-30px); transform: translateX(-30px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @keyframes mk_right_to_left { 0% { -webkit-transform: translateX(30px); transform: translateX(30px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @keyframes mk_bottom_to_top { 0% { -webkit-transform: translateY(30px); transform: translateY(30px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes mk_top_to_bottom { 0% { -webkit-transform: translateY(-30px); transform: translateY(-30px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes mk_spt { 0% { -webkit-transform: translateY(10%); transform: translateY(10%); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } .a-del1 { animation-delay: 0.1s; } .a-del2 { animation-delay: 0.2s; } .a-del3 { animation-delay: 0.3s; } .a-del4 { animation-delay: 0.4s; } .a-del5 { animation-delay: 0.5s; } .a-del6 { animation-delay: 0.6s; } .a-del7 { animation-delay: 0.7s; } .a-del8 { animation-delay: 0.8s; } .a-del9 { animation-delay: 0.9s; } .a-del10 { animation-delay: 1s; } .a-dur1 { animation-duration: 0.3s; } .a-dur2 { animation-duration: 0.4s; } .a-dur3 { animation-duration: 0.5s; } .a-dur4 { animation-duration: 0.6s; } .a-dur5 { animation-duration: 0.7s; } .a-dur6 { animation-duration: 0.8s; } .a-dur7 { animation-duration: 0.9s; } .a-dur8 { animation-duration: 1s; } .a-dur9 { animation-duration: 1.1s; } .a-dur10 { animation-duration: 1.2s; } .a-dur11 { animation-duration: 1.3s; } .a-dur12 { animation-duration: 1.4s; } .a-dur13 { animation-duration: 1.5s; } .a-dur14 { animation-duration: 1.6s; } .a-dur15 { animation-duration: 1.7s; } .a-dur16 { animation-duration: 1.8s; } .a-dur17 { animation-duration: 1.9s; } .a-dur18 { animation-duration: 2s; } .t-del1 { transition-delay: 0.1s; } .t-del2 { transition-delay: 0.2s; } .t-del3 { transition-delay: 0.3s; } .t-del4 { transition-delay: 0.4s; } .t-del5 { transition-delay: 0.5s; } .t-del6 { transition-delay: 0.6s; } .t-del7 { transition-delay: 0.7s; } .t-del8 { transition-delay: 0.8s; } .t-del9 { transition-delay: 0.9s; } .t-del10 { transition-delay: 1s; } .js-m { opacity: 0; transform: translate(0, 30px); transition: all 0.8s cubic-bezier(0.79, -0.27, 0.21, 0.82); } .js-m.animate { opacity: 1; transform: translate(0, 0); } .js-m-2-1 { opacity: 0; transform: translate(0, 30px); transition: all 0.8s cubic-bezier(0.79, -0.27, 0.21, 0.82); } .js-m-2-1.animate { opacity: 1; transform: translate(0, 0); } /*ie10以下显示*/ .browsers { position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: #fff url(../../img/img1.png); background-repeat: no-repeat; background-position: 50% 50%; z-index: 99; } .line-1 { line-height: 1.1; } .line-2 { line-height: 1.2; } .line-3 { line-height: 1.3; } .line-4 { line-height: 1.4; } .line-5 { line-height: 1.5; } .line-6 { line-height: 1.6; } .line-7 { line-height: 1.7; } .line-8 { line-height: 1.8; } .line-9 { line-height: 1.9; } .line-10 { line-height: 2; } .line-11 { line-height: 2.1; } .line-12 { line-height: 2.2; } /*文字引用*/ /*@include font-face($font-family:'ad', $file-path:"../fonts/BEBAS", $weight: normal, $style: normal); @include simple-text($borderColorFocus:#000); @include simple-textarea($borderColorFocus:#52a8ec, $width:500px, $height:80px) @include simple-btn($formbtn:false, $bgColor: $primary, $textColor:$white); /*@include triangle(left, 10px, #000 )*/ /*@include triangle($direction, $size, $borderColor )*/ /*.conbox-16{ color:nth($infoColor,1); background:nth($infoColor,2); border:1px solid nth($infoColor,3); }*/ /*@include placeholder(#999);*/ /*margin-right: pe(16px);*/ /*@extend .in-block;*/ /*初始样式结束*/ @font-face { font-family: "BEBAS"; font-weight: normal; font-style: normal; src: url("fonts/BEBAS.eot"); src: url("fonts/BEBAS.eot?#iefix") format("eot"), url("fonts/BEBAS.svg#BEBAS") format("svg"), url("fonts/BEBAS.woff") format("woff"), url("fonts/BEBAS.ttf") format("truetype"); } .fon1 { font-family: "BEBAS"; } /*首页加载loading*/ body.loading { overflow: hidden; } #pageloader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #f5f3f0; overflow: hidden; z-index: 5000; } #pageloader .logo { width: auto; height: 51px; } .darkmode #pageloader { background: #252525; } body.init #pageloader { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); -webkit-transition: all 1.2s cubic-bezier(0.77, 0, 0.175, 1); -o-transition: all 1.2s cubic-bezier(0.77, 0, 0.175, 1); transition: all 1.2s cubic-bezier(0.77, 0, 0.175, 1); } body.init #pageloader .cont { opacity: 0; -webkit-transition: all .6s; -o-transition: all .6s; transition: all 0.6s; } body.init #pageloader .logo, body.init #pageloader div { -webkit-transition: all .6s; -o-transition: all .6s; transition: all 0.6s; } body.init #pageloader .logo { -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } body.init #pageloader .small { -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } body.init #pageloader .loader-line { -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); } .loader-line { width: 50vw; max-width: 300px; height: 2px; background: #A96B41; overflow: hidden; } .loader-icon { width: 24px; height: 24px; border-radius: 50%; } .loader-icon .line { fill: none; stroke: #fff; stroke-width: 4px; stroke-linecap: round; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } /*.loader-line .gradient,.loader-line .gradient2 { width:40%; height:100%; left:-40%; background-image:-webkit-gradient(linear,left top,right top,color-stop(0,rgba(218,157,119,0)),color-stop(50%,#DA9D77),to(rgba(218,157,119,0))); background-image:-o-linear-gradient(left,rgba(218,157,119,0) 0,#DA9D77 50%,rgba(218,157,119,0) 100%); background-image:linear-gradient(to right,rgba(218,157,119,0) 0,#DA9D77 50%,rgba(218,157,119,0) 100%); -webkit-animation:line_w100 2s cubic-bezier(.165,.84,.44,1) infinite; animation:line_w100 2s cubic-bezier(.165,.84,.44,1) infinite } .loader-line .gradient2 { -webkit-animation-delay:1s; animation-delay:1s }*/ /*首页加载loading-end*/ .footer4 { background: #343434; padding-top: 2rem; } .footer4 .footer-top { padding-bottom: 2.25rem; } .footer4 .footer-top .logo { height: .95rem; margin-bottom: 1rem; } .footer4 .footer-top .leftbox { width: 310px; } .footer4 .footer-top .leftbox .tit2 { opacity: .5; } .footer4 .footer-top .leftbox .tit3 { margin-bottom: .25rem; } .footer4 .footer-top .leftbox .item:last-child { margin-top: .75rem; } .footer4 .footer-top .leftbox .linkbox { margin-top: .5rem; } .footer4 .footer-top .leftbox .linkbox span img { width: auto; height: .8rem; } .footer4 .footer-top .leftbox .linkbox .wximg { background: #d0d0d0; padding: 3px; border-radius: 3px; position: absolute; width: 100px; bottom: 55px; left: 50%; margin-left: -50px; opacity: 0; visibility: hidden; transform: translate(0, -10px); transition: all .3s ease-in-out; } .footer4 .footer-top .leftbox .linkbox .wximg:before { position: absolute; border-top: 6px solid #d0d0d0; border-left: 6px dashed transparent; border-right: 6px dashed transparent; left: 50%; margin-left: -6px; bottom: -6px; } .footer4 .footer-top .leftbox .linkbox .li:hover .wximg { opacity: 1; visibility: visible; transform: translate(0, 0); } .footer4 .footer-top .leftbox .linkbox .li { margin-right: .5rem; } .footer4 .footer-top .rightbox { width: calc(100% - 310px - 2rem); } .footer4 .footer-top .rightbox .li { width: 16.6%; padding-right: 2%; } .footer4 .footer-top .rightbox .li:last-child { padding-right: 0; } .footer4 .footer-top .rightbox .tit2 { opacity: 1; margin-bottom: .25rem; } .footer4 .footer-top .rightbox .tit3 { opacity: .4; display: block; } .footer4 .footer-top .rightbox .tit3:hover { color: #fff; opacity: 1; } .footer4 .footer-top .rightbox .tit4 { padding-bottom: 5px; width: 100%; border-bottom: 2px solid #fff; } .footer4 .footer-top .rightbox .tit4 .icon { fill: #fff; width: 15px; height: 15px; } .footer4 .footer-top .rightbox .tit4:hover { color: #fff; } .footer4 .footer-top .rightbox .scroll-top { margin-top: 2rem; width: 1.5rem; height: 1.5rem; background: #8bc120; } .footer4 .footer-top .rightbox .scroll-top .icon { fill: #fff; width: 25px; height: 25px; } .footer4 .footer-bot { height: 2.75rem; border-top: 1px solid rgba(255, 255, 255, 0.1); } .footer4 .footer-bot .right { opacity: .5; } .footer4 .footer-bot .right span{ display:flex; flex-flow: row wrap; justify-content: center; align-items: center; } .footer4 .footer-bot .right a{ display:flex; flex-flow: row wrap; justify-content: flex-start; align-items: center; } .footer4 .footer-bot a { color: #fff; } .footer4 .ulbox .li { opacity: .5; } .footer4 .ulbox .line { margin: 0 10px; width: 1px; height: 10px; background: #fff; opacity: .5; } @media (max-width: 1024px) { .footer4 .footer-top .rightbox { display: none; } .footer4 .footer-top .leftbox { width: 100%; } } @media (max-width: 767px) { .footer4 .footer-top { padding-bottom: 0; } .footer4 .footer-top .leftbox .item:last-child { margin-top: 0; border-bottom: none; } .footer4 .footer-top .logo { margin-bottom: .3rem; } .footer4 .footer4 { padding-top: 1.5rem; } .footer4 .footer-top .leftbox .linkbox { margin-top: 0; } .footer4 .footer-top .leftbox .item { padding: .55rem 0; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .footer4 .footer-bot { padding: .35rem 0; height: auto; } } .warp-header4 { position: relative; height: 80px; width: 100%; z-index: 9; } .warp-header4.on { position: absolute; width: 100%; background: #fff; left: 0; } .header4 { position: relative; background: #fff; height: 80px; z-index:91; } .header4 .logo { height: 1.125rem; } .header4 .nav { margin-right: .5rem; } .header4 .nav .li { margin: 0 .7rem; } .header4 .nav .nli { height: 80px; line-height: 80px; display:inline-block; } .header4 .nav .nli:before { content: ""; position: absolute; width: 100%; bottom: 0; height: 3px; background: #005f28; opacity: 0; transform: scale(0, 1); transition: all .4s; } .header4 .nav .li:hover .nli, .header4 .nav .li.cur { color:#005f28; } .header4 .nav .li:hover .nli:before, .header4 .nav .li.cur .nli:before { opacity: 1; transform: scale(1, 1); } .header4 .nav .li .subnav-item{ position: absolute; width:160px; left:50%; margin-left:-80px; top:90px; padding:10px; background:#fff; opacity:0; visibility: hidden; border-radius:8px; transition: all .4s; transform:translate(0,-10px); } .header4 .nav .li .subnav-item a{ height:40px; line-height:40px; color:#333; display:block; text-align:center; transition: all .4s; /*border-bottom:1px solid rgba(255,255,255,.15);*/ } .header4 .nav .li .subnav-item a:hover{ transform:translate(10px,0); } .header4 .nav .li:hover .subnav-item{ opacity:1; transform:translate(0,0); visibility: visible; } .header4 .linkbox span img { width: auto; height: .55rem; } .header4 .linkbox .wximg { background: #fff; padding: 3px; border-radius: 3px; position: absolute; width: 100px; top: 35px; left: 50%; margin-left: -50px; opacity: 0; visibility: hidden; transform: translate(0, -10px); transition: all .3s ease-in-out; } .header4 .linkbox .wximg:before { position: absolute; border-bottom: 6px solid #fff; border-left: 6px dashed transparent; border-right: 6px dashed transparent; left: 50%; margin-left: -6px; top: -6px; } .header4 .linkbox .li:hover .wximg { opacity: 1; visibility: visible; transform: translate(0, 0); } .header4 .linkbox .telbox { background: #fff; padding: 3px; border-radius: 3px; position: absolute; width: 160px; top: 35px; left: 50%; margin-left: -80px; opacity: 0; visibility: hidden; transform: translate(0, -10px); transition: all .3s ease-in-out; } .header4 .linkbox .telbox:before { position: absolute; border-bottom: 6px solid #fff; border-left: 6px dashed transparent; border-right: 6px dashed transparent; left: 50%; margin-left: -6px; top: -6px; } .header4 .linkbox .li:hover .telbox { opacity: 1; visibility: visible; transform: translate(0, 0); } .header4 .linkbox .li { margin-right: .75rem; } .header2 .linkbox{ height:20px; } .header4 .line { width: 1px; height: 15px; background: #ababab; margin: 0 .5rem; } .header4 .sreach-btn .icon { width: 25px; height: 25px; margin-right: 8px; fill: #333; } .header4 .sreach-btn:hover .icon { fill: #8bc120; } /*.warp-header4.on{ .nav .li:before{ border:2px solid #31302f; } }*/ .m-bocweb-header3 { /*position:fixed;*/ position: relative; width: 100%; height: 60px; z-index: 99; } .m-bocweb-header3 .linkbox span img { width: auto; height: .55rem; } .m-bocweb-header3 .linkbox .wximg { background: #fff; padding: 3px; border-radius: 3px; position: absolute; width: 100px; top: 35px; left: 50%; margin-left: -50px; opacity: 0; visibility: hidden; transform: translate(0, -10px); transition: all .3s ease-in-out; } .m-bocweb-header3 .linkbox .wximg:before { position: absolute; border-bottom: 6px solid #fff; border-left: 6px dashed transparent; border-right: 6px dashed transparent; left: 50%; margin-left: -6px; top: -6px; } .m-bocweb-header3 .linkbox .li:hover .wximg { opacity: 1; visibility: visible; transform: translate(0, 0); } .m-bocweb-header3 .linkbox .telbox { background: #fff; padding: 3px; border-radius: 3px; position: absolute; width: 160px; top: 35px; left: 50%; margin-left: -80px; opacity: 0; visibility: hidden; transform: translate(0, -10px); transition: all .3s ease-in-out; } .m-bocweb-header3 .linkbox .telbox:before { position: absolute; border-bottom: 6px solid #fff; border-left: 6px dashed transparent; border-right: 6px dashed transparent; left: 50%; margin-left: -6px; top: -6px; } .m-bocweb-header3 .linkbox .li:hover .telbox { opacity: 1; visibility: visible; transform: translate(0, 0); } .m-bocweb-header3 .linkbox .li { margin-right: .5rem; } .m-bocweb-header3 .header2 { background: transparent; height: 60px; padding: 0 4%; box-shadow: 0px 0px 6px 0 rgba(0, 0, 0, 0.1); position: fixed; background:#fff; width: 100%; left: 0; z-index: 99; } .m-bocweb-header3 .header2 .logo { width: 5rem; height: 1rem; display: block; position: relative; z-index: 12; } .m-bocweb-header3 .header2 .logo img { width: 100%; position: absolute; left: 0; top: 0; } .m-bocweb-header3 .header2 .logo .img1 { opacity: 1; } .m-bocweb-header3 .header2 .logo .img2 { opacity: 0; } .m-bocweb-header3 .header2 .nav .tit { display: block; width: 100%; padding: 16px 5%; line-height: 60px; position: relative; } .m-bocweb-header3 .header2 .nav .tit { line-height: 1.5; } .m-bocweb-header3 .header2 .nav .sub-tit:after { content: ""; display: block; width: 20px; height: 20px; line-height: 20px; text-align: center; background-size: 100% auto; position: absolute; right: 6.4%; top: 16px; background: url(../img/img1.svg); background-repeat: no-repeat; background-position: 50% 50%; background-size: 20px auto; transform: rotate(0); transform-origin: center center; transition: all .3s ease-in-out; } .m-bocweb-header3 .header2 .nav .sub-tit.on:after { transform: rotate(-180deg); } .m-bocweb-header3 .header2 .nav .sec-list { line-height: 40px; padding: .55rem 6%; background: #0d6a33; display: none; } .m-bocweb-header3 .header2 .nav .sec-list a { color: #fff; } .m-bocweb-header3 .header2 .hamburger { padding: 0; height: 24px; } .m-bocweb-header3 .header2 .hamburger-box { width: 30px; height: 24px; } .m-bocweb-header3 .header2 .hamburger-inner, .m-bocweb-header3 .header2 .hamburger-inner::before, .m-bocweb-header3 .header2 .hamburger-inner::after { width: 30px; height: 3px; background: #333; } .m-bocweb-header3 .header2 .hamburger.is-active .hamburger-inner, .m-bocweb-header3 .header2 .hamburger.is-active .hamburger-inner::before, .m-bocweb-header3 .header2 .hamburger.is-active .hamburger-inner::after { background: #222; } .m-bocweb-header3 .header2 .hamburger--3dx-r .hamburger-inner { transition: transform 0.6s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0.5s 0s cubic-bezier(0.645, 0.045, 0.355, 1) !important; } .m-bocweb-header3 .header2 .hamburger--3dx-r .hamburger-inner::before, .m-bocweb-header3 .header2 .hamburger--3dx-r .hamburger-inner::after { transition: transform 0.6s 0s cubic-bezier(0.645, 0.045, 0.355, 1) !important; } .m-bocweb-header3 .header2 .h-right { z-index: 12; } .m-bocweb-header3 .header2 .h-right svg { fill: #333; } .m-bocweb-header3 .header2 .search-btn { margin-right: .75rem; } .m-bocweb-header3 .header2 .search-btn svg { width: 25px; height: 25px; } .m-bocweb-header3 .header2 .languagebtn { width: 25px; line-height:1; height: 25px; /*line-height: 1.2;*/ color: #333; margin-right: .5rem; text-align: center; } .m-bocweb-header3 .header2 .warp-nav { height: calc(100vh - 60px); padding: 0 0 45px; position: fixed; background: #fff; width: 100%; left: 0; top: 60px; z-index: 9; display: none; } .m-bocweb-header3 .header2 .nav { font-size: 16px; color: #333; position: relative; overflow-y: auto; height: calc(100vh - 60px); } .m-bocweb-header3 .header2 .nav .li { position: relative; width: 100%; line-height: 60px; background: #f7f7f7; } .m-bocweb-header3 .header2 .nav .li:nth-child(2n) { background: #fff; } .m-bocweb-header3 .header2 .nav .warp-btn { display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: center; display: block; padding-left: 5%; position: relative; color: #333; transition: all .3s ease; } .m-bocweb-header3 .header2 .nav .warp-btn .btn { position: absolute; width: 20px; height: 20px; display: block; margin-right: 5px; top: 50%; margin-top: -10px; left: 0; } .m-bocweb-header3 .header2 .nav .warp-btn .btn img { position: absolute; left: 0; top: 0; } .m-bocweb-header3 .header2 .nav .li:hover .warp-btn, .m-bocweb-header3 .header2 .nav .li:hover .warp-btn.cur, .m-bocweb-header3 .header2 .nav .li.cur .warp-btn, .m-bocweb-header3 .header2 .nav .li.cur .warp-btn.cur { color: #016cb6; } .m-bocweb-header3 .header2 .nav .nav-item { position: absolute; top: 100px; width: 180px; left: 50%; margin-left: -90px; background: rgba(255, 255, 255, 0.9); font-size: 14px; box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.1); display: none; } .m-bocweb-header3 .header2 .nav .nav-item p { height: 40px; line-height: 40px; border-top: 1px solid #e7eaec; } .m-bocweb-header3 .header2 .nav .nav-item a { display: block; color: #666; text-align: center; transition: all .3s ease; } .m-bocweb-header3 .header2 .nav .nav-item a:hover { color: #016cb6; font-weight: bold; } .m-bocweb-header3.on { position: relative; } .m-bocweb-header3.active .header2 { background: #fff; } .m-bocweb-header3.active .header2 .logo .img1 { opacity: 0; } .m-bocweb-header3.active .header2 .logo .img2 { opacity: 1; } .m-bocweb-header3.active .header2 .h-right svg { fill: #666; } .m-bocweb-header3.active .header2 .h-right .languagebtn { color: #666; } .m-bocweb-header3.active .header2 .hamburger-inner, .m-bocweb-header3.active .header2 .hamburger-inner::before, .m-bocweb-header3.active .header2 .hamburger-inner::after { background: #222; } @media (max-width: 767px) { .m-bocweb-header3 .header2 { height: 60px; } .m-bocweb-header3 { height: 60px; } .m-bocweb-header3 .header2 .hamburger-box { width: 25px; height: 20px; } .m-bocweb-header3 .header2 .hamburger { height: 20px; } .m-bocweb-header3 .hamburger-inner::before { top: -8px; } .m-bocweb-header3 .hamburger-inner::after { bottom: -8px; } .m-bocweb-header3 .header2 .hamburger-inner, .m-bocweb-header3 .header2 .hamburger-inner::before, .m-bocweb-header3 .header2 .hamburger-inner::after { width: 25px; height: 2px; } .m-bocweb-header3 .hamburger--3dx-r.is-active .hamburger-inner::before { transform: translate3d(0, 8px, 0) rotate(45deg); } .m-bocweb-header3 .hamburger--3dx-r.is-active .hamburger-inner::after { transform: translate3d(0, -8px, 0) rotate(-45deg); } } /*搜索弹框样式2*/ .search-btn2 svg { width: 45px; height: 45px; } .search-alert2 { position: fixed; z-index: 100; background-color: #222222; left: 0; top: 0; width: 100%; height: 100%; display: none; } .search-alert2 .close { display: block; width: 30px; height: 30px; position: absolute; top: 38px; right: 2.6%; cursor: pointer; transition: transform 0.3s ease 0s; } .search-alert2 .close svg { width: 30px; height: 30px; fill: #fff; } .search-alert2 .cent-form { position: absolute; width: 94.8%; left: 2.6%; top: 50%; height: 2rem; margin-top: -63px; border-bottom: 1px solid #515151; } .search-alert2 .cent-form .tex { border: none; font-size: 1.2rem; height: 1.5rem; line-height: 1.5rem; text-align: left; width: 100%; box-sizing: border-box; color: #555; background: none; padding-right: 3.5rem; } .search-alert2 .cent-form .sub-butn { border: none; height: 1.5rem; font-size: .8rem; line-height: 1.5rem; color: #555; text-align: right; background: none; position: absolute; right: 0; top: 0; width: 3.5rem; text-align: center; } .search-alert2 .close:hover { transform: rotate(90deg); } .n-banner { height: 15rem; width: 100%; } .n-banner .bg-banner { height: 15rem; background-position: center center; background-repeat: no-repeat; background-size: cover; z-index: 1; } .n-banner .warp-subnav { position: absolute; height: 75px; width: 100%; top: 0; left: 0; z-index: 9; display:none; } .n-banner .warp-subnav.active { position: fixed; background: rgba(0, 0, 0, 0.8); backdrop-filter: blur(2px); } .n-banner .warp-subnav.active .subnav { border-bottom: none; } .n-banner .subnav { padding: 30px 0 20px; border-bottom: 1px solid rgba(255, 255, 255, 0.15); } .n-banner .subnav .tit2 { font-size: 16px; } .n-banner .nav-right a { margin-left: 1rem; line-height: 20px; font-size: 14px; transition: all .4s; } .n-banner .nav-right a:before { content: ""; position: absolute; width: 100%; height: 2px; background: #fff; left: 0; bottom: -20px; opacity: 0; transform: scale(0, 1); transition: all .4s; } .n-banner .nav-right a.cur { color: #fff; } .n-banner .nav-right a.cur:before { opacity: 1; transform: scale(1, 1); } .n-banner .nav-right a:hover{ color:#8bc120; } .n-banner .textbox { height: 15rem; z-index: 1; } .n-banner .text { width: 810px; } .n-banner .text .tit4 { margin-top: .25rem; } @media (max-width: 1024px) { .n-banner .text { width: 100%; } } @media (max-width: 767px) { .n-banner .tit3 { font-size: 28px; } } .n-banner.on { height: 75px; background: #f5f5f5; } .n-banner.on .subnav { border-bottom: 1px solid #d0d0d0; } .n-banner.on .nav-right a:before { background: #b4d76a; } .n-banner.on .nav-right a:hover, .n-banner.on .nav-right a.cur { color: #b4d76a; } .n-banner.on .warp-subnav.active .nav-right a { color: #fff; } @media (max-width: 1024px) { .n-banner .warp-subnav { display: none; } } .n-news { background: #f5f5f5; padding: 1.75rem 0 1.5rem; } .n-news .tit2 { margin-bottom: 1.25rem; } .n-news .formtab { width: 920px; margin: 0 auto 1.25rem; } .n-news .formtab .li { width: 290px; } .n-news .formtab .sptitle { height: 70px; border: 1px solid #d7d7d7; border-radius: 8px; padding: 0 24px; } .n-news .formtab .icon { width: 15px; height: 15px; fill: #111; } .n-news .formtab .li.on .icon { transform: rotate(-180deg); } .n-news .formtab .li3 .submitbtn{ width:25px; height:25px; right:20px; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .n-news .formtab .li3 input[type="submit"]{ position: absolute; width:100%; height:100%; left:0; top:0; z-index:2; opacity:0; } .n-news .formtab .li3 .icon { width: 25px; height: 25px; } .n-news .formtab .input { height: 18px; -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; transition: border linear 0.2s, box-shadow linear 0.2s; -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); width: 100%; height: 70px; background: none; padding: 0 24px; padding-right: 60px; border: 1px solid #d7d7d7; border-radius: 8px; box-shadow: none; } .n-news .formtab .input:focus { border-color: rgba(180, 215, 106, 0.8); -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(180, 215, 106, 0.6); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(180, 215, 106, 0.6); } .n-news .formtab .input::-webkit-input-placeholder { /* WebKit browsers */ color: #b3b2b2; } .n-news .formtab .input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #b3b2b2; } .n-news .formtab .input::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #b3b2b2; } .n-news .formtab .input:-ms-input-placeholder { /* Internet Explorer 10+ */ color: #b3b2b2; } .n-news .formtab .libox { position: absolute; width: 100%; left: 0; top: 70px; background: #fff; z-index: 3; display: none; } .n-news .formtab .item { height: 45px; line-height: 45px; border-bottom: 1px solid #d1d1d1; padding: 0 .75rem; display:block; } .n-news .formtab .item:last-child { border-bottom: none; } .n-news .formtab .item:hover { background: #8bc120; color: #fff; } @media (max-width: 1024px) { .n-news .formtab { width: 90%; } .n-news .formtab .input, .n-news .formtab .sptitle { height: 50px; } .n-news .formtab .li { width: 31%; } .n-news .formtab .li:nth-child(1) { width: 100%; } .n-news .formtab .litem { width: 48%; margin-top: 10px; } .n-news .formtab .libox { top: 50px; } } .n-news .news-list1 .li { width: 48.5%; } .n-news .news-list1 .li:hover .bg{ transform:scale3d(1.1, 1.1, 1.0); } .n-news .news-list1 .bg { width: 100%; height: 10rem; background-position: center center; background-repeat: no-repeat; transition: all .3s; } .n-news .news-list1 .text { z-index: 3; bottom: .5rem; padding: 0 1rem; } .n-news .news-list1 .time { margin-bottom: .2rem; } .n-news .news-list1 .tit3 { line-height: 35px; height: 70px; width: 80%; overflow: hidden; } @media (max-width: 767px) { .n-news .news-list1 .li { width: 100%; margin-bottom: 4%; } } .gmorebtn { width: 120px; height: 35px; color: #1f1f1f; } .gmorebtn:before { content: ""; position: absolute; width: 30px; height: 100%; background: #8bc120; left: 0; top: 0; transition: all .4s; } .gmorebtn span { position: relative; z-index: 2; } .gmorebtn .icon { width: 30px; height: 30px; fill: #141414; margin-left: 5px; } .news-list2 { margin-top: .75rem; } .news-list2 .ulbox { width: 100%; margin-bottom: -2%; } .news-list2 .ulbox .li { width: 32%; margin-right: 2%; padding: 10px; background: #fff; margin-bottom: 1.33%; border: 1px solid #eaeaea; } .news-list2 .ulbox .li:nth-child(3n) { margin-right: 0; } .news-list2 .ulbox .bg { width: 100%; height: 7.25rem; background-size: cover; } .news-list2 .ulbox .text { padding: .75rem .55rem 1.5rem; } .news-list2 .ulbox .time { color: #8a8a8a; margin-bottom: .25rem; } .news-list2 .ulbox .tit4 { line-height: 30px; height: 60px; margin-bottom: 1rem; overflow: hidden; } .news-list2 .ulbox .li:hover .tit3 { color: #8bc120; } .news-list2 .ulbox .li:hover .gmorebtn:before { width: 100%; } @media (max-width: 1024px) { .news-list2 .ulbox .li { width: 48.5%; margin-right: 3%; margin-bottom: 3%; } .news-list2 .ulbox .li:nth-child(3n) { margin-right: 3%; } .news-list2 .ulbox .li:nth-child(2n) { margin-right: 0; } } @media (max-width: 767px) { .news-list2 .ulbox .li { width: 100%; margin-bottom: 4%; margin-right: 0 !important; } } .news-info3 { padding: 1.5rem 0 3rem; background: #f5f5f5; } .news-info3 .w1500 { padding: 0 60px; } .news-info3 .contactbox { width: calc(100% - 300px - 1rem); padding: 1.5rem 2rem; background: #fff; } .news-info3 .contactbox .title { padding-bottom: .65rem; border-bottom: 1px solid #efefef; } .news-info3 .contactbox .time { margin-top: .5rem; } .news-info3 .contactbox .ntext { padding: .85rem 0 1.75rem; } .news-info3 .contactbox .left { width: calc(100% - 100px); } .news-info3 .contactbox .left a { margin-bottom: .25rem; border-bottom: 1px solid transparent; } .news-info3 .contactbox .left a:hover { border-bottom: 1px solid #ae7677; } .news-info3 .contactbox .backbtn { width: 80px; height: 80px; background: #9e1a1e; border-radius: 50%; line-height: 1; position: absolute; right: 0; bottom: -40px; background: url(../img/back.png) no-repeat center center; background-size: cover; } .news-info3 .contactbox .backbtn .icon { width: 25px; height: 25px; fill: #fff; } .news-info3 .contactbox .backbtn:hover { color: #fff; } .news-info3 .rightbox { width: 300px; border-radius: 8px; background: #fff; padding: 28px 25px; } .news-info3 .rightbox .li { padding: 15px 0 15px 18px; display: block; line-height: 1.4; border-bottom: 1px solid #e0e0e0; transition: all .4s; } .news-info3 .rightbox .li:before { content: ""; position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #b9b9b9; border-radius: 50%; left: 0; top: 25px; transition: all .4s; } .news-info3 .rightbox .li:last-child { border-bottom: none; padding-bottom: 0; } .news-info3 .rightbox .li:hover { color: #005f28; } .news-info3 .rightbox .li:hover:before { background: #005f28; } @media (max-width: 768px) { .news-info3 { padding-bottom: 2rem; } .news-info3 .w1500 { padding: 0; } .news-info3 .contactbox { width: 100%; padding: 1rem .5rem; } .news-info3 .rightbox { width: 100%; margin-top: 2.5rem; } .news-info3 .rightbox .li:before { top: 19px; } } @media (max-width: 425px) { .news-info3 .bot .left { width: 100%; } .news-info3 .bot .backbtn { margin-top: .5rem; width: 60px; height: 60px; } } .industry-list1 { padding: 1.75rem 0; background: #f5f5f5; } .industry-list1 .tit3 { color: #1b1b1b; opacity: .7; margin: .5rem auto 0; width: 800px; } .industry-list1 .ulbox { margin-top: 1rem; } .industry-list1 .ulbox .li { width: 49%; border: 1px solid #cacaca; background: #fff; margin-right: 2%; margin-bottom: 20px; } .industry-list1 .ulbox .li:nth-child(2n) { margin-right: 0; } .industry-list1 .ulbox .img { width: 50%; height: 6rem; } .industry-list1 .ulbox .text { width: 50%; height: 6rem; border-left: 1px solid #cacaca; } .industry-list1 .ulbox .text1, .industry-list1 .ulbox .text2 { padding: .5rem 1rem; } .industry-list1 .ulbox .tit3 { width: 100%; } .industry-list1 .ulbox .text1 { opacity: 1; } .industry-list1 .ulbox .text2 { opacity: 0; } .industry-list1 .ulbox .icon { margin: 0 auto; height:1rem; } .industry-list1 .ulbox .icon2 { width: 60px; height: 60px; margin: 0 auto; background: url(../img/indiconbg.png) no-repeat center center; background-size: cover; } .industry-list1 .ulbox .icon2 img { height: .75rem; } .industry-list1 .ulbox .bg { left: 0; top: 0; opacity: 0; } .industry-list1 .ulbox .icon3 { width: 20px; height: 20px; margin-left: 10px; fill: #fff; } .industry-list1 .ulbox .btn { opacity: 0; } .industry-list1 .ulbox .tit4 { color: #808080; } .industry-list1 .ulbox .tit3 { margin: .35rem 0; } .industry-list1 .ulbox .li:hover .text1 { opacity: 0; } .industry-list1 .ulbox .li:hover .text2 { opacity: 1; } .industry-list1 .ulbox .li:hover .text2 .tit3 { color: #8bc020; } .industry-list1 .ulbox .li:hover .bg { opacity: .85; } .industry-list1 .ulbox .li:hover .btn { opacity: 1; } @media (max-width: 768px) { .industry-list1 .tit3 { width: 90%; } .industry-list1 .ulbox .li { width: 100%; margin-bottom: 10px; margin-right: 0; } } @media (max-width: 767px) { .industry-list1 .ulbox .li .img { width: 100%; } .industry-list1 .ulbox .li .text { width: 100%; border-left: none; border-top: 1px solid #cacaca; } .industry-list1 .ulbox .li .btn,.industry-list1 .ulbox .li .text2{ display:none; } .industry-list1 .ulbox .li:hover .text1{ opacity:1; } } .industry-list2 { padding: 1.5rem 0; background: #f5f5f5; } .industry-list2 .ulbox { margin-top: .75rem; } .industry-list2 .li { background: transparent; flex-flow: row-reverse wrap; background: #fff; } .industry-list2 .li:nth-child(2n) { flex-flow: row wrap; } .industry-list2 .li:nth-child(2n) .text { width: 50%; } .industry-list2 .tit3 { margin-bottom: .55rem; line-height: 1.4; } .industry-list2 .img { width: 50%; min-height: 19.25rem; } .industry-list2 .text { width: 50%; padding: 2rem 1.5rem 1rem 2rem; } .industry-list2 .conbox-18 { line-height: 2; } .industry-list2 .ntext { width: calc(100% - 7rem); max-height: 12rem; line-height: 2; } .industry-list2 .mCSB_scrollTools .mCSB_dragger { height: 30px !important; } .industry-list2 .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { height: 30px; width: 5px; background: #d7d7d7 !important; border-radius: 5px; } .industry-list2 .porimg2 { width: 6rem; height: 6rem; right: 1.5rem; bottom: 1rem; } .industry-list2 .porimg2 img { max-width: 100%; max-height: 100%; } .industry-list2 .bot { margin-top: 1rem; background: #fff; padding: 25px 1rem; } .industry-list2 .bot .link { width: 30%; } .industry-list2 .bot .link:hover { color: #b4d76a; } .industry-list2 .bot .backbtn { width: 26px; height: 26px; } @media (max-width: 768px) { .industry-list2 { padding: 1.5rem 0 2.5rem; } .industry-list2 .li { margin-bottom: .65rem; } .industry-list2 .img { width: 100%; height: 10rem; min-height: auto; } .industry-list2 .tit3 { margin-bottom: .2rem; } .industry-list2 .text { width: 100%; padding: .75rem 1rem .5rem; } .industry-list2 .ntext { width: 100%; margin-bottom: .75rem; max-height: none; } .industry-list2 .porimg2 { position: relative; right: auto; bottom: auto; } .industry-list2 .li:nth-child(2n) .text { width: 100%; padding: 0.75rem 1rem 0.5rem; } .industry-list2 .bot { padding: 15px 1rem; } } .contact-list1 #allmap { width: 100%; height: 700px; } .contact-list1 .maptext { width: 560px; padding: 1rem; border-radius: 10px; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); position: absolute; left: calc(50vw - 750px); top: 2.5rem; background: rgba(139, 193, 32, 0.9); z-index: 2; } .contact-list1 .tit2 { margin-bottom: .25rem; } .contact-list1 .li { padding: 20px 0; border-bottom: 1px solid rgba(245, 245, 245, 0.3); } .contact-list1 .li span { width: 100%; } .contact-list1 .li { background: url(../img/contact1.png) no-repeat; background-size: 16px auto; padding-left: 35px; } .contact-list1 .li:nth-child(2) { background-position: left -46px; } .contact-list1 .li:nth-child(3) { background-position: left -46px; } .contact-list1 .li:nth-child(4) { background-position: left -128px; } .contact-list1 .li:nth-child(5) { background-position: left -206px; } .contact-list1 .li:nth-child(6) { background-position: left -270px; } .contact-list1 .wximg { width: 58px; height: 58px; margin-left: 15px; } @media (max-width: 1580px) { .contact-list1 .maptext { left: 5%; } } @media (max-width: 768px) { .contact-list1 #allmap { height: 350px; } .contact-list1 .maptext { position: relative; left: auto; top: auto; width: 100%; border-radius: 0; } .contact-list1 .li { padding: 12px 0; padding-left: 30px; } .contact-list1 .li:nth-child(2) { background-position: left -58px; } .contact-list1 .li:nth-child(3) { background-position: left -61px; } .contact-list1 .li:nth-child(4) { background-position: left -140px; } .contact-list1 .li:nth-child(5) { background-position: left -217px; } .contact-list1 .li:nth-child(6) { background-position: left -279px; } } .contact-list2 { padding: 1.75rem 0; } .contact-list2 .title { margin-bottom: 1.5rem; } .contact-list2 .ulbox { width: 100%; } .contact-list2 .ulbox .item-li { margin-bottom: .25rem; } .contact-list2 .ulbox .li { width: 48%; margin-bottom: 1.5rem; } .contact-list2 .ulbox .li span { width: 100px; display: inline-flex; } .contact-list2 .ulbox .li .icon { margin-right: 5px; } .contact-list2 .ulbox .input1 { width: 100%; height: 18px; -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; transition: border linear 0.2s, box-shadow linear 0.2s; -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); height: 1.5rem; padding: 10px .7rem 10px 100px; border: none; box-shadow: none; border-bottom: 1px solid #2c2c2c; } .contact-list2 .ulbox .input1:focus { border-color: rgba(141, 194, 32, 0.8); -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(141, 194, 32, 0.6); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(141, 194, 32, 0.6); } .contact-list2 .ulbox .input2 { padding: 10px .7rem 10px 100px; height: 18px; -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; transition: border linear 0.2s, box-shadow linear 0.2s; -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); height: 1.5rem; width: 100%; vertical-align: top; border: none; box-shadow: none; border-bottom: 1px solid #2c2c2c; } .contact-list2 .ulbox .input2:focus { border-color: rgba(141, 194, 32, 0.8); -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(141, 194, 32, 0.6); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(141, 194, 32, 0.6); } .contact-list2 .ulbox .li3 { width: 100%; margin-bottom: 1.5rem; } .contact-list2 .ulbox .li3 .input1 { padding-left: .7rem; padding-right: 160px; } .contact-list2 .ulbox .li3 .captcha { position: absolute; width: auto; max-height: 1.25rem; right: .75rem; } .contact-list2 .ulbox .li2 { margin-bottom: 1.5rem; } .contact-list2 .ulbox .submitbtn { width: 200px; height: 50px; } .contact-list2 .ulbox .input4 { background: #8dc220; } @media (max-width: 768px) { .contact-list2 .ulbox .li span { width: 84px; } .contact-list2 .ulbox .input1 { padding: 10px .7rem 10px 84px; } } @media (max-width: 767px) { .contact-list2 .ulbox .li { width: 100%; margin-bottom: .6rem; } .contact-list2 .ulbox .li2, .contact-list2 .ulbox .li3 { margin-bottom: .6rem; } } .n-join-list3 { padding: 1.5rem 0 2rem; } .n-join-list3 .tit3 { margin-bottom: .5rem; } .n-join-list3 .tabbox { background: #f7f7f7; margin-bottom: 1.5rem; padding: .75rem; } .n-join-list3 .tabbox .tab-li { margin-bottom: .5rem; } .n-join-list3 .tabbox .tab-li:last-child { margin-bottom: 0; } .n-join-list3 .tabbox .spli { color: #333; height: 40px; line-height: 40px; padding: 0 .5rem; margin-left: .7rem; } .n-join-list3 .tabbox .spli.cur, .n-join-list3 .tabbox .spli:hover { color: #fff; background: #8dc220; } @media (max-width: 767px) { .n-join-list3 { padding-bottom: 2.5rem; } .n-join-list3 .sptitle { width: 100%; margin-bottom: .35rem; } .n-join-list3 .tabbox .spli { height: 30px; line-height: 30px; margin-bottom: 5px; } .n-join-list3 .spbox { width: 100%; } .n-join-list3 .tabbox .spli { margin-left: 0; margin-right: .35rem; } } .recruit-list-1 .title-top { font-size: 15px; padding: .5rem 0; background: linear-gradient(to left, #016028, #8dc220); } .recruit-list-1 .title-top .span1 { width: 20%; text-indent: 1.5rem; } .recruit-list-1 .title-top .span2, .recruit-list-1 .title-top .span3, .recruit-list-1 .title-top .span4, .recruit-list-1 .title-top .span5, .recruit-list-1 .title-top .span6 { width: 16%; text-indent: .75rem; } .recruit-list-1 .list { width: 100%; border: 1px solid #ebebeb; cursor: pointer; background: #fff; margin-top: -1px; } .recruit-list-1 .list .list-top { padding: .5rem 0; font-size: 15px; } .recruit-list-1 .list .span1 { width: 20%; text-indent: 1.5rem; } .recruit-list-1 .list .span2, .recruit-list-1 .list .span3, .recruit-list-1 .list .span4, .recruit-list-1 .list .span5, .recruit-list-1 .list .span6 { width: 16%; text-indent: .75rem; } .recruit-list-1 .list .span6 span { color: #005f28; display: inline-block; border-bottom: 1px solid #005f28; text-indent: 0; } .recruit-list-1 .list .item { margin-bottom: .75rem; } .recruit-list-1 .list .list-hide { padding: .7rem 1.5rem 1.25rem; position: relative; display: none; } .recruit-list-1 .list .list-hide:before { content: ""; position: absolute; left: 1.5rem; top: 0; width: calc(100% - 3rem); height: 1px; background: #cecece; } .recruit-list-1 .list .tit2 { margin-bottom: 10px; } .recruit-list-1 .list .ul { display: flex; flex-flow: row wrap; font-size: 16px; color: #666; } .recruit-list-1 .list .ul .li { margin-bottom: 15px; margin-right: .8rem; } .recruit-list-1 .list .morebox { width: 135px; height: 46px; color: #fff; line-height: 46px; text-align: center; background: #8dc220; margin-top: 1rem; display: block; border: 2px solid transparent; transition: all .5s ease; box-sizing: content-box; } .recruit-list-1 .list .morebox:hover { background: transparent; color: #2cc2dc; border: 2px solid #2cc2dc; } .recruit-list-1 .list.cur { margin-bottom: .4rem; } @media (max-width: 960px) { .recruit-list-1 .span2, .recruit-list-1 .span3, .recruit-list-1 .span4 { display: none; } .recruit-list-1 .span1 { width: calc(100% - 100px) !important; } .recruit-list-1 .span6 { width: 80px !important; } } @media (max-width: 767px) { .recruit-list-1 .title-top .span1 { text-indent: .5rem; } .recruit-list-1 .list .span1 { text-indent: .5rem; } .recruit-list-1 .list .list-hide { padding: 0.5rem 0.5rem 1rem; } .recruit-list-1 .list .list-hide:before { left: .5rem; top: 0; width: calc(100% - 1rem); } .recruit-list-1 .list .morebox { width: 6rem; height: 35px; color: #fff; line-height: 35px; } } .click-morebox { width: 12.5rem; height: 45px; background: #8dc220; margin: 0 auto; } .click-morebox .icon { width: 15px; height: 15px; fill: #fff; margin-left: .25rem; } .media-list1 { padding: 1.75rem 0 2rem; } .media-list1 .ulbox { margin-bottom: -2%; } .media-list1 .li { width: 49%; margin-right: 2%; margin-bottom: 2%; } .media-list1 .li .img { width: 100%; } .media-list1 .li:nth-child(2n) { margin-right: 0; } .media-list1 .tit2 { margin-bottom: .25rem; } .media-list1 .li:before { content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0, 0, 0, 0.3); z-index: 2; } .media-list1 .video-btn { z-index: 3; } .media-list1 .video-btn .video { width: 2rem; height: 2rem; margin-bottom: .5rem; } .media-list1 .video-btn p { text-align: center; } .media-list1 .click-morebox { margin-top: 1.5rem; } @media (max-width: 425px) { .media-list1 .li { width: 100%; margin-right: 0; } } .news-list6-dialog3 { position: fixed; top: 0; left: 0; z-index: 99; width: 100%; height: 100%; opacity: 0; visibility: hidden; } .news-list6-dialog3 .dialog__overlay { position: absolute; top: 0; left: 0; z-index: 1; visibility: hidden; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); opacity: 0; transition: opacity 0.3s; } .news-list6-dialog3 .dialog__content { position: relative; z-index: 5; overflow-x: auto; padding: 0; max-width: 1000px; width: 90%; border-radius: 0px; background: transparent; box-shadow: none; text-align: center; opacity: 0; } .news-list6-dialog3 .dialog__content #video { max-width: 100%; max-height: 100%; margin: 0 auto; width: 90%; } .news-list6-dialog3 .closebtn { position: absolute; right: 0; top: 0; z-index: 3; width: 40px; height: 40px; text-align: center; cursor: pointer; transition: all .3s; } .news-list6-dialog3 .closebtn svg { width: 40px; height: 40px; fill: #fff; } .news-list6-dialog3.dialog--open { opacity: 1; visibility: visible; } .news-list6-dialog3.dialog--open .dialog__overlay { opacity: 1; pointer-events: auto; visibility: visible; backdrop-filter: blur(5px); } .news-list6-dialog3.dialog--open #video { opacity: 1; visibility: visible; transition: all .3s ease; } .news-list6-dialog3.dialog--close #video { opacity: 0; visibility: hidden; } .news-list6-dialog3.dialog--open .dialog__content, .news-list6-dialog3.dialog--close .dialog__content { opacity: 1; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } .news-list6-dialog3.dialog--open .dialog__content { -webkit-animation-name: anim-open3; animation-name: anim-open3; } .news-list6-dialog3 .dialog__overlay { background: rgba(0, 0, 0, 0.8); } .news-list6-dialog3.dialog--close .dialog__content { -webkit-animation-name: anim-close3; animation-name: anim-close3; } @media (max-width: 1024px) { .news-list6-dialog3 .closebtn { background: #de0000; color: #fff; } .news-list6-dialog3 .dialog__content .p { font-size: 14px; width: 90%; margin-top: .5rem; } } @media (max-width: 767px) { .news-list6-dialog3 .dialog__content { width: 100%; padding: .6rem 3%; } .news-list6-dialog3 .closebtn { right: 3%; } } @-webkit-keyframes anim-open3 { 0% { opacity: 0; -webkit-transform: scale3d(1.1, 1.1, 1); } 100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); } } @keyframes anim-open3 { 0% { opacity: 0; -webkit-transform: scale3d(1.1, 1.1, 1); transform: scale3d(1.1, 1.1, 1); } 100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @-webkit-keyframes anim-close3 { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: scale3d(0.9, 0.9, 1); } } @keyframes anim-close3 { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: scale3d(0.9, 0.9, 1); transform: scale3d(0.9, 0.9, 1); } } .media-list2 { background: #f5f5f5; padding: 1.75rem 0 2rem; } .media-list2 .ulbox { margin-top: .25rem; margin-bottom: -2%; } .media-list2 .li { width: 32%; margin-right: 2%; margin-bottom: 2%; border: 1px solid #e6e6e6; background: #fff; padding: .65rem; } .media-list2 .img { width: 4.5rem; height: 260px; background-position: center center; background-repeat: no-repeat; } .media-list2 .text { width: calc(100% - 5.2rem); margin-left: .7rem; } .media-list2 .tit3 { margin-bottom: .25rem; } .media-list2 .tit4 { margin-bottom: .85rem; } .media-list2 .downbtn { width: 130px; height: 48px; border: 1px solid #ebebeb; border-radius: 48px; color: #585858; } .media-list2 .downbtn .icon { width: 20px; height: 20px; margin-right: .35rem; } .media-list2 .li:nth-child(3n) { margin-right: 0; } .media-list2 .li:hover .downbtn { background: #8dc220; border: 1px solid #8dc220; color: #fff; } .media-list2 .li:hover .downbtn .icon { fill: #fff; } .media-list2 .click-morebox { margin-top: 1.25rem; } @media (max-width: 768px) { .media-list2 .li { width: 49%; margin-right: 2%; margin-bottom: 2%; } .media-list2 .li:nth-child(3n) { margin-right: 2%; } .media-list2 .li:nth-child(2n) { margin-right: 0; } } @media (max-width: 767px) { .media-list2 .li { width: 100%; margin-right: 0 !important; margin-bottom: 2%; } .media-list2 .img { height: 175px; } .media-list2 .downbtn { width: 100px; height: 38px; border-radius: 38px; } .media-list2 .downbtn .icon { margin-right: .15rem; } } .service-list1 { padding: 1.7rem 0; } .service-list1 .tit3 { width: 980px; margin: .5rem auto 1rem; } .service-list1 .li { width: 4.75rem; height: 4.75rem; background: #f5f5f5; margin: 0 .75rem; } .service-list1 .li img { height: 1.875rem; transition: all .5s; } .service-list1 .li p { margin-top: .25rem; } .service-list1 .li:hover img{ transform:translate3d(0, -10px, 0); } @media (max-width: 1024px) { .service-list1 .tit3 { width: 90%; } } @media (max-width: 767px) { .service-list1 .li { margin: 0 .35rem; } } .service-list2 { padding: 1.75rem 0; } .service-list2 .tit2 { margin-bottom: 1rem; } .service-list2 .list .li { width: 23.5%; padding: 1rem 0; border: 1px solid rgba(255, 255, 255, 0.1); } .service-list2 .list .icon { height: 26px; margin-bottom: .25rem; } .service-list2 .list .tit4 { margin-top: .25rem; } .service-list2 .click-zix { width: 12.5rem; height: 45px; background: #8dc220; margin: 1rem auto 0; } .service-list2 .click-zix .icon { width: 25px; height: 25px; fill: #fff; margin-right: .25rem; } .service-list2 .click-zix:hover { color: #fff; } @media (max-width: 767px) { .service-list2 .list { margin-bottom: -.55rem; } .service-list2 .list .li { width: 48%; margin-bottom: .55rem; } } .service-list3 { padding: 1.75rem 0 2.75rem; } .service-list3 .ulbox { margin-top: 1.2rem; } .service-list3 .li { width: 49%; height: 10rem; margin-right: 2%; margin-bottom: 2%; } .service-list3 .li:nth-child(2n) { margin-right: 0; } .service-list3 .li:before { content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0, 0, 0, 0.6); } .service-list3 .icon { height: 1.25rem; } .service-list3 .icon { margin-bottom:.about-list5 .25rem; } .service-list3 .tit3 { margin-bottom: .55rem; } .service-list3 .tit4 { width:80%; /*max-height: 4.75rem;*/ } .service-list3 .text1 { opacity: 0; padding: 1rem 1.75rem; } .service-list3 .text2 { opacity: 1; padding: 1rem 1.75rem; } .service-list3 .li:hover:before { opacity: .8; background: linear-gradient(to left, #8dc220, #016028); } .service-list3 .li:hover .text1 { opacity: 1; } .service-list3 .li:hover .text2 { opacity: 0; } @media (max-width: 767px) { .service-list3 .li { width: 100%; margin-right: 0; } .service-list3 .text2, .service-list3 .text1 { padding: 1rem .75rem; } .service-list3 .tit4 { width: 95%; } } .n-supplier { padding: 1.6rem 0; } .n-supplier .tit2 { margin-bottom: .75rem; } .n-supplier .formbox { border: 1px solid #9b9b9b; } .n-supplier .w50 { width: 50%; } .n-supplier .w33 { width: 33.33%; } .n-supplier .li { height: 66px; padding: 0 .75rem; border-right: 1px solid #9b9b9b; } .n-supplier .li:last-child { border-right: none; } .n-supplier .input1 { background: none; border: none; width: calc(100% - 145px); text-indent: 15px; height: 40px; line-height: 40px; } .n-supplier .input2 { background: none; border: none; width: calc(100% - 230px); text-indent: 15px; height: 40px; line-height: 40px; } .n-supplier .item-li { border-bottom: 1px solid #9b9b9b; } .n-supplier .item-li:last-child { border-bottom: none; } .n-supplier .rightbox { width: calc(100% - 145px); margin-left: 15px; } .n-supplier .radiobox { margin-left: .5rem; } .n-supplier .radiobox .radio-li { margin-right: .5rem; } .n-supplier .radiobox .radio-li input[type="radio"] { appearance: none; -webkit-appearance: none; outline: none; width: 26px; height: 26px; border: 1px solid #9b9b9b; box-sizing: content-box; margin-right: 10px; } .n-supplier .radiobox .radio-li input[type="radio"]:checked { background: #b4d76a; border: 1px solid #b4d76a; } .n-supplier .item-li2 .li { height: auto; } .n-supplier .item-li2 .radiobox { height: 66px; border-bottom: 1px solid #9b9b9b; } .n-supplier .item-li2 .radiobox:last-child { border-bottom: none; } .n-supplier .item-li2 .input1 { width: 12rem; } .n-supplier .submitbtn { width: 200px; height: 40px; background: #b4d76a; } .n-supplier .p { margin-top: .55rem; color: #fff; } @media (max-width: 768px) { .n-supplier .item-li2 .input1 { width: 5rem; } } @media (max-width: 767px) { .n-supplier .item-li .li { height: auto; width: 100%; border-bottom: 1px solid #9b9b9b; padding: 8px 15px; } .n-supplier .item-li .li:last-child { border-bottom: none; } .n-supplier .radiobox .radio-li input[type="radio"] { width: 15px; height: 15px; } .n-supplier .rightbox { width: calc(100% - 80px); } .n-supplier .item-li2 .radiobox { height: auto; padding: 10px 0; } .n-supplier .item-li2 .input1 { width: 100%; } } .products-info { padding: 2.15rem 0 0; background: #f5f5f5; z-index: 1; } .products-info .content { padding-bottom: 1.5rem; } .products-info .box3 .content{ max-width:800px; width:90%; margin:0 auto; } .products-info .box2 .proswiper { width: 50%; background: #fff; } .products-info .box2 .proswiper .swiper-slide { padding-top: 13rem; } .products-info .box2 .img { position: absolute; left: 50%; top: 50%; width: 9rem; height: 9rem; margin-top:-1rem; transform: translate(-50%, -50%); text-align: center; z-index: 1; } .products-info .box2 .img img { max-width: 100%; max-height: 100%; text-align: center; z-index: 1; } .products-info .box2 .swiper-pagination { bottom: 1rem; } .products-info .box2 .swiper-pagination span { width: 12px; height: 12px; background: #c1c1c1; margin: 0 6px; border-radius: 50%; opacity: 1; } .products-info .box2 .swiper-pagination span.swiper-pagination-bullet-active { background: #005d27; } .products-info .box2 .protext { width: 50%; padding-left: 1.75rem; } .products-info .box2 .protext .tit3 { color: #555; margin-bottom: .6rem; } .products-info .box2 .protext .p { color: #555; min-height: 6rem; margin-bottom: 1rem; line-height: 2.1; } .products-info .box2 .protext .p2 { margin-top: .65rem; } .products-info .box2 .protext .bot a { width: 190px; height: 50px; line-height: 50px; border-radius: 3px; text-align: center; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .products-info .box2 .protext .bot a.href1 { background: #8dc220; margin-right: .5rem; } .products-info .box2 .protext .bot a.href2 { background: #005d27; } .products-info .box2 .protext .bot a:hover { color: #fff; } .products-info .box3 { padding-bottom: 3rem; } .products-info .box3 .item-li { padding: .25rem 0; /*border-bottom: 1px solid #cdcdcd;*/ } .products-info .box3 .item-li .itemleft { width: 8rem; padding-right: 10px; color: #555; } .products-info .box3 .item-li .itemright { width: calc(100% - 8rem); } .products-info .box3 .item-li .itemright .p { line-height: 2.1; } .products-info .box3 .item-li .itemright .p img { max-width: 100%; } @media (max-width: 768px) { .products-info .box2 .proswiper { width: 100%; } .products-info .box2 .protext { width: 100%; padding-left: 0; margin-top: 1rem; } .products-info .box2 .protext .p { height: auto; min-height: auto; } } @media (max-width: 767px) { .products-info .box2 .protext .bot a { width: 46%; } .products-info .box3 .item-li .itemleft { width: 120px; } .products-info .box3 .item-li .itemright { width: calc(100% - 120px); } .products-info { padding-top: 1.5rem; } .products-info .box3 { padding-bottom: 1.5rem; } } .about-list1 { padding: 3rem 0 3.5rem; background: #f5f5f5; } .about-list1 .tit2 { margin-bottom: .5rem; } .about-list1 .text-left { width: 52%; } .about-list1 .text-left img { max-width: 100%; } .about-list1 .text-rightbox { width: calc(48% - 3rem); } .about-list1 .text-rightbox .tab-ul{ width:80%; } .about-list1 .text-rightbox .tab-ul .li { width: 50%; color: #005f28; text-align:center; } .about-list1 .text-rightbox .tab-ul .tit3 { font-family: "Arial"; } .about-list1 .text-rightbox .img { margin-top: 1.5rem; } @media (max-width: 767px) { .about-list1 { padding: 1.5rem 0 2rem; } .about-list1 .text-left { width: 100%; margin-bottom: 1rem; } .about-list1 .text-rightbox { width: 100%; } .about-list1 .text-rightbox .tab-ul{ width:100%; } .about-list1 .text-rightbox .tab-ul .li { align-items: center; } } .about-list2 { padding: 1.75rem 0; } .about-list2 .ulbox { height: 420px; } .about-list2 .ulbox:before { content: ""; position: absolute; width: 100%; height: 1px; top: 50%; border-bottom: 1px dashed #929496; } .about-list2 .li:nth-child(1) { margin-left: 5rem; } .about-list2 .li { width: 350px; height: 210px; padding-left: 1.25rem; } .about-list2 .li:before { content: ""; position: absolute; width: 1px; height: 70%; bottom: 0; left: 10.5px; border-left: 1px dashed #929496; } .about-list2 .li:after { content: ""; position: absolute; width: 16px; height: 16px; border-radius: 50%; left: 0; bottom: 70%; border: 3px solid #8bc120; } .about-list2 .li:nth-child(2n) { margin-left: -130px; margin-top: 210px; display: flex; flex-flow: column wrap; justify-content: flex-end; align-items: flex-start; } .about-list2 .li:nth-child(2n):before { bottom: 30%; } .about-list2 .li:nth-child(2n):after { bottom: calc(30% - 18px); } .about-list2 .contentbox { margin-top: 1rem; } .about-list2 .contentbox .mCSB_scrollTools.mCSB_scrollTools_horizontal { opacity: 1 !important; } .about-list2 .contentbox .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft { border-radius: 50%; opacity: 1 !important; left: 0; transition: all .4s; background: #8bc120 url(../img/img2.svg) no-repeat center center; background-size: 20px 20px; } .about-list2 .contentbox .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight { border-radius: 50%; opacity: 1 !important; transform: rotate(-180deg); right: 0; transition: all .4s; background: #8bc120 url(../img/img2.svg) no-repeat center center; background-size: 20px 20px; } .about-list2 .contentbox .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft, .about-list2 .contentbox .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight { width: 45px; height: 45px; margin-top: 0; top: -243px; } .about-list2 .contentbox .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerContainer { opacity: 0 !important; visibility: hidden !important; } .about-list2 .time { color: #8bc120; margin-bottom: .35rem; } @media (max-width: 767px) { .about-list2 .li:nth-child(1) { margin-left: 2rem; } .about-list2 .li { width: 240px; } } .about-list3 { padding: 2rem 0; background: #f5f5f5; } .about-list3 .li { width: 235px; padding: 10px; background: #fff; border: 1px solid #e0e0e0; } .about-list3 .img { max-width: 100%; max-height: 100%; } .about-list3 .big { width: 34px; height: 34px; background: #8bc120; position: absolute; right: 1px; bottom: 2px; } .about-list3 .big .icon { width: 20px; height: 20px; fill: #fff; } .about-list3 .ulbox { margin-top: 1rem; display: flex; } .about-list3 .li { margin-right: 20px; } .about-list3 .warp-ulbox { width: 100%; } .about-list3 .warp-ulbox .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { height: 8px; background: #005f28; margin: 4px auto; } @media (max-width: 767px) { .about-list3 .li { width: 180px; } } .about-list4 { padding: 2rem 0; background: #fff; } .about-list4 .ulbox { margin-top: 1rem; margin-bottom: -.6rem; } .about-list4 .ulbox .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 4px; background: #005f28; } .about-list4 .li { height: 380px; padding: .85rem 1rem 0; border: 1px solid #e0e0e0; } .about-list4 .li:hover .mCSB_scrollTools{ opacity:.75; visibility:visible; } .about-list4 .li .mCSB_scrollTools{ opacity:0; visibility:hidden; } .about-list4 .li1 { width: 23.9%; margin-bottom: .5rem; } .about-list4 .li2 { width: 49.3%; background: #f5f5f5; } .about-list4 .li2 .icon { background: #fff; } .about-list4 .icon { width: 2.5rem; height: 2.5rem; border-radius: 50%; background: #f5f5f5; margin-bottom: .5rem; } .about-list4 .icon img { width: 1.5rem; } .about-list4 .tit3 { margin-bottom: .2rem; } .about-list4 .tit4 { max-height: 2.5rem; } .about-list4 .li:hover { background: #8bc120; } .about-list4 .li:hover .icon { background: #fff; } .about-list4 .li:hover .tit3 { color: #fff; } .about-list4 .li:hover .tit4 { color: #fff; } @media (max-width: 767px) { .about-list4 .li { width: 100%; height: auto; padding-bottom: 1rem; } .about-list4 .li2 { margin-bottom: .5rem; } .about-list4 .tit4{ max-height:none; } } .about-list5 { padding: 2rem 0 0; } .about-list5 .ulbox { margin-top: .75rem; border-top: 1px solid rgba(255, 255, 255, 0.18); } .about-list5 .li { width: 20%; height: 660px; border-right: 1px solid rgba(255, 255, 255, 0.18); padding: 1rem; } .about-list5 .p { margin-top: .5rem; opacity: .5; max-height: 200px; width:100%; display: none; } .about-list5 .li:hover .p { display: block; } .about-list5 .swiper-pagination span{ background:#8bc120; } @media (max-width: 768px) { .about-list5 .li { width: 100%; height: auto; border: none; } .about-list5 .p { display: block; max-height:none; } } .products-list1 { padding: 1.25rem 0 2rem; background: #f5f5f5; } .products-list1 .tab-ul { margin-bottom: 1.25rem; } .products-list1 .tab-ul .li { margin: 0 10px; height: 50px; line-height: 50px; padding: 0 1rem; border: 1px solid #ccc; border-radius: 50px; } .products-list1 .tab-ul .li.cur { background: #8dc220; color: #fff; border: 1px solid #8dc220; } .products-list1 .tab-ul .li:hover{ border: 1px solid #8dc220; } .products-list1 .ulbox { margin-bottom: -1.33%; } .products-list1 .ulbox .li { width: 24%; background: #fff; margin-right: 1.33%; margin-bottom: 1.33%; padding: .75rem; height: 420px; border: 1px solid #e6e6e6; } .products-list1 .ulbox .li .bot.cur{ justify-content: center; } .products-list1 .ulbox .li .bot.cur a{ border-right:none; } .products-list1 .ulbox .li:nth-child(4n) { margin-right: 0; } .products-list1 .ulbox .porimg { width: 100%; height: 200px; margin-bottom: .25rem; } .products-list1 .ulbox .porimg img { max-width: 80%; max-height: 100%; } .products-list1 .ulbox .li .tit3{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .products-list1 .ulbox .tit4 { margin-top: .35rem; margin-bottom: .75rem; line-height:24px; height:48px; overflow: hidden; } .products-list1 .ulbox .bot a { color: #8dc220; width: 50%; } .products-list1 .ulbox .bot img { margin-right: .25rem; } .products-list1 .ulbox .bot .detail-btn { border-right: 1px solid #e0e0e0; } .products-list1 .click-morebox { margin-top: 1rem; } @media (max-width: 1024px) { .products-list1 .ulbox .li { width: 48.5%; margin-right: 3%; margin-bottom: 3%; } .products-list1 .ulbox .li:nth-child(2n) { margin-right: 0; } .products-list1 .ulbox .li{ height:400px; } } @media (max-width: 425px) { .products-list1 .ulbox .li { width: 100%; margin-right: 0; } .products-list1 .tab-ul .li { margin: 0 5px; height: 35px; line-height: 35px; padding: 0 .35rem; } .products-list1 .ulbox .li { height: 380px; } } .ibanner { position: relative; overflow: hidden; z-index: 1; } .ibanner .swiper-slide, .ibanner .slide-inner { overflow: hidden; height: 100vh; } .ibanner .bg { width: 100%; height: 100%; left: 0; top: 0; z-index: 1; } .ibanner .swiper-pagination { bottom: 1rem !important; } .ibanner .swiper-pagination span { width: 10px; height: 10px; margin: 0 8px !important; background: #b4d76a; } .ibanner .video { width: 100vw; height:100vh; position: relative; } .ibanner video { width:1920px; height:1080px; position: absolute; left:50%; top:50%; margin-left:-960px; margin-top:-540px; } @media (max-width: 1024px) { .ibanner .swiper-slide, .ibanner .slide-inner { height: 70vh; } } #i-mian .viewport { position: relative; height: 100vh; } #i-mian .viewport-cont { height: 100vh; } #i-mian .duty-view { color: #111; } #i-mian .fixed-view-ico.footercur { opacity: 0; } #i-mian .fixed-view-ico { position: fixed; left: auto; left: 1rem; top: 50%; z-index: 9; width: 20px; height: 210px; margin-top: -120px; transition: all .4s; } #i-mian .fixed-view-ico a { position: relative; display: block; width: 19px; height: 19px; border: 1px solid transparent; border-radius: 50%; margin: .65rem 0; transition: all .3s; } #i-mian .fixed-view-ico a:before { content: ""; position: absolute; width: 6px; height: 6px; border-radius: 50%; left: 50%; top: 50%; margin-top: -2.5px; margin-left: -2.5px; background: #707070; transition: all .3s; } #i-mian .fixed-view-ico a.cur { border: 1px solid #707070; } #i-mian .fixed-view-ico a.cur:before { background: #707070; } #i-mian .fixed-view-ico a span { display: inline-block; width: 0px; position: absolute; left: 30px; top: -5px; font-size: 15px; line-height: 26px; height: 26px; font-weight: bold; color: #999; text-align: left; overflow: hidden; transition: all ease-in 0.4s; } #i-mian .fixed-view-ico a:hover span, #i-mian .fixed-view-ico .cur span { width: 120px; } #i-mian .viewport-bg { width: 100%; height: 100vh; left: 0; top: 0; } #i-mian .viewport1 .ibanner { position: relative; z-index: 1; } #i-mian .viewport2 { padding-top: .65rem; background: #f5f5f5; } #i-mian .viewport2 .tit2 { margin-bottom: .35rem; } #i-mian .viewport2 .tit3 { width: 52%; margin-bottom: .5rem; } #i-mian .viewport2 .tit2 { line-height: 1.2; margin-bottom: .35rem; } #i-mian .viewport2 .titlebox { margin-bottom: .5rem; } #i-mian .viewport2 .warpulbox { width: calc(50vw + 750px); margin-left: calc(50vw - 750px); margin-top: .55rem; overflow: hidden; } #i-mian .viewport2 .warpulbox .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background: #8bc120; height: 6px; } #i-mian .viewport2 .ulbox .li { width: 8.75rem; height: 12rem; margin-right: 20px; background-size:12rem 100%; background-position:left center; position: relative; transition: width .3s; } #i-mian .viewport2 .ulbox .li:before { content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0, 0, 0, 0.4); } #i-mian .viewport2 .ulbox .icon { height: 45px; position: relative; z-index: 3; } #i-mian .viewport2 .ulbox p { color: #fff; margin-top: .35rem; position: relative; z-index: 3; } #i-mian .viewport2 .ulbox .spbox2{ padding:0 20px 20px 40px; position: absolute; left:0; bottom:0; opacity:0; width:100%; transform:translate(0,-10px); } #i-mian .viewport2 .ulbox .spbox2 .tit3{ margin-bottom:5px; } #i-mian .viewport2 .ulbox .btn{ width:48px; height:48px; border-radius:50%; border:1px solid rgba(255,255,255,.3); } #i-mian .viewport2 .ulbox .btn svg{ width:20px; height:20px; margin-left:-3px; fill:#fff; } #i-mian .viewport2 .ulbox .leftbox{ width:calc(100% - 80px); text-align:left; } @media (min-width:1024px) { #i-mian .viewport2 .ulbox .li:hover{ width: 12rem; } #i-mian .viewport2 .ulbox .li:hover .spbox1{ opacity:0; transform:translate(0,-10px); } #i-mian .viewport2 .ulbox .li:hover:before{ opacity:0; } #i-mian .viewport2 .ulbox .li:hover .spbox2{ opacity:1; transform:translate(0,0); } #i-mian .viewport2 .gmorebtn:hover:before { width: 100%; } #i-mian .viewport2 .gmorebtn:hover { color: #fff; } } @media (max-width: 1600px) { #i-mian .viewport2 .warpulbox { width: calc(100vw - 5%); margin-left: 5%; } } @media (max-width: 1024px) { #i-mian .viewport2 .ulbox .li { width: 9rem; height: 11rem; } } @media (max-width: 767px) { #i-mian .viewport2 .tit3 { width: 90%; } #i-mian .viewport2 .ulbox .spbox2{ padding: 0 10px 10px 20px; } #i-mian .viewport2 .ulbox .btn{ width:35px; height:35px; } #i-mian .viewport2 .ulbox .btn svg{ width:15px; height:15px; } } #i-mian .viewport3 .tab-img { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 1; } #i-mian .viewport3 .tab-img .img { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 1; display: none; } #i-mian .viewport3 .tab-img a { z-index: 3; } #i-mian .viewport3 .tit3 { margin: .5rem 0 .75rem; /*width:13.5rem;*/ } #i-mian .viewport3 .viewport-cont { height: auto; width: 13.5rem; margin-left: calc(50vw - 750px); position: relative; z-index: 2; } #i-mian .viewport3 .gmorebtn:hover:before { width: 100%; } #i-mian .viewport3 .gmorebtn:hover { color: #fff; } #i-mian .viewport3 .tablist { height: 110px; position: absolute; bottom: .75rem; z-index: 3; } #i-mian .viewport3 .tablist:before { content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: linear-gradient(to left, #8dc220, #016028); opacity: .9; z-index: 1; } #i-mian .viewport3 .swiper-container { height: 110px; width: calc(100% - 280px); margin: 0 auto; position: relative; z-index: 3; } #i-mian .viewport3 .swiper-button-prev { left: 50px; } #i-mian .viewport3 .swiper-button-prev, #i-mian .viewport3 .swiper-button-next { width: 50px; height: 50px; border: 1px solid #fff; background: none !important; border-radius: 50%; z-index: 3; } #i-mian .viewport3 .swiper-button-prev .icon, #i-mian .viewport3 .swiper-button-next .icon { width: 25px; height: 25px; fill: #fff; } #i-mian .viewport3 .swiper-button-next { right: 50px; } #i-mian .viewport3 .swiper-button-next .icon { transform: rotate(-180deg); } #i-mian .viewport3 .swiper-slide { transition: background .5s ease; } #i-mian .viewport3 .swiper-slide .icon2 { height: 33px; margin-bottom: .25rem; transition: all .4s; } #i-mian .viewport3 .swiper-slide.cur { background: #8bc120; } #i-mian .viewport3 .swiper-slide:hover .icon2{ transform:translate(0,-10px); } @media (max-width: 1600px) { #i-mian .viewport3 .viewport-cont { margin-left: 5%; } } @media (max-width: 1024px) { #i-mian .viewport.viewport3 { padding: 3rem 0 10rem; } } @media (max-width: 767px) { #i-mian .viewport.viewport3 { padding: 2rem 0 8rem; } #i-mian .viewport3 .viewport-cont { padding: 0; } #i-mian .viewport3 .tablist { height: 80px; } #i-mian .viewport3 .swiper-container { height: 80px; width: calc(100% - 140px); } #i-mian .viewport3 .swiper-button-prev, #i-mian .viewport3 .swiper-button-next { width: 35px; height: 35px; margin-top: -17.5px; } #i-mian .viewport3 .swiper-button-prev { left: 3%; } #i-mian .viewport3 .swiper-button-next { right: 3%; } #i-mian .viewport3 .swiper-slide .icon2 { height: 25px; } } #i-mian .viewport4 .tit3 { margin-top: .35rem; margin-bottom: 1.25rem; width:100%; } #i-mian .viewport4 .leftbox { width: 33.85%; margin-left: calc(50% - 750px); } #i-mian .viewport4 .leftbox img { max-width: 100%; } #i-mian .viewport4 .gmorebtn { margin-bottom: 1.5rem; } #i-mian .viewport4 .gmorebtn:hover:before { width: 100%; } #i-mian .viewport4 .gmorebtn:hover { color: #fff; } #i-mian .viewport4 .rightbox { width: 50%; margin-top: 80px; height: calc(100vh - 80px); margin-bottom: -1%; } #i-mian .viewport4 .rightbox .li { width: 49%; height: calc(50vh - 50px); margin-bottom: 1%; background-repeat: no-repeat; background-position: center center; } #i-mian .viewport4 .rightbox .li .bg{ z-index:1; transition: all .3s; } #i-mian .viewport4 .rightbox .li:hover .bg{ transform:scale3d(1.1, 1.1, 1.0); } #i-mian .viewport4 .rightbox .bot { padding: 0 .75rem; bottom: .5rem; width: 100%; left: 0; z-index: 3; } #i-mian .viewport4 .rightbox .btn { width: 50px; height: 50px; background: transparent; border-radius: 50%; border: 1px solid #fff; } #i-mian .viewport4 .rightbox .btn .icon { width: 18px; height: 18px; fill: #fff; } #i-mian .viewport4 .rightbox .li:hover .btn { border: 1px solid #8bc120; background: #8bc120; } @media (max-width: 1600px) { #i-mian .viewport4 .leftbox { margin-left: 5%; } } @media (max-width: 1024px) { #i-mian .viewport4 .leftbox { width: 90%; margin-bottom: 1.5rem; } #i-mian .viewport4 .rightbox { margin-top: 0; width: 100%; height: 34rem; } #i-mian .viewport4 .rightbox .li { height: 48%; } } @media (max-width: 767px) { #i-mian .viewport4{ padding-bottom:.75rem; } #i-mian .viewport4 .rightbox { height: 14rem; padding:0 5%; } #i-mian .viewport4 .rightbox .btn { width: 35px; height: 35px; } #i-mian .viewport4 .viewport-cont { padding-bottom: 0; } #i-mian .viewport4 .rightbox .li { margin-bottom: 0; margin-top: 1%; } #i-mian .viewport4 .gmorebtn{ margin-bottom:0; margin-top:1.5rem; } } #i-mian .viewport5 { background: #f5f5f5; } #i-mian .viewport5 .ulbox { margin-top: .35rem; padding-bottom: 1rem; } #i-mian .viewport5 .ulbox .li { padding: 10px; background: #fff; border: 1px solid #eaeaea; } #i-mian .viewport5 .ulbox .bg { width: 100%; height: 7.25rem; background-size: cover; } #i-mian .viewport5 .ulbox .text { padding: .5rem .55rem 1.25rem; } #i-mian .viewport5 .ulbox .time { color: #8a8a8a; margin-bottom: .25rem; } #i-mian .viewport5 .ulbox .tit4 { line-height: 30px; height: 60px; margin-bottom: 1rem; overflow: hidden; } #i-mian .viewport5 .ulbox .li:hover .tit3 { color: #8bc120; } #i-mian .viewport5 .ulbox .li:hover .gmorebtn:before { width: 100%; } #i-mian .viewport5 .ulbox .swiper-pagination { bottom: 0; } #i-mian .viewport5 .ulbox .swiper-pagination span { background: #8bc020; } #i-mian .viewport5 .ulbox .swiper-pagination .swiper-pagination-bullet-active { background: #8bc020; } @media (max-width: 1600px) { #i-mian .viewport5 .viewport-cont { padding-bottom: 1rem; } } #i-mian .viewport6 .bg-img { z-index: 2; } #i-mian .viewport6 .viewport-cont { position: relative; z-index: 3; } #i-mian .viewport6 .ulbox { margin-top: 1rem; margin-bottom: 1.5rem; } #i-mian .viewport6 .li { height: 4.5rem; width: calc(20% - 20px); margin: 10px; transition: all .4s; } #i-mian .viewport6 .li img { max-width: 100%; max-height: 100%; } @media (min-width: 1024px) { #i-mian .viewport6 .li:hover { transform: translate(0, -15px); } } #i-mian .viewport6 .gmorebtn:hover:before { width: 100%; } #i-mian .viewport6 .gmorebtn:hover { color: #fff; } #i-mian .viewport6 .ulbox{ padding-bottom:.5rem; } #i-mian .viewport6 .ulbox .swiper-pagination { bottom: 0; } #i-mian .viewport6 .ulbox .swiper-pagination span { background: #8bc020; } #i-mian .viewport6 .ulbox .swiper-pagination .swiper-pagination-bullet-active { background: #8bc020; } @media (max-width: 1600px) { #i-mian .fixed-view-ico { left: .5rem; } } @media (max-width: 1024px) { #i-mian .viewport6 .li { height: 2.5rem; } #i-mian .viewport6 .viewport-cont { padding: 1rem 0 2rem; } } @media (max-width: 767px) { #i-mian .viewport6 .li { height: 4.5rem; width: calc(50% - 10px); margin: 5px; } #i-mian .viewport6 .ulbox{ padding-bottom:1rem; } } @media (max-width: 1024px) { #i-mian .fixed-view-ico { display: none; } #i-mian .viewport { height: auto; } #i-mian .viewport-cont { height: auto; padding: 2rem 0; } } .news-list6-dialog4 { position: fixed; top: 0; left: 0; z-index: 99; width: 100%; height: 100%; opacity: 0; visibility: hidden; overflow: hidden; } .news-list6-dialog4 .dialog__overlay { position: absolute; top: 0; left: 0; z-index: 1; visibility: hidden; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); opacity: 0; transition: opacity 0.3s; } .news-list6-dialog4 .warpbox { height: 100vh; overflow-y: auto; position: relative; z-index:3; } .news-list6-dialog4 .dialog__content { position: relative; z-index: 5; padding: 0; max-width: 1500px; width: 90%; margin: 0 auto; border-radius: 0px; background: #fff; box-shadow: none; text-align: center; opacity: 0; padding: 1.75rem 3rem 1.5rem; } .news-list6-dialog4 .closebtn { position: absolute; right: 0; top: 0; z-index: 3; width: 40px; height: 40px; text-align: center; cursor: pointer; transition: all .3s; } .news-list6-dialog4 .closebtn svg { width: 40px; height: 40px; fill: #222; } .news-list6-dialog4 .title { margin-bottom: .65rem; } .news-list6-dialog4 .w50 { width: 49%; } .news-list6-dialog4 .w33 { width: 32.33%; } .news-list6-dialog4 .li { min-height: 60px; padding: 10px .75rem; border: 1px solid #e0e0e0; margin-bottom: 2%; } .news-list6-dialog4 .input1 { background: none; border: none; width: calc(100% - 145px); text-indent: 15px; height: 40px; line-height: 40px; } .news-list6-dialog4 .input2 { background: none; border: none; width: calc(100% - 230px); text-indent: 15px; height: 40px; line-height: 40px; } .news-list6-dialog4 .rightbox { width: calc(100% - 145px); margin-left: 15px; } .news-list6-dialog4 .radiobox { margin-left: .5rem; width:calc(100% - 120px); margin-bottom:-.25rem; } .news-list6-dialog4 .radiobox .radio-li { margin-right: .25rem; margin-bottom:.25rem; } .news-list6-dialog4 .radiobox .radio-li input[type="radio"] { appearance: none; -webkit-appearance: none; outline: none; width: 26px; height: 26px; border: 1px solid #d1d1d1; box-sizing: content-box; margin-right: 5px; } .news-list6-dialog4 .radiobox .radio-li input[type="radio"]:checked { background: #8dc11f url(../img/icon2.png) no-repeat center center; background-size: 14px 9px; border: 1px solid #b4d76a; } .news-list6-dialog4 .item-li2 .li { height: auto; } .news-list6-dialog4 .item-li2 .radiobox { height: 60px; border-bottom: 1px solid #9b9b9b; } .news-list6-dialog4 .item-li2 .radiobox:last-child { border-bottom: none; } .news-list6-dialog4 .item-li2 .input1 { width: 12rem; } .news-list6-dialog4 .p { margin-bottom: .35rem; } .news-list6-dialog4 .submitbtn { width: 200px; height: 40px; background: #b4d76a; } .news-list6-dialog4 .item-li:last-child .li { border: none; margin-bottom: 0; } @media (max-width: 1024px) { .news-list6-dialog4 .item-li2 .input1 { width: 5rem; } } @media (max-width: 1024px) { .news-list6-dialog4 .item-li .li { height: auto; width: 100%; padding: 8px 15px; } .news-list6-dialog4 .radiobox .radio-li input[type="radio"] { width: 15px; height: 15px; } .news-list6-dialog4 .radiobox { width: calc(100% - 120px); } .news-list6-dialog4 .item-li2 .radiobox { height: auto; padding: 10px 0; } .news-list6-dialog4 .item-li2 .input1 { width: 100%; } .news-list6-dialog4 .news-list6-dialog4 { overflow-y: auto; } } @media (max-width: 425px) { .news-list6-dialog4 .news-list6-dialog4 .input1 { height: 34px; line-height: 34px; } } .news-list6-dialog4.dialog--open { opacity: 1; visibility: visible; } .news-list6-dialog4.dialog--open .dialog__overlay { opacity: 1; pointer-events: auto; visibility: visible; backdrop-filter: blur(5px); } .news-list6-dialog4.dialog--open .dialog__content, .news-list6-dialog4.dialog--close .dialog__content { opacity: 1; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } .news-list6-dialog4.dialog--open .dialog__content { -webkit-animation-name: anim-open4; animation-name: anim-open4; } .news-list6-dialog4 .dialog__overlay { background: rgba(0, 0, 0, 0.8); } .news-list6-dialog4.dialog--close .dialog__content { -webkit-animation-name: anim-close4; animation-name: anim-close4; } @media (max-width: 1024px) { .news-list6-dialog4 .closebtn { color: #000; } .news-list6-dialog4 .dialog__content .p { font-size: 14px; width: 90%; margin-top: .5rem; } } @media (max-width: 767px) { .news-list6-dialog4 .dialog__content { width: 100%; padding: .6rem 3%; } .news-list6-dialog4 .closebtn { right: 3%; } } @-webkit-keyframes anim-open4 { 0% { opacity: 0; -webkit-transform: scale3d(1.1, 1.1, 1); } 100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); } } @keyframes anim-open4 { 0% { opacity: 0; -webkit-transform: scale3d(1.1, 1.1, 1); transform: scale3d(1.1, 1.1, 1); } 100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @-webkit-keyframes anim-close4 { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: scale3d(0.9, 0.9, 1); } } @keyframes anim-close4 { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: scale3d(0.9, 0.9, 1); transform: scale3d(0.9, 0.9, 1); } } input{ -webkit-tap-highlight-color:rgba(255,0,0,0); } img { pointer-events: none; } .n-features{ padding:2.85rem 0 3rem; background:#f5f5f5; } .n-features .li{ width:48.5%; background:#fff; padding:1.25rem 1.25rem .55rem; margin-right:3%; margin-bottom:3%; } .n-features .li:nth-child(2n){ margin-right:0; } /*.n-features .li .icon{ color:#070707; margin-top:.5rem; margin-bottom:.5rem; } .n-features .li .iconimg{ margin-right:10px; } .n-features .li .icon img{ height:1.25rem 1.25rem .55rem; } .n-features .li .icon .img2{ opacity:0; }*/ .n-features .li .p{ text-align:left; width:80%; margin:0 auto; } .n-features .li .textbox{ opacity:0; } .n-features .li:hover .img2{ opacity:1; } .n-features .li:hover .img1{ opacity:0; } .n-features .li:hover .icon{ color:#fff; } .n-features .li:hover .p{ color:#fff; } .n-features .li:hover .textbox{ opacity:1; background:linear-gradient(to top,rgb(141,194,32,9),rgb(1,96,40, .9)); } .n-features .li .tit3{ margin-top:.35rem; } @media (max-width: 767px) { .n-features .li{ width:100%; margin-right:0; } } .n-productindex{ padding:2.85rem 0 3rem; background:#f5f5f5; } .n-productindex .productindex-list1 .ulbox{ margin-top:1.25rem; } .n-productindex .productindex-list1 .li{ width:23%; margin-right:1.5%; background:#fff; padding:.75rem .75rem .35rem; } .n-productindex .productindex-list1 .iconimg{ margin-right:10px; height:1.25rem; } .n-productindex .productindex-list1 .li:nth-child(4n){ margin-right:0; } .n-productindex .productindex-list1 .li .p{ text-align:left; width:80%; margin:0 auto; } .n-productindex .productindex-list1 .li .tit3{ margin-top:.35rem; } @media (min-width:1280px) { .n-productindex .productindex-list1 .li .textbox{ opacity:0; background:linear-gradient(to top,rgb(141,194,32,1),rgb(1,96,40, 1)); /* -webkit-transform:perspective(1400px) rotateY(0); -moz-transform:perspective(1400px) rotateY(0);*/ transition: all .6s ease; transform-origin:right center; visibility:hidden; } .n-productindex .productindex-list1 .li .textbox .icon{ /*-webkit-transform:perspective(0) rotateY(-180deg); -moz-transform:perspective(0) rotateY(-180deg);*/ } .n-productindex .productindex-list1 .li .textbox .p{ /* -webkit-transform:perspective(0) rotateY(-180deg); -moz-transform:perspective(0) rotateY(-180deg);*/ } .n-productindex .productindex-list1 .li:hover .img2{ opacity:1; } .n-productindex .productindex-list1 .li:hover .img1{ opacity:0; } .n-productindex .productindex-list1 .li:hover .icon{ color:#fff; } .n-productindex .productindex-list1 .li:hover .p{ color:#fff; } .n-productindex .productindex-list1 .li:hover{ z-index:3; } .n-productindex .productindex-list1 .li:hover .textbox{ opacity:1; visibility: visible; /*-webkit-transform:perspective(1400px) rotateY(180deg); -moz-transform:perspective(1400px) rotateY(180deg);*/ } .n-productindex .productindex-list1 .li:nth-child(4) .textbox{ /* -webkit-transform:perspective(1400px) rotateY(0deg); -moz-transform:perspective(1400px) rotateY(0deg);*/ transform-origin:left center; } .n-productindex .productindex-list1 .li:nth-child(4):hover .textbox{ opacity:1; /*-webkit-transform:perspective(1400px) rotateY(-180deg); -moz-transform:perspective(1400px) rotateY(-180deg);*/ } } @media (max-width:1280px) { .n-productindex .productindex-list1 .li{ width:49%; margin-right:2%; margin-bottom:4%; } .n-productindex .productindex-list1 .li:nth-child(2n){ margin-right:0; } .n-productindex .productindex-list1 .li .textbox{ position: relative; width:100%; height:auto; } .productindex-list1 .li .tit3{ margin-bottom:.7rem; } .productindex-list1 .li .textbox .icon{ display:none; } } @media (max-width: 767px) { .n-productindex .productindex-list1 .li{ width:100%; margin-right:0; } .n-productindex .productindex-list1 .iconimg{ height:.95rem; } .productindex-list1 .li .tit3{ margin-top:.4rem; margin-bottom:.4rem; } } .productindex-list2{ margin-top:1.5rem; } .productindex-list2 .tit2 { margin-bottom: .35rem; } .productindex-list2 .tit3 { width: 52%; margin-bottom: .5rem; } .productindex-list2 .tit2 { line-height: 1.2; margin-bottom: .35rem; } .productindex-list2 .titlebox { margin-bottom: .5rem; } .productindex-list2 .warpulbox { width:100%; margin-top: .55rem; overflow: hidden; } .productindex-list2 .warpulbox .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background: #8bc120; height: 6px; } .productindex-list2 .ulbox .li { width: 8.75rem; height: 12rem; margin-right: 20px; background-size:12rem 100%; background-position:left center; position: relative; transition: width .3s; } .productindex-list2 .ulbox .li:before { content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0, 0, 0, 0.4); } .productindex-list2 .ulbox .icon { height: 45px; position: relative; z-index: 3; } .productindex-list2 .ulbox p { color: #fff; margin-top: .35rem; position: relative; z-index: 3; } .productindex-list2 .ulbox .spbox2{ padding:0 20px 20px 40px; position: absolute; left:0; bottom:0; opacity:0; width:100%; transform:translate(0,-10px); } .productindex-list2 .ulbox .spbox2 .tit3{ margin-bottom:5px; } .productindex-list2 .ulbox .btn{ width:48px; height:48px; border-radius:50%; border:1px solid rgba(255,255,255,.3); } .productindex-list2 .ulbox .btn svg{ width:20px; height:20px; margin-left:-3px; fill:#fff; } .productindex-list2 .ulbox .leftbox{ width:calc(100% - 80px); text-align:left; } @media (min-width:1024px) { .productindex-list2 .ulbox .li:hover{ width: 12rem; } .productindex-list2 .ulbox .li:hover .spbox1{ opacity:0; transform:translate(0,-10px); } .productindex-list2 .ulbox .li:hover:before{ opacity:0; } .productindex-list2 .ulbox .li:hover .spbox2{ opacity:1; transform:translate(0,0); } .productindex-list2 .gmorebtn:hover:before { width: 100%; } .productindex-list2 .gmorebtn:hover { color: #fff; } } @media (max-width: 1600px) { .productindex-list2 .warpulbox { width: calc(100vw - 5%); margin-left: 5%; } } @media (max-width: 1024px) { .productindex-list2 .ulbox .li { width: 9rem; height: 11rem; } } @media (max-width: 767px) { .productindex-list2 .tit3 { width: 90%; } .productindex-list2 .ulbox .spbox2{ padding: 0 10px 10px 20px; } .productindex-list2 .ulbox .btn{ width:35px; height:35px; } .productindex-list2 .ulbox .btn svg{ width:15px; height:15px; } } .about-list6{ padding:2.2rem 0; background:#fff; z-index:1; } .about-list6 .tab-ul{ margin-top:1rem; } .about-list6 .tab-ul .li{ width:170px; height:40px; line-height:40px; border-radius:40px; box-sizing:border-box; text-align:center; color:#086c29; border:2px solid #0c6f29; margin:0 10px; margin-bottom:1.5rem; overflow: hidden; transition: all .5s; } .about-list6 .tab-ul .li:hover,.about-list6 .tab-ul .li.cur{ color:#fff; background: linear-gradient(to left, #016028, #8dc220); border-radius:40px; } .about-list6 .leftbox{ width:42%; } .about-list6 .leftbox .tit4{ margin-top:.5rem; } .about-list6 .leftbox .ul{ margin-top:1rem; } .about-list6 .leftbox .ul .li{ margin-right:.7rem; padding-left:15px; position: relative; font-weight:bold; } .about-list6 .leftbox .ul .li:before{ content:""; position: absolute; width:6px; height:6px; border-radius:50%; left:0; top:50%; margin-top:-3px; background: linear-gradient(to left, #8dc220, #016028); } .about-list6 .imgbox{ width:50%; } .about-list6 .ulbox{ margin-top:.75rem; margin-bottom:-2%; } .about-list6 .ulbox .li{ width:32%; margin-right:2%; margin-bottom:2%; } .about-list6 .ulbox .li:nth-child(3n){ margin-right:0; } .about-list6 .ulbox .li p{ margin-top:.25rem; text-align:center; } .about-list6 .tablist{ display:none; } @media (max-width: 767px) { .about-list6 .leftbox{ width:100%; margin-bottom:.5rem; } .about-list6 .imgbox{ width:100%; } .about-list6 .tab-ul .li{ margin-bottom:1rem; width:26%; } } @media (max-width: 425px) { .about-list6 .tab-ul{ margin-bottom:.75rem; } .about-list6 .tab-ul .li{ margin:0 5px; width:28%; } .about-list6 .ulbox .li{ width:100%; margin-bottom:.35rem; } } /*# sourceMappingURL=boc_reset.css.map */