@charset "utf-8"; /** * 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: #565656; } a:active, a:hover { outline: 0 /* 2 */ } a:hover { color: #ff6000; } /* 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 { 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 */ /* 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: "Microsoft Yahei", "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; } body, html { font-family: "Microsoft YaHei","Source Han Sans CN","Noto Sans S Chinese Light","Microsoft YaHei","微軟正黑體","PingFang SC","Microsoft JhengHei","Pingfang sc regular",Helvetica, Tahoma, sans-serif; } /* @font-face { font-family: 'fon1'; src: url("fonts/CENTURYGOTHIC-BOLD.eot"); src: url("fonts/CENTURYGOTHIC-BOLD.eot") format("embedded-opentype"), url("fonts/CENTURYGOTHIC-BOLD.woff2") format("woff2"), url("fonts/CENTURYGOTHIC-BOLD.woff") format("woff"), url("fonts/CENTURYGOTHIC-BOLD.ttf") format("truetype"), url("fonts/CENTURYGOTHIC-BOLD.svg#CENTURYGOTHIC-BOLD") format("svg"); } */ body { overflow: hidden; position: relative; } .ovh-f { width: 100%; height: 100%; position: fixed; left: 0; top: 0; } a { display: block; } /*! * Hamburgers */ .hamburger { padding: 15px 15px; display: inline-block; cursor: pointer; -webkit-transition-property: opacity, -webkit-filter, opacity, filter; transition-property: opacity, filter; -webkit-transition-duration: 0.15s; transition-duration: 0.15s; -webkit-transition-timing-function: linear; transition-timing-function: linear; font: inherit; color: inherit; text-transform: none; background-color: transparent; border: 0; margin: 0; overflow: visible; } .hamburger:hover { opacity: 0.7; } .hamburger.is-active:hover { opacity: 0.7; } .hamburger.is-active .hamburger-inner, .hamburger.is-active .hamburger-inner::before, .hamburger.is-active .hamburger-inner::after { background-color: #000; } .hamburger-box { width: 40px; height: 24px; display: inline-block; position: relative; } .hamburger-inner { display: block; top: 50%; margin-top: -2px; } .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { width: 40px; height: 4px; background-color: #000; border-radius: 4px; position: absolute; -webkit-transition-property: -webkit-transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease; transition-timing-function: ease; } .hamburger-inner::before, .hamburger-inner::after { content: ""; display: block; } .hamburger-inner::before { top: -10px; } .hamburger-inner::after { bottom: -10px; } /* * 3DY Reverse */ .hamburger--3dy-r .hamburger-box { -webkit-perspective: 80px; perspective: 80px; } .hamburger--3dy-r .hamburger-inner { -webkit-transition: -webkit-transform 0.45s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: transform 0.45s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); } .hamburger--3dy-r .hamburger-inner::before, .hamburger--3dy-r .hamburger-inner::after { -webkit-transition: -webkit-transform 0s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: transform 0s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); } .hamburger--3dy-r.is-active .hamburger-inner { background-color: transparent !important; -webkit-transform: rotateX(180deg); transform: rotateX(180deg); } .hamburger--3dy-r.is-active .hamburger-inner::before { -webkit-transform: translate3d(0, 7px, 0) rotate(45deg); transform: translate3d(0, 7px, 0) rotate(45deg); } .hamburger--3dy-r.is-active .hamburger-inner::after { -webkit-transform: translate3d(0, -7px, 0) rotate(-45deg); transform: translate3d(0, -7px, 0) rotate(-45deg); } .animate-inFromLeft, .animate-inFromRight { visibility: visible !important; } .animate-outToRight .li-js { -webkit-animation: outToRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1); animation: outToRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1); } .animate-outToLeft .li-js { -webkit-animation: outToLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1); animation: outToLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1); } .animate-inFromLeft .li-js { -webkit-animation: inFromLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1); animation: inFromLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1); } .animate-inFromRight .li-js { -webkit-animation: inFromRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1); animation: inFromRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1); } @-webkit-keyframes outToRight { to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes outToRight { to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @-webkit-keyframes outToLeft { to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes outToLeft { to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @-webkit-keyframes inFromLeft { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes inFromLeft { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes inFromRight { from { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes inFromRight { from { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes opacity1 { from { opacity: 0; } to { opacity: 1; } } @keyframes opacity1 { from { opacity: 0; } to { opacity: 1; } } .c-mask-overlay { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 10; background-color: #262626; display: none; } .search-bg { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 10; background-color: #f5f5f5; display: none; z-index: 20; } .tab-label { display: block; position: relative; overflow: hidden; text-align: center; margin: .5rem auto 0; } .tab-label .n-tab-label { display: inline-block; text-align: center; height: 22px; line-height: 22px; font-size: 16px; font-weight: bold; overflow: hidden; position: relative; margin-top: 11.5px; } .tab-label .tab-label-inner { display: block; } .tab-label .tab-label-inner-bottom { position: absolute; top: 0; left: 0; } .tab-label .tab-label-inner-bottom .words-z, .tab-label .tab-label-inner-top .words-z { position: relative; } .tab-label .tab-label-inner-top .words-z span { position: relative; display: inline-block; -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); -webkit-transition: -webkit-transform .3s; transition: transform .3s; } .tab-label .tab-label-inner-bottom .words-z span { position: relative; display: inline-block; -webkit-transform: translate(0%, 100%) matrix(1, 0, 0, 1, 0, 0); -ms-transform: translate(0%, 100%) matrix(1, 0, 0, 1, 0, 0); transform: translate(0%, 100%) matrix(1, 0, 0, 1, 0, 0); -webkit-transition: -webkit-transform .3s; transition: transform .3s; } .tab-label:hover .tab-label-inner-top .words-z span { position: relative; display: inline-block; -webkit-transform: translate(0%, -100%) matrix(1, 0, 0, 1, 0, 0); -ms-transform: translate(0%, -100%) matrix(1, 0, 0, 1, 0, 0); transform: translate(0%, -100%) matrix(1, 0, 0, 1, 0, 0); } .tab-label:hover .tab-label-inner-bottom .words-z span { position: relative; display: inline-block; -webkit-transform: translate(0%, 0%) matrix(1, 0, 0, 1, 0, 0); -ms-transform: translate(0%, 0%) matrix(1, 0, 0, 1, 0, 0); transform: translate(0%, 0%) matrix(1, 0, 0, 1, 0, 0); } .w1300 { width: 1300px; margin: 0 auto; } .f-all-3 { -webkit-transition: all .3s ease-in-out !important; transition: all .3s ease-in-out !important; } .header1 { background: #fff; height: 90px; line-height: 90px; position: relative; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .header1 .n-header { width: 100%; height: 90px; line-height: 90px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .header1 .logo { margin-left: 1rem; width: 260px; height: 55px; position: relative; } .header1 .logo a { display: block; } .header1 .logo img { position: absolute; width: 65%; top: 0; bottom: 0; left: 0; right: 0; margin: auto; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .header1 .logo .img1 { -webkit-clip-path: inset(0% 0 0% 0); clip-path: inset(0% 0 0% 0); } .header1 .logo .img2 { visibility: hidden; -webkit-clip-path: inset(50% 0 50% 0); clip-path: inset(50% 0 50% 0); } .header1 .header-right { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .header1 .header-right .nav { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .header1 .header-right .nav .li { margin-right: 1.25rem; font-size: 16px; color: #333; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .header1 .header-right .nav .li:hover, .header1 .header-right .nav .li.cur { color: #ff4700; } .header1 .header-right .lang-box { width: 120px; height: 100%; border-left: 1px solid #e5e5e5; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; position: relative; } .header1 .header-right .lang-box:before { content: ""; position: absolute; width: 1px; height: 12px; background: #ccc; left: 0; right: 0; top: 0; bottom: 0; margin: auto; } .header1 .header-right .lang-box a { display: inline-block; margin: 0 10px; color: #aaa; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .header1 .header-right .lang-box a.cur { color: #333; } .header1 .header-right .lang-box a:hover { color: #ff4700; } .header1 .header-right .search-btn { margin-right: .6rem; width: 50px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; font-size: 25px; color: #b4b4b4; cursor: pointer; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .header1 .header-right .search-btn:hover { color: #ff4700; } .header1.index-cur { background: transparent; position: fixed; z-index: 99; width: 100%; box-shadow: none; } .header1.index-cur .logo .img1 { visibility: hidden; -webkit-clip-path: inset(50% 0 50% 0); clip-path: inset(50% 0 50% 0); } .header1.index-cur .logo .img2 { visibility: visible; -webkit-clip-path: inset(0% 0 0% 0); clip-path: inset(0% 0 0% 0); } .header1.index-cur .n-header { background: transparent; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .header1.index-cur .header-right .lang-box { border-left: 1px solid rgba(255, 255, 255, 0.1); } .header1.index-cur .header-right .lang-box a.cur { color: #fff; opacity: 1; } .header1.index-cur .header-right .lang-box a { opacity: .6; color: #fff; } .header1.index-cur .header-right .lang-box:before { background: rgba(255, 255, 255, 0.1); } .header1.index-cur .header-right .search-btn { color: #fff; } .header1.index-cur .header-right .nav .li { color: #fff; } .header1.index-cur2 { background: transparent; position: fixed; z-index: 99; width: 100%; box-shadow: none; } .header1.index-cur2 .n-header { border-bottom: 1px solid #e5e5e5; } #index-container .page-index.active ul li .sp { color: #333; } #index-container .page-index.active .sp2 .sp2-1, #index-container .page-index.active .sp2 .sp2-2 { color: #333; } #index-container .page-index.active ul li { background: #dddddd; } #index-container .page-index.active ul li.active { background: #ff4700; } .header2 { height: 65px; position: relative; width: 100%; background: #fff; z-index: 15; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .header2 .main-wrap { height: 65px; padding: 0 4%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row nowrap; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .header2 .logo { width: 6.5rem; height: 65px; line-height: 65px; overflow: hidden; } .header2 .logo a { display: block; } .header2 .logo img { width: 100%; vertical-align: middle; } .header2 .search-btn { font-size: 20px; color: #d0d0d0; cursor: pointer; position: absolute; right: calc(8% + 20px); height: 65px; line-height: 65px; width: 40px; text-align: center; font-size: .9rem; } .header2 .language-tab { width: 60px; height: 65px; line-height: 65px; position: absolute; right: calc(8% + 40px); top: 0; } .header2 .language-tab .spbox { color: #999; position: relative; font-size: 14px; cursor: pointer; } .header2 .hamburger { position: absolute; right: 0%; top: 0; height: 65px; padding: 0 4%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .header2 .hamburger .hamburger-box { width: .9rem; height: .9rem; } .header2 .hamburger .hamburger-inner::before { top: -7px; } .header2 .hamburger .hamburger-inner::after { top: 7px; } .header2 .hamburger .hamburger-inner { top: 50%; margin-top: -1.5px; } .header2 .hamburger .hamburger-inner, .header2 .hamburger .hamburger-inner::before, .header2 .hamburger .hamburger-inner::after { width: 100%; height: 3px; background: #05415f; } .header2 .sub-menu { width: 100%; display: none; position: absolute; left: 0; top: 65px; z-index: 2; } .header2 .sub-menu ul { width: 100%; height: calc(100vh - 100px); padding: 1.5rem 5% 0; overflow-x: hidden; } .header2 .sub-menu li { padding: .5rem 0; border-bottom: 1px solid #414141; font-size: 16px; } .header2 .sub-menu .tit { display: block; width: 100%; margin-bottom: .3rem; line-height: 1.6; color: #cdcdcd; font-size: .65rem; position: relative; font-weight: bold; } .header2 .sub-menu .sub-tit:before { display: block; width: 20px; height: 20px; background-size: 100% auto; position: absolute; right: 0%; top: 50%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } .header2 .sub-menu .sub-tit.on { color: #fff; } .header2 .sub-menu .sub-tit.on:before { content: "\e669"; } .header2 .sub-menu .sec-list { display: none; } .header2 .sub-menu .sec-list p { line-height: 1.5; } .header2 .sub-menu .sec-list a { color: #999; } .header2 .logo, .header2 .language-tab, .header2 .search-btn, .header2 .hamburger { -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .footer1 { background: #031b33; } .footer1 .fot-top { padding: 1.5rem 0 1rem; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .footer1 .input-box { background: #303135; width: 12rem; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .footer1 .input-box input[type="text"] { height: 55px; padding: 15px; line-height: 25px; color: #fff; background: none; border: none; font-size: 14px; width: calc(100% - 65px); } .footer1 .input-box input[type="submit"] { text-align: center; background: none; border: none; border-left: 1px solid #45464a; width: 65px; height: 35px; position: relative; background: url(../images/img22.png) no-repeat center; background-size: 22px auto; } .footer1 .fot-left { width: 770px; } .footer1 .fot-left .logo { width: 183px; height: 47px; margin-right: 2rem; } .footer1 .fot-left .fot-left-top { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .footer1 .fot-left .ulbox { margin-top: 1.5rem; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .footer1 .fot-left .ulbox .li { width: 100px; margin-right: 1.65rem; } .footer1 .fot-left .ulbox .dt { margin-bottom: .75rem; color: #fff; font-size: 16px; line-height: 1.5; } .footer1 .fot-left .ulbox .dd { font-size: 14px; line-height: 1.5; color: #697c8e; margin-bottom: .3rem; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .footer1 .fot-left .ulbox .dd:hover { color: #fff; } .footer1 .fot-left .ulbox .li:last-child { margin-right: 0; } .footer1 .fot-right { width: 300px; } .footer1 .fot-right .libox { margin-bottom: 1.1rem; } .footer1 .fot-right .libox .li { padding-bottom: 10px; border-bottom: 1px solid #3c3d41; margin-bottom: 10px; font-family: "Arial"; } .footer1 .fot-right .libox img { margin-right: 12px; } .footer1 .fot-right .wxbox { text-align: center; } .footer1 .fot-right .wxbox img { width: 4rem; height: 4rem; margin-bottom: 15px; } .footer1 .fot-right .wxbox p { font-size: 14px; line-height: 1.5; color: #797a7d; } .footer1 .fot-bot { border-top: 1px solid rgba(255, 255, 255, 0.05); padding: .4rem 0; } .footer1 .n-fot-bot { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .footer1 .n-fot-bot .p-left { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .footer1 .n-fot-bot .p-left span { font-size: 14px; color: #4d4f55; } .footer1 .n-fot-bot .p-left a { width: 25px; height: 25px; font-size: 22px; margin: 0 8px; color: #4d4f55; padding-left: 0; background: none; } .footer1 .n-fot-bot .p-right { color: #697c8e; font-size: 14px; line-height: 25px; } .footer1 .n-fot-bot .p-right p, .footer1 .n-fot-bot .p-right span, .footer1 .n-fot-bot .p-right a { display: inline-block; } .footer1 .n-fot-bot .p-right a { color: #4d4f55; -webkit-transition: all .3s ease; transition: all .3s ease; } .footer1 .n-fot-bot .p-right a:hover { color: #fff; } /* 新闻详情 */ .news-detail-wrap { padding: 30px 0px 0px 0px; margin-bottom: -20px; } .news-detail-wrap .con-wrap { width: 1200px; margin: 0 auto; } .news-detail-wrap .newsdetail { margin: 15px 0px 60px 0px; padding: 0px 100px; } .newsdetail .top { border-bottom: 1px solid #ddd; padding: 10px 0px; padding: 10px 0px 30px 0px; } .newsdetail .top .title { font-size: 30px; font-weight: bold; color: #3d3d3d; /*line-height: 165%;*/ text-align: center; margin-bottom: 20px; } .newsdetail .top .sub-info { text-align: center; color: #969696; line-height: 17px; } .newsdetail .top .sub-info span { margin: 0px 20px; } .newsdetail .mid { padding: 30px 0px; line-height: 190%; font-size: 15px; text-align: justify; overflow: hidden; color: #333; /*overflow-wrap: break-word;*/ /*word-wrap: break-word;*/ } .newsdetail .mid p { margin-bottom: 15px; color: #414141; } .newsdetail .mid img { margin: 30px 0px; max-width: 100%; display: inline-block; } .newsdetail .bot { background: #f2f6fc; padding: 10px 30px; } .pagefanye {} .pagefanye p { line-height: 34px; height: 34px; font-size: 15px; margin: 0px; } .pagefanye p a { display: inline-block; color: #414141; text-decoration: none; } .pagefanye p a:hover { color: #f00000; text-decoration: none; } @media screen and (max-width:1200px) { .news-detail-wrap { padding-top: 15px; } .news-detail-wrap .con-wrap { width: unset; margin: 0 auto; } .news-detail-wrap .newsdetail { margin: 15px 0px 60px 0px; padding: 0px 20px; } .newsdetail .top { border-bottom: 1px solid #ddd; padding: 10px 0px; padding: 10px 0px 20px 0px; } .newsdetail .top .title { font-size: 17px; margin-bottom: 6px; } .newsdetail .top .sub-info { font-size: 14px; } .newsdetail .top .sub-info span { margin: 0px 8px; } .newsdetail .mid { padding: 20px 0px; } .pagefanye p { font-size: 14px; } } #index-container { position: relative; z-index: 2; height: 100vh; width: 100%; } #index-container .swiper-slide { width: 100%; height: 100vh; } #index-container .swiper-slide:last-child { height: auto; } #index-container .imgbg { width: 100% !important; height: 100vh; position: absolute; z-index: 1; left: 0; top: 0; background-repeat: no-repeat; background-position: center center; background-size: cover; } #index-container .j-btn { position: absolute; left: 50%; height: 70px; bottom: 0; color: #fff; z-index: 5; cursor: pointer; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } #index-container .j-btn .triangle-up { font-size: 14px; line-height: 1.5; font-family: "fon1"; text-transform: uppercase; } #index-container .j-btn .triangle-up:before { content: ""; left: 50%; position: absolute; height: 12px; width: 3px; margin-left: -1.5px; bottom: 30px; background: #fff; -webkit-animation: fadeOutDown 2s infinite; animation: fadeOutDown 2s infinite; -webkit-animation-fill-mode: both; animation-fill-mode: both; } #index-container .j-btn .triangle-up:after { content: ""; position: absolute; left: 50%; margin-left: -.5px; width: 1px; height: 30px; bottom: 0; background: rgba(255, 255, 255, 0.5); -webkit-animation: fadeOutDown 2s .3s infinite; animation: fadeOutDown 2s .3s infinite; -webkit-animation-fill-mode: both; animation-fill-mode: both; } #index-container .j-btn2 { color: #333; } #index-container .j-btn2 .triangle-up:before { background: #333; } #index-container .j-btn2 .triangle-up:after { background: #ccc; } #index-container #i-banner { position: relative; z-index: 2; height: 100vh; width: 100%; overflow: hidden; } #index-container #i-banner .swiper-slide { width: 100%; height: 100vh; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; overflow: hidden; } #index-container #i-banner .swiper-slide .text { padding-top: 32vh; position: relative; z-index: 3; /*opacity: 0*/ /*clip-path: inset(50% 0 50% 0);*/ } #index-container #i-banner .swiper-slide .text .tit2 { line-height: 1.5; padding-left: 2.5rem; position: relative; margin-bottom:.5rem; /*opacity: 0; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-transform: translate(0, 10px); -ms-transform: translate(0, 10px); transform: translate(0, 10px);*/ } #index-container #i-banner .swiper-slide .text .tit2:before { content: ""; position: absolute; width: 2rem; height: 5px; background: #fff; top: 50%; left: 0; margin-top: -2.5px; display:none; } #index-container #i-banner .swiper-slide .text .tit3 { font-size: 1.4rem; font-family: "fon1"; line-height: 1.1; text-transform: uppercase; font-weight: bold; /*opacity: 0; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-transform: translate(0, 20px); -ms-transform: translate(0, 20px); transform: translate(0, 20px); -webkit-transition-delay: .1s; transition-delay: .1s;*/ } #index-container #i-banner .swiper-slide .text .tit4 { width: 730px; /*opacity: 0;*/ margin-top:.35rem; letter-spacing:3px; /*-webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-transform: translate(0, 30px); -ms-transform: translate(0, 30px); transform: translate(0, 30px); -webkit-transition-delay: .2s; transition-delay: .2s;*/ } #index-container #i-banner .swiper-slide.swiper-slide-active .text.animate { opacity: 1; } #index-container #i-banner .swiper-slide.swiper-slide-active .text.animate .tit2, #index-container #i-banner .swiper-slide.swiper-slide-active .text.animate .tit3, #index-container #i-banner .swiper-slide.swiper-slide-active .text.animate .tit4 { opacity: 1; -webkit-transform: translate(0, 0px); -ms-transform: translate(0, 0px); transform: translate(0, 0px); } #index-container #i-banner .banner-pagination { position: absolute; width: 2.5rem; height: 100%; z-index: 2; left: auto; right: 0; top: auto; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; text-align: center; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #index-container #i-banner .banner-pagination span { background: #fff; opacity: .6; width: 10px; height: 10px; display: block; margin: 10px 0px; border-radius: 50%; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #index-container #i-banner .banner-pagination span.swiper-pagination-bullet-active { -webkit-transform: scale3d(1.6, 1.6, 1); transform: scale3d(1.6, 1.6, 1); opacity: 1; } #index-container .swiper-slide1 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #index-container .swiper-slide1 .text { position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; z-index: 2; width: calc(650px + 50vw); margin-left: calc(50vw - 650px); } #index-container .swiper-slide1 .text .content-box { width: 500px; } #index-container .swiper-slide1 .text .content-box .tit1 { line-height: 1.2; font-family: "fon1"; } #index-container .swiper-slide1 .text .content-box .tit2 { margin-bottom: .6rem; line-height: 1.2; } #index-container .swiper-slide1 .text .content-box .tit3 { font-size: 15px; line-height: 30px; margin-bottom: 1.35rem; } #index-container .swiper-slide1 .text .content-box .more { width: 160px; height: 45px; line-height: 45px; text-align: center; color: #fff; font-size: 14px; font-family: "fon1"; text-transform: uppercase; background: #ff4700; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #index-container .swiper-slide1 .text .content-box .more:hover { letter-spacing: .5px; background: transparent; color: #333; box-shadow: inset 0px 0px 0px 4px #ff4700; } #index-container .swiper-slide1 .text .content-box .ulbox { margin-top: 2.25rem; width: 100%; border-bottom: 1px solid #ccc; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } #index-container .swiper-slide1 .text .content-box .ulbox .li-tab { text-align: left; width: 50%; padding-bottom: .5rem; position: relative; cursor: pointer; z-index: 2; } #index-container .swiper-slide1 .text .content-box .ulbox .li-tab:before { content: ""; position: absolute; left: 0; bottom: -1.5px; width: 1rem; height: 3px; background: #ff4700; } #index-container .swiper-slide1 .text .content-box .ulbox .li-tab img { margin-bottom: 8px; width: 35px; height: 35px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #index-container .swiper-slide1 .text .content-box .ulbox .li-tab p { font-size: 15px; line-height: 1.2; color: #333; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #index-container .swiper-slide1 .text .content-box .ulbox .li-tab:hover img { -webkit-transform: translate(0, -5px); -ms-transform: translate(0, -5px); transform: translate(0, -5px); } #index-container .swiper-slide1 .text .content-box .ulbox .li-tab:hover p { color: #ff4700; } #index-container .swiper-slide1 .img-box { width: calc(720px + 50vw - 650px); position: relative; z-index: 2; padding-bottom: 1rem; } #index-container .swiper-slide1 .img-box .swiper-container3 { overflow: hidden; } #index-container .swiper-slide1 .img-box .swiper-container3 .swiper-slide { height: auto; } #index-container .swiper-slide1 .img-box .swiper-container3 .swiper-slide img { max-width: 100%; } #index-container .swiper-slide1 .img-box .swiper-pagination { bottom: 0; top: auto; } #index-container .swiper-slide1 .img-box .swiper-pagination-progress .swiper-pagination-progressbar { background: #05092a; } #index-container .swiper-slide2 { background: #14314d; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #index-container .swiper-slide2 .left-box { width: 50%; padding: 0 4rem; height: 100vh; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #index-container .swiper-slide2 .left-box .tit1 { margin-bottom: .6rem; } #index-container .swiper-slide2 .left-box .ulbox { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; width: 100%; } #index-container .swiper-slide2 .left-box .ulbox .li { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; width: 33.3%; height: 3rem; border: 1px solid rgba(255, 255, 255, 0.1); position: relative; cursor: pointer; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #index-container .swiper-slide2 .left-box .ulbox .li img { position: absolute; left: 0%; right: 0%; top: 0%; bottom: 0%; margin: auto; max-width: 80%; max-height: 80%; } #index-container .swiper-slide2 .left-box .ulbox .li .img1 { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #index-container .swiper-slide2 .left-box .ulbox .li .img2 { opacity: 0; -webkit-transform: scale(0.6); -ms-transform: scale(0.6); transform: scale(0.6); -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #index-container .swiper-slide2 .left-box .ulbox .li:hover, #index-container .swiper-slide2 .left-box .ulbox .li.active { background: #fff; } #index-container .swiper-slide2 .left-box .ulbox .li:hover .img1, #index-container .swiper-slide2 .left-box .ulbox .li.active .img1 { opacity: 0; -webkit-transform: scale(0.6); -ms-transform: scale(0.6); transform: scale(0.6); } #index-container .swiper-slide2 .left-box .ulbox .li:hover .img2, #index-container .swiper-slide2 .left-box .ulbox .li.active .img2 { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } #index-container .swiper-slide2 .left-box .more { width: 160px; height: 45px; line-height: 45px; text-align: center; color: #fff; font-size: 14px; font-family: "fon1"; text-transform: uppercase; background: transparent; border: 1px solid #fff; margin-top: 1.25rem; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #index-container .swiper-slide2 .left-box .more:hover { letter-spacing: .5px; box-shadow: inset 0px 0px 0px 4px #fff; } #index-container .swiper-slide2 .right-box { position: absolute; width: 50%; right: 0; top:0; height: 100vh; z-index: 2; } #index-container .swiper-slide2 .right-box .imgbox{ position:absolute; left:0; top:0; height:100%; width:100%; z-index:3; } #index-container .swiper-slide2 .right-box .img{ position: absolute; left:0; top:0; height:100%; width:100%; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; opacity:0; z-index:1; transition: all .5s ease-in-out; } #index-container .swiper-slide2 .right-box .img.active{ opacity:1; z-index:3; } #index-container .swiper-slide2 .right-box .yin { width: 100%; height: 100%; left: 0; top: 0; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; z-index: 2; } #index-container .swiper-slide2 .right-box.active { /*-webkit-animation: imgdown 1s ease-in-out; animation: imgdown 1s ease-in-out;*/ } #index-container .swiper-slide3{ overflow:hidden; } #index-container .swiper-slide3 .text { padding-top: 18vh; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; position: relative; z-index: 5; text-align: center; } #index-container .swiper-slide3 .text .tit1 { margin-bottom: .5rem; font-weight: bold; } #index-container .swiper-slide3 .text .j-btn { margin-top: 1.25rem; } #index-container .swiper-slide3 .text .more { width: 160px; height: 45px; line-height: 45px; text-align: center; color: #fff; font-size: 14px; font-family: "fon1"; text-transform: uppercase; background: transparent; border: 1px solid #fff; margin-top: 1.25rem; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #index-container .swiper-slide3 .text .more:hover { letter-spacing: .5px; box-shadow: inset 0px 0px 0px 4px #fff; } #index-container .swiper-slide3 .wulbox{ position: absolute; height: calc(100vh - 90px); width: 100%; left: 0; top: 90px; z-index: 3; overflow:hidden; } #index-container .swiper-slide3 .ulbox { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; min-width:1000px; } #index-container .swiper-slide3 .ulbox .li { width: 25%; padding: 0 1rem 3rem; height: calc(100vh - 90px); display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; color: rgba(255, 255, 255, 0.2); /*transition:color .3s ease-in-out,letter-spacing .3s ease-in-out;*/ -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; border-right: 1px solid rgba(255, 255, 255, 0.1); } #index-container .swiper-slide3 .ulbox .li .tit3 { font-family: "fon1"; line-height: 2; text-transform: uppercase; text-align: center; width: 100%; } #index-container .swiper-slide3 .ulbox .li .tit4 { line-height: 2;text-align: center; width: 100%; } #index-container .swiper-slide3 .ulbox .li .tit5 { line-height: 2; text-transform: uppercase;text-align: center; width: 100%; } #index-container .swiper-slide3 .ulbox .li:last-child { border-right: none; } #index-container .swiper-slide3 .ulbox .li:hover,#index-container .swiper-slide3 .ulbox .li.active { letter-spacing: .5px; color: white; text-align: center; } #index-container .swiper-slide4 { /*display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; flex-shrink:auto;*/ display:block; } #index-container .swiper-slide4 .content-list{ display:block; margin-top:4rem; } #index-container .swiper-slide4 .content-list .tit1 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding-bottom: .5rem; border-bottom: 1px solid #d4d4d4; } #index-container .swiper-slide4 .content-list .more { width: 160px; height: 45px; line-height: 45px; text-align: center; color: #fff; font-size: 14px; font-family: "fon1"; text-transform: uppercase; background: #ff4700; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #index-container .swiper-slide4 .content-list .more:hover { letter-spacing: .5px; background: transparent; color: #333; box-shadow: inset 0px 0px 0px 4px #ff4700; } #index-container .swiper-slide4 .news-list { margin-top: .75rem; position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; z-index: 2; } #index-container .swiper-slide4 .news-list .img-left { width: 65%; height: 52vh; overflow: hidden; position: relative; } #index-container .swiper-slide4 .news-list .img-left .img { background-repeat: no-repeat; background-position: 50%,50%; background-size: cover; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; } #index-container .swiper-slide4 .news-list .img-left .yin { background-repeat: no-repeat; background-position: 50%,50%; background-size: cover; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 3; } #index-container .swiper-slide4 .news-list .img-left .text { position: absolute; width: 100%; left: 0; bottom: 0; z-index: 4; padding: .4rem .7rem; } #index-container .swiper-slide4 .news-list .ulbox { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 33%; } #index-container .swiper-slide4 .news-list .ulbox .li { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; padding: .375rem 0; border-bottom: 1px solid #e1e1e1; } #index-container .swiper-slide4 .news-list .ulbox .li .img { width: 3.75rem; } #index-container .swiper-slide4 .news-list .ulbox .li .img img { max-width: 100%; } #index-container .swiper-slide4 .news-list .ulbox .li .text { width: calc(100% - 4.25rem); } #index-container .swiper-slide4 .news-list .ulbox .li .text .time { color: #aaa; margin-bottom: 10px; } #index-container .swiper-slide4 .news-list .ulbox .li .text .tit4 { line-height: 26px; height: 52px; overflow: hidden; } #index-container .page-index { position: absolute; width: 4rem; height: 60%; top: 20%; z-index: 2; left: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; text-align: center; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #index-container .page-index ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; text-align: center; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #index-container .page-index ul li { width: 1px; height: 1.75rem; font-size: 14px; background: #fff; position: relative; background: rgba(255, 255, 255, 0.1); cursor: pointer; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #index-container .page-index ul li .sp { position: absolute; top: 50%; width: 50px; height: 30px; line-height: 30px; color: #fff; text-align: right; padding-right: 10px; -webkit-transform: translate(-10px, -50%); -ms-transform: translate(-10px, -50%); transform: translate(-10px, -50%); left: -50px; opacity: 0; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #index-container .page-index ul li .sp2 { position: absolute; top: 50%; width: 100px; height: 30px; line-height: 30px; padding-left: 10px; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); right: -100px; } #index-container .page-index ul li .sp2 span { position: absolute; z-index: 1; top: 50%; left: 10px; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #index-container .page-index ul li .sp2 .sp2-1 { color: #fff; } #index-container .page-index ul li .sp2 .sp2-2 { color: #fff; font-family: "fon1"; text-transform: uppercase; opacity: 0; -webkit-transform: translate(10px, -50%); -ms-transform: translate(10px, -50%); transform: translate(10px, -50%); } #index-container .page-index ul li.active { width: 4px; background: white; } #index-container .page-index ul li.active .sp { opacity: 1; -webkit-transform: translate(0px, -50%); -ms-transform: translate(0px, -50%); transform: translate(0px, -50%); } #index-container .page-index ul li.active .sp2 .sp2-1 { opacity: 0; -webkit-transform: translate(10px, -50%); -ms-transform: translate(10px, -50%); transform: translate(10px, -50%); } #index-container .page-index ul li.active .sp2 .sp2-2 { opacity: 1; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } @-webkit-keyframes fadeOutDown { 0%, 30% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 40% { opacity: 1; -webkit-transform: translate3d(0, 0%, 0); transform: translate3d(0, 0%, 0); } 100% { opacity: 0; -webkit-transform: translate3d(0, 0%, 0); transform: translate3d(0, 0%, 0); } } @keyframes fadeOutDown { 0%, 30% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 40% { opacity: 1; -webkit-transform: translate3d(0, 0%, 0); transform: translate3d(0, 0%, 0); } 100% { opacity: 0; -webkit-transform: translate3d(0, 0%, 0); transform: translate3d(0, 0%, 0); } } /*首页*/ .n-banner { height: 19rem; width: 100%; background-repeat: no-repeat; background-position: center top; background-size: cover; position: relative; z-index: 5; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .n-banner .video-btn { text-align: center; position: absolute; width: 110px; left: 50%; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); bottom: 1.25rem; cursor: pointer; } .n-banner .video-btn .img { width: 2.25rem; height: 2.25rem; } .n-banner .video-btn p { margin-top: 10px; font-family: "fon1"; text-transform: uppercase; } .n-banner .text .tit1 { line-height: 1.2; font-family: "fon1"; } .n-banner .text .tit2 { line-height: 1.2; } .n-banner .text .tit3 { margin-top: .75rem; width: 650px; } .n-banner .text .tit4 { margin-top: .75rem; width: 560px; } .n-banner .bot{ position:absolute; width:100%; height:55px; line-height:55px; color:#fff; font-size:18px; background:rgba(0,0,0,.8); bottom:0; font-weight:bold; } .wsub-nav { height: 80px; position: relative; z-index: 9; } .wsub-nav-two{ height:calc(1.5rem + 80px); position: relative; z-index: 9; } .nsub-nav { background: #f0f4f7; height: 80px; line-height: 80px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .nsub-nav a { display: block; width: 6rem; height: 80px; line-height: 80px; text-align: center; } .nsub-nav a span { padding-left: 40px; line-height: 30px; display: inline-block; } .nsub-nav a .sp0 { background: url(../images/img3-3.png) left center no-repeat; background-size: 30px auto; } .nsub-nav a .sp1 { background: url(../images/img3.png) left center no-repeat; background-size: 30px auto; } .nsub-nav a .sp2 { background: url(../images/img4.png) left center no-repeat; background-size: 30px auto; } .nsub-nav a:hover, .nsub-nav a.cur { color: #fff; background: #ff4700; } .nsub-nav a:hover .sp0, .nsub-nav a.cur .sp0 { background: url(../images/img3-4.png) left center no-repeat; } .nsub-nav a:hover .sp1, .nsub-nav a.cur .sp1 { background: url(../images/img3_1.png) left center no-repeat; } .nsub-nav a:hover .sp2, .nsub-nav a.cur .sp2 { background: url(../images/img4_1.png) left center no-repeat; } .nsub-nav-two { background: #f0f4f7; } .nsub-nav-two .pc-block { display: -webkit-box !important; display: -webkit-flex !important; display: -ms-flexbox !important; display: flex !important; } .nsub-nav-two .w1300 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .nsub-nav-two .w1300 .li { /*width: 16.6%;*/ width:20%; } .nsub-nav-two .w1300 .img { width: 100%; height: 45px; position: relative; margin-bottom: 10px; } .nsub-nav-two .w1300 .img .sp { position: absolute; max-height: 100%; left: 0; right: 0; margin: auto; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .nsub-nav-two .w1300 .img .sp1 { -webkit-clip-path: inset(0% 0 0% 0); clip-path: inset(0% 0 0% 0); visibility: visible; } .nsub-nav-two .w1300 .img .sp2 { -webkit-clip-path: inset(50% 0 50% 0); clip-path: inset(50% 0 50% 0); visibility: hidden; } .nsub-nav-two a { display: inline-block; padding: .75rem 0 .6rem; text-align: center; } .nsub-nav-two a span { color: #666; display: block; } .nsub-nav-two a:hover, .nsub-nav-two a.cur { color: #333; background: #fff; } .nsub-nav-two a:hover .img .sp1, .nsub-nav-two a.cur .img .sp1 { -webkit-clip-path: inset(50% 0 50% 0); clip-path: inset(50% 0 50% 0); visibility: hidden; } .nsub-nav-two a:hover .img .sp2, .nsub-nav-two a.cur .img .sp2 { -webkit-clip-path: inset(0% 0 0% 0); clip-path: inset(0% 0 0% 0); visibility: visible; } .nsub-nav-s .w1300 .li { width: 16%; } .nsub-nav-s a { padding: 0; height: 80px; line-height: 80px; } .nsub-nav-s a:hover, .nsub-nav-s a.cur { background: #ff4700; } .nsub-nav-s a:hover span, .nsub-nav-s a.cur span { color: #fff; } .nsub-nav.scroll { position: fixed; left: 0; width: 100%; top: 0; z-index: 9; } .nsub-nav-two.scroll { position: fixed; left: 0; width: 100%; top: 0; z-index: 9; } .tit-title { padding-bottom: 15px; text-align: center; position: relative; } .tit-title:before { content: ""; position: absolute; left: 50%; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); width: 1.25rem; height: 4px; bottom: 0; background: #ff4700; } .n-contact .list1 { padding: 2.25rem 0 2.5rem; } .n-contact .list1 .tit2 { margin-top: .85rem; } .n-contact .list1 .tit3 { display: inline-block; padding: 0 .8rem; height: 52px; line-height: 52px; font-family: "Arial"; font-weight: bold; border: 1px solid #ccc; margin: .75rem auto 0; } .n-contact .list1 .tit3:hover { letter-spacing: .5px; box-shadow: inset 0px 0px 0px 4px #ff6000; border: 1px solid #fff; } .n-contact .list1 .ulbox { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; margin-top: 1.5rem; } .n-contact .list1 .ulbox .li { width: 31.5%; margin-right: 2.75%; box-shadow: inset 0px 0px 0px 1px #e1e1e1; padding: 1.5rem 0.5rem .75rem; margin-bottom: 2.75%; cursor:pointer; } .n-contact .list1 .ulbox .li:nth-child(3n) { margin-right: 0; } .n-contact .list1 .ulbox .p { height: 35px; line-height: 35px; border-radius: 35px; padding: 0 .5rem; margin-bottom: .3rem; background: #ff4700; display: inline-block; } .n-contact .list1 .ulbox .tit4 { margin-bottom: 1.5rem; } .n-contact .list1 .ulbox .li-box { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; margin-bottom: 1rem; } .n-contact .list1 .ulbox .li-box .li-item { width: 33.3%; border-right: 1px solid #e8e8e8; } .n-contact .list1 .ulbox .li-box .li-item:last-child { border-right: 0; } .n-contact .list1 .ulbox .sp { font-size: 15px; margin-bottom: 5px; } .n-contact .list1 .ulbox .sp2 { font-size: 15px; } .n-contact .list1 .ulbox .bot { display: inline-block; padding-left: 30px; position: relative; } .n-contact .list1 .ulbox .bot:before { position: absolute; left: 0; color: #a8a8a8; } .n-contact .list1 .ulbox .li:hover { background: #ff4700; box-shadow: 0px 0px 25px 3px rgba(0, 0, 0, 0.15); -webkit-transform: translate(0, -10px); -ms-transform: translate(0, -10px); transform: translate(0, -10px); } .n-contact .list1 .ulbox .li:hover .p { background: #fff; color: #ff4700; } .n-contact .list1 .ulbox .li:hover .tit4 { color: #fff; } .n-contact .list1 .ulbox .li:hover .li-box .sp { color: #fff; -webkit-transform: translate(0, -3px); -ms-transform: translate(0, -3px); transform: translate(0, -3px); } .n-contact .list1 .ulbox .li:hover .li-box .sp2 { color: #fff; } .n-contact .list1 .ulbox .li:hover .bot { color: #fff; } .n-contact .list1 .ulbox .li:hover .bot:before { color: #fff; } .n-contact .list1 .more-click { width: 200px; height: 52px; line-height: 52px; display: inline-block; background: #ff4700; margin-top: .75rem; cursor: pointer; } .n-contact .list1 .more-click .la-ball-spin { width: 24px; height: 24px; position: absolute; left: 0; top: 0; bottom: 0; margin: auto; display: none; } .n-contact .list1 .more-click .la-ball-spin > div { width: 6px; height: 6px; margin-top: -3px; margin-left: -3px; } .n-contact .list1 .more-click .la-ball-spin > div { position: absolute; top: 50%; left: 50%; border-radius: 100%; -webkit-animation: ball-spin 1s infinite ease-in-out; animation: ball-spin 1s infinite ease-in-out; } .n-contact .list1 .more-click .la-ball-spin > div { display: inline-block; float: none; background-color: #fff; border: 0 solid #fff; } .n-contact .list1 .more-click .la-ball-spin > div:nth-child(1) { top: 5%; left: 50%; -webkit-animation-delay: -1.125s; animation-delay: -1.125s; } .n-contact .list1 .more-click .la-ball-spin > div:nth-child(2) { top: 18.1801948466%; left: 81.8198051534%; -webkit-animation-delay: -1.25s; animation-delay: -1.25s; } .n-contact .list1 .more-click .la-ball-spin > div:nth-child(3) { top: 50%; left: 95%; -webkit-animation-delay: -1.375s; animation-delay: -1.375s; } .n-contact .list1 .more-click .la-ball-spin > div:nth-child(4) { top: 81.8198051534%; left: 81.8198051534%; -webkit-animation-delay: -1.5s; animation-delay: -1.5s; } .n-contact .list1 .more-click .la-ball-spin > div:nth-child(5) { top: 94.9999999966%; left: 50.0000000005%; -webkit-animation-delay: -1.625s; animation-delay: -1.625s; } .n-contact .list1 .more-click .la-ball-spin > div:nth-child(6) { top: 81.8198046966%; left: 18.1801949248%; -webkit-animation-delay: -1.75s; animation-delay: -1.75s; } .n-contact .list1 .more-click .la-ball-spin > div:nth-child(7) { top: 49.9999750815%; left: 5.0000051215%; -webkit-animation-delay: -1.875s; animation-delay: -1.875s; } .n-contact .list1 .more-click .la-ball-spin > div:nth-child(8) { top: 18.179464974%; left: 18.1803700518%; -webkit-animation-delay: -2s; animation-delay: -2s; } .n-contact .list1 .more-click span { display: inline-block; } .n-contact .list1 .more-click.cur span { padding-left: 40px; } .n-contact .list1 .more-click.cur .la-ball-spin { display: block; } .n-contact .list2 { background: #f5f8fd; padding: 2.25rem 0 2rem; } .n-contact .list2 .ulbox { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; margin-top: 1rem; } .n-contact .list2 .ulbox .li { width: 32%; margin-right: 2%; background: #fff; padding: .75rem; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; box-shadow: 0px 0px 30px 5px rgba(0, 0, 0, 0.15); } .n-contact .list2 .ulbox .li .tit3 { color: #797a7d; } .n-contact .list2 .ulbox .li .img2 { width: 1.5rem; margin-bottom: .35rem; } .n-contact .list2 .ulbox .li:nth-child(3n) { margin-right: 0; } .n-contact .list2 .ulbox .li:hover { -webkit-transform: translate(0, -10px) !important; -ms-transform: translate(0, -10px) !important; transform: translate(0, -10px) !important; } .n-contact .list2 .ulbox .li:hover .tit2 { -webkit-transform: translate(0, -3px); -ms-transform: translate(0, -3px); transform: translate(0, -3px); } .n-contact .list2 .ulbox .li1 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .n-contact .list2 .ulbox .li1 .text { margin-right: .5rem; } .n-contact .list3 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row-reverse wrap; -ms-flex-flow: row-reverse wrap; flex-flow: row-reverse wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; } .n-contact .list3 .mapbox { width: 100%; height: 12rem; position: relative; } .n-contact .list3 .mapbox #dituContent { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 1; } .n-contact .list3 .mapbox .bg { opacity: 0; width: 100%; height: 100%; z-index: 2; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.5); visibility: hidden; } .n-contact .list3 .mapbox .map-text { padding: .5rem .7rem; width: 560px; position: absolute; left: 50%; top: 50%; z-index: 1; background: #ff4700; -webkit-transform: translate(-50%, -80%); -ms-transform: translate(-50%, -80%); transform: translate(-50%, -80%); -webkit-clip-path: inset(50% 0 50% 0); clip-path: inset(50% 0 50% 0); visibility: hidden; } .n-contact .list3 .mapbox .map-text .tit2 { margin-bottom: 14px; } .n-contact .list3 .mapbox .map-text .tit2 .sp2 { font-family: "fon1"; opacity: .15; margin-left: 12px; } .n-contact .list3 .mapbox .map-text .li { font-size: 15px; margin-bottom: .3rem; padding-left: 36px; } .n-contact .list3 .mapbox .map-text .li1 { background: url(../images/img2.png) no-repeat; background-size: 20px auto; } .n-contact .list3 .mapbox .map-text .li2 { background: url(../images/img2_1.png) no-repeat; background-size: 20px auto; } .n-contact .list3 .mapbox .map-text .li3 { background: url(../images/img2_2.png) no-repeat; background-size: 20px auto; } .n-contact .list3 .mapbox .map-text .li4 { background: url(../images/img2_3.png) no-repeat; background-size: 20px auto; } .n-contact .list3 .mapbox .map-text .close { width: 30px; height: 30px; background: #fff; position: absolute; right: 5px; top: 5px; cursor: pointer; } .n-contact .list3 .mapbox .map-text .close:before { content: ""; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 15px; height: 4px; background: #ff4700; } .n-contact .list3 .mapbox.active .bg { opacity: 1; visibility: visible; } .n-contact .list3 .mapbox.active .map-text { visibility: visible; -webkit-clip-path: inset(0% 0 0% 0); clip-path: inset(0% 0 0% 0); } .n-contact .list3 .maptab { display: none; } .n-contact .list3 .maptab .tab-li { width: 100%; height: 9rem; cursor: pointer; overflow: hidden; position: relative; } .n-contact .list3 .maptab .tab-li .bg { background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; -webkit-filter: grayscale(100%); filter: grayscale(100%); -webkit-filter: gray; filter: gray; } .n-contact .list3 .maptab .tab-li .bg2 { opacity: 1; width: 100%; height: 100%; z-index: 2; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.5); } .n-contact .list3 .maptab .text { padding: .5rem; position: absolute; left: 0; bottom: 0; z-index: 3; } .n-contact .list3 .maptab .text .tit2 { font-family: "fon1"; line-height: 1.1; } .n-contact .list3 .maptab .text .tit2, .n-contact .list3 .maptab .text .tit3 { -webkit-clip-path: inset(50% 0 50% 0); clip-path: inset(50% 0 50% 0); } .n-contact .list3 .maptab .tab-li:hover .bg, .n-contact .list3 .maptab .tab-li.cur .bg { -webkit-transform: scale(1.05, 1.05); -ms-transform: scale(1.05, 1.05); transform: scale(1.05, 1.05); -webkit-filter: grayscale(0%); filter: grayscale(0%); -webkit-filter: gray; filter: gray; } .n-contact .list3 .maptab .tab-li:hover .bg2, .n-contact .list3 .maptab .tab-li.cur .bg2 { opacity: 0; } .n-contact .list3 .maptab .tab-li:hover .tit2, .n-contact .list3 .maptab .tab-li:hover .tit3, .n-contact .list3 .maptab .tab-li.cur .tit2, .n-contact .list3 .maptab .tab-li.cur .tit3 { -webkit-clip-path: inset(0 0 0 0); clip-path: inset(0 0 0 0); } .n-news-info .list1 { background: #f9f9f9; padding: 2rem 0 3rem; } .n-news-info .list1 .news-info { width: 880px; margin: 0 auto; } .n-news-info .list1 .news-top { border-bottom: 1px solid #e5e5e5; padding-bottom: 1.5rem; text-align: left; } .n-news-info .list1 .news-top .news-tit { color: #333; margin-bottom: 20px; width: 100%; } .n-news-info .list1 .news-top .time { color: #999; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .n-news-info .list1 .news-text { padding: 1.65rem 0 4rem; min-height: 10rem; line-height: 2; border-bottom: 1px solid #e5e5e5; } .n-news-info .list1 .news-text img { max-width: 100%; display: block; margin: 0 auto; width:auto !important; height:auto !important; } .n-news-info .list1 .news-nav { padding-top: 45px; } .n-news-info .list1 .news-nav .nav-l { width: calc(100% - 200px); } .n-news-info .list1 .news-nav .nav-l span { font-size: 14px; line-height: 28px; color: #666; display: block; } .n-news-info .list1 .news-nav .nav-l span a { color: #666; width: 95%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; -webkit-transition: all .5s ease; transition: all .5s ease; } .n-news-info .list1 .news-nav .nav-l span a:hover { color: #ff4700; } .n-news-info .list1 .news-nav .news-back { width: 180px; } .n-news-info .list1 .news-nav .news-back .back-btn { width: 100%; border: 1px solid #e0e0e0; height: 45px; line-height: 45px; display: block; font-weight: bold; text-align: left; text-align: center; font-size: 14px; border-radius: 3px; -webkit-transition: all .5s ease; transition: all .5s ease; } .n-news-info .list1 .news-nav .news-back .back-btn span { position: relative; display: inline-block; padding-right: 25px; } .n-news-info .list1 .news-nav .news-back .back-btn span:before { position: absolute; font-size: 12px; right: 0; top: 50%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } .n-news-info .list1 .news-nav .news-back .back-btn:hover { color: #fff; background: #ff4700; border: 1px solid #ff4700; } .n-news { padding: 2.5rem 0 2rem; } .n-news .li { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding: 0 calc(50% - 650px) 0 calc(50% - 650px + 1.25rem); margin-bottom: 1.5rem; } .n-news .li .news-logo { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding-bottom: 18px; width: calc(50% - 650px); position: absolute; left: 0; top: 50%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } .n-news .li .news-logo img { width: 36px; height: 36px; margin-right: 10px; } .n-news .li .news-logo:before { content: ""; position: absolute; width: 100%; height: 1px; bottom: 0; left: 0; background: #e1e1e1; } .n-news .li .img { width: 14rem; } .n-news .li .img img { max-width: 100%; } .n-news .li .text { width: calc(100% - 14rem - 1.25rem); } .n-news .li .text .time { color: #aaa; font-family: "Arial"; } .n-news .li .text .line { width: 20px; height: 2px; background: #ff4700; margin-top: .5rem; margin-bottom: .65rem; } .n-news .li .text .tit1 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 6px; } .n-news .li .text .p-16 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 25px; height: 75px; overflow: hidden; margin-bottom: 1rem; } .n-news .li .text .more { width: 156px; height: 45px; line-height: 45px; text-align: center; background: #ff4700; text-transform: uppercase; color: #fff; font-family: "fon1"; } .n-news .li .text .more:hover { letter-spacing: 1px; } .n-cases { position: relative; z-index: 1; background: #fff; padding: 2.75rem 0 3rem; } .n-cases .ulbox { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .n-cases .ulbox .li { border:1px solid #dadada; padding-top: .5rem; height: 4.5rem; width: 25%; cursor: pointer; } .n-cases .ulbox .li .case_pic { height: 2rem; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .n-cases .ulbox .li .case_name { height: 1rem;line-height:1rem;; font-size: 15px; color: #333; text-align: center;} .n-cases .ulbox .li .case_sh { height: .5rem; line-height:.5rem;; font-size: 13px; color: #999; text-align: center;} .n-cases .ulbox .li:nth-child(2), .n-cases .ulbox .li:nth-child(3), .n-cases .ulbox .li:nth-child(4), .n-cases .ulbox .li:nth-child(6), .n-cases .ulbox .li:nth-child(7), .n-cases .ulbox .li:nth-child(8), .n-cases .ulbox .li:nth-child(10), .n-cases .ulbox .li:nth-child(11), .n-cases .ulbox .li:nth-child(12), .n-cases .ulbox .li:nth-child(14), .n-cases .ulbox .li:nth-child(15), .n-cases .ulbox .li:nth-child(16), .n-cases .ulbox .li:nth-child(18), .n-cases .ulbox .li:nth-child(19), .n-cases .ulbox .li:nth-child(20), .n-cases .ulbox .li:nth-child(22), .n-cases .ulbox .li:nth-child(23), .n-cases .ulbox .li:nth-child(24) { border-left: 0px; border-bottom: 0px; } .n-cases .ulbox .li:nth-child(1), .n-cases .ulbox .li:nth-child(5), .n-cases .ulbox .li:nth-child(9), .n-cases .ulbox .li:nth-child(13), .n-cases .ulbox .li:nth-child(17) { border-bottom: 0px; } .n-cases .ulbox .li:nth-child(21), .n-cases .ulbox .li:nth-child(22), .n-cases .ulbox .li:nth-child(23), .n-cases .ulbox .li:nth-child(24) { border-bottom: 1px solid #ddd; } .n-cases .ulbox .li img { max-width: 100%; } .n-cases .ulbox .li:hover { -webkit-filter: grayscale(0%); filter: grayscale(0%); -webkit-filter: gray; filter: gray; } .partner-desc { height: 350px; background: #fff;} .partner-desc .img { float: left; width: 250px; height: 250px; display: inline-block; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .partner-desc .case_ms { float: left; width: 480px; height: 250px; display: inline-block; padding: 0 20px; } .partner-desc .name { font-size: 22px; font-weight: bold; color: #333; margin-top: 50px; height: 50px; line-height: 50px; } .partner-desc .desca { font-size: 15px; color: #333; line-height: 30px; padding-bottom: 20px;} .partner-desc .descb { font-size: 13px; color: #666; line-height: 180%; padding-bottom: 20px;} .partner-desc .qygw { height: 30px;} .partner-desc .qygw a { height: 30px; line-height: 28px; display: block; border: 1px #dadada solid; width: 100px; text-align: center; border-radius:20px;} .partner-desc .qygw a:hover{ background:#ff4700; border: 1px #ff4700 solid; color: #fff;} .n-cases .more-click { width: 200px; height: 52px; line-height: 52px; display: inline-block; background: #ff4700; margin-top: .75rem; cursor: pointer; } .n-cases .more-click .la-ball-spin { width: 24px; height: 24px; position: absolute; left: 0; top: 0; bottom: 0; margin: auto; display: none; } .n-cases .more-click .la-ball-spin > div { width: 6px; height: 6px; margin-top: -3px; margin-left: -3px; } .n-cases .more-click .la-ball-spin > div { position: absolute; top: 50%; left: 50%; border-radius: 100%; -webkit-animation: ball-spin 1s infinite ease-in-out; animation: ball-spin 1s infinite ease-in-out; } .n-cases .more-click .la-ball-spin > div { display: inline-block; float: none; background-color: #fff; border: 0 solid #fff; } .n-cases .more-click .la-ball-spin > div:nth-child(1) { top: 5%; left: 50%; -webkit-animation-delay: -1.125s; animation-delay: -1.125s; } .n-cases .more-click .la-ball-spin > div:nth-child(2) { top: 18.1801948466%; left: 81.8198051534%; -webkit-animation-delay: -1.25s; animation-delay: -1.25s; } .n-cases .more-click .la-ball-spin > div:nth-child(3) { top: 50%; left: 95%; -webkit-animation-delay: -1.375s; animation-delay: -1.375s; } .n-cases .more-click .la-ball-spin > div:nth-child(4) { top: 81.8198051534%; left: 81.8198051534%; -webkit-animation-delay: -1.5s; animation-delay: -1.5s; } .n-cases .more-click .la-ball-spin > div:nth-child(5) { top: 94.9999999966%; left: 50.0000000005%; -webkit-animation-delay: -1.625s; animation-delay: -1.625s; } .n-cases .more-click .la-ball-spin > div:nth-child(6) { top: 81.8198046966%; left: 18.1801949248%; -webkit-animation-delay: -1.75s; animation-delay: -1.75s; } .n-cases .more-click .la-ball-spin > div:nth-child(7) { top: 49.9999750815%; left: 5.0000051215%; -webkit-animation-delay: -1.875s; animation-delay: -1.875s; } .n-cases .more-click .la-ball-spin > div:nth-child(8) { top: 18.179464974%; left: 18.1803700518%; -webkit-animation-delay: -2s; animation-delay: -2s; } .n-cases .more-click span { display: inline-block; } .n-cases .more-click.cur span { padding-left: 40px; } .n-cases .more-click.cur .la-ball-spin { display: block; } .n-team .list1 { padding: 2rem 0; background: #f9f9f9; } .n-team .list1 .text .tit1 { line-height: 1.2; font-family: "fon1"; } .n-team .list1 .text .tit2 { line-height: 1.2; } .n-team .list1 .text .tit3 { margin-top: .75rem; width: 650px; } .n-team .list1 .text .tit4 { margin-top: .75rem; width: 100%; } .n-team .list2 { background: -webkit-linear-gradient(top, #fff, #f2f6f8); background: linear-gradient(to bottom, #fff, #f2f6f8); } .n-team .list2 .ulbox { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: stretch; -webkit-justify-content: stretch; -ms-flex-pack: stretch; justify-content: stretch; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .n-team .list2 .li-box { width: 50%; padding: 3rem 3rem 0 2.5rem; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .n-team .list2 .li-box .img { width: 9rem; } .n-team .list2 .li-box .text { width: calc(100% - 10rem); } .n-team .list2 .li-box .text .tit1 { margin-bottom: 15px; } .n-team .list2 .li-box .text .tit2 { margin-bottom: .5rem; } .n-team .list2 .li-box .text .tit3 { margin-bottom: .35rem; font-size: 15px; color: #666; line-height: 28px; height: 84px; max-height: 8rem; overflow: hidden; } .n-team .list2 .li-box .more { display: inline-block; cursor: pointer; color: #ff4700; font-family: "fon1"; border-bottom: 1px solid #ff4700; text-transform: uppercase; } .n-team .list2 .li-box .more:hover { letter-spacing: 1px; } .n-team .list2 .li-box.active { padding: 3rem 1.5rem 0 2.5rem; background: #004060; } .n-team .list2 .li-box.active .tit1, .n-team .list2 .li-box.active .tit2, .n-team .list2 .li-box.active .tit3 { color: #fff; } .n-team .list2 .li-box.active .tit3 { opacity: .6; height: 100%; } .n-team .list2 .li-box.active .more { opacity: 0; -webkit-transform: translate(0, 30px); -ms-transform: translate(0, 30px); transform: translate(0, 30px); } .n-team .list3 { padding: 0 0 2.5rem; } .n-team .list3 .ul { position: relative; padding: 50px 0 0; } .n-team .list3 .ul .bg { position: absolute; width: 100%; z-index: 1; left: 0; top: 0; background: -webkit-linear-gradient(top, #fff, #f2f6f8); background: linear-gradient(to bottom, #fff, #f2f6f8); height: calc(100% - 130px); } .n-team .list3 .ul .n-ul { position: relative; z-index: 2; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .n-team .list3 .ul .li { width: 33.3%; cursor: pointer; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .n-team .list3 .ul .img { width: 100%; height: 11.75rem; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row nowrap; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; background: transparent; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .n-team .list3 .ul .img img { max-width: 100%; max-height: 100%; } .n-team .list3 .ul .text { height: 130px; background: #fff; padding: 15px 15px; } .n-team .list3 .ul .text .tit2 { margin-top: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .n-team .list3 .ul .text img { width: 1.25rem; display: inline-block; margin-top: 15px; opacity: 0; -webkit-transform: translate(0, 10px); -ms-transform: translate(0, 10px); transform: translate(0, 10px); -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .n-team .list3 .ul .li:hover { position: relative; z-index: 2; box-shadow: 0px 0px 50px 5px rgba(0, 0, 0, 0.24); } .n-team .list3 .ul .li:hover .img { background: -webkit-linear-gradient(top, #fff, #f2f6f8); background: linear-gradient(to bottom, #fff, #f2f6f8); } .n-team .list3 .ul .li:hover .text img { opacity: 1; -webkit-transform: translate(0, 0px); -ms-transform: translate(0, 0px); transform: translate(0, 0px); } .n-team .list3 .more-click { width: 200px; height: 52px; line-height: 52px; display: inline-block; background: #ff4700; margin-top: 1.5rem; cursor: pointer; } .n-team .list3 .more-click .la-ball-spin { width: 24px; height: 24px; position: absolute; left: 0; top: 0; bottom: 0; margin: auto; display: none; } .n-team .list3 .more-click .la-ball-spin > div { width: 6px; height: 6px; margin-top: -3px; margin-left: -3px; } .n-team .list3 .more-click .la-ball-spin > div { position: absolute; top: 50%; left: 50%; border-radius: 100%; -webkit-animation: ball-spin 1s infinite ease-in-out; animation: ball-spin 1s infinite ease-in-out; } .n-team .list3 .more-click .la-ball-spin > div { display: inline-block; float: none; background-color: #fff; border: 0 solid #fff; } .n-team .list3 .more-click .la-ball-spin > div:nth-child(1) { top: 5%; left: 50%; -webkit-animation-delay: -1.125s; animation-delay: -1.125s; } .n-team .list3 .more-click .la-ball-spin > div:nth-child(2) { top: 18.1801948466%; left: 81.8198051534%; -webkit-animation-delay: -1.25s; animation-delay: -1.25s; } .n-team .list3 .more-click .la-ball-spin > div:nth-child(3) { top: 50%; left: 95%; -webkit-animation-delay: -1.375s; animation-delay: -1.375s; } .n-team .list3 .more-click .la-ball-spin > div:nth-child(4) { top: 81.8198051534%; left: 81.8198051534%; -webkit-animation-delay: -1.5s; animation-delay: -1.5s; } .n-team .list3 .more-click .la-ball-spin > div:nth-child(5) { top: 94.9999999966%; left: 50.0000000005%; -webkit-animation-delay: -1.625s; animation-delay: -1.625s; } .n-team .list3 .more-click .la-ball-spin > div:nth-child(6) { top: 81.8198046966%; left: 18.1801949248%; -webkit-animation-delay: -1.75s; animation-delay: -1.75s; } .n-team .list3 .more-click .la-ball-spin > div:nth-child(7) { top: 49.9999750815%; left: 5.0000051215%; -webkit-animation-delay: -1.875s; animation-delay: -1.875s; } .n-team .list3 .more-click .la-ball-spin > div:nth-child(8) { top: 18.179464974%; left: 18.1803700518%; -webkit-animation-delay: -2s; animation-delay: -2s; } .n-team .list3 .more-click span { display: inline-block; } .n-team .list3 .more-click.cur span { padding-left: 40px; } .n-team .list3 .more-click.cur .la-ball-spin { display: block; } .n-about .list1 { position: relative; background: #fff; z-index: 1; padding: 0.8rem 0 1.5rem 0; } .n-about .list1 .tit1 { padding-bottom: .65rem; margin-bottom: .6rem; position: relative; } .n-about .list1 .tit1:before { content: ""; position: absolute; bottom: 0; left: 0; width: 1.25rem; height: 5px; background: #ff4700; } .n-about .list1 .content-box { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .n-about .list1 .text { font-size: 15px; line-height: 1.8; color: #666; width: calc(100% - 14.75rem - 1.75rem); } .n-about .list1 .text img { max-width: 100%; } .n-about .list1 .ulbox { width: 14.75rem; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: space-between; -ms-flex-pack: start; justify-content: space-between; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; } .n-about .list1 .ulbox .li { width: 32%; margin-bottom: 2%; /*margin-right: 2%;*/ display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .n-about .list1 .ulbox .li:nth-child(1){ width:64%; } .n-about .list1 .ulbox .li .img { margin-bottom: 10px; } .n-about .list1 .ulbox .li p { color: #474747; font-size: .5rem; font-weight: bold; } .n-about .list1 .ulbox .li:nth-child(3n) { margin-right: 0; } .n-about .list1 .ulbox .li2 { padding: .65rem .5rem; border: 1px solid #ddd; font-size: .7rem; font-weight: bold; color: #ff6000; } .n-about .list1 .ulbox .li1 { -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .n-about .list1 .ulbox .li1 .tit2 { line-height: 1.1; margin-bottom: 12px; } .n-about .list1 .ulbox .li1 .tit3 { font-family: "Arial"; line-height: 1.1; text-transform: uppercase; } .n-about .list1 .ulbox .li1 .j-box { width: 25px; height: 25px; text-align: center; background: #ff4700; border-radius: 50%; line-height: 25px; font-size: 12px; color: #fff; margin-top: .4rem; } .n-about .list2 { background-repeat: no-repeat; background-position: center center; background-size: cover; background-attachment: fixed; padding: 2.8rem 0 2.5rem; } .n-about .list2 .tit1 { font-weight: bold; padding-bottom: .65rem; margin-bottom: 1.5rem; position: relative; text-align: center; display: block; } .n-about .list2 .tit1:before { content: ""; position: absolute; bottom: 0; left: 50%; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); width: 1.25rem; height: 5px; background: #fff; } .n-about .list2 .ulbox { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .n-about .list2 .ulbox .li { height: 350px; width: 25%; padding: 1rem .75rem; /*display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center;*/ display:block; text-align:center; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .n-about .list2 .ulbox .li .img { width: 3rem; text-align: center; height: 2.5rem; line-height: 2.5rem; border-bottom:1px solid rgba(255, 255, 255, 0.2); display:block; margin:0 auto 1rem; } .n-about .list2 .ulbox .li .tit2 { margin-bottom: .5rem; line-height: 1.2; } .n-about .list2 .ulbox .li .tit3 { font-size: 15px; line-height: 1.6; } .n-about .list2 .ulbox .li:hover { background: #ff4700; transform:translate(0px,-10px); } .n-about .list3 { padding: 2rem 0; position: relative; z-index: 1; background: #fff; } .n-about .list3 .tit1 { padding-bottom: .65rem; margin-bottom: 1.5rem; position: relative; text-align: center; display: block; } .n-about .list3 .tit1:before { content: ""; position: absolute; bottom: 0; left: 50%; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); width: 1.25rem; height: 5px; background: #ff4700; } .n-about .list3 .ulbox { overflow: hidden; position: relative; padding-bottom: 1.65rem; } .n-about .list3 .ulbox .swiper-slide { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; } .n-about .list3 .ulbox .li { width: 23%; margin-right: 2.6%; margin-bottom: 2.6%; text-align: center; } .n-about .list3 .ulbox .li:nth-child(4n) { margin-right: 0; } .n-about .list3 .ulbox .img { margin-bottom: 13px; position: relative; } .n-about .list3 .ulbox .img .big-img { width: 40px; height: 40px; line-height: 40px; text-align: center; background: #004060; position: absolute; right: 0; bottom: 0; font-size: 16px; color: #fff; cursor: pointer; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .n-about .list3 .ulbox p { padding: 0 .75rem; font-size: 15px; color: #333; } .n-about .list3 .ulbox .li:hover .big-img { background: #ff4700; } .n-about .list3 .ulbox .swiper-pagination span { width: 8px; height: 8px; margin: 0 7px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .n-about .list3 .ulbox .swiper-pagination-bullet-active { background: #ff4700; -webkit-transform: scale(1.5, 1.5); -ms-transform: scale(1.5, 1.5); transform: scale(1.5, 1.5); } .n-about .list4 { background-repeat: no-repeat; background-position: center center; background-size: cover; background-attachment: fixed; height: 18rem; padding-top: 2rem } .n-about .list4 .tit1 { padding-bottom: .65rem; font-weight: bold; margin-bottom: 1.5rem; position: relative; text-align: center; display: block; } .n-about .list4 .tit1:before { content: ""; position: absolute; bottom: 0; left: 50%; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); width: 1.25rem; height: 5px; background: #fff; } .n-about .list4 .text { padding-bottom: 1rem; width: 930px; margin: 0 auto; font-size: 17px; } .n-about .list4 .text img { max-width: 100%; } .n-about .list4 .imgbox { margin:0 auto; width: 12.75rem; position: relative; } .n-about .list4 .imgbox img { max-width: 100%; } .n-about .list4 .imgbox .li { width: 310px; height: 185px; text-align: center; padding-top: 130px; color: #fff; line-height: 1.5; background: url(../images/gaoxinicon.png) rgba(0, 0, 0, 0.3) no-repeat center 1rem; } .n-about .list4 .imgbox .li1 { position: absolute; top: 1rem; left: -260px; } .n-about .list4 .imgbox .li2 { position: absolute; top: 1rem; left: 50%; margin-left: -155px; } .n-about .list4 .imgbox .li3 { position: absolute; top: 1rem; right: -260px; } .n-about .list5 { padding: 2.5rem 0 5rem; background-repeat: no-repeat; background-position: center center; background-size: cover; background-attachment: fixed; } .n-about .list5 .tit1 { padding-bottom: .65rem; margin-bottom: 1.5rem; position: relative; text-align: center; display: block; } .n-about .list5 .tit1:before { content: ""; position: absolute; bottom: 0; left: 50%; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); width: 1.25rem; height: 5px; background: #ff4700; } .n-about .list5 .ulbox { position: relative; width: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row nowrap; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; padding-left: 4.5rem; } .n-about .list5 .ulbox .mCSB_container { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row nowrap; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .n-about .list5 .ulbox:before { content: ""; position: absolute; width: 100%; height: 1px; background: #d4d4d4; left: 0; top: 50%; margin-top: -.5px; } .n-about .list5 .ulbox .li { position: relative; width: 320px; } .n-about .list5 .ulbox .nli { width: 100%; padding: 1rem 30px; background: #fff; box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.1); position: relative; z-index: 2; } .n-about .list5 .ulbox .nli .tit2 { font-family: "fon1"; line-height: 1.2; } .n-about .list5 .ulbox .nli .tit-16 { margin-top: 5px; line-height: 32px; height: 64px; overflow: hidden; } .n-about .list5 .ulbox .li1 { padding-bottom: 50px; } .n-about .list5 .ulbox .li1 .bot { position: absolute; z-index: 1; text-align: center; left: 50%; bottom: -50px; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } .n-about .list5 .ulbox .li1 .bot .line { width: 1px; height: 40px; background: #ccc; display: inline-block; } .n-about .list5 .ulbox .li1 .bot .quan { width: 33px; height: 33px; display: block; margin: 0 auto; background: url(../images/img18.png) no-repeat center; background-size: 33px auto; } .n-about .list5 .ulbox .li1 .bot .year { color: #333; font-family: "fon1"; margin-top: 10px; font-weight: bold; line-height: 1.2; } .n-about .list5 .ulbox .li2 { margin-left: 7.5rem; padding-top: 50px; } .n-about .list5 .ulbox .li2 .bot { position: absolute; z-index: 1; text-align: center; left: 50%; top: -50px; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } .n-about .list5 .ulbox .li2 .bot .line { width: 1px; height: 40px; background: #ccc; display: inline-block; } .n-about .list5 .ulbox .li2 .bot .quan { width: 33px; height: 33px; display: block; margin: 0 auto; background: url(../images/img18.png) no-repeat center; background-size: 33px auto; } .n-about .list5 .ulbox .li2 .bot .year { color: #333; font-family: "fon1"; margin-bottom: 10px; font-weight: bold; line-height: 1.2; } .n-about .list5 .ulbox .nli:hover { background: #004060; } .n-about .list5 .ulbox .nli:hover .tit2, .n-about .list5 .ulbox .nli:hover .tit3 { color: #fff; } .n-about .list5 .mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal { bottom: -3rem; } .n-about .list5 .mCSB_scrollTools.mCSB_scrollTools_horizontal { width: 550px; left: 50%; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } .n-about .list5 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail { background: url(../images/img20.png) no-repeat center; } .n-about .list5 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { width: 55px; height: 55px; left: 0; top: 50%; margin: 0 auto; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); background-color: transparent !important; background: url(../images/img19.png) no-repeat center; } @-webkit-keyframes imgdown { 0%{ opacity:0 } 50%{ opacity:.5; } 100% { opacity:1; } } @keyframes imgdown { 0%{ opacity:0 } 50%{ opacity:.5; } 100% { opacity:1; } } @-webkit-keyframes ball-spin { 0%, 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 20% { opacity: 1; } 80% { opacity: 0; -webkit-transform: scale(0); transform: scale(0); } } @keyframes ball-spin { 0%, 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 20% { opacity: 1; } 80% { opacity: 0; -webkit-transform: scale(0); transform: scale(0); } } @-webkit-keyframes imgloader { 0% { -webkit-transform: scale(0.5); transform: scale(0.5); opacity: 0; } 50% { opacity: 1; } 100% { -webkit-transform: scale(1.2); transform: scale(1.2); opacity: 0; } } @keyframes imgloader { 0% { -webkit-transform: scale(0.5); transform: scale(0.5); opacity: 0; } 50% { opacity: 1; } 100% { -webkit-transform: scale(1.2); transform: scale(1.2); opacity: 0; } } .col-1 { color: #ff4700; } .maTop-75 { margin-top: .75rem; } .recruit-alert .md-content { width: 100%; height: auto; border-radius: 0; background: transparent; } .recruit-alert .md-close { position: absolute; width: 40px; height: 40px; font-size: 20px; background: #ff4700; color: #fff; right: .25rem; top: .25rem; cursor: pointer; line-height: 40px; text-align: center; } .recruit-alert { position: fixed; top: 50%; left: 50%; width: 50%; width: 1200px; min-width: 320px; padding: 2.75rem 2rem 1rem; z-index: 99; background: #fff; visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } .recruit-alert.md-show { opacity: 1; visibility: visible; } .recruit-alert .tit1 { margin-bottom: 1rem; } .recruit-alert .libox { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; padding: .5rem 0; border-top: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; margin-bottom: 1rem; } .recruit-alert .libox .sp { width: 20%; } .recruit-alert .libox .sp:last-child { text-align: right; } .recruit-alert .content { height: 9.5rem; padding-bottom: 1rem; border-bottom: 1px solid #e1e1e1; } .recruit-alert .content .tit2 { margin-bottom: .5rem; } .recruit-alert .content .p-14 { margin-bottom: 1rem; } .recruit-alert .n-content { height: 100%; } .recruit-alert .bot { margin-top: 1rem; } .recruit-alert .bot:hover a { color: #ff4700; letter-spacing: 1px; } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #ff4700 !important; } .recruit-alert.md-show ~ .fot-overlay { opacity: 1; visibility: visible; } .recruit-alert.md-show ~ .md-close { opacity: 1; visibility: visible; } .fot-overlay { position: fixed; width: 100%; height: 100%; visibility: hidden; top: 0; left: 0; z-index: 98; opacity: 0; background: rgba(0, 0, 0, 0.5); -webkit-transition: all 0.3s; transition: all 0.3s; } .video-alert .md-content { width: 100%; height: auto; padding: 5px; background: #000; } .video-alert .md-close { position: absolute; width: 40px; height: 40px; font-size: 24px; color: #fff; background: #000; right: 0rem; top: 0rem; cursor: pointer; line-height: 40px; text-align: center; z-index: 6; -webkit-transition: all 0s ease-in-out; transition: all 0s ease-in-out; } .video-alert .md-close:hover { background: #ff4700; } .video-alert { position: fixed; top: 50%; left: 50%; width: 50%; max-width: 1000px; min-width: 320px; height: auto; z-index: 2000; visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } .video-alert .video { width: 100%; height: auto; } .video-alert.md-show ~ .fot-overlay { opacity: 1; visibility: visible; } .video-alert.md-show ~ .md-close { opacity: 1; visibility: visible; } .video-alert.md-show { visibility: visible; } .cases-alert .md-content { width: 100%; height: auto; background: #fff; padding: 1.5rem .75rem; box-shadow: 0px 0px 30px 5px rgba(115, 66, 255, 0.4) /*background:transparent;*/ } .cases-alert .md-content .img { width: 100%; padding-bottom: 1.2rem; margin-bottom: 1.25rem; border-bottom: 1px solid #e1e1e1; } .cases-alert .md-content .img img { max-width: 100%; } .cases-alert .md-content .tit1 { margin-bottom: .6rem; } .cases-alert .md-content .p-16 { margin-bottom: 1.25rem; } .cases-alert .md-content a { padding-left: 40px; background: url(../images/img9.png) no-repeat left center; line-height: 40px; display: inline-block; background-size: 28px auto; } .cases-alert .md-close { position: absolute; width: 40px; height: 40px; font-size: 24px; color: #fff; background: #c8c8c8; right: 0rem; top: 0rem; cursor: pointer; line-height: 40px; text-align: center; z-index: 6; -webkit-transition: all 0s ease-in-out; transition: all 0s ease-in-out; } .cases-alert .md-close:hover { background: #ff4700; } .cases-alert { position: fixed; top: 50%; left: 50%; width: 50%; width: 380px; /*background:#fff;*/ height: auto; z-index: 2000; visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } .cases-alert.md-show ~ .fot-overlay { opacity: 1; visibility: visible; } .cases-alert.md-show ~ .md-close { opacity: 1; visibility: visible; } .cases-alert.md-show { visibility: visible; } .team-alert { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; } .team-alert .bot { width: 100%; background: #fff; height: 80px; bottom: 0; left:0; position: absolute; } .team-alert .bot .swiper-button-prev, .team-alert .bot .swiper-button-next { background: none; left: 50%; width: 40px; height: 40px; margin-top: -20px; color: #ccc; font-size: 32px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .team-alert .bot .swiper-button-prev:hover, .team-alert .bot .swiper-button-next:hover { color: #ff4700; } .team-alert .bot .swiper-button-next { right: auto; margin-left: 130px; } .team-alert .bot .swiper-button-prev { margin-left: -170px; } .team-alert .bot .swiper-button-prev:before { display: block; -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); } .team-alert .bot .colse-two { width: 40px; height: 40px; line-height: 40px; text-align: center; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; cursor: pointer; } .team-alert .md-content { background: transparent; } .team-alert.md-show.md-effect-3 .md-content{ transition: all 0.6s; } .team-alert .md-content .swiper-slide { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .team-alert .md-content .swiper-slide .img { width: 16rem; } .team-alert .md-content .swiper-slide .img img { max-height: 100%; max-width:100%; width: 100%; } .team-alert .md-content .swiper-slide .content-right { padding-top: 1.75rem; width: calc(100% - 16rem - 1rem); } .team-alert .md-content .swiper-slide .content-right .tit1 { margin-bottom: 10px; } .team-alert .md-content .swiper-slide .content-right .tit2 { font-family: "Arial"; text-transform: uppercase; color: #dedede; line-height: 1.2; margin-bottom: .75rem; } .team-alert .md-content .swiper-slide .content-right .li-box { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding-bottom: .75rem; margin-bottom: .75rem; border-bottom: 1px solid #ccc; } .team-alert .md-content .swiper-slide .content-right .li-box .li { width: 50%; padding-right: 5%; font-size:14px; display: inline-block; } .team-alert .md-content .swiper-slide .content-right .li-box .li img { margin-right: 5px; } .team-alert .md-content .swiper-slide .content-right .p-16 { font-size: 15px; height: 6.75rem; } .team-alert .md-close { position: absolute; width: 40px; height: 40px; font-size: 24px; color: #fff; background: #000; right: 0rem; top: 0rem; cursor: pointer; line-height: 40px; text-align: center; z-index: 6; -webkit-transition: all 0s ease-in-out; transition: all 0s ease-in-out; } .team-alert .md-close:hover { background: #ff4700; } .team-alert { position: fixed; top: 50%; left: 50%; width: 100%; background: #f0f4f7; padding: 1.75rem .75rem 80px; height: 100vh; z-index: 2000; visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } .team-alert2.md-show ~ .fot-overlay { opacity: 1; visibility: visible; } .team-alert2.md-show ~ .md-close { opacity: 1; visibility: visible; } .team-alert2.md-show { visibility: visible; } .team-alert3.md-show ~ .fot-overlay { opacity: 1; visibility: visible; } .team-alert3.md-show ~ .md-close { opacity: 1; visibility: visible; } .team-alert3.md-show { visibility: visible; } @-webkit-keyframes icon1 { 0% { -webkit-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); opacity: 1; } 50% { -webkit-transform: scale(1, 1); transform: scale(1, 1); opacity: 0; } 100% { -webkit-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); opacity: 1; } } @keyframes icon1 { 0% { -webkit-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); opacity: 1; } 50% { -webkit-transform: scale(1, 1); transform: scale(1, 1); opacity: 0; } 100% { -webkit-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); opacity: 1; } } @-webkit-keyframes toRightFromRight { 79% { -webkit-transform: translate(-102%); transform: translate(-102%); } 80% { -webkit-transform: translate(102%); transform: translate(102%); } 81% { opacity: 1; } } @keyframes toRightFromRight { 79% { -webkit-transform: translate(-102%); transform: translate(-102%); } 80% { -webkit-transform: translate(102%); transform: translate(102%); } 81% { opacity: 1; } } @-webkit-keyframes toRightFromLeft { 0%,100% { -webkit-transform: rotate(180deg); transform: rotate(180deg); } 79% { -webkit-transform: rotate(180deg) translate(-102%); transform: rotate(180deg) translate(-102%); } 80% { -webkit-transform: rotate(180deg) translate(110%); transform: rotate(180deg) translate(110%); } 81% { opacity: 1; } } @keyframes toRightFromLeft { 0%,100% { -webkit-transform: rotate(180deg); transform: rotate(180deg); } 79% { -webkit-transform: rotate(180deg) translate(-102%); transform: rotate(180deg) translate(-102%); } 80% { -webkit-transform: rotate(180deg) translate(110%); transform: rotate(180deg) translate(110%); } 81% { opacity: 1; } } @-webkit-keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 45% { -webkit-transform: scale3d(1.4, 1.4, 1.4); transform: scale3d(1.4, 1.4, 1.4); } to { -webkit-transform: scale3d(1.15, 1.15, 1.15); transform: scale3d(1.15, 1.15, 1.15); } } @keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 45% { -webkit-transform: scale3d(1.4, 1.4, 1.4); transform: scale3d(1.4, 1.4, 1.4); } to { -webkit-transform: scale3d(1.15, 1.15, 1.15); transform: scale3d(1.15, 1.15, 1.15); } } .backtop-1 { position: fixed; bottom: 80px; right: 3%; background-color: rgba(0, 0, 0, 0.5); cursor: pointer; height: 46px; padding: 0; margin: 0; width: 46px; border-radius: 50%; z-index: 9; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); -webkit-transform: scale(0, 0); -ms-transform: scale(0, 0); transform: scale(0, 0); opacity: 1; -webkit-transform: translate(0, 50px); -ms-transform: translate(0, 50px); transform: translate(0, 50px); -webkit-transition: all 0.7s cubic-bezier(0.23, 1, 0.32, 1); transition: all 0.7s cubic-bezier(0.23, 1, 0.32, 1); } .backtop-1:before { height: 46px; line-height: 46px; width: 46px; position: relative; display: block; text-align: center; top: 0%; font-size: 16px; color: #fff; -webkit-animation: start-backtop-1 2s infinite ease-in-out; animation: start-backtop-1 2s infinite ease-in-out; } .backtop-1.active { -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); opacity: 1; } @-webkit-keyframes start-backtop-1 { 0%, 30% { opacity: 0; -webkit-transform: translate(0, 5px); transform: translate(0, 5px); } 40% { opacity: 1; -webkit-transform: translate(0px, -6px); transform: translate(0px, -6px); } 100% { opacity: 0; -webkit-transform: translate(0px, -8px); transform: translate(0px, -8px); } } @keyframes start-backtop-1 { 0%, 30% { opacity: 0; -webkit-transform: translate(0, 5px); transform: translate(0, 5px); } 40% { opacity: 1; -webkit-transform: translate(0px, -6px); transform: translate(0px, -6px); } 100% { opacity: 0; -webkit-transform: translate(0px, -8px); transform: translate(0px, -8px); } } .js-m { opacity: 0; -webkit-transform: translate(0, 50px); -ms-transform: translate(0, 50px); transform: translate(0, 50px); -webkit-transition: .5s ease-in-out; transition: .5s ease-in-out; } .js-m.words-js span { opacity: 0; -webkit-transform: translate(0, 30px); -ms-transform: translate(0, 30px); transform: translate(0, 30px); -webkit-transition: .5s ease-in-out; transition: .5s ease-in-out; } .js-m.words-js.animate span { opacity: 1; -webkit-transform: translate(0, 0px); -ms-transform: translate(0, 0px); transform: translate(0, 0px); } .js-m.words-js2:before{ width:0 !important; opacity:0; transition: all .5s ease-in-out; } .js-m.words-js2.animate:before{ width:2rem !important; opacity:1; } .words-js span { display: inline-block; } .js-m.words-js2 { opacity: 1; -webkit-transform: translate(0, 0px); -ms-transform: translate(0, 0px); transform: translate(0, 0px); } .js-m.words-js2 span { opacity: 0; /*letter-spacing:1em;*/ -webkit-transform: translate(100px, 0px); -ms-transform: translate(100px, 0px); transform: translate(100px, 0px); -webkit-transition: 0.8s cubic-bezier(0.32, 0.6, 0.4, 1.21); transition: 0.8s cubic-bezier(0.32, 0.6, 0.4, 1.21); } .js-m.words-js2.animate span { opacity: 1; /*letter-spacing:0;*/ -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); } .words-js2 span { display: inline-block; } .js-m.animate-left { opacity: 0; -webkit-transform: translate(-60px, 0px); -ms-transform: translate(-60px, 0px); transform: translate(-60px, 0px); -webkit-transition: .8s ease-in-out; transition: .8s ease-in-out; } .js-m.animate-right100 { opacity: 0; -webkit-transform: translate(100px, 0px); -ms-transform: translate(100px, 0px); transform: translate(100px, 0px); -webkit-transition: .5s ease-in-out; transition: .5s ease-in-out; } .js-m.animate-right50 { opacity: 0; -webkit-transform: translate(50px, 0px); -ms-transform: translate(50px, 0px); transform: translate(50px, 0px); -webkit-transition: opacity 0.8s cubic-bezier(0.32, 0.6, 0.4, 1.21), -webkit-transform 0.8s cubic-bezier(0.32, 0.6, 0.4, 1.21); transition: opacity 0.8s cubic-bezier(0.32, 0.6, 0.4, 1.21), transform 0.8s cubic-bezier(0.32, 0.6, 0.4, 1.21); } .js-m.animate-right2 { opacity: 0; -webkit-transform: translate(80px, 0px); -ms-transform: translate(80px, 0px); transform: translate(80px, 0px); -webkit-transition: opacity 1.2s cubic-bezier(0.32, 0.6, 0.4, 1.21), -webkit-transform 1.2s cubic-bezier(0.32, 0.6, 0.4, 1.21); transition: opacity 1.2s cubic-bezier(0.32, 0.6, 0.4, 1.21), transform 1.2s cubic-bezier(0.32, 0.6, 0.4, 1.21); } .js-m.animate-top { opacity: 0; -webkit-transform: translate(0, 50px); -ms-transform: translate(0, 50px); transform: translate(0, 50px); -webkit-transition: .6s ease-in-out; transition: .6s ease-in-out; } .js-m.animate-bottom { opacity: 0; -webkit-transform: translate(0, -1.5rem); -ms-transform: translate(0, -1.5rem); transform: translate(0, -1.5rem); -webkit-transition: 0.8s cubic-bezier(0.32, 0.6, 0.4, 1.21); transition: 0.8s cubic-bezier(0.32, 0.6, 0.4, 1.21); } .js-m.animate { opacity: 1; -webkit-transform: translate(0, 0px); -ms-transform: translate(0, 0px); transform: translate(0, 0px); } .delay1 { -webkit-transition-delay: .1s !important; transition-delay: .1s !important; } .delay2 { -webkit-transition-delay: .2s !important; transition-delay: .2s !important; } .delay3 { -webkit-transition-delay: .3s !important; transition-delay: .3s !important; } .delay4 { -webkit-transition-delay: .4s !important; transition-delay: .4s !important; } .delay0 { -webkit-transition-delay: 0s !important; transition-delay: 0s !important; } .delay01 { -webkit-transition-delay: .01s; transition-delay: .01s; } .delay02 { -webkit-transition-delay: .02s; transition-delay: .02s; } .delay03 { -webkit-transition-delay: .03s; transition-delay: .03s; } .delay04 { -webkit-transition-delay: .04s; transition-delay: .04s; } .delay05 { -webkit-transition-delay: .05s; transition-delay: .05s; } .delay06 { -webkit-transition-delay: .06s; transition-delay: .06s; } .delay07 { -webkit-transition-delay: .07s; transition-delay: .07s; } .delay08 { -webkit-transition-delay: .08s; transition-delay: .08s; } .n-banner .sub-nav .li-item-two span { padding-right: 0; } .n-banner .sub-nav .li-item-two span:before { display: none; } .n-banner .item-sub .li.cur { color: #999; } .n-banner .item-sub .li.cur:hover { background: transparent; color: #999; } .n-banner .item-sub .li.cur:hover:before { display: none; } .n-about .list1 .ulbox .li{ cursor: default; } .n-about .list2 .w-ulbox{ overflow-x:auto; } .n-about .list2 .ulbox{ min-width:1000px; } .n-about .list4 .imgbox .li{ font-size:15px; } .n-team .list2 .li-box{ -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .n-team .list2 .li-box:nth-child(1){ padding: 3rem 1rem 0 4.5rem; } .n-team .list2 .li-box:nth-child(2){ padding: 3rem 4.5rem 0 1rem; } .n-team .list2 .li-box.active{ padding: 3rem 3rem 0 2.5rem; } #index-container .swiper-slide3 .imgbox{ position:absolute; left:0; top:0; height:100%; width:100%; z-index:3; } #index-container .swiper-slide3 .img{ position: absolute; left:0; top:0; height:100%; width:100%; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; opacity:.2; z-index:1; transition: all .8s cubic-bezier(0.79, 0.09, 0.37, 0.38); } #index-container .swiper-slide3 .img.active{ opacity:1; z-index:3; } .team-alert .md-content{ /*-webkit-transition: all .5s cubic-bezier(0.75, 0.18, 0.29, 0.94); -o-transition: all .5s cubic-bezier(0.75, 0.18, 0.29, 0.94); transition: all .5s cubic-bezier(0.75, 0.18, 0.29, 0.94);*/ } #index-container .swiper-wrapper{ transition-timing-function:cubic-bezier(0.28, 0.29, 0.5, 1.01); } #index-container .swiper-slide4 .news-list .ulbox .li .text .time{ display:flex; flex-flow:row wrap; justify-content:space-between; align-items:flex-start; } #index-container .swiper-slide4 .news-list .ulbox .li .text .time .news-logo{ display:flex; flex-flow:row wrap; justify-content:center; align-items:flex-start; font-weight:normal; } #index-container .swiper-slide4 .news-list .ulbox .li .text .time .news-logo img{ width: 24px; height: 24px; margin-right:5px; } .n-about .list2 .ulbox .li:hover{ box-shadow:0px 0px 35px 2px rgba(0,0,0,.1); } .n-about .list4 .imgbox .li{ transition: all .5s ease-in-out; } .n-about .list4 .imgbox .li:hover{ background: url(../images/gaoxinicon.png) #ff4700 no-repeat center 1rem; box-shadow:0px 0px 25px 1px rgba(0,0,0,.1); transform:translate(0, -5px); } .n-cases .ulbox .li:hover{ transform:translate(0, -5px); box-shadow:0px 0px 25px 1px rgba(0,0,0,.1); } .n-about .list5 .ulbox .nli .bg{ position:absolute; z-index:1; width:100%; height:100%; left:0; top:0; background-size:cover; background-position:50% 50%; background-repeat:no-repeat; opacity:0; transition: all .3s ease-in-out; } .n-about .list5 .ulbox .nli .bg2{ position:absolute; z-index:2; width:100%; height:100%; left:0; top:0; background:rgba(0,0,0,.3); opacity:0; transition: all .3s ease-in-out; } .n-about .list5 .ulbox .nli .tit2{ position:relative; z-index:3; } .n-about .list5 .ulbox .nli .tit3{ position:relative; z-index:3; } .n-about .list5 .ulbox .nli:hover .bg,.n-about .list5 .ulbox .nli:hover .bg2{ opacity:1; } .team-alert3 .md-content .swiper-slide .img{ width:12rem; } #index-container .img-box .li{ position:relative; } #index-container .img-box .bg{ position:absolute; z-index:2; width:100%; height:100%; left:0; top:0; background:rgba(0,0,0,.3); opacity:0; transition: all .3s ease-in-out; } #index-container .img-box .li:hover .bg{ opacity:1; } .nsub-nav-two .swiper-button-prev,.nsub-nav-two .swiper-button-next{ background:none !important; font-size:18px; line-height:44px; text-align:center; width:18px; } .nsub-nav-two .swiper-button-prev{ left:0; } .nsub-nav-two .swiper-button-next{ right:0; } .nsub-nav-two .swiper-button-prev:before{ transform:rotate(180deg); display:block; } @media (max-width: 1023px){ .search-alert .cent-form{ height:1.65rem !important; width:80% !important; left:3% !important; margin-top:-.5rem !important; } .search-alert{ height:60px !important; } .search-alert .cent-form .sub-butn{ font-size:.65rem !important; } .search-alert .cent-form .tex{ padding:0 2.5rem 0 1.5rem !important; font-size:.7rem !important; } } .news-text .video{ width:80%; margin:0 auto 1.5rem; } .news-text .video video{ width:100%; } .news-text .video iframe{ width:100% !important; max-width:800px; height:446px; } @media (max-width: 1480px){ #index-container .swiper-slide4 .content-list{ margin-top:3.5rem; } } @media (max-width: 1024px){ #index-container .swiper-slide4 .content-list{ margin-top:0rem; } } .recruit-alert .content .p-14 ul,.recruit-alert .content .p-14 ol{ padding: 0 30px; } .team-alert .md-content .swiper-slide .content-right .p-16 ul,.team-alert .md-content .swiper-slide .content-right .p-16 ul{ padding: 0 30px; } .n-about .list4 .text .li4{ width: 320px; text-align: left; padding: .5rem; color: #fff; line-height: 1.5; background: rgba(0, 0, 0, 0.3); margin:0 auto; transition: all .3s ease-in-out; margin-top:1.5rem; } .n-about .list4 .text .li4:hover{ background: #ff4700; box-shadow: 0px 0px 25px 1px rgba(0,0,0,.1); transform: translate(0, -5px); } @media (max-width: 1024px){ .n-banner .bot{ font-size:16px; } } @media (max-width: 767px){ .news-text .video{ width:100%; } .news-text .video iframe{ width: 100% !important; max-width: 800px; height: 300px; } } /*# sourceMappingURL=style.css.map */