@charset "UTF-8"; @font-face { font-family: DINCondensed; src: url(../static/font/DIN-Condensed-Bold.ttf); } * { -webkit-box-sizing: border-box; box-sizing: border-box; } .wrap { position: relative; overflow: hidden; } html, body { font-size: 100px; padding: 0; margin: 0; font-family: "Microsoft YaHei", "PingFang SC", Arial, "Hiragino Sans GB", "WenQuanYi Micro Hei", sans-serif; } @media (min-width: 320px) { html { font-size: 5.21vw !important; } } div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, main, menu, nav, output, ruby, section, summary, time, mark, audio, video, input, textarea, button { font-size: 0.16rem; padding: 0; margin: 0; font-family: "Microsoft YaHei", "PingFang SC", Arial, "Hiragino Sans GB", "WenQuanYi Micro Hei", sans-serif; font-size: inherit; } /*ie9以下提示*/ .ie_low_version { display: block; height: auto; background: #0091ff; color: white; line-height: 20px; position: fixed; width: 100%; top: 0; left: 0; z-index: 999999999; font-size: 16px; text-align: center; padding: 22px 0; } .ie_low_version > div { padding: 0 40px; } .ie_low_version span { float: right; display: block; width: 60px; height: 26px; line-height: 26px; background: #ffffff; color: black; text-align: center; font-size: 14px; cursor: pointer; } .ie_low_version a { color: white; margin: 0 2px; } .ie_low_version + div { margin-top: 70px; } .main, header, footer { font-size: 0.16rem; } a:hover { text-decoration: none; } .transitionLable { opacity: 0; filter: alpha(opacity=0); -webkit-transform: translate3d(0, 100px, 0); transform: translate3d(0, 100px, 0); -webkit-transition: -webkit-transform 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98), opacity 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98); -webkit-transition: opacity 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98), -webkit-transform 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98); transition: opacity 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98), -webkit-transform 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98); transition: transform 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98), opacity 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98); transition: transform 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98), opacity 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98), -webkit-transform 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98); } .transitionLable.Active { opacity: 1; filter: alpha(opacity=100); -webkit-transform: translate(0, 0); transform: translate(0, 0); } .transitionLable1 { opacity: 0; filter: alpha(opacity=0); -webkit-transform: translate3d(0, -40px, 0); transform: translate3d(0, -40px, 0); -webkit-transition: -webkit-transform 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98), opacity 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98); -webkit-transition: opacity 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98), -webkit-transform 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98); transition: opacity 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98), -webkit-transform 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98); transition: transform 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98), opacity 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98); transition: transform 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98), opacity 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98), -webkit-transform 700ms cubic-bezier(0.25, 0.46, 0.33, 0.98); } .transitionLable1.Active { opacity: 1; filter: alpha(opacity=100); -webkit-transform: translate(0, 0); transform: translate(0, 0); } header { position: relative; top: 0; left: 0; background: #fff; z-index: 99; width: 100%; -webkit-transition: all 0.3s !important; transition: all 0.3s !important; -webkit-transition: -webkit-transform 666ms cubic-bezier(0.215, 0.61, 0.355, 1); transition: -webkit-transform 666ms cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 666ms cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 666ms cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 666ms cubic-bezier(0.215, 0.61, 0.355, 1); } header.fixed { position: fixed; } header .headerContainer { width: 100%; height: 100%; position: relative; } header .headerContainer .menuBtn { right: 16px; top: 0; display: none; } header .headerContainer .content { width: 100%; height: 100%; -webkit-transition: -webkit-transform 666ms cubic-bezier(0.666, 0, 0.333, 1); transition: -webkit-transform 666ms cubic-bezier(0.666, 0, 0.333, 1); transition: transform 666ms cubic-bezier(0.666, 0, 0.333, 1); transition: transform 666ms cubic-bezier(0.666, 0, 0.333, 1), -webkit-transform 666ms cubic-bezier(0.666, 0, 0.333, 1); position: relative; background-color: transparent; -webkit-transform: none; transform: none; -webkit-transition: none; transition: none; } header .headerContainer .content .logo { display: inline-block; width: 2.24rem; height: 0.51rem; background: url(../images/inner_Logo.png?v=2022) no-repeat; background-size: contain; position: absolute; left: 0.6rem; min-width: 178px; min-height: 48px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } header .headerContainer .content .phoneClose { display: none; } header .headerContainer .content nav { width: 100%; height: 100%; } header .headerContainer .content nav > ul { width: 100%; font-size: 0; text-align: center; } header .headerContainer .content nav > ul > li { display: inline-block; padding: 35px 0.36rem; position: relative; -webkit-transition: all 0.3s; transition: all 0.3s; vertical-align: top; } header .headerContainer .content nav > ul > li.selected { background: #85725a; } header .headerContainer .content nav > ul > li.selected > a { color: #fff; } header .headerContainer .content nav > ul > li:hover > a::after { content: ""; width: 30px; height: 3px; background: #ff5e19; position: absolute; bottom: 8px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } header .headerContainer .content nav > ul > li a { font-size: 16px; font-weight: 400; color: #664d37; } header .headerContainer .content nav > ul > li ul { position: absolute; top: 90px; background: #85725a; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); display: none; } header .headerContainer .content nav > ul > li ul li { border-bottom: 1px solid rgba(249, 249, 249, 0.2); } header .headerContainer .content nav > ul > li ul li > ul { display: none !important; } header .headerContainer .content nav > ul > li ul li:last-child { border-bottom: none; } header .headerContainer .content nav > ul > li ul li:hover { background: rgba(0, 0, 0, 0.1); } header .headerContainer .content nav > ul > li ul li a { padding: 20px 0.4rem; display: inline-block; white-space: nowrap; color: #fff; } header .headerContainer .content .rightSide { position: absolute; right: 0.65rem; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } header .headerContainer .content .rightSide .change-font { margin-right: 0.24rem; margin-left: 0.24rem; cursor: pointer; font-size: 14px; font-weight: 600; color: #664d37; line-height: 20px; opacity: 0.5; -webkit-transition: all 0.5s; transition: all 0.5s; } header .headerContainer .content .rightSide .change-font:hover { opacity: 1; } header .headerContainer .content .rightSide .oa, header .headerContainer .content .rightSide .chinese { font-size: 14px; font-weight: 600; color: #664d37; line-height: 20px; display: inline-block; text-align: center; opacity: 0.5; margin-right: 0.24rem; position: relative; -webkit-transition: all 0.5s; transition: all 0.5s; } header .headerContainer .content .rightSide .oa::before, header .headerContainer .content .rightSide .chinese::before { content: ""; position: absolute; right: -0.24rem; top: 6px; width: 1px; height: 8px; background: #664d37; opacity: 0.5; } header .headerContainer .content .rightSide .oa:hover, header .headerContainer .content .rightSide .chinese:hover { opacity: 1; } header .headerContainer .content .rightSide .oa { margin-right: 0.48rem; } header .headerContainer .content .rightSide .search { display: inline-block; text-align: center; font-size: 16px; } header .headerContainer .content .rightSide .search.phone-search { display: none; } header .headerContainer .content .rightSide .search .fa { color: #85725a; line-height: 43px; font-weight: 400; } header .headerContainer .content .rightSide .search-input { position: absolute; right: 0.3rem; bottom: -64px; -webkit-transition: ease-in 0.5s; transition: ease-in 0.5s; text-indent: 1.5em; z-index: 1; width: 201px; opacity: 0; } header .headerContainer .content .rightSide .search-input.active { opacity: 1; } header .headerContainer .content .rightSide .search-input input { padding: 8px; width: 100%; height: 100%; border: none; outline: none; border-bottom: 2px solid white; background: transparent; font-size: 14px; font-weight: 400; line-height: 24px; color: white; } input::-webkit-input-placeholder { color: white; opacity: 0.5; } input::-moz-placeholder { /* Mozilla Firefox 19+ */ color: white; opacity: 0.5; } input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: white; opacity: 0.5; } input:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: white; opacity: 0.5; } .banner { width: 100%; height: 3.2rem; text-align: center; } .banner .ch-title { font-size: 0.32rem; font-weight: 500; color: white; line-height: 0.45rem; padding-top: 1.19rem; margin-bottom: 6px; } .banner .en-title { font-size: 0.32rem; font-family: DINCondensed; color: white; line-height: 0.36rem; letter-spacing: 1px; } .sub-menu { background: white; -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.12); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.12); } .sub-menu ul { text-align: center; font-size: 0; } .sub-menu ul > li { float: left; position: relative; } .sub-menu ul > li::after { content: ""; width: 1px; height: 24px; background: rgba(0, 0, 0, 0.15); position: absolute; bottom: 16px; right: 0; } .sub-menu ul > li:last-child::after { display: none; } .sub-menu ul > li:hover a { color: #ff5e19; } .sub-menu ul > li:hover a::after { width: 100%; } .sub-menu ul > li a { font-size: 16px; font-weight: 400; color: #333333; line-height: 24px; position: relative; padding: 18px 0; display: inline-block; -webkit-transition: all 0.5s; transition: all 0.5s; } .sub-menu ul > li a::after { content: ""; width: 0; height: 4px; background: #ff5e19; position: absolute; bottom: 0; left: 0; -webkit-transition: all 0.5s; transition: all 0.5s; } .sub-menu ul > li.selected a { color: #ff5e19; } .sub-menu ul > li.selected a::after { width: 100%; } .sub-menu ul > li ul { display: none; height: auto; overflow: hidden; position: absolute; top: 60px; left: 50%; z-index: 2; width: 70%; transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); background-color: #85725a; } .sub-menu ul > li ul li { display: inline-block; vertical-align: middle; float: none; width: 80% !important; margin: 0 0 15px; font-size: 16px; font-family: PingFangSC, PingFangSC-Regular; font-weight: 300; text-align: center; color: #ffffff; line-height: 24px; border-bottom: 1px solid rgba(255, 255, 255, 0.25); } .sub-menu ul > li ul li:first-child { margin-bottom: 0; } .sub-menu ul > li ul li::after { display: none; } .sub-menu ul > li ul li a { color: #fff !important; } .sub-menu ul > li ul li a:hover { font-weight: 400; } .sub-menu ul > li ul li a::after { display: none; } .sub-menu ul > li ul li.selected a { color: #ff5e19; } .subMenu, .currentColumn, .threeSub { display: none; } .main { padding-top: 0.6rem; background: url(../images/inner_bg.png) no-repeat top; } .main .common-title { text-align: center; } .main .common-title .ch-title { font-size: 32px; font-weight: 600; color: #5d5044; line-height: 42px; margin-bottom: 8px; } .main .common-title .en-title { font-size: 32px; font-family: DINCondensed; color: rgba(133, 114, 90, 0.6); line-height: 42px; margin-bottom: 8px; } .main .common-title .line { display: inline-block; width: 60px; height: 4px; background: #ff9f38; } footer { background: #664d37 url(../images/footer_bg.png) no-repeat; padding: 0.74rem 0 0.68rem 0; } footer .deep-bg .copyright { font-size: 14px; font-family: ArialMT; color: rgba(255, 255, 255, 0.35); line-height: 16px; margin-top: 26px; text-align: left; padding-left: calc(20% + 0.38rem); } footer .footer-container { max-width: 1560px; margin: 0 auto; padding: 0 16px; } footer .footer-container .left-logo { float: left; width: 20%; } footer .footer-container .left-logo .footer-logo { display: inline-block; width: 249px; height: 56px; background: url(../images/footer_logo.png?v=2022) no-repeat center; background-size: cover; } footer .footer-container .right-container { padding-left: 0.3rem; float: left; width: 80%; } footer .footer-container .right-container .left-nav { width: 80%; float: left; } footer .footer-container .right-container .left-nav nav > ul > li { float: left; padding-left: 0.6rem; } footer .footer-container .right-container .left-nav nav > ul > li:first-child { padding-left: 0; } footer .footer-container .right-container .left-nav nav > ul > li a { font-size: 16px; font-weight: 400; color: white; line-height: 22px; } footer .footer-container .right-container .left-nav nav > ul > li a:hover { text-decoration: underline; } footer .footer-container .right-container .left-nav nav > ul > li ul { margin-top: 24px; } footer .footer-container .right-container .left-nav nav > ul > li ul li { margin-bottom: 12px; } footer .footer-container .right-container .left-nav nav > ul > li ul li > ul { display: none; } footer .footer-container .right-container .left-nav nav > ul > li ul li a { font-size: 14px; color: #ececec; } footer .footer-container .right-container .right-box { float: right; -webkit-transform: translateY(0.6rem); transform: translateY(0.6rem); text-align: center; } footer .footer-container .right-container .right-box .wechat { display: inline-block; width: 28px; height: 28px; background: url(../images/wechat_2x.png) no-repeat center; background-size: cover; margin-right: 20px; } footer .footer-container .right-container .right-box .weibo { display: inline-block; width: 27px; height: 27px; background: url(../images/weibo_2x.png) no-repeat center; background-size: cover; } footer .footer-container .right-container .right-box .wechat-code { display: block; width: 77px; height: 77px; background: url(../images/wechat_code_2x.png) no-repeat center; background-size: cover; -webkit-transform: translateX(10px); transform: translateX(10px); } footer .footer-container .right-container .right-box p { font-size: 14px; font-weight: 400; color: #ececec; line-height: 20px; margin-top: 10px; } footer .footer-container .right-container .bottom-container { border-top: 1px solid rgba(255, 255, 255, 0.2); margin-top: 36px; padding-top: 30px; } footer .footer-container .right-container .bottom-container .footer-info ul { float: left; width: 80%; } footer .footer-container .right-container .bottom-container .footer-info ul li { font-size: 14px; font-weight: 400; color: rgba(255, 255, 255, 0.65); line-height: 22px; float: left; padding-right: 0.36rem; } footer .footer-container .right-container .bottom-container .footer-info ul li a { font-size: 14px; font-weight: 400; color: rgba(255, 255, 255, 0.65); line-height: 20px; } footer .footer-container .right-container .bottom-container .footer-info ul:nth-child(2) { margin-top: 13px; } footer .footer-container .right-container .bottom-container .footer-info ul:nth-child(1) > li:last-child { display: none; } footer .footer-container .right-container .bottom-container .footer-info ul:nth-child(3) { width: 20%; } footer .footer-container .right-container .bottom-container .footer-info ul:nth-child(3) li { padding-right: 0; } footer .footer-container .right-container .bottom-container .footer-info ul:nth-child(3) li:nth-child(1) { margin-right: 5px; } footer .footer-container .right-container .bottom-container .footer-info ul:nth-child(3) li:nth-child(1) a { margin-top: 0; line-height: 29px; } footer .footer-container .right-container .bottom-container .footer-info ul:nth-child(3) li:nth-child(2) a { line-height: inherit; } footer .footer-container .right-container .bottom-container .footer-info .old-url { margin-top: 5px; float: left; color: rgba(255, 255, 255, 0.85); } footer .footer-container .right-container .bottom-container .footer-info .old-url:hover { color: #fff; } footer .footer-container .right-container .bottom-container .footer-info .other-link { position: relative; float: right; width: 163px; height: 29px; border: 1px solid rgba(255, 255, 255, 0.65); font-size: 12px; font-weight: 400; color: rgba(255, 255, 255, 0.65); line-height: 27px; letter-spacing: 3px; text-indent: 1em; background: #664d37; background-image: url(../images/footer_down.png); background-repeat: no-repeat; background-position-x: 140px; background-position-y: 10px; cursor: pointer; } footer .footer-container .right-container .bottom-container .footer-info .other-link > div { position: absolute; top: 27px; left: 0; width: 100%; } footer .footer-container .right-container .bottom-container .footer-info .other-link .option { display: block; border: 1px solid rgba(255, 255, 255, 0.25); border-bottom: none; line-height: 30px; height: 30px; text-indent: 1em; background: #664d37; } footer .footer-container .right-container .bottom-container .footer-info .other-link .option:last-child { border-bottom: 1px solid rgba(255, 255, 255, 0.25); } footer .footer-container .right-container .bottom-container .footer-info .other-link .option a { color: rgba(255, 255, 255, 0.65); } footer .footer-container .right-container .bottom-container .footer-info .other-link .option:hover { text-decoration: underline; } .backTop { position: fixed; right: 32px; bottom: 32px; width: 48px; height: 48px; cursor: pointer; background: #85725a url(../images/to_top.png) no-repeat center; z-index: 99; opacity: 0.75; -webkit-transition: all 0.5s; transition: all 0.5s; } .backTop:hover { opacity: 1; } .backTop.hid { opacity: 0; } @keyframes scrollUp { from { background: rgba(255, 255, 255, 0); } to { background: rgba(255, 255, 255, 0.5); } } @-webkit-keyframes scrollUp { from { background: rgba(255, 255, 255, 0); } to { background: rgba(255, 255, 255, 0.5); } } @keyframes scrollDown { from { background: rgba(255, 255, 255, 0.5); } to { background: rgba(255, 255, 255, 0); } } @-webkit-keyframes scrollDown { from { background: rgba(255, 255, 255, 0.5); } to { background: rgba(255, 255, 255, 0); } } @media only screen and (max-width: 1460px) { header .headerContainer .content nav > ul > li { padding: 35px 0.2rem; } footer .footer-container .right-container .bottom-container .footer-info ul { width: 70%; } footer .footer-container .right-container .bottom-container .footer-info ul:nth-child(3) { width: 100%; } } @media only screen and (max-width: 1403px) { footer .footer-container .right-container .bottom-container .footer-info ul { width: 70%; } } header .headerContainer .content .rightSide { right: 0.3rem; } @media only screen and (max-width: 1279px) { footer { padding-bottom: 0px; padding-top: 48px; } footer .deep-bg { background: rgba(0, 0, 0, 0.2); padding-bottom: 10px; } footer .deep-bg .copyright { margin-top: 24px; padding-top: 24px; font-size: 12px; font-family: inherit; font-weight: 400; color: rgba(255, 255, 255, 0.4); line-height: 16px; text-align: center; padding-left: 0; } footer .footer-container .left-logo { float: none; width: 100%; text-align: center; margin-bottom: 24px; } footer .footer-container .left-logo .footer-logo { width: 202px; height: 52px; background: url(../images/footer_logo_phone.png) no-repeat center; background-size: cover; } footer .footer-container .right-container { padding-left: 0; float: none; width: 100%; } footer .footer-container .right-container .left-nav { display: none; } footer .footer-container .right-container .right-box { float: none; -webkit-transform: inherit; transform: inherit; } footer .footer-container .right-container .right-box .wechat-code { margin-left: auto; margin-right: auto; -webkit-transform: inherit; transform: inherit; } footer .footer-container .right-container .bottom-container { margin-top: 24px; } footer .footer-container .right-container .bottom-container .footer-info { text-align: center; } footer .footer-container .right-container .bottom-container .footer-info ul { float: none; width: 100%; border-bottom: 1px solid rgba(255, 255, 255, 0.2); margin-bottom: 24px; padding-bottom: 24px; } footer .footer-container .right-container .bottom-container .footer-info ul li { float: none; padding-right: 0; } footer .footer-container .right-container .bottom-container .footer-info ul:nth-child(1) li:nth-child(2) { display: none; } footer .footer-container .right-container .bottom-container .footer-info .old-url { display: inline-block; width: 163px; height: 29px; border: 1px solid rgba(255, 255, 255, 0.65); font-size: 12px; font-weight: 400; color: white; line-height: 27px; letter-spacing: 3px; background: #664d37; vertical-align: top; margin-right: 24px; } footer .footer-container .right-container .bottom-container .copyright { text-align: center; font-size: 12px; font-family: inherit; } .bottom-line { width: 134px; height: 5px; background: white; border-radius: 100px; margin-top: 30px; display: block; margin-left: auto; margin-right: auto; } header .headerContainer .content nav > ul { padding-left: 0; } header .headerContainer .content nav > ul > li { padding-left: 0.15rem; padding-right: 0.15rem; } } @media only screen and (max-width: 1200px) { header .headerContainer .content .logo { left: 0.3rem; } header .headerContainer .content .rightSide .change-font, header .headerContainer .content .rightSide .oa, header .headerContainer .content .rightSide .chinese { margin-right: 8px; } header .headerContainer .content .rightSide .change-font { margin-left: 0; } header .headerContainer .content .rightSide .oa::before, header .headerContainer .content .rightSide .chinese::before { display: none; } } @media only screen and (max-width: 1024px) { header .headerContainer { height: 56px; padding: 0 16px; } header .headerContainer .content .rightSide .search.phone-search { display: inline-block; } header .headerContainer .content .rightSide .search.pc-search { display: none; } header .headerContainer .content .rightSide .search-input { display: none; } header .headerContainer .content .rightSide .oa, header .headerContainer .content .rightSide .chinese { color: #664d37; border: none; width: auto; height: auto; margin-right: 0; margin-right: 8px; } header .headerContainer .content.showMenu nav > ul > li { padding: 0; } header .headerContainer .content.showMenu nav > ul > li:nth-child(1) { -webkit-animation: showNavLi 0.5s ease-out 0.5s forwards; animation: showNavLi 0.5s ease-out 0.5s forwards; } header .headerContainer .content.showMenu nav > ul > li:nth-child(2) { -webkit-animation: showNavLi 0.5s ease-out 0.6s forwards; animation: showNavLi 0.5s ease-out 0.6s forwards; } header .headerContainer .content.showMenu nav > ul > li:nth-child(3) { -webkit-animation: showNavLi 0.5s ease-out 0.7s forwards; animation: showNavLi 0.5s ease-out 0.7s forwards; } header .headerContainer .content.showMenu nav > ul > li:nth-child(4) { -webkit-animation: showNavLi 0.5s ease-out 0.8s forwards; animation: showNavLi 0.5s ease-out 0.8s forwards; } header .headerContainer .content.showMenu nav > ul > li:nth-child(5) { -webkit-animation: showNavLi 0.5s ease-out 0.9s forwards; animation: showNavLi 0.5s ease-out 0.9s forwards; } header .headerContainer .content.showMenu nav > ul > li:nth-child(6) { -webkit-animation: showNavLi 0.5s ease-out 1s forwards; animation: showNavLi 0.5s ease-out 1s forwards; } header .headerContainer .content.showMenu nav > ul > li:nth-child(7) { -webkit-animation: showNavLi 0.5s ease-out 1.1s forwards; animation: showNavLi 0.5s ease-out 1.1s forwards; } header .headerContainer .content.showMenu nav > ul > li.hasShow { top: 0; opacity: 1; filter: Alpha(opacity=100); } @-webkit-keyframes showNavLi { 0% { top: 104px; opacity: 0; filter: Alpha(opacity=0); } 100% { top: 0; opacity: 1; filter: Alpha(opacity=100); } } @keyframes showNavLi { 0% { top: 104px; opacity: 0; filter: Alpha(opacity=0); } 100% { top: 0; opacity: 1; filter: Alpha(opacity=100); } } .mobileLogo { width: 178px; height: 40px; display: inline-block; background: url(../images/phone_logo_2x.png); background-size: cover; margin-top: 8px; } header .headerContainer .menuBtn { float: right; line-height: 52px; text-align: center; cursor: pointer; margin-top: 8px; display: block; -webkit-transition: all 0.3s; transition: all 0.3s; } header .headerContainer .menuBtn i.fa { color: #ff5e19; font-size: 26px; display: block; margin-top: 7px; } header .headerContainer .content { position: absolute; top: 0; right: -375px; z-index: 99; background: white; width: 85%; max-width: 375px; -webkit-transition: right 500ms; transition: right 500ms; height: 100vh; padding: 16px; overflow-y: scroll; } header .headerContainer .content nav > ul > li { display: block; } header .headerContainer .content nav > ul > li a { display: block; border-bottom: 1px solid #ddd; padding: 16px 0; font-size: 18px; } header .headerContainer .content nav > ul > li.selected { background: #fff; } header .headerContainer .content nav > ul > li.selected > a { color: #ff5e19; } header .headerContainer .content .phoneClose { display: block; float: right; } header .headerContainer .content .phoneClose img { display: block; width: 20px; } header .headerContainer .content .logo { display: none; } header .headerContainer .content .rightSide { top: 28px; left: 24px; right: inherit; width: 70%; } header .headerContainer .content .rightSide .change-font { margin-right: 20px; } header .headerContainer .content.showMenu { right: 0; } header .headerContainer .content.showMenu nav { margin-top: 56px; position: relative; width: 100%; margin-left: 0; overflow: hidden; height: auto; -webkit-transform: none; transform: none; } header .headerContainer .content nav > ul { padding-left: 0; } header .headerContainer .content nav > ul > li ul { position: static; -webkit-transform: inherit; transform: inherit; left: 0; background: #fff; } header .headerContainer .content nav > ul > li ul li a { display: block; font-size: 20px; font-weight: 400; color: #66625e; line-height: 28px; width: 90%; margin: 0 auto; } header .headerContainer .content nav > ul > li:hover > a::after { display: none; } header .headerContainer .bg { display: none; position: fixed; width: 100%; min-height: 100%; z-index: 3; background: black; opacity: 0.5; top: 0; left: 0; } header .headerContainer .bg.showMenu { display: block; } header .headerContainer .content nav > ul > li .showMore { position: absolute; width: 40px; height: 40px; top: 5px; right: 0; cursor: pointer; background: url(../images/minus.svg) no-repeat center; } header .headerContainer .content nav > ul > li .showMore.plus { background: url(../images/plus.svg) no-repeat center; background-size: 14px auto; } header .headerContainer .content nav > ul > li .showMore.minus { background: url(../images/minus.svg) no-repeat center; background-size: 14px auto; } } @media only screen and (max-width: 768px) { .main .common-title, .sub-menu { display: none; } .currentColumn { display: block; height: 52px; line-height: 52px; background: #85725a; background: linear-gradient(135deg, #85725a 0%, #674f39 100%); text-align: center; font-size: 16px; width: 100%; z-index: 2; color: #f9f9f8; position: relative; } .currentColumn i { font-size: 30px; right: 20px; top: 11px; position: absolute; cursor: pointer; } .subMenu.phone { position: fixed; height: 100%; width: 100%; z-index: 99; background: #85725a; background: linear-gradient(135deg, #85725a 0%, #674f39 100%); top: 0; left: 0; display: none; } .subMenu.phone.show { display: block; } .subMenu.phone .subMenuClose { position: absolute; top: 0; right: 0; width: 70px; height: 70px; background: url(../images/subMenuClose.svg) no-repeat center; background-size: 24px auto; -webkit-transform: scale(0.5, 0.5); -webkit-transition: -webkit-transform 300ms; cursor: pointer; } .subMenu.phone .menuContainer { position: absolute; top: 50%; width: 100%; -webkit-transform: scale(0.5, 0.5); -webkit-transition: -webkit-transform 300ms; } .subMenu.phone .menuContainer ul { width: 100%; } .subMenu.phone .menuContainer ul li { width: 100%; } .subMenu.phone .menuContainer ul li a { display: block; font-size: 24px; line-height: 62px; text-align: center; color: #fff; } .subMenu.phone .menuContainer ul li > ul { display: none; } .subMenu.phone.show .menuContainer.show, .subMenu.phone.show .subMenuClose.show { -webkit-transform: scale(0.8, 0.8); } .banner { height: 96px; } .banner .ch-title { font-size: 20px; font-weight: 600; line-height: 26px; padding-top: 25px; } .banner .en-title { font-size: 16px; line-height: 20px; } .threeSub { display: block; margin-top: 1px; } .threeSub .subMenu3 { position: relative; width: calc(100% - 2px); margin: 0 auto; } .threeSub .subMenu3 .btn { width: 100%; height: 40px; font-size: 14px; text-align: center; line-height: 40px; border: 1px solid #715b45; background-color: #f6f1ed; color: rgba(0, 0, 0, 0.6); } .threeSub .subMenu3 .btn::after { border: none; } .threeSub .subMenu3 .dropdown-menu { display: none; position: absolute; top: 40px; left: 0; z-index: 2; width: 100%; background: #f6f1ed; } .threeSub .subMenu3 .dropdown-menu li { display: block; text-align: center; padding: 15px 0; } .threeSub .subMenu3 .dropdown-menu li a { text-align: center; font-size: 14px; color: #000; } .main { padding-top: 24px; } } @media only screen and (max-width: 413px) { footer .footer-container .right-container .bottom-container .footer-info .other-link { width: 130px; background-position-x: 110px; } footer .footer-container .right-container .bottom-container .footer-info .old-url { width: 130px; } } /*# sourceMappingURL=common.css.map */