@font-face { font-family: 'iconfont'; src: url('iconfont/iconfont.eot'); src: url('iconfont/iconfont.eot?#iefix') format('embedded-opentype'), url('iconfont/iconfont.woff2') format('woff2'), url('iconfont/iconfont.woff') format('woff'), url('iconfont/iconfont.ttf') format('truetype'), url('iconfont/iconfont.svg#iconfont') format('svg'); } * { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } html { font-size: 20px; } body { font-family: "PingFangSC", "Microsoft Yahei", "微软雅黑"; } input[type=text]::-ms-clear { display: none; } .w1380 { width: 69rem; margin: 0 auto; } .w1420 { width: 71rem; margin: 0 auto; } .unshake { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-style: preserve-3d; } .hasbg { background-position: center center; background-attachment: scroll; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-repeat: no-repeat; } .return_top { display: none; position: fixed; z-index: 300; right: 1rem; bottom: 7rem; height: 2rem; line-height: 2rem; color: #5f656f; font-size: 0.9rem; } .return_top span { vertical-align: middle; display: none; } .return_top em { display: block; width: 30px; height: 30px; background: #FFFFFF url(../img/return.png) no-repeat; background-size: cover; border-radius: 50%; background-position: 100%; vertical-align: middle; } header { position: absolute; top: 3.3rem; left: 0; padding-left: 8%; padding-right: 8%; width: 100%; z-index: 200; height: 100px; } header .logo { width: 6%; float: left; } header .logo a { display: block; } header .logo a img { max-width: 80px; } header .logo a img.mobile { display: none; } header nav { width: 76%; float: left; } header nav > ul { float: right; } header nav > ul > li { float: left; height: 32px; } header nav > ul > li > a { line-height: 32px; color: #fff; font-size: 0.8rem; padding: 0 1.2rem; position: relative; } header nav > ul > li > a::after{ content: ''; width: 0%; height: 2px; background: #9d063d; position: absolute; left: 50%; bottom: -10px; transition: all 0.5s ease 0.5 ease 0.2s; -webkit-transition: all 0.5s ease 0.2s; -moz-transition: all 0.5s ease 0.2s; -ms-transition: all 0.5s ease 0.2s; } header nav > ul > li:hover > a::after, header nav > ul > li > a:hover::after{ width: calc(100% - 1.6rem - 1.6rem); left: 1.6rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } header nav > ul > li:not(:last-child):before { content: ''; width: 1px; height: 0.6rem; background: #fff; transform: rotate(20deg); -webkit-transform: rotate(20deg); -moz-transform: rotate(20deg); -ms-transform: rotate(20deg); position: absolute; right: 0; top: 28%; opacity: 0.3; } header nav > ul > li:nth-child(2) span { font-size: 12px; margin-left: 10px; } header nav > ul > li:nth-child(5) a span { font-size: 8px; background: rgba(255, 255, 255, 0.2); padding: 2px 4px; margin-left: 10px; } header nav > ul > li .drop-down { position: absolute; top: 100%; left: 0; background: #fff; width: 100%; display: none; padding:0 8%; } header nav > ul > li .drop-down.drop-down-product .left { float: left; width: 18%; background: #f2f2f2; position: relative; } header nav > ul > li .drop-down.drop-down-product .left:before { content: ''; width: 0; height: 0; border-width: 0 8px 8px; border-style: solid; border-color: transparent transparent #f2f2f2; position: absolute; top: -8px; left: 22%; display:none; } header nav > ul > li .drop-down.drop-down-product:before { content: ''; width: 20%; height: 100%; position: absolute; top: 0px; left: 0%; background: #f2f2f2; } header nav > ul > li .drop-down.drop-down-product .left > ul { padding: 2rem 1.7rem; } header nav > ul > li .drop-down.drop-down-product .left > ul > li { font-size: 0.8rem; font-weight: bold; cursor: pointer; margin-top: 1rem; position: relative; } header nav > ul > li .drop-down.drop-down-product .left > ul > li:before { content: '\e683'; font-family: iconfont; position: absolute; right: 0; top: 0; opacity: 0; color: #9f223d; } header nav > ul > li .drop-down.drop-down-product .left > ul > li.active { color: #9f223d; } header nav > ul > li .drop-down.drop-down-product .left > ul > li.active:before { opacity: 1; } header nav > ul > li .drop-down.drop-down-product .right { float: left; width: 82%; background: #fff; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav { position: relative; width: 100%; background: #fff; display: none; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav::after{ height:5.5rem; width:92%; position:absolute; left:4%; content:""; bottom:0px; background:url(../images/menu_bottom.png) no-repeat; background-size:auto 3.5rem; background-position: right 1rem; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav .item { position: absolute; padding: 2rem 0; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav .item h2 { font-size: 0.9rem; font-weight: bold; padding: 0 2rem; position: relative; padding-bottom: 0.6rem; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav .item h2:before { content: ''; width: 60%; height: 1px; background: #f2f2f2; position: absolute; bottom: 0; left: 2rem; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav .item > ul { padding-bottom: 2rem; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav .item > ul > li { padding: 0.3rem 2rem 0.6rem; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav .item > ul > li a { font-size: 0.7rem; color: #666; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav .item > ul > li:hover a { color: #9f223d; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav.active { display: block; } header nav > ul > li .drop-down.drop-down-product > ul { display: none; } header nav > ul > li .drop-down.drop-down-solve { width: 100%; padding: 0 8% 5.5rem; background: #fff; } header nav > ul > li .drop-down.drop-down-solve:before { content: ''; width: 0; height: 0; border-width: 0 8px 8px; border-style: solid; border-color: transparent transparent #f2f2f2; position: absolute; top: -8px; left: 8.5%; display:none; } header nav > ul > li .drop-down.drop-down-solve::after{ height:5.5rem; width:84%; position:absolute; left:8%; content:""; bottom:0px; background:url(../images/menu_bottom.png) no-repeat; background-size:auto 3.5rem; background-position: right 1rem; } header nav > ul > li .drop-down.drop-down-solve > ul > li { float: left; width: 20%; height: 1.4rem; margin-top: 2rem; background: #fff; } header nav > ul > li .drop-down.drop-down-solve > ul > li a .tu { float: left; width: 1.4rem; } header nav > ul > li .drop-down.drop-down-solve > ul > li a .tu img { width: 100%; } header nav > ul > li .drop-down.drop-down-solve > ul > li a h2 { float: right; width: 85%; font-size: 0.8rem; line-height: 1.4rem; } header nav > ul > li .drop-down.drop-down-solve > ul > li:hover a h2 { color: #9f223d; } header nav > ul > li .drop-down.drop-down-fund { width: 100%; } header nav > ul > li .drop-down.drop-down-fund:before { content: ''; width: 0; height: 0; border-width: 0 8px 8px; border-style: solid; border-color: transparent transparent #f2f2f2; position: absolute; top: -8px; left: 45%; display:none; } header nav > ul > li .drop-down.drop-down-fund > ul { padding: 1rem 0; display:flex; justify-content: center; } header nav > ul > li .drop-down.drop-down-fund > ul li { height: 2rem; margin:0 1rem; } header nav > ul > li .drop-down.drop-down-fund > ul li a { color: #999; font-size: 0.8rem; display: block; text-align: center; line-height: 2rem; } header nav > ul > li .drop-down.drop-down-fund > ul li:hover a { color: #9f223d; } header nav .nav-bottom { display: none; } header .right { width: 18%; float: left; position: relative; } header .right .nav-button { position: relative; width: 4rem; height: 5.5rem; text-align: center; z-index: 11; font-size: 0; float: right; display: none; } header .right .nav-button div { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); width: 28px; height: 16px; } header .right .nav-button div span { width: 100%; height: 2px; background-color: #333; display: block; margin: 0 auto; line-height: 2px; position: static; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } header .right .nav-button div span.center-hr { margin: 5px auto; } header .right .nav-button div span.top-hr { -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } header .right .nav-button div span.bottom-hr { -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } header .right .nav-button.active div span { position: absolute; top: 50%; margin-top: -1px; left: 0; } header .right .nav-button.active div span.center-hr { display: none; } header .right .nav-button.active div span.top-hr { transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); } header .right .nav-button.active div span.bottom-hr { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); } header .right .login { float: left; width: 50%; } header .right .login a { display: block; width: 100%; height: 32px; background: rgba(0, 0, 0, 0.2); border-radius: 16px; color: #fff; text-align: center; line-height: 32px; font-size: 12px; } header .right .login a span.iconfont { font-size: 16px; position: relative; top: 2px; } header .right .lang { float: left; width: 30%; } header .right .lang a { display: block; font-size: 14px; color: #fff; line-height: 32px; text-align: center; } header .right .lang a span { font-size: 12px; } header .right .lang ul { height: 0; overflow: hidden; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } header .right .lang ul li { height: 2.5rem; background: rgba(0, 0, 0, 0.2); } header .right .lang ul li a { font-size: 14px; line-height: 2.5rem; display: block; } header .right .lang ul li a:hover { color: #9f223d; } header .right .lang:hover ul { height: 5rem; } header .right .search { float: left; width: 20%; text-align: center; cursor: pointer; position: relative; height: 32px; overflow: hidden; } header .right .search span { font-size: 14px; color: #fff; line-height: 32px; position: relative; z-index: 10; } header .right .search span.search-close { display: none; } header .right .search .input-search { position: absolute; height: 32px; width: 0; right: 0; top: 0; background: rgba(0, 0, 0, 0.4); z-index: 9; border-radius: 4px; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } header .right .search .input-search > .search-inline { position: absolute; left: 16px; top: 0; display: none; } header .right .search .input-search input { border: none; background: none; color: #fff; line-height: 32px; height: 32px; width: 100%; padding-left: 40px; position: absolute; left: 0; top: 0; } header .right.search-click .login { visibility: hidden; } header .right.search-click .lang { visibility: hidden; } header .right.search-click .search { width: 100%; position: absolute; right: 0; top: 0; } header .right.search-click .search span.search-open { display: none; } header .right.search-click .search span.search-close { display: block; position: absolute; right: 14px; top: 0; } header .right.search-click .search .input-search { width: 14rem; } header .right.search-click .search .input-search > .search-inline { display: block; } header .search-list { position: absolute; top: 5.5rem; width: 100%; background: rgba(0, 0, 0, 0.8); color: #fff; height: 0; overflow: hidden; display: none; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .header-mobile-mask { position: fixed; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 100; display: none; } .sign-up-header { position: fixed; width: 100%; height: 100%; top: 0; z-index: 1000; background-color: rgba(0, 0, 0, 0.4); display: none; } .sign-up-header .table { width: 70%; height: 35.5rem; background: #fff; position: absolute; top: 14%; left: 15%; overflow: hidden; } .sign-up-header .table .left { width: 56%; height: 100%; position: absolute; left: 0; top: 0; background: url(../img/member_left.jpg) no-repeat; background-size: cover; } .sign-up-header .table .left .logo { position: absolute; top: 8%; left: 8%; } .sign-up-header .table .left .text { position: absolute; bottom: 8%; left: 8%; color: #fff; } .sign-up-header .table .left .text h4 { font-size: 1rem; } .sign-up-header .table .left .text h2 { font-size: 2.2rem; font-weight: bold; letter-spacing: 1px; position: relative; top: -0.4rem; } .sign-up-header .table .left .text h3 { font-size: 1.1rem; letter-spacing: 1px; } .sign-up-header .table .right { width: 44%; float: right; padding: 4%; } .sign-up-header .table .right .member-login .top { margin-top: 1rem; } .sign-up-header .table .right .member-login .top h2 { float: left; font-size: 1.7rem; font-weight: bold; } .sign-up-header .table .right .member-login .top p { float: right; font-size: 1.1rem; color: #999; position: relative; top: 0.6rem; } .sign-up-header .table .right .member-login .top p span { color: #9f223d; cursor: pointer; margin-left: 10px; } .sign-up-header .table .right .member-login .wrap { margin-top: 1rem; } .sign-up-header .table .right .member-login .wrap span { font-size: 1.1rem; color: #999; cursor: pointer; display: inline-block; position: relative; } .sign-up-header .table .right .member-login .wrap span:last-child { margin-left: 20px; } .sign-up-header .table .right .member-login .wrap span:before { content: ''; width: 0; height: 2px; position: absolute; left: 0; bottom: -10px; background: #9f223d; } .sign-up-header .table .right .member-login .wrap span.active { color: #9f223d; } .sign-up-header .table .right .member-login .wrap span.active:before { width: 100%; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .sign-up-header .table .right .member-login .wrap span:hover { color: #9f223d; } .sign-up-header .table .right .member-login .wrap span:hover:before { width: 100%; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .sign-up-header .table .right .member-login .mode { margin-top: 3rem; width: 100%; } .sign-up-header .table .right .member-login .mode li { width: 100%; } .sign-up-header .table .right .member-login .mode li > div { width: 100%; margin-top: 1rem; } .sign-up-header .table .right .member-login .mode li > div input { width: 100%; height: 2.5rem; border: 1px solid #e4e8eb; padding-left: 1rem; font-size: 0.8rem; color: #999; } .sign-up-header .table .right .member-login .mode li p { font-size: 0.7rem; color: #999; margin-top: 1rem; margin-bottom: 1rem; } .sign-up-header .table .right .member-login .mode li p a { color: #9f223d; text-decoration: underline; } .sign-up-header .table .right .member-login .mode li .button { display: inline-block; width: 10rem; height: 3rem; border-radius: 30px; background: #9f223d; color: #fff; font-size: 0.8rem; text-align: center; line-height: 3rem; cursor: pointer; } .sign-up-header .table .right .member-login .mode li span { font-size: 0.7rem; margin-left: 30px; cursor: pointer; } .sign-up-header .table .right .member-login .mode li.shouji { display: none; } .sign-up-header .table .right .member-login .mode li.shouji > div.phone input { width: 66%; float: left; } .sign-up-header .table .right .member-login .mode li.shouji > div.phone a { width: 34%; height: 2.5rem; background: #c7c6cb; color: #fff; display: inline-block; float: left; text-align: center; line-height: 2.5rem; } .sign-up-header .table .right .member-login .third-part { margin-top: 2rem; border-top: 1px solid #e4e8eb; padding-top: 1.2rem; text-align: center; } .sign-up-header .table .right .member-login .third-part p { font-size: 0.7rem; color: #999; } .sign-up-header .table .right .member-login .third-part > ul { display: inline-block; margin-top: 1rem; } .sign-up-header .table .right .member-login .third-part > ul li { float: left; width: 2.8rem; height: 2.8rem; border-radius: 50%; background: #ddd; margin-right: 1.4rem; cursor: pointer; } .sign-up-header .table .right .member-login .third-part > ul li span { font-size: 1.5rem; color: #fff; line-height: 2.8rem; } .sign-up-header .table .right .member-login .third-part > ul li:hover:first-child { background: #9e223f; } .sign-up-header .table .right .member-login .third-part > ul li:hover:nth-child(2) { background: #09bb07; } .sign-up-header .table .right .member-login .third-part > ul li:hover:last-child { background: #2caae7; } .sign-up-header .table .right .forget-password { display: none; } .sign-up-header .table .right .forget-password h2 { font-size: 1.7rem; font-weight: bold; margin-top: 2rem; margin-bottom: 2rem; } .sign-up-header .table .right .forget-password .button { display: inline-block; width: 10rem; height: 3rem; border-radius: 30px; background: #9f223d; color: #fff; font-size: 0.8rem; text-align: center; line-height: 3rem; cursor: pointer; margin-top: 2rem; } .sign-up-header .table .right .forget-password > div { width: 100%; margin-top: 1rem; } .sign-up-header .table .right .forget-password > div input { width: 100%; height: 2.5rem; border: 1px solid #e4e8eb; padding-left: 1rem; font-size: 0.8rem; color: #999; } .sign-up-header .table .right .forget-password > div.phone input { width: 66%; float: left; } .sign-up-header .table .right .forget-password > div.phone a { width: 34%; height: 2.5rem; background: #c7c6cb; color: #fff; display: inline-block; float: left; text-align: center; line-height: 2.5rem; } .sign-up-header .table .close { position: absolute; right: 1rem; top: 1rem; color: #999; font-size: 0.9rem; cursor: pointer; } .sign-up-header .table.active { background: #fff url(../img/member_bg.png) no-repeat right bottom; } .register-header { position: fixed; width: 100%; height: 100%; top: 0; z-index: 1000; background-color: rgba(0, 0, 0, 0.4); display: none; } .register-header .table { width: 70%; height: 35.5rem; background: #fff; position: absolute; top: 14%; left: 15%; overflow: hidden; } .register-header .table .left { width: 21%; height: 100%; position: absolute; left: 0; top: 0; background: url(../img/register.png) no-repeat; background-size: cover; } .register-header .table .left .logo { position: absolute; top: 8%; left: 8%; } .register-header .table .right { width: 79%; float: right; padding: 4%; } .register-header .table .right .top { margin-top: 2rem; } .register-header .table .right .top h2 { float: left; font-size: 1.7rem; font-weight: bold; } .register-header .table .right .top p { float: right; font-size: 1.1rem; color: #999; } .register-header .table .right .top p span { color: #9f223d; cursor: pointer; margin-left: 10px; } .register-header .table .right form { margin-top: 1rem; } .register-header .table .right form ul li { float: left; width: 49%; margin-top: 1rem; } .register-header .table .right form ul li input { width: 100%; height: 2.5rem; border: 1px solid #e4e8eb; padding-left: 3%; font-size: 0.8rem; } .register-header .table .right form ul li input::-webkit-input-placeholder { color: #999; } .register-header .table .right form ul li input::-ms-input-placeholder { color: #999; } .register-header .table .right form ul li input::-moz-placeholder { color: #999; } .register-header .table .right form ul li select { width: 100%; height: 2.5rem; border: 1px solid #e4e8eb; padding-left: 3%; color: #ccc; font-size: 0.8rem; } .register-header .table .right form ul li.half { width: 23.5%; } .register-header .table .right form ul li.m-right { margin-right: 2%; } .register-header .table .right form ul li.phone input { width: 66%; float: left; } .register-header .table .right form ul li.phone a { width: 34%; height: 2.5rem; background: #c7c6cb; color: #fff; display: inline-block; float: left; text-align: center; line-height: 2.5rem; } .register-header .table .right form p { font-size: 0.7rem; color: #999; margin-top: 1rem; } .register-header .table .right form p input { margin-right: 0.4rem; } .register-header .table .right form p a { color: #9f223d; text-decoration: underline; } .register-header .table .right form .button { display: inline-block; width: 10rem; height: 3rem; border-radius: 30px; background: #c7c6cb; color: #fff; font-size: 0.8rem; text-align: center; line-height: 3rem; cursor: pointer; margin-top: 2rem; } .register-header .table .close { position: absolute; right: 1rem; top: 1rem; color: #999; font-size: 0.9rem; cursor: pointer; } footer .con { padding-left: 8%; padding-right: 8%; background: #111; } footer .con .top { padding: 4.2rem 0; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } footer .con .top h2 { color: #fff; float: left; width: 20%; font-size: 1.2rem; } footer .con .top .footer-slider { float: left; width: 80%; } footer .con .top .footer-slider > ul li a img { width: 100%; } footer .con .bottom { padding: 5rem 0 5.5rem; } footer .con .bottom > ul > li { float: left; width: 12.9%; } footer .con .bottom > ul > li > a { color: #fff; font-size: 1.2rem; letter-spacing: 1px; position: relative; } footer .con .bottom > ul > li:not(:last-child) > a:before { content: ''; width: 22px; height: 1px; background: #9e223f; position: absolute; bottom: -1.6rem; left: 0; } footer .con .bottom > ul > li:last-child { width: 9.6%; position: relative; } footer .con .bottom > ul > li:last-child .share { margin-top: 20px; margin-bottom: 20px; position: relative; } footer .con .bottom > ul > li:last-child .share a { display: inline-block; width: 46px; height: 46px; background: #9e223f; border-radius: 50%; text-align: center; } footer .con .bottom > ul > li:last-child .share a span { color: #fff; font-size: 22px; line-height: 46px; } footer .con .bottom > ul > li:last-child .share a.weibo:hover { background: #9e223f; } footer .con .bottom > ul > li:last-child .share a.weixin { margin-left: 18px; } footer .con .bottom > ul > li:last-child .share a.weixin:hover { background: #09bb07; } footer .con .bottom > ul > li:last-child .share .erweima { width: 40%; position: absolute; right: 0; top: -3rem; } footer .con .bottom > ul > li:last-child .share .erweima img { width: 100%; } footer .con .bottom > ul > li:last-child h3 { font-size: 0.7rem; color: #fff; margin-bottom: 0.4rem; } footer .con .bottom > ul > li:last-child h2 { font-size: 2rem; color: #fff; white-space: nowrap; } footer .con .bottom > ul > li > ul { margin-top: 3rem; } footer .con .bottom > ul > li > ul li a { color: #fff; opacity: 0.4; font-size: 0.7rem; line-height: 1.8rem; } footer .con .bottom > ul > li > ul li a:hover { opacity: 1; } footer .con .bottom .mobile-share { display: none; } footer .copy { height: 4rem; padding-left: 8%; padding-right: 8%; background: #fff; overflow: hidden; } footer .copy .left { float: left; } footer .copy .left p { line-height: 4rem; font-size: 0.7rem; color: #999; } footer .copy .left p a { color: #999; } footer .copy .left p a:hover { color: #333; } footer .copy .right { float: right; } footer .copy .right > ul li { float: left; line-height: 4rem; } footer .copy .right > ul li a { font-size: 0.7rem; color: #999; padding: 0 10px; position: relative; } footer .copy .right > ul li:not(:last-child) a:before { content: ''; width: 1px; height: 10px; background: #999; position: absolute; right: 0; top: 24%; } footer .copy .right > ul li:hover a { color: #333; } .book-appointment { position: fixed; width: 100%; height: 100%; top: 0; z-index: 1000; background-color: rgba(0, 0, 0, 0.4); display: none; } .book-appointment .table { width: 60%; height: 60%; position: absolute; left: 20%; top: 20%; background: #fff; padding: 2% 3%; } .book-appointment .table h2 { font-size: 1.7rem; font-weight: bold; margin-bottom: 0.2rem; } .book-appointment .table h2 span { color: #9f223d; } .book-appointment .table h2 span.title { color: #333; font-size: 18px; margin-left: 1rem; } .book-appointment .table form { height: 78%; } .book-appointment .table form .big-box { height: 86%; padding-top: 2%; } .book-appointment .table form .big-box .left { float: left; width: 48%; height: 100%; } .book-appointment .table form .big-box .left > ul { height: 100%; } .book-appointment .table form .big-box .left > ul li { float: left; width: 100%; height: 25%; } .book-appointment .table form .big-box .left > ul li:not(:last-child) { padding-bottom: 3%; } .book-appointment .table form .big-box .left > ul li input { width: 100%; height: 100%; border: none; padding-left: 1rem; background: #f3f3f5; font-size: 0.8rem; color: #999; } .book-appointment .table form .big-box .left > ul li.input-left { width: 40%; } .book-appointment .table form .big-box .left > ul li.input-right { float: right; width: 57%; } .book-appointment .table form .big-box .right { float: right; width: 48%; height: 100%; position: relative; } .book-appointment .table form .big-box .right span { position: absolute; top: 1rem; left: 1rem; font-size: 0.8rem; color: #999; z-index: 100; } .book-appointment .table form .big-box .right textarea { background: #f3f3f5; width: 100%; border: none; padding: 2.5rem 1rem; height: 100%; } .book-appointment .table form .btn { width: 10rem; height: 3rem; background: #9f223d; color: #fff; border-radius: 30px; font-size: 0.8rem; text-align: center; line-height: 3rem; cursor: pointer; float: right; margin-top: 1.4rem; } .book-appointment .table form .btn:hover { background: #7a1d2f; } .book-appointment .table .close { position: absolute; right: 1rem; top: 1rem; color: #999; font-size: 0.9rem; cursor: pointer; } .sidebar { position: fixed; right: 2%; top: 30%; z-index: 1000; display: none; } .sidebar > ul li { width: 3rem; height: 3rem; background: #fff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15); margin-top: 10px; text-align: center; cursor: pointer; position: relative; left: 0; transition: all 0.2s; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; } .sidebar > ul li a { display: block; } .sidebar > ul li span { font-size: 1.5rem; color: #9f223d; line-height: 3rem; } .sidebar > ul li:hover { left: -4px; background: #9f223d; } .sidebar > ul li:hover span { color: #fff; } .sidebar > ul li:hover:nth-child(3) { border: none; left: -9rem; opacity: 1; } .sidebar > ul li:hover:nth-child(3) .tel { opacity: 1; } .sidebar > ul li:hover:nth-child(4) .erweima { display: block; } .sidebar > ul li h2 { display: none; } .sidebar > ul li:nth-child(3) { position: relative; left: 0; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .sidebar > ul li:nth-child(3) .tel { width: 9rem; height: 3rem; position: absolute; right: -9rem; top: 0; font-size: 20px; line-height: 3rem; background: #9f223d; color: #fff; opacity: 0; } .sidebar > ul li:nth-child(4) { position: relative; } .sidebar > ul li:nth-child(4) .erweima { position: absolute; width: 5rem; left: -6rem; top: -1rem; display: none; } .sidebar > ul li:nth-child(4) .erweima img { width: 100%; } #videoPopup { position: fixed; width: 100%; height: 100%; top: 0; z-index: 1000; background-color: rgba(0, 0, 0, 0.4); display: none; } @media screen and (max-width: 1680px) { html { font-size: 19px; } header .right.search-click .search .input-search { width: 12rem; } } @media screen and (max-width: 1500px) { header nav > ul > li > a { padding: 0 0.8rem; } header nav > ul > li:hover > a::after, header nav > ul > li > a:hover::after{ width: calc(100% - 0.8rem - 0.8rem); left: 0.8rem; } header nav > ul > li .drop-down.drop-down-fund { width: 140%; margin-left: -20%; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav .item h2 { padding-left: 1rem; padding-right: 1rem; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav .item > ul > li{ padding-left: 1rem; padding-right: 1rem; } footer .con .bottom > ul > li > ul li a { font-size: 0.65rem; line-height: 1.6rem; } header nav > ul > li .drop-down.drop-down-solve > ul > li a h2{ font-size: 0.7rem; } } @media screen and (max-width: 1366px) { html { font-size: 18px; } .w1380 { width: 60rem; } .w1420 { width: 62rem; } footer .con .bottom > ul > li > a { font-size: 1rem; } footer .con .bottom > ul > li:last-child .share a.weixin { margin-left: 0; } header .right.search-click .search .input-search { width: 11rem; } .sign-up-header .table { top: 2%; } .register-header .table { top: 2%; } .book-appointment .table { width: 70%; left: 15%; } } @media screen and (max-width: 1280px) { header nav > ul > li > a { padding: 0 0.5rem; } header nav > ul > li:hover > a::after, header nav > ul > li > a:hover::after{ width: calc(100% - 0.5rem - 0.5rem); left: 0.5rem; } header nav > ul > li .drop-down { width: 100%; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav { width: 100%; } header nav > ul > li .drop-down.drop-down-solve { width: 100%; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav .item h2{ font-size:0.8rem; padding:0 1rem; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav .item > ul > li { padding: 0.3rem 1rem 0.6rem; } } @media screen and (max-width: 1024px) { #new_pro_tab{ z-index: 99; } header nav > ul > li .drop-down.drop-down-product::before{ display: none; } html { font-size: 16px; } .w1380 { width: 56rem; } .w1420 { width: 58rem; } header { position: fixed; background: #fff; top: 0; height: 5.5rem; padding-left: 0; padding-right: 0; z-index: 102; } header .logo { width: 14%; height: 5.5rem; position: relative; } header .logo a { height: 100%; } header .logo a img.pc { display: none; } header .logo a img.mobile { display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } header nav { position: absolute; top: 5.5rem; } header .header_in > .right { float: right; width: 70%; } header .header_in > .right .nav-button { display: block; } header .header_in > .right .login { float: right; width: 3.5rem; height: 5.5rem; } header .header_in > .right .login a { background: none; } header .header_in > .right .login a span { color: #333; display: none; } header .header_in > .right .login a span.iconfont { display: block; font-size: 1.9rem; line-height: 5.5rem; } header .header_in > .right .search { float: right; width: 3.5rem; height: 5.5rem; } header .header_in > .right .search span { color: #333; font-size: 1.6rem; line-height: 5.5rem; position: relative; top: 2px; } header .header_in > .right .search span.search-open { display: block; } header .header_in > .right .search span.search-close { display: none; } header .header_in > .right .search.active span.search-open { display: none; } header .header_in > .right .search.active span.search-close { display: block; } header .header_in > .right .search .input-search input { display: none; } header .header_in > .right .lang { display: none; } header nav { width: 100%; background: #fff; box-shadow: inset 0 2px 20px rgba(0, 0, 0, 0.1); max-height: 0; overflow: hidden; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } header nav > ul { padding: 0 1rem; width: 100%; float: none; } header nav > ul > li { float: none; height: auto; position: relative; } header nav > ul > li > a { color: #666; font-size: 16px; font-weight: bold; line-height: 4rem; display: block; width: 60%; position: relative; } header nav > ul > li > a:before { content: ''; width: 165%; height: 1px; background: #eaecef; position: absolute; bottom: 0; left: 0; } header nav > ul > li > a::after{ display: none !important; } header nav > ul > li:first-child > a { width: 100%; } header nav > ul > li:nth-child(3) > a { width: 100%; } header nav > ul > li .drop-down-product { max-height: 0; overflow: hidden; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } header nav > ul > li .drop-down-fund { max-height: 0; overflow: hidden; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } header nav > ul > li .drop-down-solve { max-height: 0; overflow: hidden; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } header nav > ul > li:after { content: '\e626'; font-family: iconfont; position: absolute; right: 2%; top: 1rem; font-size: 1.7rem; } header nav > ul > li:first-child:after { display: none; } header nav > ul > li:nth-child(2) a span { display: none; } header nav > ul > li:nth-child(3):after { display: none; } header nav > ul > li:nth-child(5) a span { display: none; } header nav > ul > li .drop-down.drop-down-product { display: block; width: 100%; position: relative; top: 0; left: 0; } header nav > ul > li .drop-down.drop-down-product .left { display: none; } header nav > ul > li .drop-down.drop-down-product .right { display: none; } header nav > ul > li .drop-down.drop-down-product > ul { display: block; padding: 0; width: 100%; } header nav > ul > li .drop-down.drop-down-product > ul > li { position: relative; } header nav > ul > li .drop-down.drop-down-product > ul > li:after { content: '\e626'; font-family: iconfont; position: absolute; right: 4%; top: 8px; font-size: 1.2rem; } header nav > ul > li .drop-down.drop-down-product > ul > li.mobile_two:after { content: '\e794'; color: #9f223d; } header nav > ul > li .drop-down.drop-down-product > ul > li.mobile_two > ul { max-height: 400px; overflow: auto; } header nav > ul > li .drop-down.drop-down-product > ul > li h2 { color: #666; font-size: 14px; font-weight: bold; line-height: 2.5rem; width: 100%; padding-left: 2rem; border-bottom: 1px solid #eaecef; } header nav > ul > li .drop-down.drop-down-product > ul > li > ul { max-height: 0; overflow: hidden; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } header nav > ul > li .drop-down.drop-down-product > ul > li > ul > li.mobile_three h2:after { content: '\e794'; color: #9f223d; } header nav > ul > li .drop-down.drop-down-product > ul > li > ul > li.mobile_three > ul { max-height: 400px; overflow: auto; } header nav > ul > li .drop-down.drop-down-product > ul > li > ul > li h2 { padding-left: 3rem; font-size: 13px; position: relative; } header nav > ul > li .drop-down.drop-down-product > ul > li > ul > li h2:after { content: '\e626'; font-family: iconfont; position: absolute; right: 6%; top: 3px; font-size: 0.8rem; } header nav > ul > li .drop-down.drop-down-product > ul > li > ul > li > ul { max-height: 0; overflow: hidden; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } header nav > ul > li .drop-down.drop-down-product > ul > li > ul > li > ul li a { display: block; color: #666; font-size: 12px; font-weight: bold; line-height: 2.5rem; width: 100%; padding-left: 4rem; border-bottom: 1px solid #eaecef; } header nav > ul > li .drop-down.drop-down-fund { display: block; position: relative; top: 0; left: 0; } header nav > ul > li .drop-down.drop-down-fund > ul { padding: 0; } header nav > ul > li .drop-down.drop-down-fund > ul li { height: auto; padding-left: 2rem; border-bottom: 1px solid #eaecef; } header nav > ul > li .drop-down.drop-down-fund > ul li a { color: #666; font-size: 14px; font-weight: bold; line-height: 2.5rem; display: block; width: 100%; text-align: left; } header nav > ul > li .drop-down.drop-down-fund.drop-down-fund:before { display: none; } header nav > ul > li .drop-down.drop-down-solve { display: block; padding: 0; position: relative; top: 0; left: 0; } header nav > ul > li .drop-down.drop-down-solve > ul { padding: 0; } header nav > ul > li .drop-down.drop-down-solve > ul li { width: 100%; height: auto; margin-top: 0; padding-left: 2rem; border-bottom: 1px solid #eaecef; } header nav > ul > li .drop-down.drop-down-solve > ul li a { color: #666; font-size: 14px; font-weight: bold; line-height: 2.5rem; display: block; width: 100%; text-align: left; } header nav > ul > li .drop-down.drop-down-solve > ul li a .tu { display: none; } header nav > ul > li .drop-down.drop-down-solve > ul li a h2 { float: none; font-weight: bold; line-height: 2.5rem; font-size: 14px; width: 100%; } header nav > ul > li .drop-down.drop-down-solve.drop-down-solve:before { display: none; } header nav > ul > li.mobile_active:after { content: '\e794'; color: #9f223d; } header nav > ul > li.mobile_active .drop-down-product { max-height: 400px; overflow: auto; } header nav > ul > li.mobile_active .drop-down-fund { max-height: 400px; overflow: auto; } header nav > ul > li.mobile_active .drop-down-solve { width: 100%; max-height: 400px; overflow: auto; } header nav .nav-bottom { display: block; position: relative; padding: 0 1rem; } header nav .nav-bottom:after { content: '\e626'; font-family: iconfont; position: absolute; right: 3.5%; top: 1rem; font-size: 1.7rem; } header nav .nav-bottom h2 { color: #666; font-size: 16px; font-weight: bold; line-height: 4rem; display: block; width: 60%; position: relative; padding-left: 1rem; } header nav .nav-bottom h2:before { content: ''; width: 165%; height: 1px; background: #eaecef; position: absolute; bottom: 0; left: 0; } header nav .nav-bottom h2 span { font-size: 1.4rem; font-weight: normal; color: #9f223d; margin-right: 0.5rem; position: relative; top: 2px; } header nav .nav-bottom .drop-down { max-height: 0; overflow: hidden; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } header nav .nav-bottom .drop-down > ul { padding: 0; } header nav .nav-bottom .drop-down > ul li { height: auto; padding-left: 2rem; border-bottom: 1px solid #eaecef; } header nav .nav-bottom .drop-down > ul li a { color: #666; font-size: 14px; font-weight: bold; line-height: 2.5rem; display: block; width: 100%; text-align: left; } header nav .nav-bottom.mobile_active:after { content: '\e794'; color: #9f223d; } header nav .nav-bottom.mobile_active .drop-down { max-height: 400px; overflow: auto; } header nav.active { max-height: unset; padding-bottom: 4rem; overflow-y: auto; } header nav > ul > li .drop-down.drop-down-fund > ul{ display: block; } header nav > ul > li.mobile_active .drop-down-fund { width: 100%; margin-left: 0; padding: 0; } header nav > ul > li.mobile_active .drop-down-product { width: 100%; margin-left: 0; padding: 0; } header { padding-left: 0 !important; padding-right: 0 !important; } header .search-list { display: block; } header .search-list h2 { position: relative; } header .search-list h2 span { position: absolute; left: 1rem; top: 8px; font-size: 18px; color: #666; z-index: 2; } header .search-list h2 input { width: 100%; height: 2.5rem; border-radius: 4px; border: none; padding-left: 3rem; position: relative; } header .search-list h3 { font-size: 16px; opacity: 0.5; margin-top: 1rem; } header .search-list ul li { font-size: 14px; margin-top: 1.5rem; } header .search-list.mobile-search { padding: 2rem 1.5rem 3rem; height: 400px; overflow: auto; } footer.slider { padding-bottom: 5.5rem; } footer .con { padding-left: 3%; padding-right: 3%; } footer .con > .top { padding: 2.2rem 0; } footer .con > .top h2 { display: none; } footer .con > .top .footer-slider { width: 100%; } footer .con .bottom { padding: 0; } footer .con .bottom > ul > li { float: none; width: 100%; position: relative; } footer .con .bottom > ul > li:before { content: '\e81c'; font-family: iconfont; font-size: 18px; color: rgba(255, 255, 255, 0.6); position: absolute; right: 1rem; top: 10px; } footer .con .bottom > ul > li > a { width: 60%; display: block; line-height: 3rem; position: relative; font-size: 16px; } footer .con .bottom > ul > li > a:after { content: ''; width: 165%; height: 1px; background: #292929; position: absolute; left: 0; bottom: 0; } footer .con .bottom > ul > li > ul { margin-top: 0; max-height: 0; overflow: hidden; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } footer .con .bottom > ul > li > ul li { padding-left: 1rem; } footer .con .bottom > ul > li > ul li a { font-size: 14px; display: block; line-height: 2rem; border-bottom: 1px solid rgba(255, 255, 255, 0.4); } footer .con .bottom > ul > li:not(:last-child) > a:before { display: none; } footer .con .bottom > ul > li.mobile_active:before { content: '\e613'; } footer .con .bottom > ul > li.mobile_active > ul { max-height: 400px; overflow: auto; } footer .con .bottom > ul > li:last-child { display: none; } footer .con .bottom .mobile-share { display: block; } footer .con .bottom .mobile-share > .top { padding: 2rem 0 1rem; border-bottom: none; text-align: center; } footer .con .bottom .mobile-share h3 { color: #fff; font-size: 16px; text-align: center; } footer .con .bottom .mobile-share h2 { color: #fff; font-size: 22px; text-align: center; margin-top: 4px; } footer .con .bottom .mobile-share .share { text-align: center; } footer .con .bottom .mobile-share .share a { display: inline-block; width: 100px; height: 100px; border-radius: 50%; background: #323232; text-align: center; margin: 2rem 0; } footer .con .bottom .mobile-share .share a span { color: #fff; font-size: 50px; line-height: 100px; } footer .con .bottom .mobile-share .share a.weibo { background: #9f223d; } footer .con .bottom .mobile-share .share a.weixin { margin-left: 1rem; } footer .copy .left { width: 100%; } footer .copy .left p { text-align: center; } footer .copy .right { display: none; } .sign-up-header .table { height: 34.5rem; } .sign-up-header .table .left { width: 43%; } .sign-up-header .table .left .text h2 { font-size: 1.8rem; } .sign-up-header .table .left .text h3 { font-size: 1rem; } .sign-up-header .table .right { width: 57%; } .book-appointment .table { width: 80%; left: 10%; } .sidebar { left: 0; bottom: 0; top: auto; right: auto; display: block; width: 100%; height: 5.5rem; } .sidebar > ul li { float: left; width: 25%; box-shadow: none; height: 5.5rem; margin-top: 0; border: none; background: #9f223d; padding-top: 8px; } .sidebar > ul li span { font-size: 40px; color: #fff; } .sidebar > ul li:nth-child(3):hover { left: 0; } .sidebar > ul li:nth-child(3) .tel { display: none; } .sidebar > ul li:nth-child(4) .erweima { width: 12rem; left: 2rem; top: -13.5rem; } .sidebar > ul li:last-child { display: none; } .sidebar > ul li h2 { display: block; color: #fff; font-size: 16px; text-align: center; } .sidebar > ul li h2 a { color: #fff; } .sidebar > ul li:hover { left: 0; } } @media screen and (max-width: 768px) { html { font-size: 12px; } .w1380 { width: 100%; padding: 0 10px; } .w1420 { width: 100%; padding: 0 10px; } header .logo { width: 32%; } header .logo img { max-width: 64px; } header .header_in > .right { width: 60%; } header nav .nav-bottom:after { right: 4.8%; } header .search-list h2 span { top: 2px; } header .right .nav-button { width: 3.5rem; } header .right .nav-button div span { width: 80%; } footer .con .bottom .mobile-share .share a { width: 50px; height: 50px; } footer .con .bottom .mobile-share .share a span { line-height: 50px; font-size: 24px; } footer .copy { padding: 1.5rem 2rem; height: auto; } footer .copy .left p { line-height: 1.5; } footer .con .bottom > ul > li:before { top: 6px; } .sign-up-header .table { height: 35.5rem; width: 80%; left: 10%; } .sign-up-header .table .left { display: none; } .sign-up-header .table .right { width: 100%; } .sign-up-header .table .right .member-login .top { margin-top: 2.2rem; } .sign-up-header .table .right .member-login .top h2 { font-size: 16px; } .sign-up-header .table .right .member-login .top p { font-size: 13px; top: 0; } .sign-up-header .table .right .member-login .mode { margin-top: 2rem; } .sign-up-header .table .right .member-login .mode li p a { font-size: 12px; } .sign-up-header .table .right .member-login .mode li.shouji > div.phone a { font-size: 12px; } .sign-up-header .table .right .member-login .third-part p { font-size: 12px; } .sign-up-header .table .right .forget-password h2 { font-size: 16px; } .sign-up-header .table .right .forget-password > div.phone a { font-size: 12px; } .register-header .table { overflow: auto; width: 80%; left: 10%; } .register-header .table .left { display: none; } .register-header .table .right { width: 100%; } .register-header .table .right .top { margin-top: 2.2rem; } .register-header .table .right .top h2 { font-size: 16px; } .register-header .table .right .top p { font-size: 13px; top: 0; } .register-header .table .right form p { font-size: 12px; } .register-header .table .right form ul li { width: 100%; } .register-header .table .right form ul li.m-right { width: 100%; } .register-header .table .right form ul li.half { width: 100%; } .register-header .table .right form ul li.phone a { font-size: 12px; } .book-appointment .table { width: 90%; height: 76%; left: 5%; top: 6%; overflow: auto; padding: 4%; } .book-appointment .table h2 { font-size: 16px; } .book-appointment .table h2 span.title { display: block; font-size: 13px; margin-left: 0; margin-bottom: 1rem; } .book-appointment .table form .big-box .left { width: 100%; height: 80%; } .book-appointment .table form .big-box .left > ul li { height: 20%; } .book-appointment .table form .big-box .left > ul li.input-left { width: 100%; } .book-appointment .table form .big-box .left > ul li.input-right { width: 100%; } .book-appointment .table form .big-box .right { width: 100%; height: 40%; } .book-appointment .table form .btn { font-size: 14px; } .sidebar > ul { background: #9f223d; } .sidebar > ul li { padding-top: 8px; } .sidebar > ul li span { font-size: 20px; line-height: 1.5; } .sidebar > ul li h2 { font-size: 12px; } .sidebar > ul li:nth-child(4) .erweima { left: -5rem; } header nav > ul > li .drop-down.drop-down-product .right .masonry-nav::after{ display:none; } header nav > ul > li .drop-down.drop-down-solve::after{ display:none; } } /*# sourceMappingURL=./base.css.map */