@charset "UTF-8"; .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .simple-form-basic, .simple-text, .simple-textarea, .simple-select { border: 1px solid #ccc; padding: 4px; vertical-align: middle; } .simple-form-basic:focus, .simple-text:focus, .simple-textarea:focus, .simple-select:focus { outline: 0 none; } .simple-text { height: 18px; -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; transition: border linear 0.2s, box-shadow linear 0.2s; box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); } .simple-text:focus { border-color: rgba(82, 168, 236, 0.8); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6); } .simple-textarea { height: 18px; -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; transition: border linear 0.2s, box-shadow linear 0.2s; box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); height: 80px; width: 500px; vertical-align: top; } .simple-textarea:focus { border-color: rgba(82, 168, 236, 0.8); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6); } .simple-select { *margin-top: 5px; *margin-bottom: 5px; *vertical-align: top; } .reset-radio-checkbox { margin: 0 5px 0 0; padding: 0; font-size: 13px; *width: 13px; *height: 13px; } /** * 1. Set default font family to sans-serif. * 2. Prevent iOS text size adjust after orientation change, without disabling * user zoom. * 0. sassCore's style */ html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ overflow-y: scroll; /* 0 */ -webkit-overflow-scrolling: touch /* 0 */ } /** * 1. Remove default margin * 0. sassCore's style. */ body { margin: 0; /* 1 */ font-size: 12px; /* 0 */ line-height: 2; /* 0 */ color: #333; /* 0 */ background-color: #fff /* 0 */ } /* HTML5 display definitions ========================================================================== */ /** * Correct `block` display not defined for any HTML5 element in IE 8/9. * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. * Correct `block` display not defined for `main` in IE 11. */ article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } /** * 1. Correct `inline-block` display not defined in IE 8/9. * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. * 3. Correct `inline-block` display in IE 6/7. */ audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ *display: inline; /* 3 */ *zoom: 1 /* 3 */ } /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /** * Address `[hidden]` styling not present in IE 8/9/10. * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. */ [hidden], template { display: none; } /* Links ========================================================================== */ /** * 1. Remove the gray background color from active links in IE 10. * 2. Improve readability when focused and also mouse hovered in all browsers. * 0. sassCore's style. */ a { background: transparent; /* 1 */ /* 0 */ text-decoration: none; } a:active, a:hover { outline: 0 /* 2 */ } /* a:hover { color: #006699; } */ /* Text-level semantics ========================================================================== */ /** * Address styling not present in IE 8/9/10/11, Safari, and Chrome. */ abbr[title] { border-bottom: 1px dotted; } /** * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */ b, strong { font-weight: bold; } /** * Address styling not present in Safari and Chrome. */ dfn { font-style: italic; } /** * Address styling not present in IE 8/9. */ mark { background: #ff0; color: #000; } /** * Address inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* Embedded content ========================================================================== */ /** * 1. Remove border when inside `a` element in IE 8/9/10. * 2. Improve image quality when scaled in IE 7. * 0. sassCore's style. */ img { border: 0; /* 1 */ vertical-align: middle; /* 0 */ -ms-interpolation-mode: bicubic /* 2 */ } /** * Correct overflow not hidden in IE 9/10/11. */ svg:not(:root) { overflow: hidden; } /* Grouping content ========================================================================== */ /** * Address differences between Firefox and other browsers. */ hr { 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: "Source Han Sans CN", "Noto Sans S Chinese Light", "Microsoft Yahei", "Microsoft YaHei Light", "Pingfang sc regular", "Helvetica Neue", Helvetica, Tahoma, sans-serif; } h1, h2, h3, h4, h5, h6, p, figure, form, blockquote { margin: 0; } ul, ol, li, dl, dd { margin: 0; padding: 0; } ul, ol { list-style: none outside none; } h1, h2, h3 { line-height: 2; font-weight: normal; } h1 { font-size: 18px; } h2 { font-size: 15.6px; } h3 { font-size: 14.04px; } h4 { font-size: 12px; } h5, h6 { font-size: 10.2px; text-transform: uppercase; } input:-moz-placeholder, textarea:-moz-placeholder { color: #999; } input::-moz-placeholder, textarea::-moz-placeholder { color: #999; } input:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #999; } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #999; } html { overflow: hidden; overflow-y: scroll; } button, input, textarea, select { border: none; border-radius: 0; outline: none; padding: 0; } * { box-sizing: border-box; -webkit-font-smoothing: antialiased; } img { /*display: block;*/ max-width: 100%; } .clear { clear: both; } .f-cb { zoom: 1; } .f-cb:after { display: block; height: 0; clear: both; visibility: hidden; overflow: hidden; content: "."; } .fl { float: left; } .fr { float: right; } .por { position: relative; } .poa { position: absolute; } .pof { position: fixed; } .poa-f { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .ovh { overflow: hidden; } .noselect { -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; } .dn { display: none; } .w-f { width: 100%; } .h-f { height: 100%; } .loader { width: 50px; height: 50px; position: fixed; top: 50%; left: 50%; margin: -25px 0 0 -25px; font-size: 10px; border-top: 2px solid rgba(0, 0, 0, 0.08); border-right: 2px solid rgba(0, 0, 0, 0.08); border-bottom: 2px solid rgba(0, 0, 0, 0.08); border-left: 2px solid rgba(0, 0, 0, 0.5); border-radius: 50%; -webkit-animation: spinner 700ms infinite linear; animation: spinner 700ms infinite linear; } .loader.white { border-top: 2px solid rgba(255, 255, 255, 0.08); border-right: 2px solid rgba(255, 255, 255, 0.08); border-bottom: 2px solid rgba(255, 255, 255, 0.08); border-left: 2px solid rgba(255, 255, 255, 0.5); } @-webkit-keyframes spinner { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes spinner { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /*鎵嬫満涓奱閾炬帴鏈夐粦鑹查€忔槑搴曟€庝箞鍘绘帀 缁檃鍔犺繖涓牱寮?/ a { -webkit-tap-highlight-color: rgba(255, 0, 0, 0); } select, input { outline: none; } /*ie 鍘绘帀鑷甫鍏抽棴*/ input::-ms-clear { display: none; } /*缃戠珯鍗曚綅璁剧疆*/ @media only screen and (min-width: 360px) { html { font-size: 26px !important; } } @media only screen and (min-width: 435px) { html { font-size: 30px !important; } } /*@media only screen and(min-width: 500px) { html { font-size: 36px!important } }*/ @media (min-width: 769px) { html { font-size: 34px !important; } } @media only screen and (min-width: 1024px) { html { font-size: 28px !important; } } @media only screen and (min-width: 1200px) { html { font-size: 30px !important; } } @media only screen and (min-width: 1440px) { html { font-size: 34px !important; } } @media only screen and (min-width: 1680px) { html { font-size: 40px !important; } } ::-moz-selection { background: #0DA9CD; color: #fff; } ::selection { background: #0DA9CD; color: #fff; } ::-webkit-scrollbar { width: 5px; height: 5px; } ::-webkit-scrollbar-track { background: rgba(0, 0, 0, 0.1); } ::-webkit-scrollbar-thumb { background: #0DA9CD; } ::-webkit-scrollbar-thumb:window-inactive { background: #0DA9CD; } ::-webkit-scrollbar-thumb:vertical:hover { background: #0da9cd; } /*==甯哥敤棰滆壊==*/ .col-fff { color: #fff; } .col-000 { color: #000; } .col-111 { color: #111; } .col-222 { color: #222; } .col-333 { color: #333; } .col-444 { color: #444; } .col-555 { color: #555; } .col-666 { color: #666; } .col-777 { color: #666; } .col-888 { color: #666; } .col-999 { color: #999; } /*==甯哥敤瀛楀彿==*/ .tit-12 { font-size: 12px; line-height: 2; } .tit-13 { font-size: 13px; line-height: 2; } .tit-14 { font-size: 14px; line-height: 2; } .tit-15 { font-size: 15px; line-height: 2; } .tit-16 { line-height: 1.8; font-size: 16px; } .tit-17 { line-height: 1.8; font-size: 17px; } .tit-18 { line-height: 1.8; font-size: 18px; } .tit-19 { line-height: 1.8; font-size: 19px; } .tit-20 { line-height: 1.8; font-size: 20px; } .tit-21 { line-height: 1.8; font-size: 21px; } .tit-22 { line-height: 1.8; font-size: 22px; } .tit-23 { line-height: 1.8; font-size: 23px; } .tit-24 { line-height: 1.8; font-size: 24px; } .tit-25 { line-height: 1.8; font-size: 25px; } .tit-26 { line-height: 1.8; font-size: 26px; } .tit-27 { line-height: 1.8; font-size: 27px; } .tit-28 { line-height: 1.8; font-size: 28px; } .tit-29 { line-height: 1.8; font-size: 29px; } .tit-30 { line-height: 1.8; font-size: 30px; } .tit-31 { line-height: 1.8; font-size: 31px; } .tit-32 { line-height: 1.8; font-size: 32px; } .tit-33 { line-height: 1.8; font-size: 33px; } .tit-34 { line-height: 1.8; font-size: 34px; } .tit-35 { line-height: 1.8; font-size: 35px; } .tit-36 { line-height: 1.8; font-size: 36px; } .tit-37 { line-height: 1.8; font-size: 37px; } .tit-38 { line-height: 1.8; font-size: 38px; } .tit-39 { line-height: 1.8; font-size: 39px; } .tit-40 { line-height: 1.8; font-size: 40px; } .tit-41 { line-height: 1.8; font-size: 41px; } .tit-42 { line-height: 1.8; font-size: 42px; } .tit-43 { line-height: 1.8; font-size: 43px; } .tit-44 { line-height: 1.8; font-size: 44px; } .tit-45 { line-height: 1.8; font-size: 45px; } .tit-46 { line-height: 1.8; font-size: 46px; } .tit-47 { line-height: 1.8; font-size: 47px; } .tit-48 { line-height: 1.8; font-size: 48px; } .tit-49 { line-height: 1.8; font-size: 49px; } .tit-50 { line-height: 1.8; font-size: 50px; } .tit-51 { line-height: 1.8; font-size: 51px; } .tit-52 { line-height: 1.8; font-size: 52px; } .tit-53 { line-height: 1.8; font-size: 53px; } .tit-54 { line-height: 1.8; font-size: 54px; } .tit-55 { line-height: 1.8; font-size: 55px; } .tit-56 { line-height: 1.8; font-size: 56px; } .tit-57 { line-height: 1.8; font-size: 57px; } .tit-58 { line-height: 1.8; font-size: 58px; } .tit-59 { line-height: 1.8; font-size: 59px; } .tit-60 { line-height: 1.8; font-size: 60px; } .tit-61 { line-height: 1.8; font-size: 61px; } .tit-62 { line-height: 1.8; font-size: 62px; } .tit-63 { line-height: 1.8; font-size: 63px; } .tit-64 { line-height: 1.8; font-size: 64px; } .tit-65 { line-height: 1.8; font-size: 65px; } .tit-66 { line-height: 1.8; font-size: 66px; } .tit-67 { line-height: 1.8; font-size: 67px; } .tit-68 { line-height: 1.8; font-size: 68px; } .tit-69 { line-height: 1.8; font-size: 69px; } .tit-70 { line-height: 1.8; font-size: 70px; } .tit-71 { line-height: 1.8; font-size: 71px; } .tit-72 { line-height: 1.8; font-size: 72px; } .tit-73 { line-height: 1.8; font-size: 73px; } .tit-74 { line-height: 1.8; font-size: 74px; } .tit-75 { line-height: 1.8; font-size: 75px; } .tit-76 { line-height: 1.8; font-size: 76px; } .tit-77 { line-height: 1.8; font-size: 77px; } .tit-78 { line-height: 1.8; font-size: 78px; } .tit-79 { line-height: 1.8; font-size: 79px; } .tit-80 { line-height: 1.8; font-size: 80px; } @media (max-width: 1681px) { /*==甯哥敤瀛楀彿==*/ .tit-12 { font-size: 12px; } .tit-13 { font-size: 13px; } .tit-14 { font-size: 13px; } .tit-15 { font-size: 14px; } .tit-16 { font-size: 15px; } .tit-17 { font-size: 16px; } .tit-18 { font-size: 17px; } .tit-19 { font-size: 18px; } .tit-20 { font-size: 18px; } .tit-21 { font-size: 19px; } .tit-22 { font-size: 20px; } .tit-23 { font-size: 21px; } .tit-24 { font-size: 22px; } .tit-25 { font-size: 23px; } .tit-26 { font-size: 24px; } .tit-27 { font-size: 25px; } .tit-28 { font-size: 26px; } .tit-29 { font-size: 27px; } .tit-30 { font-size: 27px; } .tit-31 { font-size: 28px; } .tit-32 { font-size: 29px; } .tit-33 { font-size: 30px; } .tit-34 { font-size: 31px; } .tit-35 { font-size: 32px; } .tit-36 { font-size: 33px; } .tit-37 { font-size: 34px; } .tit-38 { font-size: 35px; } .tit-39 { font-size: 36px; } .tit-40 { font-size: 37px; } .tit-42 { font-size: 38px; } .tit-43 { font-size: 39px; } .tit-44 { font-size: 40px; } .tit-45 { font-size: 41px; } .tit-46 { font-size: 42px; } .tit-47 { font-size: 43px; } .tit-48 { font-size: 44px; } .tit-50 { font-size: 45px; } .tit-51 { font-size: 46px; } .tit-52 { font-size: 47px; } .tit-53 { font-size: 48px; } .tit-54 { font-size: 49px; } .tit-55 { font-size: 50px; } .tit-56 { font-size: 51px; } .tit-57 { font-size: 52px; } .tit-58 { font-size: 53px; } .tit-59 { font-size: 54px; } .tit-60 { font-size: 54px; } .tit-61 { font-size: 55px; } .tit-62 { font-size: 56px; } .tit-63 { font-size: 57px; } .tit-64 { font-size: 58px; } .tit-65 { font-size: 59px; } .tit-66 { font-size: 60px; } .tit-67 { font-size: 61px; } .tit-68 { font-size: 62px; } .tit-69 { font-size: 63px; } .tit-70 { font-size: 62px; } .tit-71 { font-size: 63px; } .tit-72 { font-size: 64px; } .tit-73 { font-size: 65px; } .tit-74 { font-size: 66px; } .tit-75 { font-size: 67px; } .tit-76 { font-size: 68px; } .tit-77 { font-size: 69px; } .tit-78 { font-size: 70px; } .tit-79 { font-size: 71px; } .tit-80 { font-size: 72px; } } @media (max-width: 1481px) { /*==甯哥敤瀛楀彿==*/ .tit-13 { font-size: 12px; } .tit-14 { font-size: 12px; } .tit-15 { font-size: 13px; } .tit-16 { font-size: 14px; } .tit-17 { font-size: 15px; } .tit-18 { font-size: 16px; } .tit-19 { font-size: 17px; } .tit-20 { font-size: 18px; } .tit-20 { font-size: 16px; } .tit-21 { font-size: 17px; } .tit-22 { font-size: 18px; } .tit-23 { font-size: 19px; } .tit-24 { font-size: 20px; } .tit-25 { font-size: 21px; } .tit-26 { font-size: 22px; } .tit-27 { font-size: 23px; } .tit-28 { font-size: 24px; } .tit-29 { font-size: 25px; } .tit-30 { font-size: 26px; } .tit-31 { font-size: 25px; } .tit-32 { font-size: 26px; } .tit-33 { font-size: 27px; } .tit-34 { font-size: 28px; } .tit-35 { font-size: 29px; } .tit-36 { font-size: 30px; } .tit-37 { font-size: 31px; } .tit-38 { font-size: 32px; } .tit-39 { font-size: 33px; } .tit-40 { font-size: 34px; } .tit-41 { font-size: 35px; } .tit-42 { font-size: 36px; } .tit-43 { font-size: 37px; } .tit-44 { font-size: 38px; } .tit-45 { font-size: 37px; } .tit-46 { font-size: 38px; } .tit-47 { font-size: 39px; } .tit-48 { font-size: 40px; } .tit-49 { font-size: 41px; } .tit-50 { font-size: 42px; } .tit-51 { font-size: 43px; } .tit-52 { font-size: 44px; } .tit-53 { font-size: 45px; } .tit-54 { font-size: 46px; } .tit-55 { font-size: 47px; } .tit-56 { font-size: 48px; } .tit-57 { font-size: 49px; } .tit-58 { font-size: 50px; } .tit-59 { font-size: 51px; } .tit-60 { font-size: 52px; } .tit-61 { font-size: 51px; } .tit-62 { font-size: 52px; } .tit-63 { font-size: 53px; } .tit-64 { font-size: 54px; } .tit-65 { font-size: 55px; } .tit-66 { font-size: 56px; } .tit-67 { font-size: 57px; } .tit-68 { font-size: 58px; } .tit-69 { font-size: 59px; } .tit-70 { font-size: 60px; } .tit-71 { font-size: 55px; } .tit-72 { font-size: 56px; } .tit-73 { font-size: 57px; } .tit-74 { font-size: 58px; } .tit-75 { font-size: 59px; } .tit-76 { font-size: 60px; } .tit-77 { font-size: 61px; } .tit-78 { font-size: 62px; } .tit-79 { font-size: 63px; } .tit-80 { font-size: 64px; } } @media (max-width: 1281px) { /*==甯哥敤瀛楀彿==*/ .tit-13 { font-size: 12px; } .tit-14 { font-size: 12px; } .tit-15 { font-size: 12px; } .tit-16 { font-size: 13px; } .tit-17 { font-size: 16px; } .tit-18 { font-size: 15px; } .tit-19 { font-size: 16px; } .tit-20 { font-size: 17px; } .tit-22 { font-size: 18px; } .tit-24 { font-size: 19px; } .tit-25 { font-size: 20px; } .tit-26 { font-size: 21px; } .tit-27 { font-size: 22px; } .tit-28 { font-size: 23px; } .tit-29 { font-size: 24px; } .tit-30 { font-size: 25px; } .tit-31 { font-size: 26px; } .tit-32 { font-size: 27px; } .tit-33 { font-size: 24px; } .tit-34 { font-size: 25px; } .tit-35 { font-size: 26px; } .tit-36 { font-size: 27px; } .tit-37 { font-size: 28px; } .tit-38 { font-size: 29px; } .tit-39 { font-size: 30px; } .tit-40 { font-size: 31px; } .tit-41 { font-size: 32px; } .tit-42 { font-size: 33px; } .tit-43 { font-size: 34px; } .tit-44 { font-size: 35px; } .tit-45 { font-size: 36px; } .tit-46 { font-size: 37px; } .tit-47 { font-size: 38px; } .tit-48 { font-size: 39px; } .tit-49 { font-size: 40px; } .tit-50 { font-size: 38px; } .tit-51 { font-size: 39px; } .tit-52 { font-size: 40px; } .tit-53 { font-size: 41px; } .tit-54 { font-size: 42px; } .tit-55 { font-size: 43px; } .tit-56 { font-size: 44px; } .tit-57 { font-size: 45px; } .tit-58 { font-size: 46px; } .tit-59 { font-size: 47px; } .tit-60 { font-size: 48px; } .tit-61 { font-size: 49px; } .tit-62 { font-size: 50px; } .tit-63 { font-size: 51px; } .tit-64 { font-size: 52px; } .tit-65 { font-size: 53px; } .tit-66 { font-size: 54px; } .tit-67 { font-size: 55px; } .tit-68 { font-size: 56px; } .tit-69 { font-size: 57px; } .tit-70 { font-size: 58px; } .tit-71 { font-size: 51px; } .tit-72 { font-size: 52px; } .tit-73 { font-size: 53px; } .tit-74 { font-size: 54px; } .tit-75 { font-size: 55px; } .tit-76 { font-size: 56px; } .tit-77 { font-size: 57px; } .tit-78 { font-size: 58px; } .tit-79 { font-size: 59px; } .tit-80 { font-size: 60px; } } @media (max-width: 1024px) { .tit-24 { font-size: 16px; } .tit-25 { font-size: 17px; } .tit-26 { font-size: 18px; } .tit-27 { font-size: 19px; } .tit-28 { font-size: 20px; } .tit-29 { font-size: 21px; } .tit-30 { font-size: 22px; } .tit-31 { font-size: 23px; } .tit-32 { font-size: 24px; } .tit-33 { font-size: 21px; } .tit-34 { font-size: 22px; } .tit-35 { font-size: 23px; } .tit-36 { font-size: 24px; } .tit-37 { font-size: 25px; } .tit-38 { font-size: 26px; } .tit-39 { font-size: 27px; } .tit-40 { font-size: 28px; } .tit-41 { font-size: 29px; } .tit-42 { font-size: 30px; } .tit-43 { font-size: 31px; } .tit-44 { font-size: 32px; } .tit-45 { font-size: 33px; } .tit-46 { font-size: 34px; } .tit-47 { font-size: 35px; } .tit-48 { font-size: 36px; } .tit-49 { font-size: 37px; } .tit-50 { font-size: 34px; } .tit-51 { font-size: 35px; } .tit-52 { font-size: 36px; } .tit-53 { font-size: 37px; } .tit-54 { font-size: 38px; } .tit-55 { font-size: 39px; } .tit-56 { font-size: 40px; } .tit-57 { font-size: 41px; } .tit-58 { font-size: 42px; } .tit-59 { font-size: 43px; } .tit-60 { font-size: 44px; } .tit-61 { font-size: 45px; } .tit-62 { font-size: 46px; } .tit-63 { font-size: 47px; } .tit-64 { font-size: 48px; } .tit-65 { font-size: 49px; } .tit-66 { font-size: 50px; } .tit-67 { font-size: 51px; } .tit-68 { font-size: 52px; } .tit-69 { font-size: 53px; } .tit-70 { font-size: 54px; } .tit-71 { font-size: 47px; } .tit-72 { font-size: 48px; } .tit-73 { font-size: 49px; } .tit-74 { font-size: 50px; } .tit-75 { font-size: 51px; } .tit-76 { font-size: 52px; } .tit-77 { font-size: 53px; } .tit-78 { font-size: 54px; } .tit-79 { font-size: 55px; } .tit-80 { font-size: 56px; } } @media (max-width: 768px) { .tit-16 { font-size: 12px; } .tit-18 { font-size: 14px; } .tit-20 { font-size: 16px; } .tit-33 { font-size: 20px; } .tit-34 { font-size: 21px; } .tit-35 { font-size: 22px; } .tit-36 { font-size: 23px; } .tit-37 { font-size: 24px; } .tit-38 { font-size: 25px; } .tit-39 { font-size: 26px; } .tit-40 { font-size: 24px; } .tit-41 { font-size: 25px; } .tit-42 { font-size: 26px; } .tit-43 { font-size: 27px; } .tit-44 { font-size: 28px; } .tit-45 { font-size: 29px; } .tit-46 { font-size: 30px; } .tit-47 { font-size: 31px; } .tit-48 { font-size: 32px; } .tit-49 { font-size: 33px; } .tit-50 { font-size: 28px; } .tit-51 { font-size: 29px; } .tit-52 { font-size: 30px; } .tit-53 { font-size: 31px; } .tit-54 { font-size: 32px; } .tit-55 { font-size: 33px; } .tit-56 { font-size: 34px; } .tit-57 { font-size: 35px; } .tit-58 { font-size: 36px; } .tit-59 { font-size: 37px; } .tit-60 { font-size: 36px; } .tit-61 { font-size: 37px; } .tit-62 { font-size: 38px; } .tit-63 { font-size: 39px; } .tit-64 { font-size: 40px; } .tit-65 { font-size: 41px; } .tit-66 { font-size: 42px; } .tit-67 { font-size: 43px; } .tit-68 { font-size: 44px; } .tit-69 { font-size: 45px; } .tit-70 { font-size: 46px; } .tit-70 { font-size: 42px; } .tit-71 { font-size: 43px; } .tit-72 { font-size: 44px; } .tit-73 { font-size: 45px; } .tit-74 { font-size: 46px; } .tit-75 { font-size: 47px; } .tit-76 { font-size: 48px; } .tit-77 { font-size: 49px; } .tit-78 { font-size: 50px; } .tit-79 { font-size: 51px; } .tit-80 { font-size: 52px; } } /*姝f枃瀛楀彿*/ .conbox-14 { font-size: 14 px; line-height: 1.8; } .conbox-15 { font-size: 15 px; line-height: 1.8; } .conbox-16 { font-size: 16 px; line-height: 1.8; } .conbox-17 { font-size: 17 px; line-height: 1.8; } .conbox-18 { font-size: 18 px; line-height: 1.8; } .conbox-19 { font-size: 19 px; line-height: 1.8; } .conbox-20 { font-size: 20 px; line-height: 1.8; } .conbox-21 { font-size: 21 px; line-height: 1.8; } .conbox-22 { font-size: 22 px; line-height: 1.8; } .conbox-23 { font-size: 23 px; line-height: 1.8; } .conbox-24 { font-size: 24 px; line-height: 1.8; } @media (max-width: 1481px) { .conbox-18 { font-size: 16px; } .conbox-20 { font-size: 18px; } .conbox-24 { font-size: 20px; } } @media (max-width: 1281px) { .conbox-14 { font-size: 13px; } .conbox-16 { font-size: 14px; } .conbox-18 { font-size: 15px; } .conbox-20 { font-size: 15px; } .conbox-24 { font-size: 16px; } } /*寮规€х洅鏍峰紡*/ .f-no { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; } .f-no-b-center { 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; } .f-no-b-start { 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; } .f-no-b-stretch { 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: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; } .f-no-c-center { 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; } .f-no-c-start { 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: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .f-no-c-stretch { 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; } .f-no-s-center { 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; } .f-no-s-end { 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; } .f-no-s-stretch { 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; } .f-no-end-start { 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; } .f-no-col { 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; } .f-no-col-b-center { 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: 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; } .f-no-col-c-center { 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; } .f-no-col-s-center { 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; } .f-no-col-s-end { 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: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; } .f-no-col-c-start { 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; } .f-no-col-b-start { 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: 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; } .f-no-col-end-start { 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; } /*鍝嶅簲闅愯棌鏍峰紡*/ .pc-block { display: block; } .pc-block-768 { display: block; } .pc-block-767 { display: block; } .m-block { display: none; } .m-block-767 { display: none; } .m-block-768 { display: none; } @media (max-width: 1024px) { .pc-block { display: none; } .m-block { display: block; } } @media (max-width: 768px) { .pc-block-768 { display: none; } .m-block-768 { display: block; } } @media (max-width: 767px) { .pc-block-767 { display: none; } .m-block-767 { display: block; } } /*甯哥敤鏍峰紡绫诲悕*/ .poa-middle { left: 0; top: 0; bottom: 0; right: 0; margin: auto; } .tran-middle { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .text-hide { word-break: keep-all; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .img-cover { background-size: cover; background-position: center center; background-repeat: no-repeat; } .pointer { cursor: pointer; } .bgtop { background-position: top; } .containbg { background-repeat: no-repeat; background-size: contain; background-position: center; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } .text-justif { text-align: justify; } .text-nowrap { white-space: nowrap; } .text-lowercase { text-transform: lowercase; } .text-uppercase { text-transform: uppercase; } .text-capitalize { text-transform: capitalize; } .text-bold { font-weight: bold; } .centerh { position: absolute; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .centerv { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .centerblock { margin-left: auto; margin-right: auto; } .shadow1 { box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.15); } .full { width: 100%; height: 100%; } .fullw { width: 100%; } .fullh { height: 100%; } .fullvh { height: 100vh; } .top { top: 0; } .btm { bottom: 0; } .lt { left: 0; } .rt { right: 0; } .block { display: block; } .inlineblock { display: inline-block; } .notrans { -webkit-transition-duration: 0s !important; transition-duration: 0s !important; } .no-hover { pointer-events: none !important; cursor: default; } .trans3d0 { -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .round { border-radius: 50%; } .mt0 { margin-top: 0; } .mb0 { margin-bottom: 0; } .in-block { display: inline-block; *display: inline; *zoom: 1; } /*缃戠珯涓讳綋鍖哄煙瀹藉害鏍峰紡*/ .w100 { width: 100%; } .w1720 { max-width: 1720px; width: 90%; margin: 0 auto; } .w1300 { width: 1300px; margin: 0 auto; } @media (max-width: 1350px) { .w1300 { width: 94%; } } .w1080 { width: 1080px; margin: 0 auto; } @media (max-width: 1100px) { .w1080 { width: 94%; } } .w1070 { width: 1070px; margin: 0 auto; } @media (max-width: 1100px) { .w1070 { width: 94%; } } /*鍒嗛〉鏍峰紡*/ .wpage { text-align: center; } .page { padding: 40px 0 0; font-size: 14px; font-weight: bold; line-height: 22px; text-align: center; clear: both; display: inline-block; } .page a { text-decoration: none; color: #d2d2d2; width: 38px; height: 38px; line-height: 38px; margin: 0 2px; background: #f0efef; display: block; float: left; -webkit-transition: 0.5s cubic-bezier(0.6, 0.2, 0.1, 1); transition: 0.5s cubic-bezier(0.6, 0.2, 0.1, 1); } .page a.active { background: #0053A6; color: #fff; -webkit-transition: 0.5s cubic-bezier(0.6, 0.2, 0.1, 1); transition: 0.5s cubic-bezier(0.6, 0.2, 0.1, 1); } .page span.laypage_curr { width: 38px; height: 38px; line-height: 38px; margin: 0 2px; display: inline-block; background: #0053A6; color: #fff; -webkit-transition: 0.5s cubic-bezier(0.6, 0.2, 0.1, 1); transition: 0.5s cubic-bezier(0.6, 0.2, 0.1, 1); } .page a:hover { text-decoration: none; color: #fff; background: #0053A6; -webkit-transition: 0.5s cubic-bezier(0.6, 0.2, 0.1, 1); transition: 0.5s cubic-bezier(0.6, 0.2, 0.1, 1); } /*鍒嗛〉鏍峰紡end*/ @media (max-width: 767px) { .wrap { padding: 30px; } } .wrap-sm { padding: 30px; } @media (max-width: 767px) { .wrap-sm { padding: 15px; } } .wrap-xs { padding: 20px; } @media (max-width: 767px) { .wrap-xs { padding: 10px; } } .p-v-xs { padding-top: 20px; padding-bottom: 20px; } @media (max-width: 767px) { .p-v-xs { padding-top: 10px; padding-bottom: 10px; } } .p-v-sm { padding-top: 30px; padding-bottom: 30px; } @media (max-width: 767px) { .p-v-sm { padding-top: 20px; padding-bottom: 20px; } } .p-v-md { padding-top: 60px; padding-bottom: 60px; } @media (max-width: 959px) { .p-v-md { padding-top: 40px; padding-bottom: 40px; } } @media (max-width: 767px) { .p-v-md { padding-top: 30px; padding-bottom: 30px; } } .p-v-lg { padding-top: 100px; padding-bottom: 100px; } @media (max-width: 959px) { .p-v-lg { padding-top: 70px; padding-bottom: 70px; } } @media (max-width: 767px) { .p-v-lg { padding-top: 50px; padding-bottom: 50px; } } .p-h-sm { padding-left: 30px; padding-right: 30px; } @media (max-width: 767px) { .p-h-sm { padding-left: 20px; padding-right: 20px; } } .pt0 { padding-top: 0; } .pb0 { padding-bottom: 0; } .m-v-lg { margin-top: 100px; margin-bottom: 100px; } @media (max-width: 959px) { .m-v-lg { margin-top: 70px; margin-bottom: 70px; } } @media (max-width: 767px) { .m-v-lg { margin-top: 50px; margin-bottom: 50px; } } .m-b-xxs { margin-bottom: 5px; } .m-b-xs { margin-bottom: 10px; } .m-b-sm { margin-bottom: 20px; } @media (max-width: 767px) { .m-b-sm { margin-bottom: 15px; } } .m-b-md { margin-bottom: 30px; } @media (max-width: 767px) { .m-b-md { margin-bottom: 20px; } } .m-b-lg { margin-bottom: 60px; } @media (max-width: 767px) { .m-b-lg { margin-bottom: 40px; } } .m-b-xl { margin-bottom: 100px; } @media (max-width: 959px) { .m-b-xl { margin-bottom: 70px; } } @media (max-width: 767px) { .m-b-xl { margin-bottom: 50px; } } .m-t-xxs { margin-top: 5px; } .m-t-xs { margin-top: 10px; } .m-t-sm { margin-top: 20px; } @media (max-width: 767px) { .m-t-sm { margin-top: 15px; } } .m-t-md { margin-top: 30px; } @media (max-width: 767px) { .m-t-md { margin-top: 20px; } } .m-t-lg { margin-top: 60px; } @media (max-width: 767px) { .m-t-lg { margin-top: 40px; } } .m-r-xxs { margin-right: 5px; } .m-r-xs { margin-right: 10px; } .m-r-sm { margin-right: 20px; } @media (max-width: 767px) { .m-r-sm { margin-right: 10px; } } .m-l-xxs { margin-left: 5px; } .m-l-xs { margin-left: 10px; } .m-l-sm { margin-left: 20px; } @media (max-width: 767px) { .m-l-sm { margin-left: 10px; } } @media (max-width: 767px) and (orientation: portrait) { .phone-v-fullw { width: 100%; } .phone-v-p0 { padding: 0; } } /*甯哥敤css3鍔ㄧ敾鏍峰紡*/ .trans { -webkit-transition: all .4s; transition: all 0.4s; } .trans2 { -webkit-transition: all 0.4s cubic-bezier(0.77, 0, 0.175, 1); transition: all 0.4s cubic-bezier(0.77, 0, 0.175, 1); } .trans-md { -webkit-transition: all .8s; transition: all 0.8s; } .trans-md2 { -webkit-transition: all 0.8s cubic-bezier(1, 0, 0, 1); transition: all 0.8s cubic-bezier(1, 0, 0, 1); } /*loadering鍔ㄧ敾鏍峰紡2*/ .anim-loader { -webkit-animation: loader 1829ms linear infinite, loader_dash 2156ms ease-in-out infinite; animation: loader 1829ms linear infinite, loader_dash 2156ms ease-in-out infinite; } .anim-fade-out { -webkit-animation: fade_out .5s ease forwards; animation: fade_out 0.5s ease forwards; } /*妯″潡鍔犺浇鐨刲oading-2*/ .ajax-loader { background: rgba(0, 0, 0, 0.2); visibility: hidden; opacity: 0; z-index: 1036; } .tt-ajax-loader .ajax-loader { visibility: visible; opacity: 1; } .tt-ajax-loader .ajax-loader .loader-icon .line { -webkit-animation: loader 1829ms linear infinite, loader_dash 2156ms ease-in-out infinite; animation: loader 1829ms linear infinite, loader_dash 2156ms ease-in-out infinite; } /*end*/ /*鍏ュ満鍔ㄧ敾鏍峰紡*/ .cssanimations .anim_emt, .cssanimations .anim_group .anim_item { visibility: hidden; } .cssanimations .anim_emt.visb, .cssanimations .anim_group .anim_item.visb { visibility: inherit; } .anim_emt.start { -webkit-animation-duration: .6s; animation-duration: .6s; -webkit-animation-timing-function: ease; animation-timing-function: ease; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .anim_emt.start.scale_up { -webkit-animation-name: mk_scale; animation-name: mk_scale; } .anim_emt.start.fade_in { -webkit-animation-name: mk_fade; animation-name: mk_fade; } .anim_emt.start.r_to_l { -webkit-animation-name: mk_right_to_left; animation-name: mk_right_to_left; } .anim_emt.start.l_to_r { -webkit-animation-name: mk_left_to_right; animation-name: mk_left_to_right; } .anim_emt.start.t_to_b { -webkit-animation-name: mk_top_to_bottom; animation-name: mk_top_to_bottom; } .anim_emt.start.b_to_t { -webkit-animation-name: mk_bottom_to_top; animation-name: mk_bottom_to_top; } .slide_anim { visibility: hidden; } .slide_anim.start { visibility: visible; } .slide_anim.b_to_t.start { -webkit-animation: mk_bottom_to_top .6s; animation: mk_bottom_to_top 0.6s; } .anim_emt.palx_img.start { overflow: hidden; -webkit-animation-name: tt_palx_wrap; animation-name: tt_palx_wrap; } .anim_emt.palx_img.start .img-wrap { -webkit-animation: tt_palx_img .6s; animation: tt_palx_img 0.6s; } @-webkit-keyframes tt_palx_wrap { 0% { -webkit-transform: translateY(30px); transform: translateY(30px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes tt_palx_wrap { 0% { -webkit-transform: translateY(30px); transform: translateY(30px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @-webkit-keyframes tt_palx_img { 0% { -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes tt_palx_img { 0% { -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @-webkit-keyframes loader { to { -webkit-transform: rotate3d(0, 0, 1, 360deg); transform: rotate3d(0, 0, 1, 360deg); } } @keyframes loader { to { -webkit-transform: rotate3d(0, 0, 1, 360deg); transform: rotate3d(0, 0, 1, 360deg); } } @-webkit-keyframes loader_dash { from { stroke-dasharray: 0 150; stroke-dashoffset: 0; } to { stroke-dasharray: 100 150; stroke-dashoffset: -140; } } @keyframes loader_dash { from { stroke-dasharray: 0 150; stroke-dashoffset: 0; } to { stroke-dasharray: 100 150; stroke-dashoffset: -140; } } @-webkit-keyframes line_w100 { to { left: 100%; } } @keyframes line_w100 { to { left: 100%; } } @-webkit-keyframes rotate_360 { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes rotate_360 { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes fade_out { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fade_out { 0% { opacity: 1; } 100% { opacity: 0; } } @-webkit-keyframes fade_in { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fade_in { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes fade_out_in { 0%, 100% { opacity: 1; } 50% { opacity: 0; } } @keyframes fade_out_in { 0%, 100% { opacity: 1; } 50% { opacity: 0; } } @-webkit-keyframes mk_scale { 0% { -webkit-transform: scale(0.5); transform: scale(0.5); opacity: 0; } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } } @keyframes mk_scale { 0% { -webkit-transform: scale(0.5); transform: scale(0.5); opacity: 0; } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } } @-webkit-keyframes mk_fade { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes mk_fade { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes mk_left_to_right { 0% { -webkit-transform: translateX(-30px); transform: translateX(-30px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @keyframes mk_left_to_right { 0% { -webkit-transform: translateX(-30px); transform: translateX(-30px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @-webkit-keyframes mk_right_to_left { 0% { -webkit-transform: translateX(30px); transform: translateX(30px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @keyframes mk_right_to_left { 0% { -webkit-transform: translateX(30px); transform: translateX(30px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @-webkit-keyframes mk_bottom_to_top { 0% { -webkit-transform: translateY(30px); transform: translateY(30px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes mk_bottom_to_top { 0% { -webkit-transform: translateY(30px); transform: translateY(30px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @-webkit-keyframes mk_top_to_bottom { 0% { -webkit-transform: translateY(-30px); transform: translateY(-30px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes mk_top_to_bottom { 0% { -webkit-transform: translateY(-30px); transform: translateY(-30px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @-webkit-keyframes mk_spt { 0% { -webkit-transform: translateY(10%); transform: translateY(10%); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes mk_spt { 0% { -webkit-transform: translateY(10%); transform: translateY(10%); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } .js-m { opacity: 0; -webkit-transform: translate(0, 30px); -ms-transform: translate(0, 30px); transform: translate(0, 30px); -webkit-transition: all 0.8s cubic-bezier(0.79, -0.27, 0.21, 0.82); transition: all 0.8s cubic-bezier(0.79, -0.27, 0.21, 0.82); } .js-m.animate { opacity: 1; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .js-m-2-1 { opacity: 0; -webkit-transform: translate(0, 30px); -ms-transform: translate(0, 30px); transform: translate(0, 30px); -webkit-transition: all 0.8s cubic-bezier(0.79, -0.27, 0.21, 0.82); transition: all 0.8s cubic-bezier(0.79, -0.27, 0.21, 0.82); } .js-m-2-1.animate { opacity: 1; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .a-del1 { -webkit-animation-delay: 0.1s; animation-delay: 0.1s; } .a-del2 { -webkit-animation-delay: 0.2s; animation-delay: 0.2s; } .a-del3 { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; } .a-del4 { -webkit-animation-delay: 0.4s; animation-delay: 0.4s; } .a-del5 { -webkit-animation-delay: 0.5s; animation-delay: 0.5s; } .a-del6 { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; } .a-del7 { -webkit-animation-delay: 0.7s; animation-delay: 0.7s; } .a-del8 { -webkit-animation-delay: 0.8s; animation-delay: 0.8s; } .a-del9 { -webkit-animation-delay: 0.9s; animation-delay: 0.9s; } .a-del10 { -webkit-animation-delay: 1s; animation-delay: 1s; } .a-dur1 { -webkit-animation-duration: 0.3s; animation-duration: 0.3s; } .a-dur2 { -webkit-animation-duration: 0.4s; animation-duration: 0.4s; } .a-dur3 { -webkit-animation-duration: 0.5s; animation-duration: 0.5s; } .a-dur4 { -webkit-animation-duration: 0.6s; animation-duration: 0.6s; } .a-dur5 { -webkit-animation-duration: 0.7s; animation-duration: 0.7s; } .a-dur6 { -webkit-animation-duration: 0.8s; animation-duration: 0.8s; } .a-dur7 { -webkit-animation-duration: 0.9s; animation-duration: 0.9s; } .a-dur8 { -webkit-animation-duration: 1s; animation-duration: 1s; } .a-dur9 { -webkit-animation-duration: 1.1s; animation-duration: 1.1s; } .a-dur10 { -webkit-animation-duration: 1.2s; animation-duration: 1.2s; } .a-dur11 { -webkit-animation-duration: 1.3s; animation-duration: 1.3s; } .a-dur12 { -webkit-animation-duration: 1.4s; animation-duration: 1.4s; } .a-dur13 { -webkit-animation-duration: 1.5s; animation-duration: 1.5s; } .a-dur14 { -webkit-animation-duration: 1.6s; animation-duration: 1.6s; } .a-dur15 { -webkit-animation-duration: 1.7s; animation-duration: 1.7s; } .a-dur16 { -webkit-animation-duration: 1.8s; animation-duration: 1.8s; } .a-dur17 { -webkit-animation-duration: 1.9s; animation-duration: 1.9s; } .a-dur18 { -webkit-animation-duration: 2s; animation-duration: 2s; } .t-del1 { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; } .t-del2 { -webkit-transition-delay: 0.2s; transition-delay: 0.2s; } .t-del3 { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; } .t-del4 { -webkit-transition-delay: 0.4s; transition-delay: 0.4s; } .t-del5 { -webkit-transition-delay: 0.5s; transition-delay: 0.5s; } .t-del6 { -webkit-transition-delay: 0.6s; transition-delay: 0.6s; } .t-del7 { -webkit-transition-delay: 0.7s; transition-delay: 0.7s; } .t-del8 { -webkit-transition-delay: 0.8s; transition-delay: 0.8s; } .t-del9 { -webkit-transition-delay: 0.9s; transition-delay: 0.9s; } .t-del10 { -webkit-transition-delay: 1s; transition-delay: 1s; } /*ie10浠ヤ笅鏄剧ず*/ .browsers { position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: #fff url(../../img/iebgimg.png); background-repeat: no-repeat; background-position: 50% 50%; z-index: 99; } .line-1 { line-height: 1.1; } .line-2 { line-height: 1.2; } .line-3 { line-height: 1.3; } .line-4 { line-height: 1.4; } .line-5 { line-height: 1.5; } .line-6 { line-height: 1.6; } .line-7 { line-height: 1.7; } .line-8 { line-height: 1.8; } .line-9 { line-height: 1.9; } .line-10 { line-height: 2; } .line-11 { line-height: 2.1; } .line-12 { line-height: 2.2; } /*姣涚幓鐠?/ .some-class-zxx { background-color: #fff; } @supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) { .some-class-zxx { background: rgba(255, 255, 255, 0.75); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); } } /*鏂囧瓧寮曠敤*/ /*@include font-face($font-family:'ad', $file-path:"../fonts/BEBAS", $weight: normal, $style: normal); @include simple-text($borderColorFocus:#000); @include simple-textarea($borderColorFocus:#52a8ec, $width:500px, $height:80px) @include simple-btn($formbtn:false, $bgColor: $primary, $textColor:$white); /*@include triangle(left, 10px, #000 )*/ /*@include triangle($direction, $size, $borderColor )*/ /*.conbox-16{ color:nth($infoColor,1); background:nth($infoColor,2); border:1px solid nth($infoColor,3); }*/ /*@include placeholder(#999);*/ /*margin-right: pe(16px);*/ /*@extend .in-block;*/ /*鍒濆鏍峰紡缁撴潫*/ /*棣栭〉鍔犺浇loading*/ body.loading { overflow: hidden; } #pageloader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #f5f3f0; overflow: hidden; z-index: 5000; } #pageloader .logo { width: auto; height: 51px; } .darkmode #pageloader { background: #252525; } body.init #pageloader { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); -webkit-transition: all 1.2s cubic-bezier(0.77, 0, 0.175, 1); transition: all 1.2s cubic-bezier(0.77, 0, 0.175, 1); } body.init #pageloader .cont { opacity: 0; -webkit-transition: all .6s; transition: all 0.6s; } body.init #pageloader .logo, body.init #pageloader div { -webkit-transition: all .6s; transition: all 0.6s; } body.init #pageloader .logo { -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } body.init #pageloader .small { -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } body.init #pageloader .loader-line { -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); } .loader-line { width: 50vw; max-width: 300px; height: 2px; background: #A96B41; overflow: hidden; } .loader-icon { width: 24px; height: 24px; border-radius: 50%; } .loader-icon .line { fill: none; stroke: #fff; stroke-width: 4px; stroke-linecap: round; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } /*.loader-line .gradient,.loader-line .gradient2 { width:40%; height:100%; left:-40%; background-image:-webkit-gradient(linear,left top,right top,color-stop(0,rgba(218,157,119,0)),color-stop(50%,#DA9D77),to(rgba(218,157,119,0))); background-image:-o-linear-gradient(left,rgba(218,157,119,0) 0,#DA9D77 50%,rgba(218,157,119,0) 100%); background-image:linear-gradient(to right,rgba(218,157,119,0) 0,#DA9D77 50%,rgba(218,157,119,0) 100%); -webkit-animation:line_w100 2s cubic-bezier(.165,.84,.44,1) infinite; animation:line_w100 2s cubic-bezier(.165,.84,.44,1) infinite } .loader-line .gradient2 { -webkit-animation-delay:1s; animation-delay:1s }*/ /*棣栭〉鍔犺浇loading-end*/ /*# sourceMappingURL=boc_reset.css.map */ .wr { width: 100%; position: relative; } .lh1 { line-height: 1; } .bg { width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; } header { width: 100%; position: fixed; top: 0; left: 0; z-index: 99; } .pc-header { width: 100%; height: 100px; display: flex; align-items: center; justify-content: space-between; padding: 0 1rem; transition: all 0.5s; } .pc-header .left-btn { display: flex; height: 100%; align-items: center; } .pc-header .left-btn .logo { width: 236px; position: relative; } .gupiaodm { margin-left: .575rem; padding-left: .575rem; line-height: 1; font-size: 14px; border-left: 2px solid rgba(255, 255, 255, 0.4); } .gupiaodm p:last-child { margin-top: 2px; font-family: Arial; letter-spacing: 2px; } .pc-header .right-btn { display: flex; height: 100%; align-items: center; } .pc-header .right-btn .numlist { display: flex; align-items: center; justify-content: flex-start; } .pc-header .right-btn .numlist .li { display: block; padding-left: .625rem; height: 100%; position: relative; cursor: pointer; margin-left: .625rem; } .pc-header .right-btn .numlist .li .op2 { right: 0; left: auto; } .pc-header .right-btn .numlist .li::after { width: 1px; height: 80%; content: ""; position: absolute; left: 0; top: 10%; background-color: rgba(255, 255, 255, 0.4); } .pc-header .right-btn .numlist .li a { color: #fff; font-size: 18px; font-family: Arial; line-height: 16px; } .pc-header .right-btn .numlist .li:last-child { border-right: 0; } .banner { height: 23.925rem; } .banner-container { width: 100%; height: 100%; overflow: hidden; position: relative; } .banner-container .swiper-slide { width: 100%; height: 100%; overflow: hidden; } .pc { display: block; } .mb { display: none; } .banner .swiper-slide, .banner .slide-inner { height: 100%; overflow: hidden; position: relative; } .banner-container .txt { position: absolute; top: 9.575rem; left: 4.6rem; } .banner-container .txt .t1 { font-weight: 600; line-height: 1.8rem; } .banner-container .txt .tit-18 { width: 12.25rem; margin-top: .7rem; font-size: 18px; font-weight: 400; color: #FFFFFF; line-height: .6rem; letter-spacing: 3px } .banner-container .txt .more { margin-top: 2.3rem } .more { display: flex; padding: 14px 20px; background-color: #ffffff; color: #0053A6; font-size: 0; font-family: SourceHanSansCN; font-weight: bold; align-items: center; transition: all 0.5s; background: linear-gradient(to right, #0da9cd 25%, #ffffff 75%); background-position: 100% 50%; background-size: 400% 300%; -webkit-transition: 1000ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: 1000ms cubic-bezier(0.165, 0.84, 0.44, 1); } .more .tit-16 { line-height: 1; display: inline-block; font-size: 15px; } .more .icon { display: inline-block; margin-left: 15px; transition: all 0.5s; } .imgspc { height: 100%; position: relative; object-fit: cover; } .pc-header .op1 { opacity: 1; } .pc-header .op2 { opacity: 0; position: absolute; top: 0; left: 0; } .pc-header .right-btn .nav { height: 100px; display: flex; align-items: center; justify-content: flex-start; } .pc-header .right-btn .nav .li { height: 100%; margin-right: 1.625rem; } .pc-header .right-btn .nav .li .tit a { display: block; height: 100%; text-align: center; line-height: 100px; color: #fff; } header .pc-header .right-btn .langbox { position: relative; margin-left: 0.5rem; } header .pc-header .right-btn .litip .img1 { width: 20px; height: 20px; margin-right: 5px; fill: #fff; } header .pc-header .right-btn .litip .icon { width: 20px; height: 20px; fill: #fff; } header .pc-header .right-btn .litip .x { margin-right: 14px; } header .pc-header .right-btn .litip .s { width: 7px; height: 7px; margin-left: 7px; } header .pc-header .right-btn .libox { padding: 8px 8px 0; /*background: #fff;*/ width: 100px; position: absolute; top: 20px; left: 50%; margin-left: -40px; opacity: 0; visibility: hidden; border-radius: 8px; transform: translate(0, -20px); } header .pc-header .right-btn .libox a { display: block; width: 84px; height: 20px; line-height: 20px; text-align: center; border-radius: 5px; /*background: #eee;*/ color: #999; transition: all .3s; margin-bottom: .25rem; } header .pc-header .right-btn .libox a:hover { color: #0053A6; /*background: #0053A6;*/ } header .pc-header .right-btn .langbox.hover .libox { transition: none; opacity: 1; visibility: visible; transform: translate(0, 0); } header .pc-header .right-btn .litip:hover { color: #fff; } header .pc-header .right-btn .landbtn { margin-left: .5rem; display: none; } header .pc-header .right-btn .landbtn.active { display: flex; } /* header .pc-header:hover .right-btn .litip { color: #111111; } header .pc-header:hover .right-btn .litip .img1 { fill: #111111; } header .pc-header:hover .right-btn .litip .icon { fill: #111111; } header .pc-header.soll .right-btn .litip { color: #111111; } header .pc-header.soll .right-btn .litip .img1 { fill: #111111; } header .pc-header.soll .right-btn .litip .icon { fill: #111111; } */ footer { background: #282828; position: relative; width: 100%; } footer .top { display: flex; } footer .top .left { width: 41%; height: 13.75rem; padding-top: 2rem; padding-left: 3rem; border-right: 1px solid rgba(230, 230, 230, .1); } footer .top .left .logo { display: block; width: 6.95rem; } footer .top .left .send { width: 11.5rem; height: 1.3rem; margin-top: 1.375rem; } footer .top .left .send form { display: flex; } footer .top .left .send .txt { width: calc(100% - 1.3rem); height: 1.3rem; background-color: rgba(245, 245, 245, .1); position: relative; } footer .top .left .send .txt input { width: 100%; height: 100%; background: transparent; color: #999999; font-size: 16px; padding-left: 1rem; position: relative; z-index: 3; } footer .top .left .send .txt .lab { width: 1.3rem; height: 1.3rem; position: absolute; left: 0; top: 0; } footer .top .left .send .submit { width: 1.3rem; height: 1.3rem; background: #0053A6; background-image: url(../img/send2.png); background-repeat: no-repeat; background-position: center; } footer .top .left .t1 { margin-top: 1rem; line-height: 1; color: #FFFFFF; opacity: 0.3; } footer .top .left .t3 { margin-top: .75rem; } footer .top .left .t2 { color: #FFFFFF; line-height: .45rem; margin-top: .15rem; opacity: 0.7; } footer .top .left .ewm { margin-top: .525rem; } footer .top .right { width: 59%; height: 13.75rem; } footer .top .right .li { width: 100%; height: 50%; } footer .top .right .li:first-child { border-bottom: 1px solid rgba(230, 230, 230, .1); } footer .top .right .li .nav { display: flex; width: 100%; height: 100%; align-items: center; justify-content: flex-start; padding: 2rem 4rem; flex-wrap: wrap; padding-right: 0; } footer .top .right .li .nav a { display: block; font-weight: 400; color: #ffffff; line-height: 1; font-size: .6rem; margin-right: 3.6rem; opacity: 0.8; } footer .top .right .li .list { display: flex; width: 100%; height: 100%; align-items: center; justify-content: flex-start; padding: 2rem 4rem; flex-wrap: wrap; padding-right: 0; } footer .top .right .li .list .ls { width: 8.75rem; height: 3rem; display: flex; margin-right: 0.75rem; align-items: flex-start; flex-direction: column; justify-content: center; padding: 0 .475rem; } footer .top .right .li .list .ls .tit-27 { margin-top: 13px; line-height: 1; } .view { width: 100%; padding: 0 3rem; position: relative; } .home-a { padding: 3.75rem 0; padding-bottom: 2.25rem; } .main-tit { display: inline-block; font-size: .9rem; font-weight: bold; color: #000000; line-height: 1; background: linear-gradient(to right, #0053A6 0%, #00A3CA 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .main-t { font-size: 1.2rem; font-weight: bold; color: #222222; line-height: 1; margin-top: .55rem; } .home-a .left { width: 41%; float: left; } .home-a .left .con { width: 100%; margin-top: 2.325rem; height: 9rem; } .home-a .left .con .t1 { font-weight: bold; color: #222222; line-height: 1; } .home-a .left .con .t2 { font-family: SourceHanSansCN; font-weight: 400; color: #666666; line-height: .75rem; margin-top: .725rem; height: 2.25rem; overflow: hidden; } .home-a .left .con .list { width: 5.925rem; margin-top: .75rem; } .home-a .left .con .list .li { display: block; width: 100%; border-top: 1px solid rgba(0, 0, 0, 0.1); font-size: .4rem; line-height: 1; padding: 9px 0; color: #999999; position: relative; cursor: pointer; transition: all 0.5s; } .home-a .left .con .list .li:last-child { border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .home-a .left .con .list .li::after { content: ""; position: absolute; right: 0; top: 50%; width: 4px; height: 10px; transform: translateY(-50%); background-image: url(../img/jt2.png); background-repeat: no-repeat; background-size: 100% 100%; filter: grayscale(100%); opacity: 0.9; } .home-a .left .con .list .li:hover { color: #0DA9CD; } .home-a .left .con .list .li:hover::after { filter: grayscale(0); opacity: 1; } .home-a .left .con .list .li.on { color: #0DA9CD; } .home-a .left .con .list .li.on::after { filter: grayscale(0); opacity: 1; } .home-a .right { width: 59%; float: right; padding-left: 5.775rem; } .home-a .right .pimg { padding-top: 1.425rem; } .home-a .right .img2 { position: relative; margin-top: -1rem; margin-left: 1rem; margin-bottom: 1rem; opacity: 0; } .home-a .right .img1 { position: absolute; z-index: 2; top: 50%; left: 50%; transform: translate(-50%, -50%); } .home-a .right .list { display: flex; align-items: center; justify-content: space-between; padding: 0 1rem; margin-top: 1rem; } .homea-container { overflow: hidden; padding: 1.475rem 0; } .homea-container .swiper-slide { text-align: center; font-weight: 500; color: #999999; line-height: 1; font-size: .45rem; transition: all 0.5s; cursor: pointer; } .homea-container .swiper-slide.swiper-slide-active { color: #0DA9CD; transform: scale(1.3); position: relative; } .home-a .right .list .next, .home-a .right .list .prev { background-image: url(../img/hab3.png); width: 9px; height: 14px; cursor: pointer; filter: grayscale(100%); opacity: 0.9; } .home-a .right .list .next { background-image: url(../img/hab4.png); } .home-a .right .list .next:hover, .home-a .right .list .prev:hover { filter: grayscale(0); opacity: 1; } .homea-container .swiper-slide.swiper-slide-active::after { content: ""; width: 2px; height: .375rem; background: #0DA9CD; position: absolute; top: -0.6rem; left: 50%; transform: scale(0.8); } .more2 { background: linear-gradient(to right, #0da9cd 25%, #0053A6 75%); background-position: 100% 50%; background-size: 400% 300%; color: #fff; } .more2 .icon { filter: grayscale(100%) brightness(1000%) !important; } .home-a .left .more { margin-top: 1rem; } .scroll-animate.animated { visibility: hidden; } .home-b .homeb-container { margin-top: 1.65rem; } .home-b .homeb-container .swiper-slide { height: 13rem; width: 55.9%; position: relative; overflow: hidden; margin-top: 1rem; } .home-b .homeb-container .swiper-slide .txt { width: 100%; position: absolute; bottom: 0; left: 0; z-index: 2; opacity: 0; padding: 3rem 1.4rem 1rem; transition: all 0.5s; background-image: linear-gradient(transparent, rgba(0, 78, 162, .5)); } .home-b .homeb-container .swiper-slide .txt .t1 { display: block; } .home-b .homeb-container .swiper-slide .txt .t2 { display: flex; align-items: center; } .home-b .homeb-container .swiper-slide .txt .t2 .icon { font-size: 0; text-align: left; margin-left: 10px; } .home-b { background-color: #e9f3fb; padding: 2.5rem 0 3rem; } .home-b .homeb-container .swiper-slide .txt .t2 .icon .box { width: 13px; height: 7px; background: #fff; display: inline-block; margin-left: 1px; opacity: 0.7; -webkit-clip-path: polygon(0 0, 75% 0, 100% 100%, 25% 100%); clip-path: polygon(0 0, 75% 0, 100% 100%, 25% 100%); transition: all 0.5s; } .home-b .homeb-container .swiper-slide:hover .txt .t2 .icon .box:nth-child(2) { transition-delay: 0.5s; } .home-b .homeb-container .swiper-slide:hover .txt .t2 .icon .box:nth-child(3) { transition-delay: 1s; } .home-b .homeb-container .swiper-slide .bg { transition: all 0.5s; } .home-b .homeb-container .swiper-slide:hover .bg { transform: scale(1.02); } .home-b .homeb-container .swiper-slide:hover .txt .t2 .icon .box { opacity: 1; } .home-b .homeb-container .swiper-slide.swiper-slide-active { margin-top: 0; } .home-b .homeb-container .swiper-slide .mak { z-index: 3; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #000000; opacity: .3; } .home-b .homeb-container .swiper-slide.swiper-slide-active .mak { opacity: 0; } .home-b .homeb-container .swiper-slide .a { display: none; position: absolute; top: 0; left: 0; z-index: 4; width: 100%; height: 100%; } .home-b .homeb-container .swiper-slide.swiper-slide-active .a { display: block; } .home-b .homeb-container .next, .home-b .homeb-container .prev { width: 1.6rem; height: 1.6rem; background: #0053A6; border-radius: 50%; position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; background-image: url(../img/hbjt.png); background-position: center; background-repeat: no-repeat; cursor: pointer; transition: all 0.5s; } .home-b .homeb-container .next { right: .5rem; background-image: url(../img/hbjt2.png); } .home-b .homeb-container .prev { left: .5rem; } .home-b .homeb-container .next:hover, .home-b .homeb-container .prev:hover { background-color: #0DA9CD; } .home-b .homeb-container .swiper-slide.swiper-slide-active .txt { opacity: 1; } .home-c { margin-top: -2px; padding-bottom: 3.75rem; } .home-c .left { padding-top: 4.475rem; padding-left: 3rem; width: 50%; float: left; padding-right: 5.25rem; } .home-c .left .t1 { font-weight: 500; color: #666666; line-height: .7rem; margin-top: 1.375rem; } .home-c .left .numlist { width: 100%; display: flex; margin-top: 1.75rem; margin-bottom: 1.75rem; } .home-c .left .numlist .li { width: 33%; } .home-c .left .numlist .li .nums { display: flex; color: #0053A6; align-items: flex-end; justify-content: flex-start; } .home-c .left .numlist .li .nums .num { line-height: 1; font-family: FacileSans; font-weight: 700; letter-spacing: -2px; margin-right: 8px; } .home-c .left .numlist .li .t2 { color: #999999; line-height: 0.7rem; margin-top: 3px; } .home-c .left .numlist .li .nums .num span { font-size: 16px; vertical-align: top; } .home-c .right { width: 50%; float: left; height: 18.125rem; /* background: #E9F3FB; */ padding-top: 0rem; position: relative; } .home-c .right .img1 { position: absolute; right: 0rem; width: 33rem; max-width: none; } .home-c .right .play { width: 5rem; height: 2.5rem; background: #00A4CA; opacity: 0.95; border-radius: 1.25rem .2rem .2rem 1.25rem; position: absolute; left: 0; transform: translateX(-100%); bottom: 3rem; display: flex; align-items: center; justify-content: center; } .home-c .right .play .icon { width: .925rem; margin-right: .275rem; } .home-d { background: #E9F3FB; padding: 1.875rem 0; } .home-d .homed-container { margin-top: 1.2rem; } .home-d .homed-container .swiper-slide { width: calc((100% - 2.25rem) / 3); height: 14rem; margin-right: 1.125rem; } .home-d .homed-container .swiper-slide:last-child { margin-right: 0; } .home-d .homed-container .swiper-slide .mak { width: 100%; height: 100%; position: absolute; z-index: 2; top: 0; left: 0; background: #0F5C98; opacity: 0.73; transition: all 0.5s; } .home-d .homed-container .swiper-slide .txt { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 4; padding: 1.25rem; } .home-d .homed-container .swiper-slide .txt .t1 { line-height: .9rem; margin-top: .75rem; } .home-d .homed-container .swiper-slide .txt .tip { font-size: 0; text-align: left; margin-top: .825rem; } .home-d .homed-container .swiper-slide .txt .tip .li { padding: .25rem .5rem; border: 1px solid #D5D5D5; border-radius: 16px; display: inline-block; vertical-align: top; font-size: 12px; line-height: 1; background-color: rgba(255, 255, 255, 0.1); margin-right: 10px; } .home-d .homed-container .swiper-slide .txt .bot { width: calc(100% - 2.5rem); position: absolute; bottom: 0; left: 1.25rem; padding: 1.125rem 0; border-top: 1px solid rgba(255, 255, 255, 0.3); display: flex; flex-direction: row; align-items: center; justify-content: space-between; } .home-d .homed-container .swiper-slide .txt .bot .t2 .icon { font-size: 0; text-align: left; margin-left: 10px; } .home-d .homed-container .swiper-slide .txt .bot .t2 .icon .box { width: 13px; height: 7px; background: #fff; display: inline-block; margin-left: 1px; opacity: 0.7; -webkit-clip-path: polygon(0 0, 75% 0, 100% 100%, 25% 100%); clip-path: polygon(0 0, 75% 0, 100% 100%, 25% 100%); transition: all 0.5s; } .home-d .homed-container .swiper-slide .txt .bot .t2 { display: flex; align-items: center; } .home-d .homed-container .swiper-slide:hover .mak { opacity: 1; background: #0DA9CD; } .home-d .homed-container .swiper-slide:hover .mak .txt .bot .t2 .icon .box { opacity: 1; } .news-pagination { position: relative; margin-top: 1.25rem; text-align: center; } .news-pagination .swiper-pagination-bullet { width: 2.7rem; height: .175rem; background: #0DA9CD; border-radius: 0 !important; opacity: 0.1; transform: skewX(30deg); transition: 0.5s ease-in-out; } .news-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { opacity: 1; } .pc-header.on { background-color: #fff; } .pc-header.on .op1 { opacity: 0; } .pc-header.on .op2 { opacity: 1; } .pc-header.on .right-btn .nav .li .tit a { color: #000; } header .pc-header.on .right-btn .litip .icon { fill: #000; } header .pc-header.on .col-fff { color: #000; } .pc-header.on .right-btn .numlist .li::after { background-color: #000; } .pc-header.on .right-btn .litip:hover { color: #000; } .allnews { position: absolute; bottom: 0; right: 3rem; display: flex; align-items: center; color: #666; transition: all 0.5s; } .allnews .icon { margin-left: 11px; filter: grayscale(100%); opacity: 0.6; } .allnews .icon img { display: inline-block; } .allnews:hover { color: #00A4CA; } .allnews:hover .icon { filter: grayscale(0); opacity: 1; } footer .bot { padding: .75rem 3rem; color: #CCCCCC; border-top: 1px solid rgba(230, 230, 230, .1); } .pc-header.on .right-btn .nav .li .tit a:hover { color: #0DA9CD; } .banner-pagination { position: absolute; text-align: center; z-index: 333; bottom: 1.55rem !important; } .banner-pagination .swiper-pagination-bullet { width: 2.7rem; height: .175rem; background: #FFF; border-radius: 0 !important; opacity: 0.2; transform: skewX(30deg); } .banner-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { opacity: 1; } /*hover.css*/ @media (min-width: 1025px) { .more:hover { color: #fff; background-position: 1% 50%; } .more:hover .icon { filter: grayscale(100%) brightness(1000%) !important; } } /*bocami.css*/ .scroll-animate.animated { visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -webkit-perspective: 1000; -moz-perspective: 1000; -ms-perspective: 1000; perspective: 1000; } .font-fadeIn font { display: inline-block; } .scrolly { transition: all 0.5s ease-out; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; backface-visibility: hidden; } .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } /*animate琛ュ厖鍔ㄧ敾*/ @keyframes fadeInLeftSmall { from { opacity: 0; transform: translate3d(-1rem, 0, 0); } to { opacity: 1; transform: none; } } .fadeInLeftSmall { animation-name: fadeInLeftSmall; } @keyframes fadeInRightSmall { from { opacity: 0; transform: translate3d(0.3rem, 0, 0); } to { opacity: 1; transform: none; } } .fadeInRightSmall { animation-name: fadeInRightSmall; } @keyframes fadeInDownSmall { from { opacity: 0; transform: translate3d(0%, -10px, 0); } to { opacity: 1; transform: none; } } .fadeInDownSmall { animation-name: fadeInDownSmall; } @keyframes fadeOutDownSmall { from { opacity: 1; transform: none; } to { opacity: 0; transform: translate3d(0%, 10px, 0); } } .fadeOutDownSmall { animation-name: fadeOutDownSmall; } @keyframes fadeOutRightSmall { from { opacity: 1; transform: none; } to { opacity: 0; transform: translate3d(50px, 0px, 0); } } .fadeOutRightSmall { animation-name: fadeOutRightSmall; } @keyframes fadeInUpSmall { from { opacity: 0; transform: translate3d(0%, 40px, 0); } to { opacity: 1; transform: none; } } @media (max-width: 1024px) { @keyframes fadeInUpSmall { from { opacity: 0; transform: translate3d(0%, 20px, 0); } to { opacity: 1; transform: none; } } } .fadeInUpSmall { animation-name: fadeInUpSmall; } @keyframes scaleIn { 0% { opacity: 0; transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); backface-visibility: hidden; } 100% { opacity: 1; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); backface-visibility: hidden; } } .scaleIn { animation-name: scaleIn; } .getGray { -webkit-filter: grayscale(100%); /* CSS3 filter鏂瑰紡锛寃ebkit鍐呮牳鏂瑰紡锛宖irefox澶栫殑缁濆ぇ閮ㄥ垎鐨勭幇浠f祻瑙堝櫒*/ -moz-filter: grayscale(100%); /* 鐩墠娌℃湁瀹炵幇 */ -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); /* CSS3 filter鏂瑰紡锛屾爣鍑嗗啓娉?/ /*filter: url(filters.svg#grayscale);*/ /* Firefox 4+ */ filter: gray; /* IE 6-9 */ } .img-ani { transform: scaleX(0.5) scaleY(0.5) scaleZ(1) translate(0, 50%); transition: all .9s ease; opacity: 0; } .img-ani .img-child { transform: scaleX(1.5) scaleY(1.5) scaleZ(1); transition: all 1.5s ease; } .img-ani.go { transform: scaleX(1) scaleY(1) scaleZ(1) translate(0); opacity: 1; } .img-ani.go .img-child { transform: scaleX(1) scaleY(1) scaleZ(1) translate(0); } .bx { background-size: cover; background-position: center; color: #fff; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } .ph .pic { position: absolute; width: calc(100% + 60px); height: calc(100% + 60px); left: -30px; top: -30px; backface-visibility: hidden; } @media screen and (orientation: portrait) { .ph .pic { position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; backface-visibility: hidden; } } @keyframes Tmouse { 0% { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); } 100% { -webkit-transform: translateY(12px); -moz-transform: translateY(-12px); -ms-transform: translateY(-12px); -o-transform: translateY(-12px); transform: translateY(-12px); } } @keyframes wave { to { transform: translateX(-100%); } } @keyframes loop1 { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } } @keyframes loop2 { 0% { transform: rotate(40deg); } 100% { transform: rotate(400deg); } } @keyframes loop3 { 0% { transform: rotate(80deg); } 100% { transform: rotate(440deg); } } @keyframes loop4 { 0% { transform: rotate(-30deg); } 100% { transform: rotate(330deg); } } @keyframes fn3 { 0% { opacity: 0; transform: matrix(1, 0.1, 0, 1, 0, 10); } 100% { opacity: 1; transform: matrix(1, 0, 0, 1, 0, 0); } } .fn3 { transform-origin: 0 50%; animation: fn3 1.2s cubic-bezier(0.49, 0.54, 0.16, 1); animation-fill-mode: both; } /* -------------------------------- Keyframes -------------------------------- */ @-webkit-keyframes cd-reveal-left { 0% { opacity: 0; visibility: hidden; } 100% { opacity: 1; visibility: visible; } } @keyframes cd-reveal-left { 0% { opacity: 0; visibility: hidden; } 100% { opacity: 1; visibility: visible; } } @-webkit-keyframes cd-reveal-right { 0% { opacity: 0; visibility: hidden; } 100% { opacity: 1; visibility: visible; } } @keyframes cd-reveal-right { 0% { opacity: 0; visibility: hidden; } 100% { opacity: 1; visibility: visible; } } @-webkit-keyframes cd-hide-left { 0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden; } } @keyframes cd-hide-left { 0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden; } } @-webkit-keyframes cd-hide-right { 0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden; } } @keyframes cd-hide-right { 0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden; } } @-webkit-keyframes cd-clicked { 0%, 100% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes cd-clicked { 0%, 100% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes cir_right { from { clip-path: circle(12vw at 112% 50%); } to { clip-path: circle(12vw at 102% 50%); } } @keyframes cir_left { from { clip-path: circle(12vw at -12% 50%); } to { clip-path: circle(12vw at -2% 50%); } } @keyframes banner_in { 0% { clip-path: ellipse(50% 50% at 50% 150%); } 100% { clip-path: ellipse(100% 180% at 50% 150%); } } @keyframes banner_out { 0% { clip-path: ellipse(100% 180% at 50% 150%); } 100% { clip-path: ellipse(50% 50% at 50% 150%); } } @keyframes banner_appIn { 0% { clip-path: ellipse(100% 50% at 50% 150%); } 100% { clip-path: ellipse(180% 180% at 50% 150%); } } @keyframes banner_appOut { 0% { clip-path: ellipse(180% 180% at 50% 150%); } 100% { clip-path: ellipse(100% 50% at 50% 150%); } } @keyframes row5_in { 0% { opacity: 1; } 100% { opacity: 1; } } @keyframes r5_in { 0% { transform: translate3d(-70vw, 36vw, 0) scale(1); } 50% { transform: translate3d(-14vw, 6vw, 0) scale(1); } 100% { transform: translate3d(-14vw, 6vw, 0) scale(3); } } @keyframes r5_out { 0% { transform: translate3d(-14vw, 6vw, 0) scale(3); } 50% { transform: translate3d(-14vw, 6vw, 0) scale(1); } 100% { transform: translate3d(-70vw, 36vw, 0) scale(1); } } @keyframes slider { 0% { opacity: 0; margin-left: -0.1rem; } 100% { opacity: 1; margin-left: 0; } } @keyframes scrFn { 0% { transform: translate3d(50vw, 42vh, 0) scale(0.9) rotate(0); } 30% { transform: translate3d(50vw, 42vh, 0) scale(9) rotate(0); } 100% { transform: translate3d(50vw, 42vh, 0) scale(54) rotate(20deg); } } @keyframes aboutFn { 0% { -webkit-mask-size: 45.8%; -webkit-mask-position: 50% 40%; } 30% { -webkit-mask-size: 458%; -webkit-mask-position: 50% 40%; } 100% { -webkit-mask-size: 2738%; -webkit-mask-position: 52% 52%; } } @keyframes scrImg { 0% { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); backface-visibility: hidden; } 100% { transform: rotate(360deg); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); backface-visibility: hidden; } } @keyframes scrOut { 0% { transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); backface-visibility: hidden; opacity: 1; } 12% { transform: translate3d(0, 20px, 0); -webkit-transform: translate3d(0, 20px, 0); -moz-transform: translate3d(0, 20px, 0); -o-transform: translate3d(0, 20px, 0); -ms-transform: translate3d(0, 20px, 0); backface-visibility: hidden; opacity: 0; } 100% { transform: translate3d(0, 20px, 0); -webkit-transform: translate3d(0, 20px, 0); -moz-transform: translate3d(0, 20px, 0); -o-transform: translate3d(0, 20px, 0); -ms-transform: translate3d(0, 20px, 0); backface-visibility: hidden; opacity: 0; } } @keyframes scrP1 { 0% { transform: translate3d(0, 0, 0) scale(1); -webkit-transform: translate3d(0, 0, 0) scale(1); -moz-transform: translate3d(0, 0, 0) scale(1); -o-transform: translate3d(0, 0, 0) scale(1); -ms-transform: translate3d(0, 0, 0) scale(1); backface-visibility: hidden; opacity: 1; } 8% { transform: translate3d(-5px, -7px, 0) scale(1.05); -webkit-transform: translate3d(-5px, -7px, 0) scale(1.05); -moz-transform: translate3d(-5px, -7px, 0) scale(1.05); -o-transform: translate3d(-5px, -7px, 0) scale(1.05); -ms-transform: translate3d(-5px, -7px, 0) scale(1.05); backface-visibility: hidden; opacity: 0; } 100% { transform: translate3d(-5px, -7px, 0) scale(1.05); -webkit-transform: translate3d(-5px, -7px, 0) scale(1.05); -moz-transform: translate3d(-5px, -7px, 0) scale(1.05); -o-transform: translate3d(-5px, -7px, 0) scale(1.05); -ms-transform: translate3d(-5px, -7px, 0) scale(1.05); backface-visibility: hidden; opacity: 0; } } @keyframes scrP2 { 0% { transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); backface-visibility: hidden; opacity: 1; } 10% { transform: translate3d(7px, 5px, 0) scale(1.05); -webkit-transform: translate3d(7px, 5px, 0) scale(1.05); -moz-transform: translate3d(7px, 5px, 0) scale(1.05); -o-transform: translate3d(7px, 5px, 0) scale(1.05); -ms-transform: translate3d(7px, 5px, 0) scale(1.05); backface-visibility: hidden; opacity: 0; } 100% { transform: translate3d(7px, 5px, 0) scale(1.05); -webkit-transform: translate3d(7px, 5px, 0) scale(1.05); -moz-transform: translate3d(7px, 5px, 0) scale(1.05); -o-transform: translate3d(7px, 5px, 0) scale(1.05); -ms-transform: translate3d(7px, 5px, 0) scale(1.05); backface-visibility: hidden; opacity: 0; } } @keyframes scrP3 { 0% { transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); backface-visibility: hidden; opacity: 1; } 12% { transform: translate3d(-7px, -5px, 0) scale(1.05); -webkit-transform: translate3d(-7px, -5px, 0) scale(1.05); -moz-transform: translate3d(-7px, -5px, 0) scale(1.05); -o-transform: translate3d(-7px, -5px, 0) scale(1.05); -ms-transform: translate3d(-7px, -5px, 0) scale(1.05); backface-visibility: hidden; opacity: 0; } 100% { transform: translate3d(-7px, -5px, 0) scale(1.05); -webkit-transform: translate3d(-7px, -5px, 0) scale(1.05); -moz-transform: translate3d(-7px, -5px, 0) scale(1.05); -o-transform: translate3d(-7px, -5px, 0) scale(1.05); -ms-transform: translate3d(-7px, -5px, 0) scale(1.05); backface-visibility: hidden; opacity: 0; } } .scrTxt { animation-name: scrTxt; } @keyframes scrTxt { 0% { transform: translate3d(50px, 10px, 0); -webkit-transform: translate3d(50px, 10px, 0); -moz-transform: translate3d(50px, 10px, 0); -o-transform: translate3d(50px, 10px, 0); -ms-transform: translate3d(50px, 10px, 0); backface-visibility: hidden; opacity: 0; } 20% { transform: translate3d(0px, 0px, 0); -webkit-transform: translate3d(0px, 0px, 0); -moz-transform: translate3d(0px, 0px, 0); -o-transform: translate3d(0px, 0px, 0); -ms-transform: translate3d(0px, 0px, 0); backface-visibility: hidden; opacity: 1; } 100% { transform: translate3d(0px, 0px, 0); -webkit-transform: translate3d(0px, 0px, 0); -moz-transform: translate3d(0px, 0px, 0); -o-transform: translate3d(0px, 0px, 0); -ms-transform: translate3d(0px, 0px, 0); backface-visibility: hidden; opacity: 1; } } @keyframes scrP4 { 0% { transform: translate3d(-120px, 0px, 0px) rotate(-50deg); } 30% { transform: translate3d(-120px, 0px, 0px) rotate(0deg); } 100% { transform: translate3d(-120px, 0px, 0px) rotate(0deg); } } @keyframes scrP5 { 0% { transform: translate3d(calc(70vw - 30vw), calc(13vw + 12.3vw), 0); -webkit-transform: translate3d(calc(70vw - 30vw), calc(13vw + 12.3vw), 0); -moz-transform: translate3d(calc(70vw - 30vw), calc(13vw + 12.3vw), 0); -o-transform: translate3d(calc(70vw - 30vw), calc(13vw + 12.3vw), 0); -ms-transform: translate3d(calc(70vw - 30vw), calc(13vw + 12.3vw), 0); backface-visibility: hidden; } 58% { transform: translate3d(calc(50vw - 30vw), calc(13vw + 12.3vw), 0); -webkit-transform: translate3d(calc(50vw - 30vw), calc(13vw + 12.3vw), 0); -moz-transform: translate3d(calc(50vw - 30vw), calc(13vw + 12.3vw), 0); -o-transform: translate3d(calc(50vw - 30vw), calc(13vw + 12.3vw), 0); -ms-transform: translate3d(calc(50vw - 30vw), calc(13vw + 12.3vw), 0); backface-visibility: hidden; } 100% { transform: translate3d(calc(50vw - 30vw), calc(13vw + 12.3vw), 0); -webkit-transform: translate3d(calc(50vw - 30vw), calc(13vw + 12.3vw), 0); -moz-transform: translate3d(calc(50vw - 30vw), calc(13vw + 12.3vw), 0); -o-transform: translate3d(calc(50vw - 30vw), calc(13vw + 12.3vw), 0); -ms-transform: translate3d(calc(50vw - 30vw), calc(13vw + 12.3vw), 0); backface-visibility: hidden; } } @keyframes scrP51 { 0% { margin-left: 50%; letter-spacing: 0.6rem; } 40% { margin-left: 0%; letter-spacing: 0px; } 100% { margin-left: 0%; letter-spacing: 0px; } } @keyframes scrP6 { 0% { transform: translate3d(calc(70vw - 6.25vw), calc(13vw + 12.3vw), 0); -webkit-transform: translate3d(calc(70vw - 6.25vw), calc(13vw + 12.3vw), 0); -moz-transform: translate3d(calc(70vw - 6.25vw), calc(13vw + 12.3vw), 0); -o-transform: translate3d(calc(70vw - 6.25vw), calc(13vw + 12.3vw), 0); -ms-transform: translate3d(calc(70vw - 6.25vw), calc(13vw + 12.3vw), 0); backface-visibility: hidden; letter-spacing: 1rem; opacity: 0; } 58% { transform: translate3d(calc(50vw - 6.25vw), calc(13vw + 12.3vw), 0); -webkit-transform: translate3d(calc(50vw - 6.25vw), calc(13vw + 12.3vw), 0); -moz-transform: translate3d(calc(50vw - 6.25vw), calc(13vw + 12.3vw), 0); -o-transform: translate3d(calc(50vw - 6.25vw), calc(13vw + 12.3vw), 0); -ms-transform: translate3d(calc(50vw - 6.25vw), calc(13vw + 12.3vw), 0); backface-visibility: hidden; letter-spacing: 0px; opacity: 1; } 100% { transform: translate3d(calc(50vw - 6.25vw), calc(13vw + 12.3vw), 0); -webkit-transform: translate3d(calc(50vw - 6.25vw), calc(13vw + 12.3vw), 0); -moz-transform: translate3d(calc(50vw - 6.25vw), calc(13vw + 12.3vw), 0); -o-transform: translate3d(calc(50vw - 6.25vw), calc(13vw + 12.3vw), 0); -ms-transform: translate3d(calc(50vw - 6.25vw), calc(13vw + 12.3vw), 0); backface-visibility: hidden; letter-spacing: 0px; opacity: 1; } } @keyframes scrP61 { 0% { letter-spacing: 0.6rem; background-color: #ffffff; } 40% { letter-spacing: 0px; background-color: rgba(255, 255, 255, 0); } 100% { letter-spacing: 0px; background-color: rgba(255, 255, 255, 0); } } @keyframes scrP7 { 0% { transform: translate3d(0vw, 0vw, 0); -webkit-transform: translate3d(0vw, 0vw, 0); -moz-transform: translate3d(0vw, 0vw, 0); -o-transform: translate3d(0vw, 0vw, 0); -ms-transform: translate3d(0vw, 0vw, 0); backface-visibility: hidden; } 58% { transform: translate3d(-15vw, 0vw, 0); -webkit-transform: translate3d(-15vw, 0vw, 0); -moz-transform: translate3d(-15vw, 0vw, 0); -o-transform: translate3d(-15vw, 0vw, 0); -ms-transform: translate3d(-15vw, 0vw, 0); backface-visibility: hidden; } 100% { transform: translate3d(-15vw, 0vw, 0); -webkit-transform: translate3d(-15vw, 0vw, 0); -moz-transform: translate3d(-15vw, 0vw, 0); -o-transform: translate3d(-15vw, 0vw, 0); -ms-transform: translate3d(-15vw, 0vw, 0); backface-visibility: hidden; } } @keyframes scrP8 { 0% { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); backface-visibility: hidden; } 100% { transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); backface-visibility: hidden; } } @keyframes scrP9 { 0% { transform: translate3d(0vw, 0vw, 0); -webkit-transform: translate3d(0vw, 0vw, 0); -moz-transform: translate3d(0vw, 0vw, 0); -o-transform: translate3d(0vw, 0vw, 0); -ms-transform: translate3d(0vw, 0vw, 0); backface-visibility: hidden; } 100% { transform: translate3d(-58%, 0vw, 0); -webkit-transform: translate3d(-58%, 0vw, 0); -moz-transform: translate3d(-58%, 0vw, 0); -o-transform: translate3d(-58%, 0vw, 0); -ms-transform: translate3d(-58%, 0vw, 0); backface-visibility: hidden; } } @keyframes scrP10 { 0% { opacity: 0; transform: translate3d(0vw, 0vw, 0); -webkit-transform: translate3d(0vw, 0vw, 0); -moz-transform: translate3d(0vw, 0vw, 0); -o-transform: translate3d(0vw, 0vw, 0); -ms-transform: translate3d(0vw, 0vw, 0); backface-visibility: hidden; } 15% { opacity: 1; transform: translate3d(0vw, 0vw, 0); -webkit-transform: translate3d(0vw, 0vw, 0); -moz-transform: translate3d(0vw, 0vw, 0); -o-transform: translate3d(0vw, 0vw, 0); -ms-transform: translate3d(0vw, 0vw, 0); backface-visibility: hidden; } 25% { transform: translate3d(0px, 2.02rem, 0px); -webkit-transform: translate3d(0px, 2.02rem, 0px); -moz-transform: translate3d(0px, 2.02rem, 0px); -o-transform: translate3d(0px, 2.02rem, 0px); -ms-transform: translate3d(0px, 2.02rem, 0px); backface-visibility: hidden; } 35% { transform: translate3d(0px, 2.02rem, 0px); -webkit-transform: translate3d(0px, 2.02rem, 0px); -moz-transform: translate3d(0px, 2.02rem, 0px); -o-transform: translate3d(0px, 2.02rem, 0px); -ms-transform: translate3d(0px, 2.02rem, 0px); backface-visibility: hidden; } 50% { transform: translate3d(0.4rem, 4.04rem, 0px); -webkit-transform: translate3d(0.4rem, 4.04rem, 0px); -moz-transform: translate3d(0.4rem, 4.04rem, 0px); -o-transform: translate3d(0.4rem, 4.04rem, 0px); -ms-transform: translate3d(0.4rem, 4.04rem, 0px); backface-visibility: hidden; } 100% { transform: translate3d(0.4rem, 4.04rem, 0px); -webkit-transform: translate3d(0.4rem, 4.04rem, 0px); -moz-transform: translate3d(0.4rem, 4.04rem, 0px); -o-transform: translate3d(0.4rem, 4.04rem, 0px); -ms-transform: translate3d(0.4rem, 4.04rem, 0px); backface-visibility: hidden; } } @keyframes scrP11 { 0% { transform: translate3d(-20px, 0vw, 0); -webkit-transform: translate3d(-20px, 0vw, 0); -moz-transform: translate3d(-20px, 0vw, 0); -o-transform: translate3d(-20px, 0vw, 0); -ms-transform: translate3d(-20px, 0vw, 0); backface-visibility: hidden; opacity: 0; } 15% { transform: translate3d(0vw, 0vw, 0); -webkit-transform: translate3d(0vw, 0vw, 0); -moz-transform: translate3d(0vw, 0vw, 0); -o-transform: translate3d(0vw, 0vw, 0); -ms-transform: translate3d(0vw, 0vw, 0); backface-visibility: hidden; opacity: 1; } 100% { transform: translate3d(0, 0vw, 0); -webkit-transform: translate3d(0, 0vw, 0); -moz-transform: translate3d(0, 0vw, 0); -o-transform: translate3d(0, 0vw, 0); -ms-transform: translate3d(0, 0vw, 0); backface-visibility: hidden; opacity: 1; } } @keyframes scrP12 { 0% { transform: translate3d(-20px, 0vw, 0); -webkit-transform: translate3d(-20px, 0vw, 0); -moz-transform: translate3d(-20px, 0vw, 0); -o-transform: translate3d(-20px, 0vw, 0); -ms-transform: translate3d(-20px, 0vw, 0); backface-visibility: hidden; opacity: 0; } 25% { transform: translate3d(0vw, 0vw, 0); -webkit-transform: translate3d(0vw, 0vw, 0); -moz-transform: translate3d(0vw, 0vw, 0); -o-transform: translate3d(0vw, 0vw, 0); -ms-transform: translate3d(0vw, 0vw, 0); backface-visibility: hidden; opacity: 1; } 100% { transform: translate3d(0, 0vw, 0); -webkit-transform: translate3d(0, 0vw, 0); -moz-transform: translate3d(0, 0vw, 0); -o-transform: translate3d(0, 0vw, 0); -ms-transform: translate3d(0, 0vw, 0); backface-visibility: hidden; opacity: 1; } } @keyframes scrP13 { 0% { transform: translate3d(-20px, 0vw, 0); -webkit-transform: translate3d(-20px, 0vw, 0); -moz-transform: translate3d(-20px, 0vw, 0); -o-transform: translate3d(-20px, 0vw, 0); -ms-transform: translate3d(-20px, 0vw, 0); backface-visibility: hidden; opacity: 0; } 40% { transform: translate3d(0vw, 0vw, 0); -webkit-transform: translate3d(0vw, 0vw, 0); -moz-transform: translate3d(0vw, 0vw, 0); -o-transform: translate3d(0vw, 0vw, 0); -ms-transform: translate3d(0vw, 0vw, 0); backface-visibility: hidden; opacity: 1; } 100% { transform: translate3d(0, 0vw, 0); -webkit-transform: translate3d(0, 0vw, 0); -moz-transform: translate3d(0, 0vw, 0); -o-transform: translate3d(0, 0vw, 0); -ms-transform: translate3d(0, 0vw, 0); backface-visibility: hidden; opacity: 1; } } @keyframes scrP14 { 0% { transform: translate3d(0vw, 0%, 0); -webkit-transform: translate3d(0vw, 0%, 0); -moz-transform: translate3d(0vw, 0%, 0); -o-transform: translate3d(0vw, 0%, 0); -ms-transform: translate3d(0vw, 0%, 0); backface-visibility: hidden; } 100% { transform: translate3d(0, 90%, 0); -webkit-transform: translate3d(0, 90%, 0); -moz-transform: translate3d(0, 90%, 0); -o-transform: translate3d(0, 90%, 0); -ms-transform: translate3d(0, 90%, 0); backface-visibility: hidden; } } @keyframes loadFn { 0% { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); backface-visibility: hidden; } 100% { transform: rotate(360deg); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); backface-visibility: hidden; } } .warp-header4 { position: absolute; width: 100%; left: 0; top: 0; z-index: 9; } .disable-hover { pointer-events: none; } .scroll-animate.animated { visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -webkit-perspective: 1000; -moz-perspective: 1000; -ms-perspective: 1000; perspective: 1000; } .font-fadeIn font { display: inline-block; } .scrolly { transition: all 0.5s ease-out; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; backface-visibility: hidden; } .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } /*鍏ュ満鍔ㄧ敾鏍峰紡*/ .cssanimations .anim_emt, .cssanimations .anim_group .anim_item { visibility: hidden; } .cssanimations .anim_emt.visb, .cssanimations .anim_group .anim_item.visb { visibility: inherit; } .anim_emt.start { -webkit-animation-duration: .6s; animation-duration: .6s; -webkit-animation-timing-function: ease; animation-timing-function: ease; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .anim_emt.start.scale_up { -webkit-animation-name: mk_scale; animation-name: mk_scale; } .anim_emt.start.fade_in { -webkit-animation-name: mk_fade; animation-name: mk_fade; } .anim_emt.start.r_to_l { -webkit-animation-name: mk_right_to_left; animation-name: mk_right_to_left; } .anim_emt.start.l_to_r { -webkit-animation-name: mk_left_to_right; animation-name: mk_left_to_right; } .anim_emt.start.t_to_b { -webkit-animation-name: mk_top_to_bottom; animation-name: mk_top_to_bottom; } .anim_emt.start.b_to_t { -webkit-animation-name: mk_bottom_to_top; animation-name: mk_bottom_to_top; } .slide_anim { visibility: hidden; } .slide_anim.start { visibility: visible; } .slide_anim.b_to_t.start { -webkit-animation: mk_bottom_to_top .6s; animation: mk_bottom_to_top 0.6s; } .anim_emt.palx_img.start { overflow: hidden; -webkit-animation-name: tt_palx_wrap; animation-name: tt_palx_wrap; } .anim_emt.palx_img.start .img-wrap { -webkit-animation: tt_palx_img .6s; animation: tt_palx_img 0.6s; } @keyframes tt_palx_wrap { 0% { -webkit-transform: translateY(30px); transform: translateY(30px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes tt_palx_img { 0% { -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes loader { to { -webkit-transform: rotate3d(0, 0, 1, 360deg); transform: rotate3d(0, 0, 1, 360deg); } } @keyframes loader_dash { from { stroke-dasharray: 0 150; stroke-dashoffset: 0; } to { stroke-dasharray: 100 150; stroke-dashoffset: -140; } } @keyframes line_w100 { to { left: 100%; } } @keyframes rotate_360 { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes fade_out { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fade_in { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fade_out_in { 0%, 100% { opacity: 1; } 50% { opacity: 0; } } @keyframes mk_scale { 0% { -webkit-transform: scale(0.5); transform: scale(0.5); opacity: 0; } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } } @keyframes mk_fade { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes mk_left_to_right { 0% { -webkit-transform: translateX(-30px); transform: translateX(-30px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @keyframes mk_right_to_left { 0% { -webkit-transform: translateX(30px); transform: translateX(30px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @keyframes mk_bottom_to_top { 0% { -webkit-transform: translateY(30px); transform: translateY(30px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes mk_top_to_bottom { 0% { -webkit-transform: translateY(-30px); transform: translateY(-30px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes mk_spt { 0% { -webkit-transform: translateY(10%); transform: translateY(10%); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } .js-m { opacity: 0; transform: translate(0, 30px); transition: all 0.8s cubic-bezier(0.79, -0.27, 0.21, 0.82); } .js-m.animate { opacity: 1; transform: translate(0, 0); } .js-m-2-1 { opacity: 0; transform: translate(0, 30px); transition: all 0.8s cubic-bezier(0.79, -0.27, 0.21, 0.82); } .js-m-2-1.animate { opacity: 1; transform: translate(0, 0); } .a-del1 { animation-delay: 0.1s; } .a-del2 { animation-delay: 0.2s; } .a-del3 { animation-delay: 0.3s; } .a-del4 { animation-delay: 0.4s; } .a-del5 { animation-delay: 0.5s; } .a-del6 { animation-delay: 0.6s; } .a-del7 { animation-delay: 0.7s; } .a-del8 { animation-delay: 0.8s; } .a-del9 { animation-delay: 0.9s; } .a-del10 { animation-delay: 1s; } .a-dur1 { animation-duration: 0.3s; } .a-dur2 { animation-duration: 0.4s; } .a-dur3 { animation-duration: 0.5s; } .a-dur4 { animation-duration: 0.6s; } .a-dur5 { animation-duration: 0.7s; } .a-dur6 { animation-duration: 0.8s; } .a-dur7 { animation-duration: 0.9s; } .a-dur8 { animation-duration: 1s; } .a-dur9 { animation-duration: 1.1s; } .a-dur10 { animation-duration: 1.2s; } .a-dur11 { animation-duration: 1.3s; } .a-dur12 { animation-duration: 1.4s; } .a-dur13 { animation-duration: 1.5s; } .a-dur14 { animation-duration: 1.6s; } .a-dur15 { animation-duration: 1.7s; } .a-dur16 { animation-duration: 1.8s; } .a-dur17 { animation-duration: 1.9s; } .a-dur18 { animation-duration: 2s; } .t-del1 { transition-delay: 0.1s; } .t-del2 { transition-delay: 0.2s; } .t-del3 { transition-delay: 0.3s; } .t-del4 { transition-delay: 0.4s; } .t-del5 { transition-delay: 0.5s; } .t-del6 { transition-delay: 0.6s; } .t-del7 { transition-delay: 0.7s; } .t-del8 { transition-delay: 0.8s; } .t-del9 { transition-delay: 0.9s; } .t-del10 { transition-delay: 1s; } @keyframes fadeInUpabout { from { opacity: 0; transform: translate3d(0%, 80px, 0); } to { opacity: 1; transform: none; } } @media (max-width: 1024px) { @keyframes fadeInUpabout { from { opacity: 0; transform: translate3d(0%, 30px, 0); } to { opacity: 1; transform: none; } } } .fadeInUpabout { animation-name: fadeInUpabout; } /*mob.css*/ @media (max-width: 1440px) {} @media (max-width: 1024px) { .pc { display: none; } .mb { display: block; } .m-bocweb-header3 .header2 { background: #fff; height: 60px; padding: 0 4%; box-shadow: 0px 0px 6px 0 rgb(0 0 0 / 10%); position: fixed; width: 100%; left: 0; z-index: 99; } .m-bocweb-header3 .header2 .logo { display: block; position: relative; z-index: 12; width: 5rem; } .m-bocweb-header3 .header2 .logo svg { height: 0.75rem; } .m-bocweb-header3 .header2 .logo svg .cls-1 { fill: #055bbb; } .m-bocweb-header3 .header2 .langbox { position: relative; } .m-bocweb-header3 .header2 .langbox .icon { width: 20px; height: 20px; fill: #0053A6; margin-right: 10px; } .m-bocweb-header3 .header2 .langbox .libox { padding: 10px; background: #fff; width: 100px; position: absolute; top: 30px; right: 0; opacity: 0; visibility: hidden; transform: translate(0, -20px); } .m-bocweb-header3 .header2 .langbox:hover .libox { transition: none; opacity: 1; visibility: visible; transform: translate(0, 0); } .m-bocweb-header3 .header2 .langbox .libox a { display: block; width: 80px; height: 35px; line-height: 35px; text-align: center; border-radius: 5px; background: #eee; color: #999; transition: all .3s; margin-bottom: 0.25rem; } .m-bocweb-header3 .header2 .hamburger { padding: 0; height: 20px; } .hamburger-box { width: 40px; height: 24px; display: inline-block; position: relative; } .hamburger-inner { display: block; top: 50%; margin-top: -2px; } .m-bocweb-header3 .header2 .hamburger-box { width: 25px; height: 20px; } .hamburger-inner::before, .hamburger-inner::after { content: ""; display: block; } .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { width: 40px; height: 4px; background-color: #000; border-radius: 4px; position: absolute; transition-property: transform; transition-duration: 0.15s; transition-timing-function: ease; } .m-bocweb-header3 .header2 .hamburger--3dx-r .hamburger-inner { transition: transform 0.6s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0.5s 0s cubic-bezier(0.645, 0.045, 0.355, 1) !important; } .m-bocweb-header3 .header2 .hamburger-inner, .m-bocweb-header3 .header2 .hamburger-inner::before, .m-bocweb-header3 .header2 .hamburger-inner::after { width: 30px; height: 3px; background: #0053A6; } .m-bocweb-header3 .header2 .hamburger-inner, .m-bocweb-header3 .header2 .hamburger-inner::before, .m-bocweb-header3 .header2 .hamburger-inner::after { width: 25px; height: 2px; } .m-bocweb-header3 .hamburger-inner::before { top: -8px; } .m-bocweb-header3 .hamburger-inner::after { bottom: -8px; } .m-bocweb-header3 .header2 .warp-nav { height: calc(100vh - 60px); padding: 0 0 45px; position: fixed; background: rgba(17, 96, 165, 0.98); width: 100%; left: 0; top: 60px; z-index: 9; display: none; } .m-bocweb-header3 .header2 .nav { font-size: 16px; color: #333; position: relative; overflow-y: auto; height: calc(100vh - 60px); } .m-bocweb-header3 .search { width: 90%; margin: 0 auto; padding: 1.25rem 0; border-bottom: 1px solid rgba(255, 255, 255, 0.3); } .m-bocweb-header3 .search .input1 { padding: 0 0.5rem; height: 40px; width: 100%; background: transparent; border-radius: 3px; border: 1px solid rgba(255, 255, 255, 0.3); } .m-bocweb-header3 .search .input2 { width: 30px; height: 30px; background: url(../img/search.png) no-repeat center center; background-size: 15px 16px; position: absolute; right: 3%; top: 50%; margin-top: -15px; } .m-bocweb-header3 .header2 .nav .warp-btn { display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: center; display: block; padding: 16px 0; line-height: 1.5; position: relative; transition: all .3s ease; border-bottom: 1px solid rgba(255, 255, 255, 0.2); } .m-bocweb-header3 .header2 .nav .li { position: relative; width: 100%; padding: 0 5%; } .m-bocweb-header3 .header2 .nav .tit { width: 100%; padding: 16px 0; line-height: 60px; position: relative; border-bottom: 1px solid rgba(255, 255, 255, 0.2); } .m-bocweb-header3 .header2 .nav .sub-tit { display: block; } .m-bocweb-header3 .header2 .nav .tit { line-height: 1.5; } .m-bocweb-header3 .header2 .nav .sub-tit:after { content: ""; display: block; width: 15px; height: 15px; text-align: center; position: absolute; right: 5%; top: 20px; background: url(../img/img1.svg); background-repeat: no-repeat; background-position: 50% 50%; background-size: 15px auto; transform: rotate(0); transform-origin: center center; transition: all .3s ease-in-out; } .m-bocweb-header3 .header2 .nav .sec-list { line-height: 40px; padding: 0.35rem 0 0.35rem 6%; display: none; font-size: 14px; } .m-bocweb-header3 .header2 .nav .sec-tit { font-size: 15px; color: #8ebfea; position: relative; transition: all .4s; display: block; } .m-bocweb-header3 .header2 .nav .sec-list-nav { font-size: 13px; padding-left: 8px; line-height: 30px; display: none; } .m-bocweb-header3 .header2 .nav .sec-list a { color: #fff; } .m-bocweb-header3 .header2 .nav .sec-list-nav a { color: #8ebfea; } .banner-container .txt { left: 4%; top: 4.35rem; } .banner-container .txt .t1 { font-size: 1rem; line-height: 1.4; } .banner-container .txt .tit-18 { width: 80%; font-size: 16px; line-height: 1.5; } .more { padding: 10px 12px; } .more .tit-16 { font-size: 14px; } .home-a { padding: 2rem 0; } .view { width: 100%; padding: 0 4%; position: relative; } .home-a .left { width: 100%; } .main-tit { font-size: .8rem; } .main-t { font-size: 1rem; margin-top: .4rem; } .home-a .right { width: 100%; padding: 0; margin-top: 1.75rem; } .home-a .right .list { margin-top: 1rem; } .home-a .right .list .next { margin-left: .5rem; } .home-a .right .list .prev { margin-right: .5rem; } .home-a .right .img2 { width: 70%; } .home-a .left .con { margin-top: 0; height: auto; } .home-a .left .con .list .li { padding: 11px 0; } .home-b .homeb-container .swiper-slide { width: 56%; height: 9rem; } .home-b .homeb-container .next, .home-b .homeb-container .prev { width: 1.2rem; height: 1.2rem; position: relative; left: 50%; right: 0; display: inline-block; margin-left: -1rem; transform: translateX(-50%); margin-top: 1rem; background-size: 8px 10px; } .home-b .homeb-container .next { margin-left:.5rem; } .home-b .homeb-container .swiper-slide .txt { padding: .5rem; } .home-b .homeb-container .swiper-slide .txt .tit-36 { font-size: 18px; } .home-b .homeb-container .swiper-slide .txt .t1 .tit-19 { font-size: 14px; line-height: 1.5; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .home-b .homeb-container .swiper-slide .txt .t1 { display: flex; justify-content: space-between; flex-direction: column; } .home-b .homeb-container .swiper-slide .txt .t2 { margin-top: 0.2rem; } .home-b .homeb-container .swiper-slide .txt .t2 .icon .box { width: 7px; height: 4px; } .home-c .left { width: 100%; padding-top: 1rem; padding-right: 4%; padding-left: 4%; } .home-c .right { width: 100%; height: auto; margin-top: 1rem; padding: 0; } .home-c .right .img1 { width: 18rem; position: relative; } .home-c .right .play { left: 1rem; transform: translateX(0); height: 1.8rem; } .home-c .right .play { bottom: 30%; } .home-c { padding-bottom: 0; } .home-d .homed-container .swiper-slide { width: 100%; } .news-pagination .swiper-pagination-bullet { width: 1rem; } .allnews { position: relative; right: 0; margin-top: 1rem; } .home-d { padding-bottom: .8rem; } footer .top { display: block; } footer .top .left { width: 100%; height: auto; padding: 0; } footer .top .left .send .txt input { font-size: .4rem; } footer .top .right { width: 100%; height: auto; padding: 0; margin-top: 0.75rem; } footer .top .right .li:first-child { display: none; } footer .top .right .li { width: 100%; height: auto; } footer .top .right .li .list { padding: 0; } footer .top { padding: 2rem 4%; } footer .bot { padding: 1rem 4%; } } /*video.css*/ .vidcontainer { position: fixed; width: 100%; height: 100%; z-index: 100; top: 0; left: 0; overflow: hidden; display: none; cursor: pointer; z-index: 999; } .vidcontainer .video-dialog { position: absolute; left: 50%; top: 50%; width: 50%; transform: translate(-50%, -50%); } .vidcontainer .mask { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #000; opacity: .8; } .vidcontainer .closevid { width: 1.5rem; height: 1.5rem; background-image: url("../img/close-vid2.png"); background-size: .35rem; border: 1px solid #fff; border-radius: 100%; background-repeat: no-repeat; background-position: center; position: absolute; top: 0; right: -2.5rem; cursor: pointer; transition: all .3s; } .vidcontainer video { width: 100%; outline: none; } .more .tit-15 { line-height: 1; display: inline-block; font-size: 15px; } @media (max-width: 767px) { .showd { display: none; } .vidcontainer .closevid { width: .6rem; height: .6rem; top: -1rem; right: 0; } .vidcontainer .video-dialog { width: 90%; } .more .tit-15 { font-size: 14px; } } @media (min-width: 1025px) { .vidcontainer .closevid:hover { transform: rotate(90deg); } } .play-btn { width: 2rem; cursor: pointer; } .home-d .homed-container .swiper-slide:hover .txt .bot .t2 .icon .box:nth-child(2) { transition-delay: 0.2s; } .home-d .homed-container .swiper-slide:hover .txt .bot .t2 .icon .box:nth-child(3) { transition-delay: 0.4s; } .home-d .homed-container .swiper-slide:hover .txt .bot .t2 .icon .box { opacity: 1; } @media (min-width: 996px) { @media (-webkit-min-device-pixel-ratio: 1.25) { html { zoom: 0.8; font-size: 40px !important; } /**/ .tit-12 { font-size: 12.84px; line-height: 2; } .tit-13 { font-size: 13.91px; line-height: 2; } .tit-14 { font-size: 14.98px; line-height: 2; } .tit-15 { font-size: 16.05px; line-height: 2; } .tit-16 { line-height: 1.8; font-size: 17.12px; } .tit-17 { line-height: 1.8; font-size: 18.19px; } .tit-18 { line-height: 1.8; font-size: 19.26px; } .tit-19 { line-height: 1.8; font-size: 20.33px; } .tit-20 { line-height: 1.8; font-size: 21.4px; } .tit-21 { line-height: 1.8; font-size: 22.47px; } .tit-22 { line-height: 1.8; font-size: 23.54px; } .tit-23 { line-height: 1.8; font-size: 24.61px; } .tit-24 { line-height: 1.8; font-size: 25.68px; } .tit-25 { line-height: 1.8; font-size: 26.75px; } .tit-26 { line-height: 1.8; font-size: 27.82px; } .tit-27 { line-height: 1.8; font-size: 28.89px; } .tit-28 { line-height: 1.8; font-size: 29.96px; } .tit-29 { line-height: 1.8; font-size: 31.03px; } .tit-30 { line-height: 1.8; font-size: 32.1px; } .tit-31 { line-height: 1.8; font-size: 33.17px; } .tit-32 { line-height: 1.8; font-size: 34.24px; } .tit-33 { line-height: 1.8; font-size: 35.31px; } .tit-34 { line-height: 1.8; font-size: 36.38px; } .tit-35 { line-height: 1.8; font-size: 37.45px; } .tit-36 { line-height: 1.8; font-size: 38.52px; } .tit-37 { line-height: 1.8; font-size: 39.59px; } .tit-38 { line-height: 1.8; font-size: 40.66px; } .tit-39 { line-height: 1.8; font-size: 41.73px; } .tit-40 { line-height: 1.8; font-size: 42.8px; } .tit-41 { line-height: 1.8; font-size: 43.87px; } .tit-42 { line-height: 1.8; font-size: 44.94px; } .tit-43 { line-height: 1.8; font-size: 46.01px; } .tit-44 { line-height: 1.8; font-size: 47.08px; } .tit-45 { line-height: 1.8; font-size: 48.15px; } .tit-46 { line-height: 1.8; font-size: 49.22px; } .tit-47 { line-height: 1.8; font-size: 50.29px; } .tit-48 { line-height: 1.8; font-size: 51.36px; } .tit-49 { line-height: 1.8; font-size: 52.43px; } .tit-50 { line-height: 1.8; font-size: 53.5px; } .tit-51 { line-height: 1.8; font-size: 54.57px; } .tit-52 { line-height: 1.8; font-size: 55.64px; } .tit-53 { line-height: 1.8; font-size: 56.71px; } .tit-54 { line-height: 1.8; font-size: 57.78px; } .tit-55 { line-height: 1.8; font-size: 58.85px; } .tit-56 { line-height: 1.8; font-size: 59.92px; } .tit-57 { line-height: 1.8; font-size: 60.99px; } .tit-58 { line-height: 1.8; font-size: 62.06px; } .tit-59 { line-height: 1.8; font-size: 63.13px; } .tit-60 { line-height: 1.8; font-size: 64.2px; } .tit-61 { line-height: 1.8; font-size: 65.27px; } .tit-62 { line-height: 1.8; font-size: 66.34px; } .tit-63 { line-height: 1.8; font-size: 67.41px; } .tit-64 { line-height: 1.8; font-size: 68.48px; } .tit-65 { line-height: 1.8; font-size: 69.55px; } .tit-66 { line-height: 1.8; font-size: 70.62px; } .tit-67 { line-height: 1.8; font-size: 71.69px; } .tit-68 { line-height: 1.8; font-size: 72.76px; } .tit-69 { line-height: 1.8; font-size: 73.83px; } .tit-70 { line-height: 1.8; font-size: 74.9px; } .tit-71 { line-height: 1.8; font-size: 75.97px; } .tit-72 { line-height: 1.8; font-size: 77.04px; } .tit-73 { line-height: 1.8; font-size: 78.11px; } .tit-74 { line-height: 1.8; font-size: 79.18px; } .tit-75 { line-height: 1.8; font-size: 80.25px; } .tit-76 { line-height: 1.8; font-size: 81.32px; } .tit-77 { line-height: 1.8; font-size: 82.39px; } .tit-78 { line-height: 1.8; font-size: 83.46px; } .tit-79 { line-height: 1.8; font-size: 84.53px; } .tit-80 { line-height: 1.8; font-size: 85.6px; } @media (max-width: 1681px) { .tit-12 { font-size: 12.84px; } .tit-13 { font-size: 13.91px; } .tit-14 { font-size: 13.91px; } .tit-15 { font-size: 14.98px; } .tit-16 { font-size: 16.05px; } .tit-17 { font-size: 17.12px; } .tit-18 { font-size: 18.19px; } .tit-19 { font-size: 19.26px; } .tit-20 { font-size: 19.26px; } .tit-21 { font-size: 20.33px; } .tit-22 { font-size: 21.4px; } .tit-23 { font-size: 22.47px; } .tit-24 { font-size: 23.54px; } .tit-25 { font-size: 24.61px; } .tit-26 { font-size: 25.68px; } .tit-27 { font-size: 26.75px; } .tit-28 { font-size: 27.82px; } .tit-29 { font-size: 28.89px; } .tit-30 { font-size: 28.89px; } .tit-31 { font-size: 29.96px; } .tit-32 { font-size: 31.03px; } .tit-33 { font-size: 32.1px; } .tit-34 { font-size: 33.17px; } .tit-35 { font-size: 34.24px; } .tit-36 { font-size: 35.31px; } .tit-37 { font-size: 36.38px; } .tit-38 { font-size: 37.45px; } .tit-39 { font-size: 38.52px; } .tit-40 { font-size: 39.59px; } .tit-42 { font-size: 40.66px; } .tit-43 { font-size: 41.73px; } .tit-44 { font-size: 42.8px; } .tit-45 { font-size: 43.87px; } .tit-46 { font-size: 44.94px; } .tit-47 { font-size: 46.01px; } .tit-48 { font-size: 47.08px; } .tit-50 { font-size: 48.15px; } .tit-51 { font-size: 49.22px; } .tit-52 { font-size: 50.29px; } .tit-53 { font-size: 51.36px; } .tit-54 { font-size: 52.43px; } .tit-55 { font-size: 53.5px; } .tit-56 { font-size: 54.57px; } .tit-57 { font-size: 55.64px; } .tit-58 { font-size: 56.71px; } .tit-59 { font-size: 57.78px; } .tit-60 { font-size: 57.78px; } .tit-61 { font-size: 58.85px; } .tit-62 { font-size: 59.92px; } .tit-63 { font-size: 60.99px; } .tit-64 { font-size: 62.06px; } .tit-65 { font-size: 63.13px; } .tit-66 { font-size: 64.2px; } .tit-67 { font-size: 65.27px; } .tit-68 { font-size: 66.34px; } .tit-69 { font-size: 67.41px; } .tit-70 { font-size: 66.34px; } .tit-71 { font-size: 67.41px; } .tit-72 { font-size: 68.48px; } .tit-73 { font-size: 69.55px; } .tit-74 { font-size: 70.62px; } .tit-75 { font-size: 71.69px; } .tit-76 { font-size: 72.76px; } .tit-77 { font-size: 73.83px; } .tit-78 { font-size: 74.9px; } .tit-79 { font-size: 75.97px; } .tit-80 { font-size: 77.04px; } } @media (max-width: 1481px) { .tit-13 { font-size: 12.84px; } .tit-14 { font-size: 12.84px; } .tit-15 { font-size: 13.91px; } .tit-16 { font-size: 14.98px; } .tit-17 { font-size: 16.05px; } .tit-18 { font-size: 17.12px; } .tit-19 { font-size: 18.19px; } .tit-20 { font-size: 19.26px; } .tit-20 { font-size: 17.12px; } .tit-21 { font-size: 18.19px; } .tit-22 { font-size: 19.26px; } .tit-23 { font-size: 20.33px; } .tit-24 { font-size: 21.4px; } .tit-25 { font-size: 22.47px; } .tit-26 { font-size: 23.54px; } .tit-27 { font-size: 24.61px; } .tit-28 { font-size: 25.68px; } .tit-29 { font-size: 26.75px; } .tit-30 { font-size: 27.82px; } .tit-31 { font-size: 26.75px; } .tit-32 { font-size: 27.82px; } .tit-33 { font-size: 28.89px; } .tit-34 { font-size: 29.96px; } .tit-35 { font-size: 31.03px; } .tit-36 { font-size: 32.1px; } .tit-37 { font-size: 33.17px; } .tit-38 { font-size: 34.24px; } .tit-39 { font-size: 35.31px; } .tit-40 { font-size: 36.38px; } .tit-41 { font-size: 37.45px; } .tit-42 { font-size: 38.52px; } .tit-43 { font-size: 39.59px; } .tit-44 { font-size: 40.66px; } .tit-45 { font-size: 39.59px; } .tit-46 { font-size: 40.66px; } .tit-47 { font-size: 41.73px; } .tit-48 { font-size: 42.8px; } .tit-49 { font-size: 43.87px; } .tit-50 { font-size: 44.94px; } .tit-51 { font-size: 46.01px; } .tit-52 { font-size: 47.08px; } .tit-53 { font-size: 48.15px; } .tit-54 { font-size: 49.22px; } .tit-55 { font-size: 50.29px; } .tit-56 { font-size: 51.36px; } .tit-57 { font-size: 52.43px; } .tit-58 { font-size: 53.5px; } .tit-59 { font-size: 54.57px; } .tit-60 { font-size: 55.64px; } .tit-61 { font-size: 54.57px; } .tit-62 { font-size: 55.64px; } .tit-63 { font-size: 56.71px; } .tit-64 { font-size: 57.78px; } .tit-65 { font-size: 58.85px; } .tit-66 { font-size: 59.92px; } .tit-67 { font-size: 60.99px; } .tit-68 { font-size: 62.06px; } .tit-69 { font-size: 63.13px; } .tit-70 { font-size: 64.2px; } .tit-71 { font-size: 58.85px; } .tit-72 { font-size: 59.92px; } .tit-73 { font-size: 60.99px; } .tit-74 { font-size: 62.06px; } .tit-75 { font-size: 63.13px; } .tit-76 { font-size: 64.2px; } .tit-77 { font-size: 65.27px; } .tit-78 { font-size: 66.34px; } .tit-79 { font-size: 67.41px; } .tit-80 { font-size: 68.48px; } } @media (max-width: 1281px) { .tit-13 { font-size: 12.84px; } .tit-14 { font-size: 12.84px; } .tit-15 { font-size: 12.84px; } .tit-16 { font-size: 13.91px; } .tit-17 { font-size: 17.12px; } .tit-18 { font-size: 16.05px; } .tit-19 { font-size: 17.12px; } .tit-20 { font-size: 18.19px; } .tit-22 { font-size: 19.26px; } .tit-24 { font-size: 20.33px; } .tit-25 { font-size: 21.4px; } .tit-26 { font-size: 22.47px; } .tit-27 { font-size: 23.54px; } .tit-28 { font-size: 24.61px; } .tit-29 { font-size: 25.68px; } .tit-30 { font-size: 26.75px; } .tit-31 { font-size: 27.82px; } .tit-32 { font-size: 28.89px; } .tit-33 { font-size: 25.68px; } .tit-34 { font-size: 26.75px; } .tit-35 { font-size: 27.82px; } .tit-36 { font-size: 28.89px; } .tit-37 { font-size: 29.96px; } .tit-38 { font-size: 31.03px; } .tit-39 { font-size: 32.1px; } .tit-40 { font-size: 33.17px; } .tit-41 { font-size: 34.24px; } .tit-42 { font-size: 35.31px; } .tit-43 { font-size: 36.38px; } .tit-44 { font-size: 37.45px; } .tit-45 { font-size: 38.52px; } .tit-46 { font-size: 39.59px; } .tit-47 { font-size: 40.66px; } .tit-48 { font-size: 41.73px; } .tit-49 { font-size: 42.8px; } .tit-50 { font-size: 40.66px; } .tit-51 { font-size: 41.73px; } .tit-52 { font-size: 42.8px; } .tit-53 { font-size: 43.87px; } .tit-54 { font-size: 44.94px; } .tit-55 { font-size: 46.01px; } .tit-56 { font-size: 47.08px; } .tit-57 { font-size: 48.15px; } .tit-58 { font-size: 49.22px; } .tit-59 { font-size: 50.29px; } .tit-60 { font-size: 51.36px; } .tit-61 { font-size: 52.43px; } .tit-62 { font-size: 53.5px; } .tit-63 { font-size: 54.57px; } .tit-64 { font-size: 55.64px; } .tit-65 { font-size: 56.71px; } .tit-66 { font-size: 57.78px; } .tit-67 { font-size: 58.85px; } .tit-68 { font-size: 59.92px; } .tit-69 { font-size: 60.99px; } .tit-70 { font-size: 62.06px; } .tit-71 { font-size: 54.57px; } .tit-72 { font-size: 55.64px; } .tit-73 { font-size: 56.71px; } .tit-74 { font-size: 57.78px; } .tit-75 { font-size: 58.85px; } .tit-76 { font-size: 59.92px; } .tit-77 { font-size: 60.99px; } .tit-78 { font-size: 62.06px; } .tit-79 { font-size: 63.13px; } .tit-80 { font-size: 64.2px; } } @media (max-width: 1024px) { .tit-24 { font-size: 17.12px; } .tit-25 { font-size: 18.19px; } .tit-26 { font-size: 19.26px; } .tit-27 { font-size: 20.33px; } .tit-28 { font-size: 21.4px; } .tit-29 { font-size: 22.47px; } .tit-30 { font-size: 23.54px; } .tit-31 { font-size: 24.61px; } .tit-32 { font-size: 25.68px; } .tit-33 { font-size: 22.47px; } .tit-34 { font-size: 23.54px; } .tit-35 { font-size: 24.61px; } .tit-36 { font-size: 25.68px; } .tit-37 { font-size: 26.75px; } .tit-38 { font-size: 27.82px; } .tit-39 { font-size: 28.89px; } .tit-40 { font-size: 29.96px; } .tit-41 { font-size: 31.03px; } .tit-42 { font-size: 32.1px; } .tit-43 { font-size: 33.17px; } .tit-44 { font-size: 34.24px; } .tit-45 { font-size: 35.31px; } .tit-46 { font-size: 36.38px; } .tit-47 { font-size: 37.45px; } .tit-48 { font-size: 38.52px; } .tit-49 { font-size: 39.59px; } .tit-50 { font-size: 36.38px; } .tit-51 { font-size: 37.45px; } .tit-52 { font-size: 38.52px; } .tit-53 { font-size: 39.59px; } .tit-54 { font-size: 40.66px; } .tit-55 { font-size: 41.73px; } .tit-56 { font-size: 42.8px; } .tit-57 { font-size: 43.87px; } .tit-58 { font-size: 44.94px; } .tit-59 { font-size: 46.01px; } .tit-60 { font-size: 47.08px; } .tit-61 { font-size: 48.15px; } .tit-62 { font-size: 49.22px; } .tit-63 { font-size: 50.29px; } .tit-64 { font-size: 51.36px; } .tit-65 { font-size: 52.43px; } .tit-66 { font-size: 53.5px; } .tit-67 { font-size: 54.57px; } .tit-68 { font-size: 55.64px; } .tit-69 { font-size: 56.71px; } .tit-70 { font-size: 57.78px; } .tit-71 { font-size: 50.29px; } .tit-72 { font-size: 51.36px; } .tit-73 { font-size: 52.43px; } .tit-74 { font-size: 53.5px; } .tit-75 { font-size: 54.57px; } .tit-76 { font-size: 55.64px; } .tit-77 { font-size: 56.71px; } .tit-78 { font-size: 57.78px; } .tit-79 { font-size: 58.85px; } .tit-80 { font-size: 59.92px; } } @media (max-width: 768px) { .tit-16 { font-size: 12.84px; } .tit-18 { font-size: 14.98px; } .tit-20 { font-size: 17.12px; } .tit-33 { font-size: 21.4px; } .tit-34 { font-size: 22.47px; } .tit-35 { font-size: 23.54px; } .tit-36 { font-size: 24.61px; } .tit-37 { font-size: 25.68px; } .tit-38 { font-size: 26.75px; } .tit-39 { font-size: 27.82px; } .tit-40 { font-size: 25.68px; } .tit-41 { font-size: 26.75px; } .tit-42 { font-size: 27.82px; } .tit-43 { font-size: 28.89px; } .tit-44 { font-size: 29.96px; } .tit-45 { font-size: 31.03px; } .tit-46 { font-size: 32.1px; } .tit-47 { font-size: 33.17px; } .tit-48 { font-size: 34.24px; } .tit-49 { font-size: 35.31px; } .tit-50 { font-size: 29.96px; } .tit-51 { font-size: 31.03px; } .tit-52 { font-size: 32.1px; } .tit-53 { font-size: 33.17px; } .tit-54 { font-size: 34.24px; } .tit-55 { font-size: 35.31px; } .tit-56 { font-size: 36.38px; } .tit-57 { font-size: 37.45px; } .tit-58 { font-size: 38.52px; } .tit-59 { font-size: 39.59px; } .tit-60 { font-size: 38.52px; } .tit-61 { font-size: 39.59px; } .tit-62 { font-size: 40.66px; } .tit-63 { font-size: 41.73px; } .tit-64 { font-size: 42.8px; } .tit-65 { font-size: 43.87px; } .tit-66 { font-size: 44.94px; } .tit-67 { font-size: 46.01px; } .tit-68 { font-size: 47.08px; } .tit-69 { font-size: 48.15px; } .tit-70 { font-size: 49.22px; } .tit-70 { font-size: 44.94px; } .tit-71 { font-size: 46.01px; } .tit-72 { font-size: 47.08px; } .tit-73 { font-size: 48.15px; } .tit-74 { font-size: 49.22px; } .tit-75 { font-size: 50.29px; } .tit-76 { font-size: 51.36px; } .tit-77 { font-size: 52.43px; } .tit-78 { font-size: 53.5px; } .tit-79 { font-size: 54.57px; } .tit-80 { font-size: 55.64px; } } /**/ .view { padding: 0 6.25%; } .banner { height: 125vh; } .banner-container .txt { top: 7.575rem; } .tit-18 { font-size: 18px; } .cons-banner{ height: 45vw !important;; } .cons-banner .images{ height: 45vw !important; } } @media (-webkit-min-device-pixel-ratio: 1.25){ .main-text, .contitles{ font-size: 17.12px!important; } .home-d .homed-container .swiper-slide .txt .tip .li{ font-size: 13px!important; } @media (max-width: 1681px){ .main-text, .contitles { font-size: 16.05px!important; } .home-d .homed-container .swiper-slide .txt .tip .li{ font-size: 13px!important; } } @media (max-width: 1481px){ .main-text, .contitles { font-size: 14.98px!important; } .home-d .homed-container .swiper-slide .txt .tip .li{ font-size: 13px!important; } } @media (max-width: 1281px){ .main-text, .contitles { font-size: 13.91px!important; } .home-d .homed-container .swiper-slide .txt .tip .li{ font-size: 13px!important; } } @media (max-width: 1024px){ .main-text, .contitles { font-size: 14px!important; } } } @media (-webkit-min-device-pixel-ratio: 1.5){ .main-text, .contitles{ font-size: 20.32px!important; } .home-d .homed-container .swiper-slide .txt .tip .li{ font-size: 16.5px!important; } @media (max-width: 1681px){ .main-text, .contitles { font-size: 19.05px!important; } .home-d .homed-container .swiper-slide .txt .tip .li{ font-size: 16px!important; } } @media (max-width: 1481px){ .main-text, .contitles { font-size: 17.78px!important; } .home-d .homed-container .swiper-slide .txt .tip .li{ font-size: 15px!important; } } @media (max-width: 1281px){ .main-text, .contitles { font-size: 16.51px!important; } .home-d .homed-container .swiper-slide .txt .tip .li{ font-size: 15px!important; } } @media (max-width: 1024px){ .main-text, .contitles { font-size: 16px!important; } .home-d .homed-container .swiper-slide .txt .tip .li{ font-size: 14px!important; } } } @media (-webkit-min-device-pixel-ratio: 1.5){ /**/ .tit-12 { font-size: 15.24px; line-height: 2; } .tit-13 { font-size: 16.51px; line-height: 2; } .tit-14 { font-size: 17.78px; line-height: 2; } .tit-15 { font-size: 19.05px; line-height: 2; } .tit-16 { line-height: 1.8; font-size: 20.32px; } .tit-17 { line-height: 1.8; font-size: 21.59px; } .tit-18 { line-height: 1.8; font-size: 22.86px; } .tit-19 { line-height: 1.8; font-size: 24.13px; } .tit-20 { line-height: 1.8; font-size: 25.4px; } .tit-21 { line-height: 1.8; font-size: 26.67px; } .tit-22 { line-height: 1.8; font-size: 27.94px; } .tit-23 { line-height: 1.8; font-size: 29.21px; } .tit-24 { line-height: 1.8; font-size: 30.48px; } .tit-25 { line-height: 1.8; font-size: 31.75px; } .tit-26 { line-height: 1.8; font-size: 33.02px; } .tit-27 { line-height: 1.8; font-size: 34.29px; } .tit-28 { line-height: 1.8; font-size: 35.56px; } .tit-29 { line-height: 1.8; font-size: 36.83px; } .tit-30 { line-height: 1.8; font-size: 38.1px; } .tit-31 { line-height: 1.8; font-size: 39.37px; } .tit-32 { line-height: 1.8; font-size: 40.64px; } .tit-33 { line-height: 1.8; font-size: 41.91px; } .tit-34 { line-height: 1.8; font-size: 43.18px; } .tit-35 { line-height: 1.8; font-size: 44.45px; } .tit-36 { line-height: 1.8; font-size: 45.72px; } .tit-37 { line-height: 1.8; font-size: 46.99px; } .tit-38 { line-height: 1.8; font-size: 48.26px; } .tit-39 { line-height: 1.8; font-size: 49.53px; } .tit-40 { line-height: 1.8; font-size: 50.8px; } .tit-41 { line-height: 1.8; font-size: 52.07px; } .tit-42 { line-height: 1.8; font-size: 53.34px; } .tit-43 { line-height: 1.8; font-size: 54.61px; } .tit-44 { line-height: 1.8; font-size: 55.88px; } .tit-45 { line-height: 1.8; font-size: 57.15px; } .tit-46 { line-height: 1.8; font-size: 58.42px; } .tit-47 { line-height: 1.8; font-size: 59.69px; } .tit-48 { line-height: 1.8; font-size: 60.96px; } .tit-49 { line-height: 1.8; font-size: 62.23px; } .tit-50 { line-height: 1.8; font-size: 63.5px; } .tit-51 { line-height: 1.8; font-size: 64.77px; } .tit-52 { line-height: 1.8; font-size: 66.04px; } .tit-53 { line-height: 1.8; font-size: 67.31px; } .tit-54 { line-height: 1.8; font-size: 68.58px; } .tit-55 { line-height: 1.8; font-size: 69.85px; } .tit-56 { line-height: 1.8; font-size: 71.12px; } .tit-57 { line-height: 1.8; font-size: 72.39px; } .tit-58 { line-height: 1.8; font-size: 73.66px; } .tit-59 { line-height: 1.8; font-size: 74.93px; } .tit-60 { line-height: 1.8; font-size: 76.2px; } .tit-61 { line-height: 1.8; font-size: 77.47px; } .tit-62 { line-height: 1.8; font-size: 78.74px; } .tit-63 { line-height: 1.8; font-size: 80.01px; } .tit-64 { line-height: 1.8; font-size: 81.28px; } .tit-65 { line-height: 1.8; font-size: 82.55px; } .tit-66 { line-height: 1.8; font-size: 83.82px; } .tit-67 { line-height: 1.8; font-size: 85.09px; } .tit-68 { line-height: 1.8; font-size: 86.36px; } .tit-69 { line-height: 1.8; font-size: 87.63px; } .tit-70 { line-height: 1.8; font-size: 88.9px; } .tit-71 { line-height: 1.8; font-size: 90.17px; } .tit-72 { line-height: 1.8; font-size: 91.44px; } .tit-73 { line-height: 1.8; font-size: 92.71px; } .tit-74 { line-height: 1.8; font-size: 93.98px; } .tit-75 { line-height: 1.8; font-size: 95.25px; } .tit-76 { line-height: 1.8; font-size: 96.52px; } .tit-77 { line-height: 1.8; font-size: 97.79px; } .tit-78 { line-height: 1.8; font-size: 99.06px; } .tit-79 { line-height: 1.8; font-size: 100.33px; } .tit-80 { line-height: 1.8; font-size: 101.6px; } @media (max-width: 1681px) { .tit-12 { font-size: 15.24px; } .tit-13 { font-size: 16.51px; } .tit-14 { font-size: 16.51px; } .tit-15 { font-size: 17.78px; } .tit-16 { font-size: 19.05px; } .tit-17 { font-size: 20.32px; } .tit-18 { font-size: 21.59px; } .tit-19 { font-size: 22.86px; } .tit-20 { font-size: 22.86px; } .tit-21 { font-size: 24.13px; } .tit-22 { font-size: 25.4px; } .tit-23 { font-size: 26.67px; } .tit-24 { font-size: 27.94px; } .tit-25 { font-size: 29.21px; } .tit-26 { font-size: 30.48px; } .tit-27 { font-size: 31.75px; } .tit-28 { font-size: 33.02px; } .tit-29 { font-size: 34.29px; } .tit-30 { font-size: 34.29px; } .tit-31 { font-size: 35.56px; } .tit-32 { font-size: 36.83px; } .tit-33 { font-size: 38.1px; } .tit-34 { font-size: 39.37px; } .tit-35 { font-size: 40.64px; } .tit-36 { font-size: 41.91px; } .tit-37 { font-size: 43.18px; } .tit-38 { font-size: 44.45px; } .tit-39 { font-size: 45.72px; } .tit-40 { font-size: 46.99px; } .tit-42 { font-size: 48.26px; } .tit-43 { font-size: 49.53px; } .tit-44 { font-size: 50.8px; } .tit-45 { font-size: 52.07px; } .tit-46 { font-size: 53.34px; } .tit-47 { font-size: 54.61px; } .tit-48 { font-size: 55.88px; } .tit-50 { font-size: 57.15px; } .tit-51 { font-size: 58.42px; } .tit-52 { font-size: 59.69px; } .tit-53 { font-size: 60.96px; } .tit-54 { font-size: 62.23px; } .tit-55 { font-size: 63.5px; } .tit-56 { font-size: 64.77px; } .tit-57 { font-size: 66.04px; } .tit-58 { font-size: 67.31px; } .tit-59 { font-size: 68.58px; } .tit-60 { font-size: 68.58px; } .tit-61 { font-size: 69.85px; } .tit-62 { font-size: 71.12px; } .tit-63 { font-size: 72.39px; } .tit-64 { font-size: 73.66px; } .tit-65 { font-size: 74.93px; } .tit-66 { font-size: 76.2px; } .tit-67 { font-size: 77.47px; } .tit-68 { font-size: 78.74px; } .tit-69 { font-size: 80.01px; } .tit-70 { font-size: 78.74px; } .tit-71 { font-size: 80.01px; } .tit-72 { font-size: 81.28px; } .tit-73 { font-size: 82.55px; } .tit-74 { font-size: 83.82px; } .tit-75 { font-size: 85.09px; } .tit-76 { font-size: 86.36px; } .tit-77 { font-size: 87.63px; } .tit-78 { font-size: 88.9px; } .tit-79 { font-size: 90.17px; } .tit-80 { font-size: 91.44px; } } @media (max-width: 1481px) { .tit-13 { font-size: 15.24px; } .tit-14 { font-size: 15.24px; } .tit-15 { font-size: 16.51px; } .tit-16 { font-size: 17.78px; } .tit-17 { font-size: 19.05px; } .tit-18 { font-size: 20.32px; } .tit-19 { font-size: 21.59px; } .tit-20 { font-size: 22.86px; } .tit-20 { font-size: 20.32px; } .tit-21 { font-size: 21.59px; } .tit-22 { font-size: 22.86px; } .tit-23 { font-size: 24.13px; } .tit-24 { font-size: 25.4px; } .tit-25 { font-size: 26.67px; } .tit-26 { font-size: 27.94px; } .tit-27 { font-size: 29.21px; } .tit-28 { font-size: 30.48px; } .tit-29 { font-size: 31.75px; } .tit-30 { font-size: 33.02px; } .tit-31 { font-size: 31.75px; } .tit-32 { font-size: 33.02px; } .tit-33 { font-size: 34.29px; } .tit-34 { font-size: 35.56px; } .tit-35 { font-size: 36.83px; } .tit-36 { font-size: 38.1px; } .tit-37 { font-size: 39.37px; } .tit-38 { font-size: 40.64px; } .tit-39 { font-size: 41.91px; } .tit-40 { font-size: 43.18px; } .tit-41 { font-size: 44.45px; } .tit-42 { font-size: 45.72px; } .tit-43 { font-size: 46.99px; } .tit-44 { font-size: 48.26px; } .tit-45 { font-size: 46.99px; } .tit-46 { font-size: 48.26px; } .tit-47 { font-size: 49.53px; } .tit-48 { font-size: 50.8px; } .tit-49 { font-size: 52.07px; } .tit-50 { font-size: 53.34px; } .tit-51 { font-size: 54.61px; } .tit-52 { font-size: 55.88px; } .tit-53 { font-size: 57.15px; } .tit-54 { font-size: 58.42px; } .tit-55 { font-size: 59.69px; } .tit-56 { font-size: 60.96px; } .tit-57 { font-size: 62.23px; } .tit-58 { font-size: 63.5px; } .tit-59 { font-size: 64.77px; } .tit-60 { font-size: 66.04px; } .tit-61 { font-size: 64.77px; } .tit-62 { font-size: 66.04px; } .tit-63 { font-size: 67.31px; } .tit-64 { font-size: 68.58px; } .tit-65 { font-size: 69.85px; } .tit-66 { font-size: 71.12px; } .tit-67 { font-size: 72.39px; } .tit-68 { font-size: 73.66px; } .tit-69 { font-size: 74.93px; } .tit-70 { font-size: 76.2px; } .tit-71 { font-size: 69.85px; } .tit-72 { font-size: 71.12px; } .tit-73 { font-size: 72.39px; } .tit-74 { font-size: 73.66px; } .tit-75 { font-size: 74.93px; } .tit-76 { font-size: 76.2px; } .tit-77 { font-size: 77.47px; } .tit-78 { font-size: 78.74px; } .tit-79 { font-size: 80.01px; } .tit-80 { font-size: 81.28px; } } @media (max-width: 1281px) { .tit-13 { font-size: 15.24px; } .tit-14 { font-size: 15.24px; } .tit-15 { font-size: 15.24px; } .tit-16 { font-size: 16.51px; } .tit-17 { font-size: 20.32px; } .tit-18 { font-size: 19.05px; } .tit-19 { font-size: 20.32px; } .tit-20 { font-size: 21.59px; } .tit-22 { font-size: 22.86px; } .tit-24 { font-size: 24.13px; } .tit-25 { font-size: 25.4px; } .tit-26 { font-size: 26.67px; } .tit-27 { font-size: 27.94px; } .tit-28 { font-size: 29.21px; } .tit-29 { font-size: 30.48px; } .tit-30 { font-size: 31.75px; } .tit-31 { font-size: 33.02px; } .tit-32 { font-size: 34.29px; } .tit-33 { font-size: 30.48px; } .tit-34 { font-size: 31.75px; } .tit-35 { font-size: 33.02px; } .tit-36 { font-size: 34.29px; } .tit-37 { font-size: 35.56px; } .tit-38 { font-size: 36.83px; } .tit-39 { font-size: 38.1px; } .tit-40 { font-size: 39.37px; } .tit-41 { font-size: 40.64px; } .tit-42 { font-size: 41.91px; } .tit-43 { font-size: 43.18px; } .tit-44 { font-size: 44.45px; } .tit-45 { font-size: 45.72px; } .tit-46 { font-size: 46.99px; } .tit-47 { font-size: 48.26px; } .tit-48 { font-size: 49.53px; } .tit-49 { font-size: 50.8px; } .tit-50 { font-size: 48.26px; } .tit-51 { font-size: 49.53px; } .tit-52 { font-size: 50.8px; } .tit-53 { font-size: 52.07px; } .tit-54 { font-size: 53.34px; } .tit-55 { font-size: 54.61px; } .tit-56 { font-size: 55.88px; } .tit-57 { font-size: 57.15px; } .tit-58 { font-size: 58.42px; } .tit-59 { font-size: 59.69px; } .tit-60 { font-size: 60.96px; } .tit-61 { font-size: 62.23px; } .tit-62 { font-size: 63.5px; } .tit-63 { font-size: 64.77px; } .tit-64 { font-size: 66.04px; } .tit-65 { font-size: 67.31px; } .tit-66 { font-size: 68.58px; } .tit-67 { font-size: 69.85px; } .tit-68 { font-size: 71.12px; } .tit-69 { font-size: 72.39px; } .tit-70 { font-size: 73.66px; } .tit-71 { font-size: 64.77px; } .tit-72 { font-size: 66.04px; } .tit-73 { font-size: 67.31px; } .tit-74 { font-size: 68.58px; } .tit-75 { font-size: 69.85px; } .tit-76 { font-size: 71.12px; } .tit-77 { font-size: 72.39px; } .tit-78 { font-size: 73.66px; } .tit-79 { font-size: 74.93px; } .tit-80 { font-size: 76.2px; } } @media (max-width: 1024px) { .tit-24 { font-size: 20.32px; } .tit-25 { font-size: 21.59px; } .tit-26 { font-size: 22.86px; } .tit-27 { font-size: 24.13px; } .tit-28 { font-size: 25.4px; } .tit-29 { font-size: 26.67px; } .tit-30 { font-size: 27.94px; } .tit-31 { font-size: 29.21px; } .tit-32 { font-size: 30.48px; } .tit-33 { font-size: 26.67px; } .tit-34 { font-size: 27.94px; } .tit-35 { font-size: 29.21px; } .tit-36 { font-size: 30.48px; } .tit-37 { font-size: 31.75px; } .tit-38 { font-size: 33.02px; } .tit-39 { font-size: 34.29px; } .tit-40 { font-size: 35.56px; } .tit-41 { font-size: 36.83px; } .tit-42 { font-size: 38.1px; } .tit-43 { font-size: 39.37px; } .tit-44 { font-size: 40.64px; } .tit-45 { font-size: 41.91px; } .tit-46 { font-size: 43.18px; } .tit-47 { font-size: 44.45px; } .tit-48 { font-size: 45.72px; } .tit-49 { font-size: 46.99px; } .tit-50 { font-size: 43.18px; } .tit-51 { font-size: 44.45px; } .tit-52 { font-size: 45.72px; } .tit-53 { font-size: 46.99px; } .tit-54 { font-size: 48.26px; } .tit-55 { font-size: 49.53px; } .tit-56 { font-size: 50.8px; } .tit-57 { font-size: 52.07px; } .tit-58 { font-size: 53.34px; } .tit-59 { font-size: 54.61px; } .tit-60 { font-size: 55.88px; } .tit-61 { font-size: 57.15px; } .tit-62 { font-size: 58.42px; } .tit-63 { font-size: 59.69px; } .tit-64 { font-size: 60.96px; } .tit-65 { font-size: 62.23px; } .tit-66 { font-size: 63.5px; } .tit-67 { font-size: 64.77px; } .tit-68 { font-size: 66.04px; } .tit-69 { font-size: 67.31px; } .tit-70 { font-size: 68.58px; } .tit-71 { font-size: 59.69px; } .tit-72 { font-size: 60.96px; } .tit-73 { font-size: 62.23px; } .tit-74 { font-size: 63.5px; } .tit-75 { font-size: 64.77px; } .tit-76 { font-size: 66.04px; } .tit-77 { font-size: 67.31px; } .tit-78 { font-size: 68.58px; } .tit-79 { font-size: 69.85px; } .tit-80 { font-size: 71.12px; } } @media (max-width: 768px) { .tit-16 { font-size: 15.24px; } .tit-18 { font-size: 17.78px; } .tit-20 { font-size: 20.32px; } .tit-33 { font-size: 25.4px; } .tit-34 { font-size: 26.67px; } .tit-35 { font-size: 27.94px; } .tit-36 { font-size: 29.21px; } .tit-37 { font-size: 30.48px; } .tit-38 { font-size: 31.75px; } .tit-39 { font-size: 33.02px; } .tit-40 { font-size: 30.48px; } .tit-41 { font-size: 31.75px; } .tit-42 { font-size: 33.02px; } .tit-43 { font-size: 34.29px; } .tit-44 { font-size: 35.56px; } .tit-45 { font-size: 36.83px; } .tit-46 { font-size: 38.1px; } .tit-47 { font-size: 39.37px; } .tit-48 { font-size: 40.64px; } .tit-49 { font-size: 41.91px; } .tit-50 { font-size: 35.56px; } .tit-51 { font-size: 36.83px; } .tit-52 { font-size: 38.1px; } .tit-53 { font-size: 39.37px; } .tit-54 { font-size: 40.64px; } .tit-55 { font-size: 41.91px; } .tit-56 { font-size: 43.18px; } .tit-57 { font-size: 44.45px; } .tit-58 { font-size: 45.72px; } .tit-59 { font-size: 46.99px; } .tit-60 { font-size: 45.72px; } .tit-61 { font-size: 46.99px; } .tit-62 { font-size: 48.26px; } .tit-63 { font-size: 49.53px; } .tit-64 { font-size: 50.8px; } .tit-65 { font-size: 52.07px; } .tit-66 { font-size: 53.34px; } .tit-67 { font-size: 54.61px; } .tit-68 { font-size: 55.88px; } .tit-69 { font-size: 57.15px; } .tit-70 { font-size: 58.42px; } .tit-70 { font-size: 53.34px; } .tit-71 { font-size: 54.61px; } .tit-72 { font-size: 55.88px; } .tit-73 { font-size: 57.15px; } .tit-74 { font-size: 58.42px; } .tit-75 { font-size: 59.69px; } .tit-76 { font-size: 60.96px; } .tit-77 { font-size: 62.23px; } .tit-78 { font-size: 63.5px; } .tit-79 { font-size: 64.77px; } .tit-80 { font-size: 66.04px; } } /*# sourceMappingURL=c.css.map */ /**/ html { zoom: 0.674; font-size: 40px !important; } .cons-banner{ height: 54vw !important;; } .cons-banner .images{ height: 54vw !important; } .view { padding: 0 6.25%; } .banner { height: 150vh; } .banner-container .txt { top: 7.575rem; } .tit-18 { font-size: 18px; } footer .top .right .li .nav a{ margin-right: 3.2rem; } } } .showd { position: absolute; opacity: 0.8; bottom: -0.25rem; }