body{ margin: 0; padding: 0;} *{ margin: 0; padding: 0; list-style: none; font-family: '微软雅黑'; font-size: 14px; color: #333;} a{ text-decoration: none; cursor: pointer; display: block;} img{ border: 0; display: block; cursor: pointer;} h1, h2, h3, h4, h5{ font-weight: normal;} ul, li{ list-style: none; cursor: pointer;} b, i, em{ font-weight: normal; font-style: normal;} button, textarea, input{ outline: none;} @font-face{ font-family: 'font1'; src:url('../fonts/baijamjuree-medium.ttf'); } @font-face{ font-family: 'font2'; src:url('../fonts/helvetica bold.ttf'); } @font-face{ font-family: 'font3'; src:url('../fonts/1587631800631.otf'); } /*清除浮动*/ .clearfix:after{visibility:hidden;display:block;font-size:0;content: " ";clear:both;height:0;} .clearfix{*zoom:1;} html,body{ font-size: calc(100vw/19.2);} .clear{ clear: both;} .section{ position: relative;} .section::after{ content: ''; width: 1px; height: calc(100% - 80px); background: #fff; opacity: 0.2; position: absolute; top: 80px; left: 80px; z-index: 5;} .section::before{ content: ''; width: 1px; height: calc(100% - 80px); background: #fff; opacity: 0.2; position: absolute; top: 80px; right: 80px; z-index: 5;} .section5::after, .section5::before{ display: none;} .section1{ width: 100%; height: 100%; background: url(../images/1.jpg) no-repeat center; background-size: cover;} .section2{ width: 100%; height: 100%; background: url(../images/4.jpg) no-repeat center; background-size: cover;} .section3{ width: 100%; height: 100%; background: url(../images/6.jpg) no-repeat center; background-size: cover;} .section4{ width: 100%; height: 100%; background: url(../images/17.jpg) no-repeat center; background-size: cover;} .section5{ width: 100%; height: 100%; background: url(../images/23.jpg) no-repeat center; background-size: cover;} .w1340{ width: 13.6rem; margin: auto;} .banner, .banner .mker, .banner .mker .img{ width: 100%; height: 100%; overflow: hidden; position: relative;} .banner .swiper{ height: 100%; width: 100%;} .banner .mker .img{ transform: scale(1.1); transition: all 3.2s; background-size: cover;} .banner .swiper-slide-active .mker .img{ transform: scale(1);} .banner .swiper-slide{ width: 100%!important;} .banner .mker .img img{ width: 100%; opacity: 0; display: block;} .banner .text{ width: 100%; position: absolute; top: 50%; left: 0; transform: translateY(-50%);} .banner .text .h1{ font-size: 0.76rem; line-height: 0.8rem; color: #fff; font-weight: bold;} .banner .text .m{ font-size: 0.18rem; line-height: 0.2rem; text-transform: uppercase; color: #fff; opacity: 0.8; margin-top: 15px; font-family: 'font2';} .banner .text .em{ height: 1px; margin-top: 0.2rem; width: 6.8rem; background: hsla(0,0%,100%,0.30); position: relative;} .banner .text .em::after{ width: 1.44rem; height: 2px; background: #fff; position: absolute; left: 0; bottom: 0; content: '';} .banner .text .p{ font-size: 0.3rem; line-height: 0.48rem; color: #fff; margin-top: 0.25rem;} .moremax{ width: 174px; height: 60px; line-height: 60px; display: flex; justify-content: center; border-radius: 35px; border: 1px solid hsla(196,56%,95%,0.80); transition: all 0.5s;} .moremax i{ font-size: 15px; color: #fff; padding-right: 37px; background: url(../images/2.png) no-repeat center right; background-size: 16px auto; transition: all 0.5s;} .moremax:hover{ background: hsla(196,56%,95%,0.80);} .moremax:hover i{ color: #008CD6; background: url(../images/2s.png) no-repeat center right; background-size: 16px auto;} .banner .moremax{ margin-top: 80px;} .banner .boot{ position: absolute; left: 50%; bottom: 90px; display: flex; transform: translateX(-50%); z-index: 5;} .banner .boot .em{ width: 48px; height: 48px; border: 1px solid #EAF5F9; border-radius: 100%; background: url(../images/3.png) no-repeat center; background-size: 12px auto; margin-right: 12px; transition: all 0.5s; cursor: pointer;} .banner .boot .em2{ transform: rotate(180deg);} .banner .boot .em:hover{ background: #EAF5F9 url(../images/3s.png) no-repeat center; background-size: 12px auto;} .banner .swiper-button-next, .banner .swiper-button-prev{ display: none;} .indexsert{ display: flex; justify-content: center; padding-top: 2.4rem;} .textmax .h1{ font-size: 0.62rem; line-height: 0.64rem; color: #fff; opacity: 0; padding-top: 0.25rem;} .textmax .m{ font-size: 0.18rem; line-height: 0.18rem; margin-top: 0.2rem; color: #fff; opacity: 0.8; text-transform: uppercase; padding-top: 0.25rem; opacity: 0;} .textmax .em{ width: 0.5rem; height: 3px; background: #fff; margin-top: 0.22rem; opacity: 0;} .textmax .p{ font-size: 0.18rem; line-height: 0.36rem; margin-top: 0.35rem; color: #fff; opacity: 0; padding-top: 0.25rem;} .section.active .textmax .h1{ animation: mymove1 0.5s; animation-delay: 0.5s; animation-fill-mode: forwards;} @keyframes mymove1{ from { opacity: 0; padding-top: 25px; } to { opacity: 1; padding-top: 0; } } .section.active .textmax .m{ animation: mymove2 0.5s; animation-delay: 0.8s; animation-fill-mode: forwards;} @keyframes mymove2{ from { opacity: 0; padding-top: 25px; } to { opacity: 1; padding-top: 0; } } .section.active .textmax .em{ animation: mymove3 0.5s; animation-delay: 1s; animation-fill-mode: forwards;} @keyframes mymove3{ from { opacity: 0; } to { opacity: 1; } } .section.active .textmax .p{ animation: mymove4 0.5s; animation-delay: 1.5s; animation-fill-mode: forwards;} @keyframes mymove4{ from { opacity: 0; padding-top: 25px; } to { opacity: 1; padding-top: 0; } } .textmax .moremax{ opacity: 0;} .section.active .textmax .moremax{ animation: mymove5 0.5s; animation-delay: 2s; animation-fill-mode: forwards;} @keyframes mymove5{ from { opacity: 0; } to { opacity: 1; } } .section.active .indextwoent .text .h2{ animation: mymove6 0.5s; animation-delay: 1.2s; animation-fill-mode: forwards;} @keyframes mymove6{ from { opacity: 0; padding-top: 25px; } to { opacity: 1; padding-top: 0; } } .section.active .indextwoent .text .icon{ animation: mymove7 0.5s; animation-delay: 1.7s; animation-fill-mode: forwards;} @keyframes mymove7{ from { opacity: 0; padding-top: 25px; } to { opacity: 1; padding-top: 0; } } .indexcapament .list, .indexnews .cont .list{ opacity: 0;} .section.active .indexcapament .list{ animation: mymove8 0.5s; animation-delay: 1.5s; animation-fill-mode: forwards;} @keyframes mymove8{ from { opacity: 0; bottom: -25px; } to { opacity: 1; bottom: 0; } } .section.active .indexnews .cont .list{ animation: mymove9 0.5s; animation-delay: 1.5s; animation-fill-mode: forwards;} @keyframes mymove9{ from { opacity: 0; padding-top: 25px; } to { opacity: 1; padding-top: 0; } } .indexsert .textmax{ width: 5.7rem; padding-top: 0.8rem;} .indexsert .moremax{ margin-top: 0.75rem;} .indexsert .cont{ display: flex; justify-content: space-between; position: relative; z-index: 5;} .indexsert .timeser{ width: 5.87rem; height: 5.87rem; position: relative; background: url(../images/7.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser::after{ content: ''; width: 4.44rem; height: 4.44rem; border: 1px dashed hsla(0,0%,100%,0.30); position: absolute; top: 50%; left: 50%; margin-left: -2.22rem; margin-top: -2.22rem; border-radius: 100%;} .indexsert .timeser::before{ width: 100%; height: 100%; border-radius: 100%; position: absolute; top: 0; left: 0; content: ''; background: url(../images/mm2.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser::before{ animation: sicver 15s infinite linear;} @keyframes sicver { from { transform: rotate(0deg); } to { transform: rotate(359deg); } } .indexsert .timeser .li{ position: absolute; top: 0; left: 0; cursor: pointer;} .indexsert .timeser .li1{ top: -0.3rem; left: 2.62rem; right: auto; bottom: auto;} .indexsert .timeser .li2{ top: 0.26rem; right: 0.8rem; left: auto; bottom: auto;} .indexsert .timeser .li3{ top: 1.93rem; right: -0.29rem; left: auto; bottom: auto;} .indexsert .timeser .li4{ top: 3.79rem; right: -0.1rem; left: auto; bottom: auto;} .indexsert .timeser .li5{ top: 5.31rem; right: 1.35rem; left: auto; bottom: auto;} .indexsert .timeser .li6{ top: 5.31rem; right: auto; left: 1.49rem; bottom: auto;} .indexsert .timeser .li7{ top: 3.81rem; right: auto; left: -0.1rem; bottom: auto;} .indexsert .timeser .li8{ top: 1.91rem; right: auto; left: -0.29rem; bottom: auto;} .indexsert .timeser .li9{ top: 0.26rem; right: auto; left: 0.78rem; bottom: auto;} .indexsert .timeser .li .m{ width: 0.64rem; height: 0.64rem; border-radius: 100%; border: 1px solid rgba(146,158,195,0.71); transition: all 0.5s;} .indexsert .timeser .li .m1{ background: url(../images/16.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li .m2{ background: url(../images/15.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li .m3{ background: url(../images/14.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li .m4{ background: url(../images/13.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li .m5{ background: url(../images/12.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li .m6{ background: url(../images/11.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li .m7{ background: url(../images/10.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li .m8{ background: url(../images/9.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li .m9{ background: url(../images/8.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li.on .m1{ background: #008CD6 url(../images/16s.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li.on .m2{ background: #008CD6 url(../images/15s.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li.on .m3{ background: #008CD6 url(../images/14s.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li.on .m4{ background: #008CD6 url(../images/13s.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li.on .m5{ background: #008CD6 url(../images/12s.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li.on .m6{ background: #008CD6 url(../images/11s.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li.on .m7{ background: #008CD6 url(../images/10s.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li.on .m8{ background: #008CD6 url(../images/9s.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li.on .m9{ background: #008CD6 url(../images/8s.png) no-repeat center; background-size: 100% auto;} .indexsert .timeser .li.on .m{ border-color: #008CD6;} .indexsert .timeser .li .p{ font-size: 0.18rem; color: #fff; line-height: 0.28rem; position: absolute; text-transform: uppercase;} .indexsert .timeser .li1 .p{ left: 50%; bottom: 0.74rem; transform: translateX(-50%); white-space: nowrap;} .indexsert .timeser .li2 .p{ left: 0.85rem; top: 50%; transform: translateY(-50%); white-space: nowrap;} .indexsert .timeser .li3 .p{ top: 0.55rem; left: 0.7rem; white-space: nowrap;} .indexsert .timeser .li4 .p{ top: 0.75rem; left: 0.35rem; white-space: nowrap;} .indexsert .timeser .li5 .p{ top: 0.8rem; left: 0.3rem; white-space: nowrap;} .indexsert .timeser .li6 .p{ top: 0.8rem; right: 0.3rem; white-space: nowrap;} .indexsert .timeser .li7 .p{ top: 0.75rem; right: 0.35rem; white-space: nowrap;} .indexsert .timeser .li8 .p{ top: 0.55rem; right: 0.7rem; white-space: nowrap;} .indexsert .timeser .li9 .p{ right: 0.85rem; top: 50%; transform: translateY(-50%); white-space: nowrap;} .indexcapament{ width: 100%; height: 100%; position: relative;} .indexcapament .top{ padding-top: 1.7rem;} .indexcapament .top .textmax{ position: relative;} .indexcapament .top .moremax{ position: absolute; right: 0; top: 30px;} .indexcapament .list{ position: absolute; bottom: -25px; left: 80px; right: 80px; display: flex; justify-content: center; border-top: 1px solid hsla(0,0%,100%,0.20);} .indexcapament .list .li{ width: calc(100% / 3); height: 5.4rem; /*display: flex; justify-content: center; align-items: center;*/ position: relative; transition: all 0.5s; overflow: hidden;} .indexcapament .list .li::after{ content: ''; width: 1px; height: 100%; position: absolute; top: 0; left: 0; background: #fff; opacity: 0.2;} .indexcapament .list .li:first-child::after{ display: none;} /*.indexcapament .list .li:hover{ background: linear-gradient(0deg, hsla(201,100%,42%,0.80), hsla(224,90%,33%,0.80),hsla(224,93%,24%,0.80));}*/ .indexcapament .list .m{ display: flex; justify-content: center;} .indexcapament .list .m i{ display: block; position: relative; padding-left: 0.25rem;} .indexcapament .list .m img{ height: 0.7rem; position: relative; z-index: 3;} .indexcapament .list .m i::after{ width: 0.66rem; height: 0.66rem; border-radius: 100%; background: #042274; position: absolute; left: 0; content: ''; top: -0.05rem; transition: all 0.5s;} .indexcapament .list .li:hover .m i::after{ background: #008CD6;} .indexcapament .list .h1{ font-size: 0.22rem; text-align: center; line-height: 0.22rem; color: #fff; margin-top: 0.35rem;} .indexcapament .list .em{ width: 0.32rem; height: 2px; background: #fff; margin: 0.25rem auto 0;} .indexcapament .list .p{ font-size: 0.16rem; line-height: 0.26rem; margin: 0.3rem auto 0; width: 4rem; text-align: center; color: #fff; opacity: 0; transition: all 0.5s;} .indexcapament .list a{ margin: 0.45rem auto 0; width: 1.54rem; height: 0.54rem; line-height: 0.54rem; text-align: center; font-size: 0.15rem; color: #fff; background: #008CD6; border-radius: 0.3rem; transition: all 0.5s; opacity: 0;} .indexcapament .list a:hover{ box-shadow: 0 0 10px hsla(201,100%,42%,0.30);} .indexcapament .list .mk{ padding-top: 1.7rem; transition: all 0.5s; position: relative; z-index: 5;} .indexcapament .list .li:hover .mk{ padding-top: 0.8rem;} .indexcapament .list .li:hover .p, .indexcapament .list .li:hover a{ opacity: 1;} .indexcapament .list .k{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; opacity: 0; z-index: 0; transition: all 0.5s;} .indexcapament .list .k::after{ content: ''; width: 100%; height: 100%; background: #008CD6; opacity: 0.7; position: absolute; top: 0; left: 0;} .indexcapament .list .k img{ display: block; width: 100%; opacity: 0;} .indexcapament .list .li:hover .k{ opacity: 1;} .indexnews{ width: 100%; background: url(../images/23.jpg) no-repeat center; background-size: cover; position: relative;} .indexnews::after{ content: ''; width: 1px; height: calc(100% - 80px); background: #fff; opacity: 0.2; position: absolute; top: 80px; left: 80px; z-index: 5;} .indexnews::before{ content: ''; width: 1px; height: calc(100% - 80px); background: #fff; opacity: 0.2; position: absolute; top: 80px; right: 80px; z-index: 5;} .textmax2 .h1, .textmax2 .m{ color: #042274;} .textmax2 .em{ background: #042274} .moremax2{ border-color: #042274;} .moremax2:hover{ background: #042274;} .moremax2 i{ color: #042274; background: url(../images/2w.png) no-repeat right center; background-size: 16px auto;} .moremax2:hover i{ color: #fff; background: url(../images/2.png) no-repeat right center; background-size: 16px auto;} .indexnews .top .moremax2{ position: absolute; top: 15px; right: 0;} .indexnews .top .textmax{ position: relative;} .indexnews .cont{ padding-top: 1.4rem;} .indexnews .cont .list{ margin-top: 0.35rem; padding-top: 25px;} .indexnews .cont .list .li{ position: relative;} .indexnews .cont .list .li{ background: linear-gradient(0deg, #008CD6, #08309E, #042274); float: left; overflow: hidden;} .indexnews .cont .list .li img{ width: 100%; transition: all 0.5s;} .indexnews .cont .list .li:hover img{ transform: scale(1.03);} .indexnews .cont .list .li:first-child, .indexnews .cont .list .li:first-child .img{ width: 3.8rem; height: 6rem; overflow: hidden;} .indexnews .cont .list .li:nth-child(2), .indexnews .cont .list .li:nth-child(2) .img{ width: 5.3rem; height: 6rem; overflow: hidden;} .indexnews .cont .list .li:nth-child(3), .indexnews .cont .list .li:nth-child(3) .img{ width: 3.8rem; height: 2.88rem; overflow: hidden;} .indexnews .cont .list .li:nth-child(4), .indexnews .cont .list .li:nth-child(4) .img{ width: 3.8rem; height: 2.88rem; overflow: hidden;} .indexnews .cont .list .li:nth-child(3), .indexnews .cont .list .li:nth-child(4){ float: right;} .indexnews .cont .list .li:nth-child(2){ margin-left: 0.38rem;} .indexnews .cont .list .li:nth-child(4){ margin-top: 0.24rem;} .indexnews .cont .list .li .mk{ position: absolute; top: 35px; left: 22px; right: 22px;} .indexnews .cont .list .li .mk .time{ font-size: 13px; line-height: 13px; color: #fff;} .indexnews .cont .list .li .mk .h1{ font-size: 0.22rem; line-height: 0.36rem; margin-top: 0.7rem; color: #fff;} .indexnews .cont .list .li .moremax{ position: absolute; left: 22px; bottom: 0.4rem; width: 2.48rem; top: auto; background: hsla(224,93%,24%,0.50); border-color: hsla(224,93%,24%,0.50);} .indexnews .cont .list .li .moremax i{ color: #fff; background: url(../images/2.png) no-repeat right center; background-size: 16px auto;} .indexnews .cont .list .li:first-child .moremax{ background: #008CD6; border-color: #008CD6;} .indexnews .cont .list .li .a{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;} .footer{ background: linear-gradient(135deg, #003399 0%, rgba(0,0,0,1.0) 100%); padding: 60px 1rem 40px 1rem;} .footer .logo img{ height: 42px;} .footer .nav{ margin-top: 90px; display: flex; justify-content: flex-start;} .footer .nav .li{ border-right: 1px solid hsla(0,0%,100%,0.20); padding: 0 0.5rem 0 0.35rem;} .footer .nav .li:first-child{ padding: 0 0.35rem 0 0;} .footer .nav .li .h1 a{ font-size: 16px; line-height: 30px; color: #fff; margin-bottom: 15px; transition: all 0.5s;} .footer .nav .li .h1 a:hover{ opacity: 0.8;} .footer .nav .li .m{ display: flex;} .footer .nav .li .m a{ font-size: 14px; line-height: 30px; color: #fff; transition: all 0.5s;} .footer .nav .li .m a:hover{ opacity: 0.8; text-decoration: underline;} .footer .nav .li .m a{ width: 85px;} .footer .nav .li .m a:nth-child(2n){ width: auto; margin-left: 0.5rem;} .footer .boot{ margin-top: 90px; display: flex; justify-content: space-between; align-items: flex-end;} .footer .boot .top{ display: flex; justify-content: flex-start;} .footer .boot .top a{ font-size: 12px; line-height: 20px; color: #fff; margin-right: 34px; position: relative; transition: all 0.5s;} .footer .boot .top a:hover{ text-decoration: underline;} .footer .boot .top a::after{ width: 34px; line-height: 20px; color: #fff; position: absolute; top: 0; right: -34px; text-align: center; opacity: 0.5; content: '|';} .footer .boot .top a:last-child::after{ display: none;} .footer .boot .top a:last-child{ margin-right: 0;} .footer .boot .p, .footer .boot .p a{ display: flex; font-size: 12px; line-height: 22px; color: hsla(0,0%,100%,0.40); text-transform: uppercase; transition: all 0.5s;} .footer .boot .p a:hover{ color: #fff;} .footer .boot .mk{ margin-top: 10px;} .footer .boot .p a{ margin-right: 15px;} .footer .boot .wear{ display: flex; justify-content: flex-end;} .footer .boot .wear .h{ font-size: 14px; color: #fff; line-height: 32px; margin-right: 16px;} .footer .boot .wear .k{ display: flex;} .footer .boot .wear .k .m{ width: 32px; height: 32px; background: #008CD6; margin-left: 8px; border-radius: 100%; position: relative;} .footer .boot .wear .k .m:first-child{ margin-left: 0;} .footer .boot .wear .k .m .d{ display: none; padding: 10px; background: #008CD6; border-radius: 5px; position: absolute; bottom: 45px; left: 50%; transform: translateX(-50%);} .footer .boot .wear .k .m:hover .d{ display: block;} .footer .boot .wear .k .m .d img{ width: 100px; display: block;} .footer .boot .wear .k .m .d::after{ width: 10px; height: 10px; background: #008CD6; transform: translateX(-50%) rotate(45deg); position: absolute; left: 50%; bottom: -5px; content: '';} .footer .boot .wear .k .m .d{ font-size: 18px; color: #fff; white-space: nowrap; font-weight: bold;} .footer .boot .wear .k .m1{ background: #008CD6 url(../images/90.png) no-repeat center; background-size: 100% auto;} .footer .boot .wear .k .m2{ background: #008CD6 url(../images/91.png) no-repeat center; background-size: 100% auto;} .footer .boot .wear .k .m3{ background: #008CD6 url(../images/89.png) no-repeat center; background-size: 100% auto;} .footer .boot .tel{ text-align: right; font-size: 42px; color: #fff; line-height: 42px; font-family: 'font1'; margin-top: 20px;} .footer .boot .right a{ text-align: right; margin-top: 10px; font-size: 16px; line-height: 20px; color: #fff; opacity: 0.8;} .footer .cont{ position: relative;} .footer .topboxer{ width: 50px; height: 50px; background: url(../images/88.png) no-repeat center bottom; background-size: 26px auto; border-radius: 100%; /*border: 1px solid #fff;*/ position: absolute; right: 0; top: 42px; cursor: pointer;} .footer .topboxer:hover{ animation: foot 1.5s; animation-iteration-count: infinite;} @keyframes foot{ 0% { background: url(../images/88.png) no-repeat center bottom 0px; background-size: 26px auto; } 50% { background: url(../images/88.png) no-repeat center bottom -10px; background-size: 26px auto; } 100% { background: url(../images/88.png) no-repeat center bottom 0px; background-size: 26px auto; } } .indextwoent{ display: flex; justify-content: space-between; padding-top: 2.1rem;} .indextwoent .text{ width: 6.8rem;} .indextwoent .text .h2{ font-size: 32px; line-height: 32px; color: #fff; margin-top: 40px; opacity: 0; padding-top: 25px;} .indextwoent .text .p{ margin-top: 20px; font-size: 16px; line-height: 32px; opacity: 0;} .indextwoent .text .icon{ margin-top: 45px; display: flex; justify-content: space-between; opacity: 0; padding-top: 25px;} .indextwoent .text .icon .tp{ display: flex; justify-content: flex-start; align-items: flex-end; font-size: 38px; color: #fff; line-height: 36px; font-family: 'font1';} .indextwoent .text .icon .li:nth-child(3) .tp{ font-size: 13px; line-height: 29px; justify-content: space-between; padding: 0 15px 0 10px;} .indextwoent .text .icon .tp i{ font-size: 0.58rem; font-family: 'font1'; color: #fff; line-height: 0.58rem; margin-right: 0.1rem;} .indextwoent .text .icon .k{ font-size: 0.15rem; line-height: 0.15rem; margin-top: 0.15rem; color: #fff;} .indextwoent .text .moremax{ margin-top: 0.8rem;} .indextwoent .img img{ width: 4.24rem; margin-left: 0.8rem; padding-top: 0.5rem;} .header{ position: fixed; top: 0; left: 0; right: 0; height: 79px; border-bottom: 1px solid hsla(0,0%,100%,0.20); display: flex; justify-content: space-between; align-items: center; padding: 0 1rem; z-index: 50; transition: all 0.5s;} .header2{ background: #042274;} .header .logo img{ height: 52px;} .header .nav{ display: flex; justify-content: flex-start; position: relative;} .header .nav .li{ margin-left: 0.62rem;} /*.header .nav .li a{ font-size: 16px; position: relative; line-height: 79px; color: #fff;} .header .nav .li a::after{ width: 0; height: 3px; background: #fff; position: absolute; left: 50%; bottom: -1px; content: ''; transition: all 0.5s; transform: translateX(-50%);} .header .nav .li.on a::after, .header .nav .li:hover a::after{ width: 32px;}*/ .header .nav .li .tit a{ font-size: 16px; position: relative; line-height: 79px; color: #fff;} .header .nav .li .tit a::after{ width: 0; height: 3px; background: #fff; position: absolute; left: 50%; bottom: -1px; content: ''; transition: all 0.5s; transform: translateX(-50%);} .header .nav .li.on .tit a::after, .header .nav .li:hover .tit a::after{ width: 32px;} .header .nav .li .list{ position: absolute; top: 80px; right: 0; background: #fff; width: 1070px; display: none; justify-content: space-between; min-height: 275px;} .header .nav .li:hover .list{ display: flex;} .header .nav .li .list .left{ margin-left: 145px; width: 165px; padding: 35px 0; border-right: 1px solid #e3e6e6;} .header .nav .li .list .left .ali{ display: flex;} .header .nav .li .list .left .ali a{ font-size: 18px; line-height: 50px;} .header .nav .li .list .left .ali.cur a, .header .nav .li .list .left .ali:hover a{ font-weight: bold; color: #002173; padding-right: 32px; background: url(../images/2w.png) no-repeat right center; background-size: 16px auto;} .header .nav .li .list .right{ width: 630px; margin-right: 65px; padding: 40px 0;} .header .nav .li .list .right .wli, .header .nav .li .list .right .mli{ display: flex; justify-content: flex-start; flex-wrap: wrap;} .header .nav .li .list .right .wli a{ width: 33%; font-size: 14px; color: #222; line-height: 46px; transition: all 0.5s;} .header .nav .li .list .right .wli a:hover{ color: #0092d3;} .header .nav .li .list .right .ali{ min-width: 185px; margin-right: 115px;} .header .nav .li .list .right .ali .h2{ font-size: 16px; font-weight: bold; color: #0092d3; line-height: 40px; padding-bottom: 5px; border-bottom: 1px solid #e3e6e6;} .header .nav .li .list .right .ali .m a{ font-size: 14px; line-height: 38px; color: #222; transition: all 0.5s;} .header .nav .li .list .right .ali .m a:hover{ color: #0092d3;} .header .nav .li .list .right .ali .m{ padding-top: 12px;} .header .nav .li:nth-child(5), .header .nav .li:nth-child(6){ position: relative;} .header .nav .li .ver{ display: none; position: absolute; top: 80px; left: 50%; transform: translateX(-50%); background: #fff; padding: 15px 0;} .header .nav .li .ver a{ font-size: 14px; line-height: 32px; text-align: center; padding: 0 25px; white-space: nowrap; transition: all 0.5s;} .header .nav .li .ver a:hover{ color: #0092d3;} .header .nav .li:hover .ver{ display: block;} .indexsert .imgker{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; overflow: hidden; z-index: 0;} .indexsert .imgker .m{ width: 100%; height: 100%; overflow: hidden; position: absolute; top: 0; left: 0; transform: scale(1.1); opacity: 0; z-index: 0;} .indexsert .imgker .m.on{ z-index: 5; transform: scale(1); opacity: 1; transition: all 0.8s;} .indexsert .imgker .m img{ display: block; width: 100%; opacity: 0;} .indexsert .imgker::after{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #008CD6; opacity: 0.1; content: ''; z-index: 5;} #fp-nav{ position: fixed; top: 50%; right: 30px; z-index: 30;} #fp-nav li{ margin-top: 30px; display: flex; justify-content: flex-end; width: 20px;} #fp-nav li a{ display: block; width: 8px; height: 8px; border-radius: 4px; background: #fff; transition: all 0.5s;} #fp-nav li:first-child{ margin-top: 0;} #fp-nav li a.active{ width: 20px;} .banner .swiper-pagination{ position: absolute; bottom: 90px; left: auto; right: 0.2rem; transform: rotate(90deg); line-height: 1rem; z-index: 5; font-size: 16px; color: hsla(0,0%,100%,0.30); width: auto;} .banner .swiper-pagination .swiper-pagination-current{ font-size: 24px; color: #fff;} .banner .swiper-pagination .swiper-pagination-total{ font-size: 16px; color: hsla(0,0%,100%,0.30);} /* */ .aboutbanner{ position: relative;} .aboutbanner .img{ width: 100%; height: 500px; overflow: hidden; background-size: cover;} .aboutbanner .img img{ display: block; width: 100%; opacity: 0;} .w1360{ width: 13.6rem; margin: auto;} .aboutbanner .cont{ width: 100%; position: absolute; top: 230px; left: 0;} .aboutbanner .cont .em{ font-size: 16px; line-height: 16px; color: #fff; text-transform: uppercase;} .aboutbanner .cont .h1{ font-size: 48px; line-height: 48px; margin-top: 16px; color: #fff;} .aboutbanner .cont .p{ font-size: 22px; line-height: 32px; margin-top: 15px; color: #fff;} .aboutwo{ display: flex; justify-content: space-between;} .aboutwo .left{ width: 50%; background: #fff url(../images/w3.png) no-repeat center bottom; background-size: 100% auto; display: flex; justify-content: center; align-items: center;} .aboutwo .left>div{ margin: 0 1.52rem; text-align: center;} .aboutwo .left .m img{ display: block; height: 0.63rem; margin: auto;} .aboutwo .left .h1{ font-size: 0.32rem; font-weight: bold; margin-top: 0.38rem; line-height: 0.34rem; text-align: center;} .aboutwo .left .p{ font-size: 16px; line-height: 0.36rem; margin-top: 0.3rem; color: #666; text-align: left;} .aboutwo .right{ width: 50%;} .aboutwo .right .top{ display: flex; justify-content: center;} .aboutwo .right .top .li{ width: 33%; height: 3.2rem; background: #042274; display: flex; justify-content: center; align-items: center;} .aboutwo .right .top .li:nth-child(2){ width: 34%; background: #008CD7;} .aboutwo .right .top .li .h1{ display: flex; justify-content: flex-start; align-items: flex-end;} .aboutwo .right .top .li:nth-child(3) .h1{ justify-content: space-between; padding: 0 15px 0 10px;} .aboutwo .right .top .li .h1 div{ font-size: 0.58rem; font-weight: bold; line-height: 0.58rem; color: #fff; font-family: 'font1';} .aboutwo .right .top .li .h1 i{ font-size: 0.38rem; font-weight: bold; margin-left: 0.09rem; color: #fff; line-height: 0.4rem;} .aboutwo .right .top .li .h1 em, .aboutwo .right .top .li:nth-child(3) .h1 i{ font-size: 15px; line-height: 0.28rem; color: #fff; margin-left: 0.09rem; font-weight: normal;} .aboutwo .right .top .li .p{ font-size: 16px; line-height: 0.26rem; margin-top: 0.25rem; color: #fff;} .aboutwo .right .m img{ display: block; width: 100%; transition: all 0.5s;} .aboutwo .right .m{ overflow: hidden;} .aboutwo .right .m:hover img{ transform: scale(1.05);} .abouthree{ background: url(../images/w5.jpg) no-repeat center; background-size: cover; padding: 1rem 0;} .titlemax .h1{ font-size: 0.36rem; line-height: 0.36rem; text-align: center; color: #fff;} .titlemax .p{ font-size: 0.18rem; line-height: 0.18rem; margin-top: 0.2rem; text-align: center; text-transform: uppercase; color: #fff; font-family: 'font2';} .titlemax .em{ width: 0.5rem; height: 3px; background: #008CD7; margin: 0.2rem auto 0;} .titlemax2 .h1{ color: #042274;} .titlemax2 .p{ color: #042274;} .abouthree .mk{ margin-top: 0.65rem; font-size: 15px; line-height: 0.32rem; color: #fff;} .abouthree .boot{ display: flex; justify-content: flex-end; align-items: flex-end; margin-top: 0.55rem;} .abouthree .boot .m img{ height: 0.52rem;} .abouthree .boot .p{ font-size: 16px; line-height: 16px; position: relative; color: #fff;} .abouthree .boot .p::after{ content: ''; width: 1.55rem; height: 1px; background: #E6E6E6; position: absolute; left: -1.65rem; top: 50%; margin-top: -0.5px; opacity: 0.2;} .aboutfour{ padding-top: 0.9rem; background: #F5F5F5;} .aboutfour .cont{ display: flex; margin-top: 0.8rem; padding-left: 1.7rem;} .aboutfour .cont .mySwiper2{ width: 13.7rem; padding: 0.25rem 0;} .aboutfour .cont .mySwiper{ width: 1.55rem;} .aboutfour .cont .mk .h1{ font-size: 0.48rem; line-height: 0.48rem; position: relative; z-index: 5;} .aboutfour .cont .mk .text{ margin-top: 0.7rem; width: 9rem;} .aboutfour .cont .mk .text .p{ font-size: 15px; line-height: 0.34rem; color: #424242; padding-left: 20px; position: relative; margin-bottom: 0.1rem; z-index: 5;} .aboutfour .cont .mk .text .p::after{ content: ''; width: 6px; height: 6px; background: #333; border-radius: 100%; position: absolute; top: 0.15rem; left: 0px;} .aboutfour .cont .mySwiper2 .swiper-slide{ background: #F5F5F5; opacity: 0!important;} .aboutfour .cont .mySwiper2 .swiper-slide-active{ opacity: 1!important;} .aboutfour .cont .mySwiper .p{ font-size: 18px; font-weight: bold; line-height: 0.6rem; cursor: pointer;} .aboutfour .cont .mySwiper{ height: 3.6rem;} .aboutfour .cont .mySwiper .swiper-slide-thumb-active{ background: url(../images/w7.png) no-repeat center right; background-size: 21px auto;} .aboutfour .cont .left{ position: relative; padding: 0.1rem 0 0.45rem 0; margin-right: 0.6rem;} .aboutfour .cont .left::after{ content: ''; width: 1px; background: #000; position: absolute; top: 0; right: 10px; height: 100%;} .aboutfour .cont .left .em{ width: 44px; height: 40px; background: url(../images/w13.png) no-repeat center; background-size: 15px auto; cursor: pointer;} .aboutfour .cont .left .went .p{ font-size: 15px; text-align: center; color: #333; width: 44px; opacity: 0; display: none;} .aboutfour .cont .left .em2{ transform: rotate(180deg);} .aboutfour .swiper-button-next, .aboutfour .swiper-button-prev{ display: none;} .aboutfour .cont .mk i{ display: block; font-size: 4.6rem; line-height: 4.6rem; color: #E6E6E6; position: absolute; top: -0.45rem; right: 0; font-family: 'font3'; padding-right: 0.4rem; z-index: 0;} .aboutfour .cont .mk i{ color: transparent; background-image: url("../images/a1.jpg"); background-clip: text; -webkit-background-clip: text; font-style: oblique;} .aboutfive{ padding: 0.7rem 1.6rem; display: flex; justify-content: space-between; align-items: center;} .aboutfive .img{ width: 5.9rem; border: 1px solid #E6EDF1;} .aboutfive .img img{ display: block; width: 100%;} .aboutfive .text{ width: 9.6rem;} .aboutfive .text .h1{ font-size: 0.26rem; font-weight: bold; line-height: 0.36rem;} .aboutfive .text .p{ font-size: 15px; line-height: 0.34rem; margin-top: 0.25rem; color: #424242;} .aboutsix .top{ display: flex; background: url(../images/w9.jpg) no-repeat center; background-size: cover;} .aboutsix .top .li{ width: 33%; height: 5rem; overflow: hidden; text-align: center; position: relative; transition: all 0.5s;} .aboutsix .top .li:nth-child(2){ width: 34%;} .aboutsix .top .li:hover{ background: hsla(224,95%,23%,0.20);} .aboutsix .top .li::after{ width: 1px; height: 100%; background: #fff; position: absolute; top: 0; left: 0; content: ''; opacity: 0.2;} .aboutsix .top .li:first-child::after{ display: none;} .aboutsix .top .tit{ padding-top: 1.8rem;} .aboutsix .tit .h1{ font-size: 0.3rem; font-weight: bold; line-height: 0.32rem; color: #fff;} .aboutsix .tit .em{ font-size: 15px; line-height: 15px; margin-top: 0.2rem; text-transform: uppercase; opacity: 0.4; color: #fff;} .aboutsix .tit .m{ width: 0.5rem; height: 3px; background: #008CD7; margin: 0.2rem auto 0;} .aboutsix .tit .h2{ font-size: 0.22rem; line-height: 0.38rem; margin-top: 0.2rem; color: #fff;} .aboutsix .tit .p{ font-size: 16px; line-height: 0.3rem; margin-top: 0.2rem; color: #fff; opacity: 0.8;} .aboutsix .bot .li{ margin-top: 0.35rem; position: relative;} .aboutsix .bot .li .ms img{ display: block; width: 100%;} .aboutsix .bot .li .tit{ position: absolute; top: 50%; transform: translateY(-50%); left: 1.6rem;} .aboutsix .bot .li .tit .m{ margin: 0.2rem 0 0 0;} .aboutsix .bot .li:nth-child(2) .tit{ right: 2.55rem; left: auto;} .aboutsix{ margin-bottom: 0.35rem;} .socialone{ border-bottom: 1px solid #EBEEF4;} .socialone .cont{ display: flex; justify-content: space-between;} .socialone .cont .nav{ display: flex;} .socialone .cont .nav .li{ margin-right: 0.5rem;} .socialone .cont .nav .li a{ font-size: 16px; color: #333; transition: all 0.5s; line-height: 0.72rem;} .socialone .cont .nav .li.on a, .socialone .cont .nav .li:hover a{ color: #042274; font-weight: bold;} .minnavbox{ display: flex; justify-content: flex-start;} .minnavbox a{ font-size: 15px; color: hsla(0,0%,20%,0.60); transition: all 0.5s; line-height: 0.72rem; position: relative; margin-left: 16px;} .minnavbox a:hover{ color: #333;} .minnavbox a::after{ width: 16px; line-height: 0.72rem; text-align: center; font-size: 16px; color: #333; opacity: 0.5; position: absolute; top: 0; left: -16px; content: '-';} .minnavbox a:first-child::after{ display: none;} .minnavbox a:first-child{ margin-left: 0;} .socialtwo{ padding: 0.55rem 0 0.65rem 0;} .socialtwo .li{ margin-top: 0.45rem; background: url(../images/w17.jpg) no-repeat center; background-size: cover; display: flex; justify-content: space-between;} .socialtwo .li:first-child{ margin-top: 0;} .socialtwo .li .img{ width: 3.17rem; height: 4.04rem; overflow: hidden;} .socialtwo .li .img img{ display: block; width: 100%;} .socialtwo .li .text{ width: 9.69rem; height: 4.04rem; margin-right: 0.33rem; position: relative;} .socialtwo .li .text .h1{ font-size: 0.2rem; font-weight: bold; line-height: 0.22rem; padding-top: 0.28rem; transition: all 0.5s;} .socialtwo .li:hover .text .h1{ color: #042274;} .socialtwo .li .text .time{ font-size: 14px; line-height: 14px; margin-top: 0.15rem; color: hsla(0,0%,20%,0.50);} .socialtwo .li .text .p{ font-size: 14px; line-height: 0.26rem; margin-top: 0.2rem; color: #666;} .socialtwo .li .text .h2{ font-size: 0.2rem; font-weight: bold; line-height: 0.22rem; padding-top: 0.5rem; transition: all 0.5s;} .socialtwo .li:hover .text .h2{ color: #042274;} .socialtwo .li .text .pt{ width: 5.9rem;} .socialtwo .li .text .pt .m{ font-size: 14px; line-height: 0.26rem; color: #666; padding-left: 15px; position: relative; margin-top: 0.15rem;} .socialtwo .li .text .pt .m::after{ content: '■'; font-size: 14px; color: #666; line-height: 0.22rem; position: absolute; top: 0; left: 0;} .moremax3{ width: 128px; height: 42px; line-height: 42px; border-color: #b3b9bd;} .moremax3:hover{ background: #008CD7; border-color: #008CD7;} .moremax3 i{ color: #b3b9bd; padding-right: 30px; background: url(../images/w18.png) no-repeat right center; background-size: 16px auto;} .moremax3:hover i{ color: #fff; background: url(../images/w18s.png) no-repeat right center; background-size: 16px auto;} .socialtwo .li .text .moremax{ position: absolute; right: 0; bottom: 0.32rem;} .socialthree{ padding: 0.5rem 0 0.8rem 0; background: #fff url(../images/w28.jpg) no-repeat center bottom; background-size: 100% auto;} .socialthree .li{ margin-top: 0.7rem;} .socialthree .li:first-child{ margin-top: 0;} .socialthree .li .h1{ font-size: 0.26rem; color: #042274; line-height: 0.36rem; text-align: center; font-weight: bold;} .socialthree .li .text{ margin-top: 0.3rem;} .socialthree .li .text h1, .socialthree .li .text p{ font-size: 15px; line-height: 30px; color: #424242;} .socialthree .li .text p{ padding-left: 30px;} .socialthree .li .text h1{ font-weight: bold;} .newsone{ padding: 0.7rem 0 0.6rem 0; background: url(../images/w21.jpg) no-repeat center; background-size: cover;} .newsone .mker{ display: flex; justify-content: space-between; background: #fff;} .newsone .mker .img{ width: 7.77rem; height: 4.8rem; overflow: hidden;} .newsone .mker .img img{ display: block; width: 100%; transition: all 0.5s;} .newsone .mker:hover .img img{ transform: scale(1.05);} .newsone .mker .text{ width: 4.8rem; margin-right: 0.47rem; padding-top: 0.8rem;} .newsone .mker .text .h1{ font-size: 0.2rem; line-height: 0.3rem; margin-top: 0.15rem; transition: all 0.5s;} .newsone .mker:hover .text .h1{ color: #0325A1;} .newsone .mker .text .time{ font-size: 14px; color: #0325A1; line-height: 14px;} .newsone .mker .text .p{ font-size: 14px; line-height: 0.28rem; margin-top: 0.2rem; color: #666;} .newsone .mker .text .moremax{ margin-top: 0.8rem;} .newsone .swiper{ padding-bottom: 45px;} .newsone .swiper-container-horizontal>.swiper-pagination-bullets{ display: flex; justify-content: center; bottom: 0;} .moremax4{ width: 150px;} .newstwo{ padding: 0.55rem 0 0.4rem 0;} .newstwo .cont .li{ padding-top: 0.45rem;} .newstwo .cont .li .mk{ padding: 0.55rem; position: relative; transition: all 0.5s;} .newstwo .cont .li:hover .mk{ background: #F0F7FF;} .newstwo .cont .li .mk .img{ float: right;} .newstwo .cont .li .mk .img .m{ width: 3.4rem; height: 2.1rem; overflow: hidden; margin-top: 0.28rem;} .newstwo .cont .li .mk .img .m:first-child{ margin-top: 0; } .newstwo .cont .li .mk .img .m img{ display: block; width: 100%; transition: all 0.5s;} .newstwo .cont .li .mk .img .m:hover img{ transform: scale(1.05);} .newstwo .cont .li .text{ width: 7rem; margin-left: 1.52rem;} .newstwo .cont .li .text .top .h1{ font-size: 0.2rem; transition: all 0.5s; line-height: 0.22rem;} .newstwo .cont .li:hover .text .top .h1{ color: #0325A1;} .newstwo .cont .li .text .top .p{ font-size: 14px; line-height: 0.28rem; margin-top: 15px; color: #666;} .newstwo .cont .li .text .top .moremax{ margin-top: 0.35rem;} .newstwo .cont .li .text .bot a{ font-size: 14px; color: #424242; line-height: 0.36rem; padding-left: 20px; position: relative; transition: all 0.5s;} .newstwo .cont .li .text .bot a:hover{ color: #0325A1;} .newstwo .cont .li .text .bot a::after{ content: '◆'; font-size: 14px; color: #424242; line-height: 0.36rem; position: absolute; top: 0; left: 0; opacity: 0.8;} .newstwo .cont .li .text .bot{ margin-top: 0.4rem; max-height: 1.8rem; overflow: hidden;} .newstwo .cont .li .text .bot2{ max-height: none;} .newstwo .cont .li .time{ position: absolute; top: 0.55rem; left: 0.55rem; font-size: 0.2rem; color: #0325A1; text-align: center; font-family: 'font3';} .newstwo .cont .li .time i{ font-size: 0.52rem; display: block; line-height: 0.52rem; color: #0325A1; font-family: 'font3';} .newstwo .cont .li .more{ margin-left: 0.15rem; position: absolute; left: 0.55rem; bottom: 0.55rem; width: 14px; font-size: 14px; color: #333; line-height: 0.24rem; text-align: center; padding-bottom: 0.2rem; background: url(../images/w24.png) no-repeat bottom center; background-size: 9px auto; margin-bottom: 0.8rem; cursor: pointer;} .newstwo .cont .li .more::after{ width: 1px; height: 0.7rem; background: #777A7D; opacity: 0.2; position: absolute; bottom: -0.8rem; left: 50%; content: ''; margin-left: -0.5px;} .pageing{ display: flex; justify-content: center;} .pageing a{ font-size: 16px; color: #333; line-height: 0.46rem; min-width: 0.46rem; text-align: center; transition: all 0.5s; border-radius: 100%; margin: 0 3px;} .pageing a:hover{ color: #008CD7;} .pageing a.cur{ background: #008CD7; color: #fff;} .pageing a.prev, .pageing a.next{ margin: 0 0.2rem;} .newstwo .pageing{ margin-top: 0.4rem;} .newsdata{ background: #F2F2F2; padding: 0.36rem 0 0.42rem 0;} .newsdata .cont{ display: flex; justify-content: space-between; align-items: flex-start;} .newsdata .cont .left{ width: 8.92rem; background: #fff; margin-left: 0.8rem; position: relative;} .newsdata .cont .right{ width: 3.64rem; background: #fff;} .newsdata .cont .right .mk{ padding: 0.25rem 0.24rem;} .newsdata .cont .right .mk .h1{ font-size: 0.2rem; font-weight: bold; line-height: 0.22rem;} .newsdata .cont .right .top{ margin-top: 0.15rem;} .newsdata .cont .right .top .m{ overflow: hidden; width: 100%;} .newsdata .cont .right .top .m img{ display: block; width: 100%; transition: all 0.5s;} .newsdata .cont .right .top:hover .m img{ transform: scale(1.05);} .newsdata .cont .right .top .p{ font-size: 16px; line-height: 0.28rem; margin-top: 0.1rem; color: #333; transition: all 0.5s;} .newsdata .cont .right .top:hover .p{ color: #0325A1;} .newsdata .cont .right .list{ margin-top: 0.2rem; border-top: 1px solid #E4EBF4; padding-top: 0.15rem;} .newsdata .cont .right .list a{ font-size: 14px; line-height: 0.36rem; color: #424242; transition: all 0.5s; padding-left: 20px; position: relative;} .newsdata .cont .right .list a:hover{ color: #0325A1;} .newsdata .cont .right .list a::after{ content: '◆'; font-size: 14px; color: #424242; line-height: 0.36rem; position: absolute; top: 0; left: 3px; opacity: 0.8;} .newsdata .cont .left .mk{ padding: 0.38rem;} .newsdata .cont .left .mk .h1{ font-size: 0.24rem; line-height: 0.36rem; color: #333;} .newsdata .cont .left .mk .icon{ margin-top: 0.25rem; display: flex;} .newsdata .cont .left .mk .icon .p{ font-size: 14px; line-height: 14px; color: #666; margin-right: 0.25rem;} .newsdata .cont .left .data{ margin-top: 0.22rem; border-top: 1px solid #E4EBF4; border-bottom: 1px solid #E4EBF4; padding: 0.2rem 0; font-size: 14px; line-height: 0.3rem; color: #666;} .newsdata .cont .left .data img{ display: block; margin: auto; max-width: 100%;} .newsdata .cont .left .more a{ font-size: 14px; line-height: 36px; color: #424242; padding-left: 20px; position: relative; display: flex;} .newsdata .cont .left .more a::after{ content: '◆'; font-size: 14px; color: #424242; line-height: 36px; position: absolute; top: 0; left: 3px; opacity: 0.5;} .newsdata .cont .left .more a i{ transition: all 0.5s; font-size: 14px; color: #424242;} .newsdata .cont .left .more a:hover i{ color: #0325A1;} .newsdata .cont .left .more{ margin-top: 0.2rem;} .newsdata .cont .left .time{ width: 0.76rem; background: #fff; position: absolute; top: 0; left: -0.8rem; text-align: center; font-size: 15px; line-height: 15px; font-family: 'font3'; color: #0325A1; padding: 0.25rem 0;} .newsdata .cont .left .time i{ display: block; font-size: 0.36rem; line-height: 0.36rem; font-family: 'font3'; color: #0325A1; margin-bottom: 0.02rem;} .discretebox .wli{ width: 100%; height: 8.6rem;} .discretebox .wli1{ background: url(../images/w30.jpg) no-repeat right center; background-size: cover;} .discretebox .wli2{ background: url(../images/w32.jpg) no-repeat right center; background-size: cover;} .discretebox .wli3{ background: url(../images/w33.jpg) no-repeat right center; background-size: cover;} .discretebox .wli4{ background: url(../images/w34.jpg) no-repeat right center; background-size: cover;} .discretebox .wli .mk{ padding: 0.74rem 0 0 1.6rem; position: relative; height: calc(100% - 0.74rem);} .discretebox .wli .mk .h1{ height: 1.31rem; background: url(../images/w31.png) no-repeat left center; background-size: auto 100%; position: relative;} .discretebox .wli .mk .h1::after{ width: 3px; height: 0.32rem; background: #008CD6; position: absolute; top: 50%; left: 0.32rem; transform: translateY(-50%); content: '';} .discretebox .wli .mk .h1 i{ font-size: 0.32rem; line-height: 1.31rem; color: #fff; margin-left: 0.56rem; display: block;} .discretebox .wli .mk .num{ width: 1.17rem; position: absolute; top: 2.05rem; bottom: 0;} .discretebox .wli .mk .num i{ display: block; font-size: 0.18rem; text-align: center; line-height: 0.3rem; padding-top: 5.73rem; position: relative; color: #fff;} .discretebox .wli .mk .num i::after{ content: ''; width: 1px; height: 5.73rem; position: absolute; top: 0; left: 50%; margin-left: -0.5px; background: #fff; opacity: 0.2;} .discretebox .wli .mk .num::after{ content: ''; width: 1px; height: 0.52rem; position: absolute; bottom: 0; left: 50%; margin-left: -0.5px; background: #fff; opacity: 0.2;} .discretebox .wli .text{ padding: 0.12rem 0 0 1.2rem; width: 7rem; } .discretebox .wli .text .li{ padding: 0.3rem 0; border-top: 1px solid hsla(0,0%,100%,0.10);} .discretebox .wli .text .li:first-child{ border-top: none; padding: 0 0 0.3rem 0;} .discretebox .wli .text .li .h2{ font-size: 0.18rem; font-weight: bold; color: #fff; line-height: 0.2rem;} .discretebox .wli .text .li .p{ font-size: 16px; line-height: 0.28rem; margin-top: 0.2rem; color: #fff; opacity: 0.8;} .discretebox .wli .text .icon{ display: flex; margin-top: 0.4rem; margin-left: 0.22rem;} .discretebox .wli .text .icon .m{ margin-right: 0.7rem;} .discretebox .wli .text .icon .m .n{ display: flex; justify-content: center;} .discretebox .wli .text .icon .m .n i{ display: block; position: relative; padding-right: 0.1rem;} .discretebox .wli .text .icon .m .n i img{ display: block; height: 0.5rem; position: relative; z-index: 5; transition: all 0.5s;} .discretebox .wli .text .icon .m:hover .n i img{ transform: rotateY(360deg);} .discretebox .wli .text .icon .m .n i::after{ width: 0.4rem; height: 0.4rem; border-radius: 100%; background: #0179C4; position: absolute; right: 0; top: 50%; margin-top: -0.2rem; content: ''; transition: all 0.5s;} .discretebox .wli .text .icon .m .s{ font-size: 15px; line-height: 15px; margin-top: 0.2rem; color: #fff; text-align: center; opacity: 0.8;} .moremax5{ width: 240px; height: 52px; line-height: 52px;} .discretebox .wli .moremax{ margin-top: 0.55rem;} .discretebox .wli5{ background: url(../images/w55.jpg) no-repeat right center; background-size: cover;} .discretebox .wli6{ background: url(../images/w56.jpg) no-repeat right center; background-size: cover;} .serviceone{ padding: 0.92rem 0; background: url(../images/w60.jpg) no-repeat bottom center; background-size: 100% auto;} .serviceone .cont{ display: flex; justify-content: space-between; align-items: center;} .serviceone .cont .img img{ display: block; width: 4.57rem;} .serviceone .cont .right{ width: 7.53rem;} .serviceone .cont .right .wli{ background: #fff; border-radius: 4px; box-shadow: 0 0 10px #eee; margin-top: 0.15rem; padding: 0.15rem 0.22rem; display: flex; justify-content: space-between;} .serviceone .cont .right .wli:first-child{ margin-top: 0;} .serviceone .cont .right .wli .top{ display: flex; justify-content: flex-start; padding-top: 0.05rem;} .serviceone .cont .right .wli .top .h1{ font-size: 0.2rem; font-weight: bold; color: #042375; line-height: 0.24rem;} .serviceone .cont .right .wli .top .m img{ display: block; width: 0.3rem; margin-right: 0.08rem;} .serviceone .cont .right .wli .mk, .serviceone .cont .right .wli .a{ width: 5.7rem;} .serviceone .cont .right .wli .mk .m{ font-size: 16px; line-height: 0.36rem; color: #666; position: relative; padding-left: 0.26rem;} .serviceone .cont .right .wli .mk .m::after{ content: ''; position: absolute; top: 0; left: 0; width: 0.26rem; height: 0.36rem; background: url(../images/w65.png) no-repeat left center; background-size: 0.17rem auto;} .serviceone .cont .right .wli .a{ display: flex;} .serviceone .cont .right .wli .a i{ padding: 0 0.3rem; border: 1px solid #EAEFF5; line-height: 0.4rem; border-radius: 0.25rem; font-size: 16px; color: #666666;} .serviceone .cont .right .wli .ft{ display: flex; margin-left: 0.26rem;} .serviceone .cont .right .wli .ft .u{ background: #E7F0FF; padding: 0 0.1rem; line-height: 0.38rem; font-size: 16px; color: #666; margin-right: 0.07rem;} .serviceone .cont .right .wli .li{ margin-top: 0.15rem;} .serviceone .cont .right .wli .li:first-child{ margin-top: 0;} .servicebanner{ position: relative; overflow: hidden;} .servicebanner .img{ width: 100%; overflow: hidden; height: 6.2rem; background-size: cover;} .servicebanner .img img{ display: block; opacity: 0; width: 100%;} .servicebanner .cont{ width: 100%; position: absolute; top: 2.4rem; left: 0;} .servicebanner .cont .h1{ font-size: 0.46rem; font-weight: bold; line-height: 0.48rem;} .servicebanner .cont .p{ font-size: 0.22rem; line-height: 0.36rem; margin-top: 0.2rem;} .servicetwo{ padding: 0.8rem 0 0.72rem 0; overflow: hidden;} .servicetwo .cont{ width: 21.6rem; margin-top: 0.6rem; margin-left: -1.2rem; position: relative;} .servicetwo .cont .mker{ width: 3.4rem; height: 5rem; position: relative; background: #008CD7; border-radius: 0.12rem; margin: auto;} .servicetwo .cont .mker .img{ width: 100%; height: 100%; overflow: hidden; position: relative; border-radius: 0.12rem;} .servicetwo .cont .mker .img::after{ content: ''; width: 100%; height: 2.13rem; position: absolute; left: 0; bottom: 0; background-image: linear-gradient(to top, hsla(201,100%,42%,0.50) , hsla(201,100%,42%,0.00));} .servicetwo .cont .mker .img img{ display: block; width: 100%; transition: all 0.5s;} .servicetwo .cont .mker:hover .img img{ transform: scale(1.05);} .servicetwo .cont .mker .p{ font-size: 0.22rem; width: 100%; font-weight: bold; text-align: center; position: absolute; left: 0; bottom: 0.35rem; color: #fff;} .servicetwo .cont .swiper-container::after{ content: ''; width: 3.5rem; height: 100%; background: #fff; position: absolute; top: 0; left: 0; z-index: 5; opacity: 0.85;} .servicetwo .cont .swiper-container::before{ content: ''; width: 3.5rem; height: 100%; background: #fff; position: absolute; top: 0; right: 0; z-index: 5; opacity: 0.85;} .servicetwo .swiper-button-next, .servicetwo .swiper-button-prev{ width: 0.56rem; height: 0.56rem; border-radius: 100%; background: #008CD7 url(../images/w68.png) no-repeat center; background-size: 0.27rem auto; z-index: 8; transition: all 0.5s;} .servicetwo .swiper-button-next{ right: 2.4rem; transform: rotate(180deg);} .servicetwo .swiper-button-prev{ left: 2.4rem;} .servicetwo .swiper-button-next:hover, .servicetwo .swiper-button-prev:hover{ box-shadow: 0 0 10px #008CD7;} .makebanner{ position: relative; overflow: hidden;} .makebanner .img{ width: 100%; overflow: hidden; height: 6.2rem; background-size: cover;} .makebanner .img img{ display: block; opacity: 0; width: 100%;} .makebanner .cont{ width: 100%; position: absolute; top: 2.3rem; left: 0;} .makebanner .cont .h1{ font-size: 0.36rem; color: #fff; line-height: 0.46rem;} .makebanner .cont .p{ font-size: 0.2rem; line-height: 0.34rem; margin-top: 0.2rem; color: #fff;} .maketwo{ position: relative; z-index: 5; transform: translateY(-50%);} .maketwo .cont{ display: flex; justify-content: space-between;} .maketwo .cont .li{ width: 4.34rem; height: 1.48rem; box-shadow: 0 0 10px #eee; border-radius: 0.06rem; position: relative; background: #fff;} .maketwo .cont .li .mk{ padding: 0.2rem 0.3rem;} .maketwo .cont .li .mk .h1{ font-size: 16px; color: #505050; line-height: 16px;} .maketwo .cont .li .mk .img{ margin-top: 0.18rem; display: flex; justify-content: flex-start; align-items: center; margin-left: 0.1rem;} .maketwo .cont .li .mk .img .m img{ display: block; height: 0.67rem; margin-right: 0.2rem;} .maketwo .cont .li .mk .img .p{ font-size: 0.2rem; line-height: 0.3rem; font-weight: bold; transition: all 0.5s;} .maketwo .cont .li:hover .mk .img .p{ color: #008CD7;} .maketwo .cont .li a{ display: flex; position: absolute; right: 0.25rem; bottom: 0.22rem;} .maketwo .cont .li a i{ font-size: 15px; color: #008CD7; padding-left: 0.24rem; background: url(../images/w71.png) no-repeat left center; background-size: 0.16rem auto;} .maketwo .cont .li a:hover i{ text-decoration: underline;} .makethree .ps{ text-align: center; font-size: 18px; line-height: 0.28rem; margin-top: 0.3rem; color: #333;} .relationbanner{ position: relative; overflow: hidden;} .relationbanner .img{ width: 100%; overflow: hidden; height: 6.2rem; background-size: cover;} .relationbanner .img img{ display: block; opacity: 0; width: 100%;} .relationbanner .cont{ width: 100%; position: absolute; top: 2.1rem; left: 0;} .relationbanner .cont .h1{ font-size: 0.48rem; color: #fff; line-height: 0.58rem; width: 4.5rem;} .relationbanner .cont .p{ font-size: 0.26rem; line-height: 0.36rem; margin-top: 0.15rem; color: #fff;} .relationbanner .cont .bot{ margin-top: 0.5rem;} .relationbanner .cont .bot .h2{ font-size: 18px; line-height: 18px; color: #fff;} .relationbanner .cont .bot .mk{ margin-top: 0.15rem; line-height: 0.24rem; display: flex;} .relationbanner .cont .bot .mk .m{ font-size: 0.24rem; font-weight: bold; color: #fff; padding-right: 0.2rem; background: url(../images/w73.png) no-repeat right center; background-size: 0.13rem auto; margin-right: 0.2rem;} .relationbanner .cont .bot .mk .m2{ background: url(../images/w73s.png) no-repeat right center; background-size: 0.13rem auto;} .relationbanner .cont .bot .mk .s{ font-size: 0.2rem; color: #fff;} .relationform{ padding: 0.65rem 0 0.75rem 0; background: url(../images/w74.jpg) no-repeat center bottom; background-size: 100% auto;} .relationform .form{ margin-top: 0.4rem; display: flex; justify-content: flex-start; flex-wrap: wrap;} .relationform .form .li{ width: 50%; display: flex; margin-bottom: 3px; background: #fff;} .relationform .form .li .em:first-child{ width: 1.8rem; height: 0.52rem; line-height: 0.52rem; background: #e9edf2;} .relationform .form .li .em:first-child i{ display: block; text-align: center; font-size: 16px; color: #333;} .relationform .form .li .em:nth-child(2){ width: calc(100% - 1.8rem);} .relationform .form .li .em:nth-child(2) i{ display: block; font-size: 18px; line-height: 0.52rem; padding: 0 0.34rem;} .noticebox{ padding: 0.65rem 0 0.4rem 0; background: url(../images/w76.jpg) no-repeat bottom center; background-size: 100% auto;} .noticebox .went{ margin-top: 0.3rem;} .noticebox .went .top{ display: flex; justify-content: space-between; align-items: center;} .noticebox .went .top .left{ display: flex;} .noticebox .went .top .left .m{ width: 1.9rem; background: #E9F3FD; text-align: center; line-height: 0.6rem; font-size: 0.2rem; font-weight: bold; color: #042274; border-radius: 0.06rem 0.06rem 0 0; border: 1px solid #EAEFF5; border-bottom: none; margin-right: 0.1rem; transition: all 0.5s;} .noticebox .went .top .left .m.on, .noticebox .went .top .left .m:hover{ background: #008CD7; border-color: #008CD7; color: #fff; cursor: pointer;} .noticebox .went .top .right{ display: flex; align-items: center; justify-content: flex-end;} .noticebox .went .top .right .p{ font-size: 16px; margin-right: 0.1rem; color: #333;} .noticebox .went .top .right .sel{ position: relative;} .noticebox .went .top .right .sel::after{ width: 0.1rem; height: 100%; position: absolute; top: 0; right: 0.2rem; background: url(../images/w75.png) no-repeat center; background-size: 100% auto; content: '';} .noticebox .went .top .right select{ width: 120px; height: 0.48rem; border: 1px solid #E1E6EC; outline: none; padding: 0 0.18rem; font-size: 18px; color: #333; border-radius: 0.03rem; display: block; appearance: none; } .noticebox .went .list{ background: #fff; padding: 0.25rem 0.32rem 0.22rem 0.32rem; border: 1px solid #EAEFF5; border-radius: 0 0.03rem 0.03rem 0.03rem;} .noticebox .went .list .li{ border-bottom: 1px solid #DEE9F8;} .noticebox .went .list .li a{ display: flex; justify-content: space-between; line-height: 0.46rem;} .noticebox .went .list .li .p{ font-size: 15px; color: #333; transition: all 0.5s; padding-left: 20px; position: relative;} .noticebox .went .list .li .p::after{ content: '◆'; font-size: 14px; color: #424242; line-height: 0.46rem; position: absolute; top: 0; left: 3px; opacity: 0.5;} .noticebox .went .list .li:hover .p{ color: #042274;} .noticebox .went .list .li .time{ font-size: 14px; color: #333; opacity: 0.6; margin-right: 0.1rem;} .noticebox .went .pageing{ margin-top: 0.4rem;} .noticebox .went .kli{ display: none;} .noticebox .went .kli:first-child{ display: block;} .companytwo{ padding: 0.65rem 0 0.75rem 0; background: url(../images/w76.jpg) no-repeat center bottom; background-size: 100% auto;} .companytwo .img{ margin-top: 0.52rem;} .companytwo .img img{ display: block; max-width: 100%; margin: auto;} .companytwo .list{ display: flex; justify-content: space-between; margin-top: 0.7rem;} .companytwo .list .li{ width: 4.25rem; background: #fff; border-radius: 0.05rem; border: 1px solid #EAEFF5; transition: all 0.5s;} .companytwo .list .li:hover{ box-shadow: 0 0 15px hsla(224,93%,24%,0.10);} .companytwo .list .li .mk{ padding: 0.35rem 0.4rem;} .companytwo .list .li .h1{ font-size: 0.24rem; font-weight: bold; color: #042274; line-height: 0.34rem; text-align: center;} .companytwo .list .li .em{ width: 0.3rem; height: 3px; margin: 0.15rem auto 0; background: #008CD7;} .companytwo .list .li .p{ font-size: 14px; line-height: 0.28rem; text-align: center; color: #333; margin-top: 0.2rem; } .companythree{ padding: 0.7rem 0 0.55rem 0;} .companythree .list{ margin-top: 0.4rem; border: 1px solid #EAEFF5; border-radius: 0.03rem; background: #fff; box-shadow: 0 0 15px hsla(224,93%,24%,0.10); } .companythree .list .mk{ display: flex; justify-content: space-between; flex-wrap: wrap; padding: 0.3rem 0.35rem;} .companythree .list .mk .li a{ font-size: 16px; line-height: 0.46rem; color: #008CD7; position: relative; padding-left: 20px;} .companythree .list .mk .li a::after{ content: '◆'; font-size: 14px; color: #008CD7; line-height: 0.46rem; position: absolute; top: 0; left: 0;} .companythree .list .mk .li{ width: 6.3rem;} .companythree .list .mk .li:hover a{ text-decoration: underline;} .financebox{ padding: 0.65rem 0 0.85rem 0; background: url(../images/w76.jpg) no-repeat center bottom; background-size: 100% auto;} .financebox .form{ margin-top: 0.4rem;} .financebox .form .top{ display: flex;border-bottom: 0.03rem solid hsla(0,0%,100%,0.00); line-height: 0.52rem; text-align: center;} .financebox .form .top .em{ font-size: 18px; font-weight: bold;} .financebox .form .top .li:first-child .em{ text-align: left; padding: 0 0.57rem;} .financebox .form .top .li{ border-left: 1px solid hsla(214,21%,76%,0.30); width: 2.68rem; background: #DBEDF6;} .financebox .form .top .li:first-child{ border-left: none; width: 5.52rem;} .financebox .form .bot .wli{ display: flex; border-bottom: 0.03rem solid hsla(0,0%,100%,0.00);} .financebox .form .bot .wli .li{ width: 2.68rem; background: #fff; border-left: 1px solid hsla(214,21%,76%,0.30); text-align: center;} .financebox .form .bot .wli .li:first-child{ width: 5.52rem; border-left: none; text-align: left; background: #e9edf2;} .financebox .form .bot .wli .li .em{ font-size: 16px; line-height: 0.26rem; padding: 0.13rem 0;} .financebox .form .bot .wli .li:first-child .em{ margin: 0 0.57rem;} .financebox .form .mk2 .wli .li:first-child .em{ font-weight: bold; font-size: 18px;} .financebox .form .mk .wli .li a{ display: flex; justify-content: center;} .financebox .form .mk .wli .li a i{ font-size: 15px; color: #008CD7; padding-left: 0.28rem; background: url(../images/w78.png) no-repeat left center; background-size: 0.18rem auto;} .heatbox{ padding: 0.75rem 0 0.85rem 0; background: url(../images/w79.jpg) no-repeat center; background-size: cover;} .heatbox .cont{ display: flex; justify-content: space-between;} .heatbox .cont .left{ width: 4.02rem; border-radius: 0.05rem; background: hsla(201,100%,42%,0.80); padding: 0.15rem 0;} .heatbox .cont .left .li{ padding: 0.35rem 0;} .heatbox .cont .left .li .m img{ display: block; width: 0.34rem; margin: auto;} .heatbox .cont .left .li .h1{ font-size: 16px; margin-top: 0.1rem; color: #fff; text-align: center;} .heatbox .cont .left .li .p{ font-size: 0.26rem; color: #fff; font-weight: bold; text-align: center; margin-top: 0.185rem; line-height: 0.26rem;} .heatbox .cont .right{ width: 9.05rem;} .heatbox .cont .right .titlemax .h1, .heatbox .cont .right .titlemax .p{ text-align: left;} .heatbox .cont .right .titlemax .em{ margin: 0.2rem 0 0 0;} .heatbox .cont .right .form{ display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 0.6rem;} .heatbox .cont .right .form .li{ width: 4.45rem; margin-top: 0.12rem; display: flex; justify-content: space-between;} .heatbox .cont .right .form .li .h1{ display: flex; justify-content: flex-end; font-size: 16px; color: #333; line-height: 0.52rem; width: 80px;} .heatbox .cont .right .form .li .h1 i{ color: #FF0000; margin-right: 3px;} .heatbox .cont .right .form .li .input{ width: calc(100% - 95px); border: 1px solid #EAEFF5; border-radius: 0.05rem; display: flex; box-sizing: border-box; background: #fff; transition: all 0.5s;} .heatbox .cont .right .form .li:hover .input, .heatbox .cont .right .form .li:hover .text{ border-color: hsla(201,100%,42%,0.40);} .heatbox .cont .right .form .li .input input{ font-size: 16px; padding: 0 15px; height: 0.5rem; border: none; border-radius: 0.05rem;} .heatbox .cont .right .form .li2{ width: 100%;} .heatbox .cont .right .form .li .text{ width: calc(100% - 95px); border: 1px solid #EAEFF5; border-radius: 0.05rem; display: flex; box-sizing: border-box; background: #fff; transition: all 0.5s;} .heatbox .cont .right .form .li .text textarea{ display: block; width: 100%; height: 1.49rem; padding: 0.1rem 15px; font-size: 16px; border: none; border-radius: 0.05rem;} .heatbox .cont .right .form .sub{ width: calc(100% - 95px); padding-top: 0.08rem;} .heatbox .cont .right .form .sub button{ display: block; width: 2.2rem; height: 0.6rem; border-radius: 0.05rem; background: #042274; border: none; font-size: 0.2rem; color: #fff; transition: all 0.5s;} .heatbox .cont .right .form .sub button:hover{ background: #008CD7; cursor: pointer;} .joinbanner .cont .em, .joinbanner .cont .h1, .joinbanner .cont .p{ color: #333;} .joinhot{ padding: 0.6rem 0 0.5rem 0; background: url(../images/w84.jpg) no-repeat center bottom; background-size: 100% auto;} .joinhot .list{ display: flex; justify-content: flex-start; flex-wrap: wrap; padding-top: 0.24rem;} .joinhot .list .li{ width: 4.36rem; background: #fff; border-radius: 0.03rem; position: relative; box-shadow: 0 0 10px hsla(224,93%,24%,0.10); margin: 0.26rem 0.26rem 0 0;} .joinhot .list .li::after{ position: absolute; top: 0; left: 0; bottom: 0; right: 0; border: 1px solid #EAEFF5; border-radius: 0.03rem; content: '';} .joinhot .list .li:nth-child(3n){ margin: 0.26rem 0 0 0;} .joinhot .list .li .mk{ padding: 0.25rem 0.32rem 0.1rem 0.32rem; position: relative; z-index: 5;} .joinhot .list .li .top{ display: flex; justify-content: space-between;} .joinhot .list .li .top a{ width: 0.86rem; height: 36px; line-height: 36px; font-size: 14px; color: #008CD7; border: 1px solid #008CD7; border-radius: 0.03rem; text-align: center; opacity: 0.6; transition: all 0.5s;} .joinhot .list .li:hover .top a{ opacity: 1; background: #008CD7; color: #fff;} .joinhot .list .li .top .h1{ display: flex; font-size: 0.18rem; font-weight: bold; line-height: 36px; color: #333; transition: all 0.5s;} .joinhot .list .li:hover .top .h1{ color: #008CD7;} .joinhot .list .li .top .h1 i{ display: block; width: 19px; height: 36px; background: url(../images/w85.png) no-repeat center; background-size: 100% auto; margin-left: 0.08rem;} .joinhot .list .li .bot{ margin-top: 5px;} .joinhot .list .li .bot .m{ font-size: 15px; line-height: 0.58rem; border-top: 1px solid #DEE9F8; padding-left: 35px;} .joinhot .list .li .bot .m:first-child{ border-top: none;} .joinhot .list .li .bot .m1{ background: url(../images/w86.png) no-repeat left 8px center; background-size: 15px auto;} .joinhot .list .li .bot .m2{ background: url(../images/w87.png) no-repeat left 6px center; background-size: 19px auto;} .joinhot .moremax{ margin: 0.5rem 0.1rem 0 0.1rem;} .joinhot .mjob{ display: flex; justify-content: center;} .moremax6{ width: 188px; height: 58px; line-height: 58px; border-color: #008CD6;} .moremax6 i{ color: #008CD6; background: url(../images/2s.png) no-repeat center right; background-size: 16px auto;} .moremax6:hover{ background: #008CD6;} .moremax6:hover i{ color: #fff; background: url(../images/2.png) no-repeat center right; background-size: 16px auto;} .joinboxtwo{ position: relative;} .joinboxtwo .img img{ display: block; width: 100%;} .joinboxtwo .text{ position: absolute; left: 1.63rem; top: 50%; transform: translateY(-50%);} .joinboxtwo .titlemax .h1, .joinboxtwo .titlemax .p{ text-align: left;} .joinboxtwo .titlemax .em{ margin: 0.2rem 0 0 0;} .joinboxtwo .ps{ font-size: 15px; line-height: 0.28rem; margin-top: 0.25rem; color: #fff;} .joinboxthree{ padding: 0.75rem 1rem 0.7rem 1rem;} .joinboxthree .cont{ margin-top: 0.6rem; padding-top: 0.8rem; position: relative;} .joinboxthree .cont .img{ width: 8.61rem; position: absolute; top: 0; right: 0; overflow: hidden;} .joinboxthree .cont .img img{ display: block; width: 100%;} .joinboxthree .cont .text{ width: 11.82rem; min-height: 5.77rem; background: #F5F9FE;} .joinboxthree .cont .text .mk{ padding: 0.65rem 4.27rem 0 0.75rem; display: flex; justify-content: space-between; flex-wrap: wrap;} .joinboxthree .cont .text .li{ margin-bottom: 0.5rem; width: 2.85rem;} .joinboxthree .cont .text .li .top{ display: flex;} .joinboxthree .cont .text .li .top .m{ width: 0.6rem;} .joinboxthree .cont .text .li .top .m img{ display: block; height: 0.42rem;} .joinboxthree .cont .text .li .top .h1{ font-size: 0.2rem; color: #042274; line-height: 0.42rem; font-weight: bold;} .joinboxthree .cont .text .li .p{ font-size: 14px; line-height: 0.26rem; margin-top: 0.1rem; color: #666; margin-left: 0.6rem;} .joinboxthree .cont .text .li:nth-child(5){ width: 100%;} .joinboxthree .ps{ text-align: center; font-size: 15px; line-height: 0.28rem; margin-top: 0.3rem; color: #666;} .itembox{ padding: 1rem 0 0.5rem 0; background: url(../images/w94.jpg) no-repeat center bottom; background-size: cover;} .itembox .cont{ display: flex; justify-content: flex-start; flex-wrap: wrap;} .itembox .cont .li, .itembox .cont .li a{ width: 4.34rem; height: 1.69rem; position: relative; background: #fff;} .itembox .cont .li{ margin: 0 0.28rem 1.14rem 0;} .itembox .cont .li:nth-child(3n){ margin: 0 0 1.14rem 0;} .itembox .cont .li a{ display: flex; align-items: center;} .itembox .cont .li .img{ width: 2.09rem; height: 2.09rem; overflow: hidden; position: absolute; left: 0.2rem; top: 50%; transform: translateY(-50%);} .itembox .cont .li .img img{ display: block; width: 100%; transition: all 0.5s;} .itembox .cont .li:hover .img img{ transform: scale(1.05);} .itembox .cont .li .text{ margin-left: 2.53rem;} .itembox .cont .li .text .h1{ font-size: 0.24rem; line-height: 0.24rem; color: #333; transition: all 0.5s;} .itembox .cont .li:hover .text .h1{ color: #042274;} .itembox .cont .li .text .p{ font-size: 15px; line-height: 0.26rem; margin-top: 0.2rem; color: #666;} .contactow{ background: #F4F4F4;} .contactow .cont{ margin: -0.65rem auto 0; position: relative; z-index: 5; background: #fff; border-radius: 0.1rem;} .contactow .cont .mk{ padding: 0.6rem 0.67rem; display: flex; justify-content: space-between;} .contactow .cont .mk .text{ width: 3.8rem;} .contactow .cont .mk .text .h1{ font-size: 0.26rem; line-height: 0.3rem;} .contactow .cont .mk .text .li{ margin-top: 0.29rem;} .contactow .cont .mk .text .li .h2{ font-size: 14px; line-height: 0.26rem; padding-left: 0.35rem; background: url(../images/w96.png) no-repeat center left; background-size: auto 0.26rem; text-transform: uppercase;} .contactow .cont .mk .text .li .mn{ font-size: 14px; line-height: 0.26rem; font-weight: bold; color: #666; margin: 0.1rem 0 0 0.35rem;} .contactow .cont .mk .img{ width: 3.9rem; background: #F4F4F4;} .contactow .cont .mk .img .m img{ display: block; width: 100%; transition: all 0.5s;} .contactow .cont .mk .img .m{ overflow: hidden;} .contactow .cont .mk .img:hover .m img{ transform: scale(1.05);} .contactow .cont .mk .img .ber{ padding: 0.2rem 0.25rem;} .contactow .cont .mk .img .ber .h1{ font-size: 0.18rem; color: #333;} .contactow .cont .mk .img .ber .p{ font-size: 14px; line-height: 0.3rem; margin-top: 0.15rem; color: #424242;} .contactow .cont .mk .form{ width: 3.9rem; background: #D2D8DF;} .contactow .cont .mk .form .fm{ padding: 0.3rem 0.28rem;} .contactow .cont .mk .form .fm .h1{ font-size: 0.26rem; line-height: 0.26rem;} .contactow .cont .mk .form .li{ margin-top: 0.15rem;} .contactow .cont .mk .form .li:first-child{ margin-top: 0;} .contactow .cont .mk .form .amk{ margin-top: 0.26rem;} .contactow .cont .mk .form .input{ background: #fff; display: flex; box-sizing: border-box;} .contactow .cont .mk .form .input input{ display: block; padding: 0 0.13rem; width: 100%; height: 0.48rem; border: none; font-size: 14px; color: #242020;} .contactow .cont .mk .form .input input::placeholder, .contactow .cont .mk .form .input textarea::placeholder{ color: hsla(0,6%,13%,0.50);} .contactow .cont .mk .form .input textarea{ display: block; width: 100%; height: 0.9rem; font-size: 14px; color: #242020; padding: 0.13rem; border: none;} .contactow .cont .mk .form .sub{ padding: 0.05rem 0 0 0;} .contactow .cont .mk .form .sub button{ width: 2rem; height: 0.5rem; border-radius: 0.1rem; margin: auto; background: #5B626A; font-size: 16px; color: #fff; border: none; display: block; cursor: pointer; transition: all 0.5s;} .contactow .cont .mk .form .sub button:hover{ background: #042274;} .contactmap{ padding: 0.75rem 0 0 0; background: #F4F4F4;} .contactmap .mapbox{ margin-top: 0.4rem; width: 100%; height: 5rem; background: url(../images/w98.jpg) no-repeat center; background-size: cover;} .cellboxsix{ display: none;} .cellboxsix .topnav{ position: fixed; top: 0; left: 0; right: 0; padding: 0 0.25rem; height: 50px; display: flex; justify-content: space-between; align-items: center; z-index: 50; border-bottom: 1px solid hsla(0,0%,100%,0.09); transition: all 0.5s;} .cellboxsix .topnav2{ background: #042274;} .cellboxsix .topnav .logo img{ display: block; height: 30px;} .cellboxsix .topnav .sole{ width: 24px; height: 20px; position: relative;} .cellboxsix .topnav .sole i{ display: block; width: 100%; height: 3px; background: #fff; border-radius: 2px; position: absolute; left: 0;} .cellboxsix .topnav .sole i:first-child{ top: 0;} .cellboxsix .topnav .sole i:nth-child(2){ top: 50%; margin-top: -1.5px;} .cellboxsix .topnav .sole i:nth-child(3){ bottom: 0;} .cellboxsix .up{ width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 55; background: #000; opacity: 0.8; display: none;} .cellboxsix .list{ width: 200px; background: #fff; position: fixed; top: 0; right: -100%; z-index: 60; height: 100%; transition: all 0.5s;} .cellboxsix .list2{ right: 0;} .cellboxsix .list .sole{ width: 30px; height: 30px; position: absolute; top: 10px; right: 10px; background: url(../images/sole.png) no-repeat center; background-size: 80% auto;} .cellboxsix .list .img{ padding: 100px 0 0 15px;} .cellboxsix .list .img img{ display: block; height: 30px;} /*.cellboxsix .list .nav{ margin: 0 15px; padding-top: 30px;}*/ .cellboxsix .list .nav .li{ border-bottom: 1px solid hsla(0,0%,0%,0.05);} .cellboxsix .list .nav .li .tit a{ font-size: 15px; color: #333; line-height: 50px;} .aboutbanner::after, .servicebanner::after, .makebanner::after, .relationbanner::after{ width: 1px; position: absolute; top: 80px; left: 0.8rem; background: #fff; opacity: 0.1; bottom: 0; content: '';} .aboutbanner::before, .servicebanner::before, .makebanner::before, .relationbanner::before{ width: 1px; position: absolute; top: 80px; right: 0.8rem; background: #fff; opacity: 0.1; bottom: 0; content: '';} .companythree .list .more{ padding: 0.3rem 0; margin: 0 0.35rem; border-top: 1px solid hsla(0,0%,0%,0.10);} .companythree .list .more i{ cursor: pointer; width: 140px; height: 44px; font-size: 14px; text-align: center; line-height: 44px; border-radius: 30px; border: 1px solid #008CD7; color: #008CD7; display: block; margin: auto; transition: all 0.5s;} .companythree .list .more i:hover{ background: #008CD7; color: #fff;} .companythree .list .mk{ max-height: 1.8rem; overflow: hidden; padding: 0.3rem 0.35rem 0 0.3rem; margin: 0 0 0.35rem 0;} .companythree .list .mk2{ max-height: none;} .timeser{ opacity: 0;} .active .timeser{ animation: mymovewww 0.5s; animation-delay: 2s; animation-fill-mode: forwards;} @keyframes mymovewww{ from { opacity: 0; } to { opacity: 1; } } .cellboxsix .list .min{ display: none; border-top: 1px solid #eee; padding: 10px 0;} .cellboxsix .list .tit{ display: flex; align-items: center; justify-content: space-between;} .cellboxsix .list .tit i, .cellboxsix .list .wli .m i{ display: block; width: 20px; height: 50px; background: url(../images/3w.png) no-repeat center; background-size: 8px auto; transition: all 0.5s;} .cellboxsix .list .tit .i, .cellboxsix .list .wli .m .i{ transform: rotate(90deg);} .cellboxsix .list .wli .m a{ font-size: 15px; color: #666; line-height: 30px; padding-left: 15px; position: relative;} .cellboxsix .list .wli .m a::after{ opacity: 0.8; content: ''; width: 6px; height: 6px; border-radius: 100%; background: #666; position: absolute; top: 50%; left: 2px; transform: translateY(-50%);} .cellboxsix .list .wli .rom a{ font-size: 15px; line-height: 30px; color: #666; padding-left: 15px; opacity: 0.8;} .cellboxsix .list .wli .m{ display: flex; justify-content: space-between; align-items: center;} .cellboxsix .list .wli .m i{ height: 30px;} .cellboxsix .list .wli .rom{ display: none;} .cellboxsix .list .nav{padding: 0 15px;position: absolute; top: 160px;left: 0;right: 0;bottom: 0;overflow-y: auto;} .layui-layer,.layui-layer-content{color:#fff !important;} html::-webkit-scrollbar, body::-webkit-scrollbar{ width: 7px; background: #eee;} html::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb{ width: 7px; background: #999; border-radius: 3px;}