nav { position: fixed; right: 2%; top: 30%; z-index: 99; cursor: pointer; } nav img { } nav .tips { background: #fff; box-shadow: 0px 4px 12px rgba(164, 192, 242, 0.34); position: absolute; top: -80px; right: 0px; color: #373858; width: 200px; border-radius: 10px; padding: 20px; } .text-title { margin: 15px 0; } .text-title img { width: 120px; } .text-title span { color: #b8c4de; font-weight: 600; font-size: 18px; font-style: italic; vertical-align: bottom; } .text-title a { color: #626d82; } .el-carousel__item img { width: 100%; height: 100%; } .el-carousel__item:nth-child(2n) { background-color: #99a9bf; } .el-carousel__item:nth-child(2n 1) { background-color: #d3dce6; } .dialog { width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: 999; background: rgba(0, 0, 0, 0.4); padding-top: 50px; display: none; } .dialog .main { width: 900px; height: 650px; background: no-repeat; background-size: 100% 100%; padding: 30px; } .dialog .main .header { color: #fff; font-size: 18px; padding-left: 55px; position: relative; } .dialog .main .header .xl { position: absolute; top: -90px; left: -48px; width: 140px; } .dialog .main .header .no { display: inline-block; color: #fff; font-size: 14px; cursor: pointer; } .dialog .main .header .btn-close { margin-left: 15px; display: inline-block; cursor: pointer; color: #fff; font-size: 14px; width: 115px; height: 40px; line-height: 40px; padding: 0 10px; border: 1px solid #fff; border-radius: 90px; } .dialog .main .header .btn-close img { width: 25px; } .dialog .main .content { background: no-repeat; background-size: 100% 100%; width: 100%; height: 450px; margin: 45px 0 15px; padding-top: 20px; position: relative; } .dialog .main .content .tabs { margin-left: 20px; cursor: pointer; display: inline-block; padding: 0 15px; width: 180px; height: 60px; line-height: 50px; background: no-repeat; background-size: 100% 100%; } .dialog .main .content .tabs img { width: 35px; } .dialog .main .content .active { background: no-repeat; background-size: 100% 100%; } .dialog .main .content .center { position: relative; top: -26px; left: 10px; height: 370px; width: 100%; } .dialog .main .content .center img { width: 500px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; } .dialog .main .content .center .item { cursor: pointer; transition: width 1s ease-in-out; font-size: 14px; position: absolute; top: 40px; left: 100px; z-index: 2; background: #fff; background-blend-mode: multiply; box-shadow: inset 0px 1px 2px rgba(49, 59, 103, 0.27); border-radius: 3px; color: #adbbe2; width: 180px; height: 45px; line-height: 45px; text-align: center; padding: 0 10px; } .dialog .main .content .center .item:nth-child(2) { top: 40px; left: 100px; } .dialog .main .content .center .item:nth-child(3) { top: 115px; left: 10px; } .dialog .main .content .center .item:nth-child(4) { top: 200px; left: 40px; } .dialog .main .content .center .item:nth-child(5) { top: 275px; left: 10px; } .dialog .main .content .center .item:nth-child(6) { top: 309px; left: 200px; width: 150px; } .dialog .main .content .center .item:nth-child(7) { top: 300px; left: 375px; } .dialog .main .content .center .item:nth-child(8) { top: 307px; left: 580px; } .dialog .main .content .center .item:nth-child(9) { top: 210px; left: 590px; } .dialog .main .content .center .item:nth-child(10) { top: 130px; left: 625px; } .dialog .main .content .center .item:nth-child(11) { top: 40px; left: 550px; } .dialog .main .content .center .item:hover, .dialog .main .content .center .active { z-index: 8; width: auto; background: linear-gradient(180deg, #4981ff 0%, #719cff 100%); background-blend-mode: multiply; mix-blend-mode: normal; box-shadow: 0px 4px 8px #d3dcf3; border-radius: 3px; color: #fff; } .dialog .main .content .center .item:hover { z-index: 9; } .dialog .main .content .wd-a { position: relative; top: -30px; left: 20px; font-size: 14px; } .dialog .main .content .wd-a span { color: #3a8ee6; } .dialog .main .content .bottom { position: relative; top: -606px; left: -27px; } .dialog .main .content .bottom img { width: 947px; } .dialog .main .footer .el-input__inner { border: none; box-shadow: none; background: #fff; height: 60px; line-height: 60px; } .dialog .main .footer .el-input__inner::placeholder { color: #373858; } .dialog .main .footer .el-input-group__append { border: none; background: #437cff; color: #fff; margin: 20px; cursor: pointer; } .dialog .main .footer .el-button--primary { background: #437cff; border-radius: 0; margin-left: 20px; padding: 0 20px; height: 60px; line-height: 60px; } .dialog .main .footer .el-button--primary img { width: 24px; margin-right: 10px; } .top { width: 100%; height: 1300px; background: no-repeat; background-size: 100% 100%; } .top .main .consult .el-tabs__nav-wrap, .top .main .consult .el-tabs__nav-scroll { overflow: initial; } .top .main .consult .el-tabs__header { background: no-repeat; background-size: 100% 100%; box-shadow: 0px 0px 12px rgba(168, 178, 203, 0.18); } .top .main .consult .el-tabs__nav { float: none; text-align: center; } .top .main .consult .el-tabs__nav-wrap::after, .top .main .consult .el-tabs__active-bar { height: 0; } .top .main .consult .el-tabs__item.is-active { background: linear-gradient(180deg, #2d6bf3 0%, #3d81f2 99.83%); color: #fff; border-bottom: 3px solid #28d4fe; position: relative; } .top .main .consult .el-tabs__item.is-active:before { position: absolute; bottom: -8px; left: 50%; transform: translate(-50%); content: ''; border-top: 8px solid #28d4fe; border-left: 8px solid transparent; border-right: 8px solid transparent; } .top .main .consult .el-tabs__item { padding: 0 40px!important; } .top .main .consult ul { width: 100%; min-height: 200px; } .top .main .consult ul li { border-bottom: 1px dashed rgba(168, 178, 203, 0.42); padding: 20px 0; margin: 0 20px; position: relative; } .top .main .consult ul li:before { position: absolute; bottom: -2px; left: 0; content: ''; width: 4px; height: 4px; background: rgba(168, 178, 203, 0.42); transform: rotate(45deg); } .top .main .consult ul li h2 { color: #221920; font-size: 16px; font-weight: 600; position: relative; } .top .main .consult ul li h2:before { position: absolute; top: 7px; left: -15px; content: ''; width: 7px; height: 7px; border-radius: 50%; background: #0b5fb9; } .top .main .consult ul li h2 div { font-size: 14px; color: #ffffff; text-align: center; font-style: initial; width: 120px; height: 30px; line-height: 30px; background: no-repeat; background-size: 100% 100%; } .top .main .consult ul li p { color: #5a5866; font-size: 15px; height: 28px; line-height: 28px; } .top .main .consult .consult-right { width: 100%; height: 400px; background: no-repeat; background-size: 100% 100%; padding-top: 100px; } .top .main .consult .consult-right .title-name { font-size: 24px; padding-left: 50px; margin-left: 52px; color: #fff; } .top .main .consult .consult-right .title-name span { font-size: 16px; font-style: italic; margin-left: 10px; } .top .main .consult .consult-right a { display: block; margin-top: 150px; margin-left: 100px; } .top .main .matching { width: 100%; margin-bottom: 30px; } .top .main .project { margin: 30px 0 50px; display: flex; justify-content: space-between; } .top .main .project .project-item { width: 285px; height: 230px; padding: 30px; box-shadow: 2px 1px 5px 2px rgba(0, 0, 0, 0.1); border-radius: 2px; color: #373858; position: relative; cursor: pointer; } .top .main .project .project-item:hover { background: rgba(240, 245, 254, 0.4); } .top .main .project .project-item h2 { font-size: 18px; font-weight: 600; } .top .main .project .project-item p { height: 30px; line-height: 30px; } .top .main .project .project-item a { color: #f6713e; font-size: 14px; } .top .main .project .project-item img { position: absolute; bottom: 0; right: 0; } .top .main .project .project-item:nth-child(2) a { color: #216bf3; } .top .main .project .project-item:nth-child(3) a { color: #49bde8; } .top .main .project .project-item:last-child a { color: #67c984; } .top .main .el-carousel__item--card.is-active .btn-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 50px; height: 50px; border: 2px solid #fff; border-radius: 3px; color: #fff; font-size: 35px; text-align: center; } .top .main .el-dialog__body video { width: 100%; } .top .main .cloud-class .el-carousel__item--card { border-radius: 2px; } .top .main .cloud-class .el-carousel__item--card.is-active .btn-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 50px; height: 50px; border: 2px solid #fff; border-radius: 3px; color: #fff; font-size: 35px; text-align: center; } .top .main .cloud-class .el-carousel__item--card.is-active .title { position: absolute; bottom: 0; left: 0; width: 100%; background: rgba(85, 105, 182, 0.59); backdrop-filter: blur(12px); color: #fff; height: 40px; line-height: 40px; padding: 0 10px; font-size: 14px; } .top .main .cloud-class .el-carousel__indicators--outside button { background-color: #d0d9e9; opacity: 1; height: 3px; border-radius: 7px; } .top .main .cloud-class .el-carousel__indicator.is-active button { background-color: #437cff; } .top .main .class .title { color: #373858; font-size: 24px; } .top .main .class .in { font-size: 22px; font-style: italic; color: rgba(168, 178, 203, 0.28); height: 34px; line-height: 28px; position: relative; left: 30px; } .top .main .class .in:before { background: #5596fa; border-radius: 3px; position: absolute; bottom: 0px; left: 0; content: ''; width: 30px; height: 3px; } .top .main .class .item { color: #373858; padding: 10px 20px; border: 1px solid transparent; } .top .main .class .item h2 span { color: #8b96b2; font-size: 14px; } .top .main .class .item p { color: #8b96b2; font-size: 14px; line-height: 24px; } .top .main .class .item-active, .top .main .class .item:hover { border: 1px solid #e5eeff; box-sizing: border-box; box-shadow: 0px 4px 8px rgba(51, 109, 193, 0.2); border-radius: 4px; cursor: pointer; } .top .main .class .class-pagination { margin-top: 15px; text-align: right; } .top .main .class .class-pagination .pag-item { cursor: pointer; display: inline-block; margin-left: 5px; background: #d0d9e9; border-radius: 1px; width: 24px; height: 24px; line-height: 24px; text-align: center; font-style: italic; color: #798aaf; font-size: 14px; font-weight: 600; } .top .main .class .class-pagination .pag-active { background: #437cff; color: #fff; } .swiper-banner { margin-bottom: 30px; } .swiper-banner .el-carousel { width: 100%; } .main .subject { margin: 50px 0; } .main .subject .el-scrollbar__wrap { overflow-x: hidden; } .main .subject .el-tabs__active-bar, .main .subject .el-tabs__nav-wrap::after { height: 0 !important; } .main .subject .el-tabs__item { background: #e9ecf1; padding: 0 80px; height: 130px; line-height: 130px; border: 1px solid #f5f7f9; } .main .subject .el-tabs__item:first-child { margin-top: 20px; } .main .subject .el-tabs__item p { position: absolute; left: 5px; top: -15px; width: 30px; height: 30px; line-height: 30px; text-align: center; border-radius: 50%; background: #fff; color: #cfd7e5; font-style: italic; font-size: 16px; font-weight: 600; } .main .subject .el-tabs__item img { position: absolute; top: 0; right: 0; } .main .subject .el-tabs--left .el-tabs__header.is-left { margin-right: 0; } .main .subject .el-tabs--left .el-tabs__item.is-left { text-align: left; color: #626d82; } .main .subject .el-tabs__item.is-active { background: linear-gradient(175.13deg, #1b63e9 19.7%, #4e85fd 96.08%); position: relative; width: 110%; } .main .subject .el-tabs__item.is-active:before { position: absolute; top: 0; right: -1px; content: ''; border-left: 24px solid transparent; border-top: 64px solid #f0f4fd; border-bottom: 40px solid transparent; } .main .subject .el-tabs__item.is-active:after { position: absolute; bottom: -1px; right: -1px; content: ''; border-left: 24px solid transparent; border-bottom: 64px solid #f0f4fd; border-top: 40px solid transparent; } .main .subject .el-tabs__item.is-active div { color: #fff; font-size: 20px; } .main .subject .el-tabs__item.is-active p { color: #fff; background: #26bbfa; } .main .subject .el-tabs--left, .main .subject .el-tabs__nav-wrap, .main .subject .el-tabs__nav-scroll { overflow: initial; } .main .subject .el-tabs--left .el-tabs__header.is-left { width: 240px; } .main .subject .subject-box { width: 955px; height: 520px; background: no-repeat; background-size: 100% 100%; padding: 40px; position: relative; } .main .subject .subject-box .hc-more { color: #a8b2cb; } .main .subject .subject-box .hc-title { width: 290px; margin: 30px; } .main .subject .subject-box .hc-content { background: linear-gradient(180deg, #edf0f9 0%, #ffffff 100%); border: 1px solid #ffffff; box-shadow: 0px 0px 12px rgba(168, 178, 203, 0.18); border-radius: 2px; padding: 30px 40px 80px; } .main .subject .subject-box .hc-content .img { margin-right: 20px; width: 190px; } .main .subject .subject-box .hc-content p { color: #373858; font-size: 14px; line-height: 28px; letter-spacing: 1px; margin-top: 10px; } .main .subject .subject-box .hc-content .btn { width: 150px; cursor: pointer; } .main .subject .subject-box .text-title img { width: 100px; } .main .subject .subject-box .text-title span { font-size: 16px; } .main .subject .subject-box .ss-content { display: flex; justify-content: space-between; flex-direction: row; flex-wrap: wrap; } .main .subject .subject-box .ss-content .ss-item { width: 280px; background: linear-gradient(180deg, #f3f5f8 0%, #fefefe 100%); box-shadow: 6px 6px 22px #f3f5f9; } .main .subject .subject-box .ss-content .ss-item:hover a { color: #fff; background: #2c79e8; } .main .subject .subject-box .ss-content .ss-item:hover .img { display: none; } .main .subject .subject-box .ss-content .ss-item:hover .img_h { display: inline-block; } .main .subject .subject-box .ss-content .ss-item h2 { color: #221920; font-size: 16px; height: 40px; border-bottom: 1px dashed rgba(121, 138, 175, 0.63); position: relative; margin: 20px 20px 10px; padding-bottom: 10px; } .main .subject .subject-box .ss-content .ss-item h2:before { position: absolute; bottom: -2px; left: 0; content: ''; width: 4px; height: 4px; background: rgba(121, 138, 175, 0.63); transform: rotate(45deg); } .main .subject .subject-box .ss-content .ss-item h2 img { width: 45px; } .main .subject .subject-box .ss-content .ss-item a { width: 100%; color: #5a5866; line-height: 30px; height: 30px; font-size: 14px; display: inline-block; padding-left: 20px; box-sizing: border-box; } .main .subject .subject-box .ss-content .ss-item a .img_h { display: none; } .main .subject .subject-box .tab-top { cursor: pointer; display: inline-block; background: linear-gradient(180deg, #eef4fe 0%, #ffffff 100%); box-shadow: 0px 4px 4px rgba(35, 85, 199, 0.24), inset -1px 1px 0px #d8e7ff; backdrop-filter: blur(6px); border-radius: 6px; width: 120px; height: 40px; line-height: 40px; margin-right: 10px; text-align: center; } .main .subject .subject-box .tab-top-active { background: linear-gradient(180deg, #156cff 0%, #769ffe 100%); } .main .subject .subject-box .tab-m { display: flex; justify-content: space-between; border-bottom: 1px dashed #8b96b2; padding: 20px 0; } .main .subject .subject-box .tab-m .tab-m-i { width: 180px; height: 60px; line-height: 60px; text-align: center; color: #626d82; background: #fff; margin: 20px 0; position: relative; cursor: pointer; } .main .subject .subject-box .tab-m .tab-m-i:before { position: absolute; bottom: -10px; left: 50%; transform: translate(-50%); content: ''; border-top: 10px solid #fff; border-left: 10px solid transparent; border-right: 10px solid transparent; } .main .subject .subject-box .tab-m .tab-m-i-a { background: no-repeat; background-size: 100%; color: #fff; } .main .subject .subject-box .tab-m .tab-m-i-a:before { border-top: 10px solid #769df9; } .main .subject .subject-box .list-item { background: linear-gradient(180deg, #f3f5f8 0%, #fefefe 100%); box-shadow: 6px 6px 22px #f3f5f9; margin-top: 20px; height: 100px; } .main .subject .subject-box .list-item:hover h2 { border-bottom: none; } .main .subject .subject-box .list-item:hover h2:before { background: transparent; } .main .subject .subject-box .list-item:hover div { color: #fff; background: #2c79e8; box-shadow: 0px 4px 4px rgba(13, 71, 154, 0.25); } .main .subject .subject-box .list-item:hover div .img { display: none; } .main .subject .subject-box .list-item:hover div .img_h { display: inline-block; } .main .subject .subject-box .list-item:hover div .bt { display: inline-block; } .main .subject .subject-box .list-item h2 { border-bottom: 1px dashed rgba(121, 138, 175, 0.63); position: relative; color: #221920; margin: 20px 20px 0; } .main .subject .subject-box .list-item h2:before { position: absolute; bottom: -2px; left: 0; content: ''; width: 4px; height: 4px; background: rgba(121, 138, 175, 0.63); transform: rotate(45deg); } .main .subject .subject-box .list-item h2 img { width: 50px; } .main .subject .subject-box .list-item div { cursor: pointer; font-size: 14px; color: #5c5866; padding: 10px 20px; position: relative; } .main .subject .subject-box .list-item div .img_h { display: none; } .main .subject .subject-box .list-item div .bt { display: none; background: #fff; color: #2c79e8; position: absolute; top: 4px; right: 4px; width: 30px; height: 30px; font-size: 25px; } .main .subject .subject-box .list-item div .bt:before { position: absolute; top: -3px; left: -5px; width: 11px; height: 35px; content: ''; background: #2c79e8; transform: rotate(15deg); } .main .subject .subject-box .list-item div .bt i { position: absolute; top: 3px; left: 14px; } .main .alliance { cursor: pointer; display: block; box-sizing: border-box; width: 100%; height: 130px; border-radius: 5px; background: no-repeat; /* background: no-repeat;*/ background-size: 100% 100%; padding: 60px; } .main .alliance img { cursor: pointer; width: 200px; } .market-service { width: 100%; height: 500px; background: no-repeat; background-size: 100% 100%; } .market-service .main .el-tabs__active-bar { height: 4px; } .market-service .main .el-tabs__nav-wrap::after { height: 0 !important; } .market-service .main .el-tabs__header { margin: 0; } .market-service .main .market-main { background: linear-gradient(180deg, #f3f5f8 0%, #fefefe 100%); border: 2px solid #ffffff; box-shadow: 6px 6px 22px #f3f5f9; position: relative; top: -1px; left: -2px; } .market-service .main .market-main .market-left { height: 400px; padding: 50px; font-size: 30px; color: #fff; position: relative; } .market-service .main .market-main .market-left p { color: rgba(255, 255, 255, 0.4); font-size: 18px; height: 40px; line-height: 40px; margin-bottom: 30px; position: relative; } .market-service .main .market-main .market-left p:before { width: 30px; height: 3px; position: absolute; bottom: 0; left: 0; content: ''; background: #ffffff; border-radius: 3px; } .market-service .main .market-main .market-left a { font-size: 14px; } .market-service .main .market-main .market-left img { position: absolute; top: 0; left: 0; width: 95%; height: 400px; } .market-service .main .market-main .m-i { cursor: pointer; padding: 15px; background: #fff; margin-top: 20px; margin-left: 15px; } .h2-popper{ background: #496bfd!important; color: #fff!important; border: none; } .h2-popper .popper__arrow::after { /* 注意:placement位置不同,下面的属性不同 */ border-top-color: #496bfd!important; } .market-service .main .market-main .m-i .h2 { color: #373956; font-size: 17px; font-weight: 600; } .market-service .main .market-main .m-i .h2 img { width: 20px; } .market-service .main .market-main .m-i .mc { border-top: 1px dashed #d0d9e9; color: #626d82; font-size: 15px; position: relative; margin-top: 10px; } .market-service .main .market-main .m-i .mc .ellipse { height: 40px; line-height: 40px; } .market-service .main .market-main .m-i .mc .ellipse img { width: 25px; } .market-service .main .market-main .m-i .mc:before { position: absolute; top: -2px; left: 0; content: ''; width: 4px; height: 4px; background: #d0d9e9; transform: rotate(45deg); } /*# sourcemappingurl=index.css.map */