@charset "UTF-8";
::-moz-selection { color: #fff; background: #3e84ff; }
::selection { color: #fff; background: #3e84ff; }

* { margin: 0px; padding: 0px; }

html { font-size: 62.5%; height: 100%; }

body { margin: 0 auto; width: 100%; max-width: 1920px; font-size: 14px; font-size: 1.4rem; line-height: 1.2; overflow-x: hidden; font-family: 'Microsoft YaHei', 微软雅黑; }
body::-webkit-scrollbar {/*滚动条整体样式*/
  width: 8px;     /*高宽分别对应横竖滚动条的尺寸*/
  height: 8px;
  scrollbar-arrow-color:red;
}
body::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
  border-radius: 5px;
  -webkit-box-shadow: inset 0 0 5px #c1c1c1;
  box-shadow: inset 0 0 5px #c1c1c1;
  background: #c1c1c1;
  scrollbar-arrow-color:red;
}
body::-webkit-scrollbar-track {/*滚动条里面轨道*/
  -webkit-box-shadow: inset 0 0 5px rgba(193,193,193,0.1);
  box-shadow: inset 0 0 5px rgba(193,193,193,0.1);
  border-radius: 0;
  background: rgba(193,193,193,0.1);
}

a { text-decoration: none; outline: none; color: #333; tap-highlight-color: transparent; focus-ring-color: transparent; -webkit-tap-highlight-color: transparent; -webkit-focus-ring-color: transparent; -moz-tap-highlight-color: transparent; -moz-focus-ring-color: transparent; -webkit-transition: all 550ms; -o-transition: all 550ms; -moz-transition: all 550ms; transition: all 550ms; }

a:hover { color: #3e84ff; }

ol, ul, li { list-style: none; }

img { max-width: 100%; border: 0px solid #ccc; height: auto; }

table, embed, video { max-width: 100%; }

input, textarea { border: none; background: none; font-family: inherit; }

input[type="submit"], textarea[type="submit"] { cursor: pointer; }

input[type="checkbox"], textarea[type="checkbox"] { cursor: pointer; }

input[type="radio"], textarea[type="radio"] { cursor: pointer; }

input:focus, textarea:focus { outline: none; }

textarea { resize: none; }

button { border: none; background: none; cursor: pointer; }

em, i { font-style: normal; }

.ellipsis1{
  display: -webkit-box!important;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis
}
.ellipsis2{
  display: -webkit-box!important;
  -webkit-line-clamp:2;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
}
.ellipsis3{  display: -webkit-box!important;
  -webkit-line-clamp:3;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
}
.ellipsis4{  display: -webkit-box!important;
  -webkit-line-clamp:4;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
} 
.br{display: block;}
.f-box { margin: 0 auto; width: 1200px; max-width: 100%; overflow: visible; -moz-box-sizing: border-box; box-sizing: border-box; }
@media screen and (max-width: 1219px) { .f-box{ width: 980px; } }
@media screen and (max-width: 1023px) { .f-box { width: 90%;} }
@media screen and (max-width: 991px) { .f-box { width: 720px; } .br{display: none;}} 
@media screen and (max-width: 767px) { .f-box { padding-left: 15px; padding-right: 15px; }

.m-br{display: block;} }
.tr { text-align: right;}
/* .j-xx start */
.j-offset-top { -webkit-transition: all 750ms; -o-transition: all 750ms; -moz-transition: all 750ms; transition: all 750ms; -webkit-transform: translateY(100px); -moz-transform: translateY(100px); -ms-transform: translateY(100px); -o-transform: translateY(100px); transform: translateY(100px); opacity: 0; }

.j-offset-top.run { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); opacity: 1; }

.flex{display: flex;display:-webkit-flex;justify-content: space-between;flex-wrap: wrap}

.banner {  width: 100%; }
.banner img { width: 100%; }
.index2 { text-align: center;}
.title { text-align: center; font-size: 36px; font-weight: bold; color: #333333; line-height: 46px; padding-top: 84px;}
.s-title { text-align: center;font-size: 16px;  color: #000000; line-height: 26px; margin-top: 13px;}
.index2 .list { margin-top: 50px;}
.index2 .list .item { width: calc(33.33% - 23.3px); margin-top: 26px;background: url(../image/m-smart7-img1.png) no-repeat center; background-size: 99% 98%;}
.index2 .list .item div { padding: 10px 45px 20px;} 
.index2 .list .item div img { width: 100%;height: 100%;object-fit: cover;} 
.index-btn { display: inline-block; margin-top: 85px; padding: 18px 80px; background: linear-gradient(-264deg, #7B66FD, #376EF9); border-radius: 20px;font-size: 22px; font-weight: bold; color: #FFFFFF; line-height: 24px; text-align: center;} 
.index-btn:hover { opacity: 0.8;color: #FFFFFF;} 
.wave { margin-top: 62px; width: 100vw;height: 109px; overflow: hidden; position: relative;} 
.wave .waveTop { width: 200%;height: 100%; position: absolute; top: 0; left: 0; background-repeat: repeat no-repeat; background-position: 0 bottom; transform-origin: center bottom; -webkit-animation: moveWave 15s linear infinite; -o-animation: moveWave 15s linear infinite; animation: moveWave 15s linear infinite;} 
@keyframes moveWave {
    0% {
        transform: translateX(0) translateZ(0) scaleY(1)
    }
    50% {
        transform: translateX(-25%) translateZ(0) scaleY(0.55)
    }
    100% {
        transform: translateX(-50%) translateZ(0) scaleY(1)
    }
}
@media screen and (max-width: 1219px) { 
  .index2 .list .item div { padding: 10px 35px 20px;}
} 
@media screen and (max-width: 991px) { 
  .title { font-size: 20px;line-height: 30px; padding-top: 50px;}
  .s-title { font-size: 12px; line-height: 22px; margin-top: 5px;} 
  .index2 .list { margin-top: 10px;}
  .index-btn { padding: 10px 40px; font-size: 16px; margin-top: 40px;}
  .index2 .wave { margin-top: 20px; }
  .index2 .list .item { width: calc(50% - 23.3px);}
  .index2 .list .item div { padding: 10px 35px 20px;}
} 
@media screen and (max-width: 480px) {  
  .index2 .list .item { width: 100%;}
  .index2 .list .item div { padding: 10px 40px 20px;}
} 
@media screen and (min-width: 1600px) { .f-big-box { width: 1500px;}}
.index3 { margin-bottom: 66px;}
.index3 .cont { margin-top: 85px; position: relative;}
.index3 .center { display: block; margin: 0 auto; width: 31.14%; height: auto;}
.index3 .item { position: absolute; line-height: 0;}
.index3 .item img { width: 99px; height: 65px;}
.index3 .item .text {margin-top: -17px;flex: 1;}
.index3 .item .text p:nth-of-type(1) {font-size: 26px; font-weight: bold; color: #000000; line-height: 40px; background: linear-gradient(-264deg, #7B66FD 0%, #376EF9 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.index3 .item .text p:nth-of-type(2) { margin-top: 19px; font-size: 16px; color: #000000; line-height: 30px;}
.index3 .item1 { top: 12.4%; right: 65%;}
.index3 .item1 img { margin-left: 15px; margin-right: 12px;}
.index3 .item2 { top: 65.2%; right: 65%;}
.index3 .item2 .text {margin-top: 40px;}
.index3 .item2 img { transform: rotateX(180deg); margin-left: 15px; margin-right: 12px;}
.index3 .item3 { top: 12.4%; left: 65%;}
.index3 .item3 img { transform: rotateY(180deg); margin-left: 13px; margin-right: 10px;}
.index3 .item4 { top: 65.2%; left: 65%;}
.index3 .item4 .text {margin-top: 40px;}
.index3 .item4 img { transform: rotate(-180deg); margin-left: 13px; margin-right: 10px;}
@media screen and (max-width: 1219px) {
  .index3 { margin-bottom: 100px;}
}
@media screen and (max-width: 1023px) {
  .index3 { margin-bottom: 130px;}
  .index3 .item .text p:nth-of-type(1) { font-size: 22px; line-height: 36px;}
}
@media screen and (max-width: 991px) {
  .index3 .cont { margin-top: 10px;}
  .index3 .item img { width: 46px; height: 33px;}
  .index3 .item .text { margin-top: -11px;}
  .index3 .item .text p:nth-of-type(1) {font-size: 18px; line-height: 26px;}
  .index3 .item .text p:nth-of-type(2) {font-size: 12px; line-height: 18px; margin-top: 10px;}
  .index3 .item2 .text {margin-top: 18px;}
  .index3 .item4 .text {margin-top: 18px;}
}
@media screen and (max-width: 767px) {
  .index3 { margin-bottom: 70px;}
  .index3 .center { width: 70%; margin-top: 30px;}
  .index3 .item { position: relative; left: unset; top: unset; right: unset; text-align: center;}
  .index3 .item .text { margin-top: 30px;}
  .index3 .item .text.tr { text-align: center;}
  .index3 .item .text p:nth-of-type(1) { line-height: 26px;}
  .index3 .item .text p:nth-of-type(2) { line-height: 24px; margin-top: 19px;}
  .index3 .item img  { display: none;}
}
.index4 { background: #EFEFFF; padding-bottom: 73px;}
.index4 .tit-box { margin-top: 45px; text-align: center;}
.index4 .tit-box .tit { position: relative; display: inline-block; padding: 20px 45px; background: #FFFFFF; box-shadow: 0px 3px 7px 0px rgba(35, 24, 21, 0.15);}
.index4 .tit-box .tit span { font-size: 30px; font-weight: bold; color: #1D5D9D; line-height: 34px; background: linear-gradient(-264deg, #7B66FD 0%, #376EF9 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.index4 .tit-box img { position: absolute;}
.index4 .tit-box img:nth-of-type(1) { top: -4px;left: -7px;}
.index4 .tit-box img:nth-of-type(2) { right: -5px;bottom: -5px;}
.index4 .list { margin-top: 20px;}
.index4 .list .item { margin-top: 60px; flex: 1; margin-right: 14px; padding: 40px 5px 25px; background: linear-gradient(-264deg, #7B66FD, #376EF9); border-radius: 6px; position: relative;}
.index4 .list .item:last-child { margin-right: 0;}
.index4 .list .item .tit { position: absolute; left: 20px; top: -14px; width: calc(100% - 40px);height: 37px; background: #FFFFFF; box-shadow: 0px 3px 7px 0px rgba(35, 24, 21, 0.35); border-radius: 6px;text-align: center;font-size: 20px; font-family: Microsoft YaHei; font-weight: bold; color: #333333; line-height: 37px;}
.index4 .list .item .text { padding-left: 29px; background: url('../image/tick.png') no-repeat; background-position: 6px 10px; font-size: 18px; font-weight: 400; color: #FFFFFF; line-height: 38px;}
.index4 .tit-box1 { margin-top: 85px;}
.index4 .list1 { margin-top: 25px;}
.index4 .list1 .item { margin-top: 60px; text-align: center; flex: 1; margin-right: 63px; padding: 45px 15px 14px;background: #FFFFFF;position: relative;}
.index4 .list1 .item:last-child { margin-right: 0;}
.index4 .list1 .item .icon { width: 64px; height: 64px; display: flex; align-items: center;justify-content: center; background: #466CFA; border-radius: 50%;position: absolute;left: 50%;margin-left: -32px;top: -32px; text-align: center;} 
.index4 .list1 .item p { margin-top: 16px; font-size: 16px; color: #666666; line-height: 30px;}
.index4 .list1 .item .tit {font-size: 20px; font-weight: bold; color: #446CFA; line-height: 30px;}
@media screen and (max-width: 1219px) {
  .index4 .list .item { width: calc(33.33% - 30px);flex: unset;}
  .index4 .list .item .tit { font-size: 18px;}
  .index4 .list .item .text { font-size: 16px;}
  .index4 .list .item:nth-child(3n) { margin-right: 0;}
  .index4 .list1 .item { margin-right: 20px;}
}
@media screen and (max-width: 991px) {
  .index4 .tit-box { margin-top: 40px; text-align: center;}
  .index4 .tit-box1 { margin-top: 40px;}
  .index4 .tit-box .tit { padding: 8px 25px;}
  .index4 .tit-box .tit span { font-size: 18px;}
  .index4 .tit-box img { width: 18px;height: auto;}
  .index4 .list1 .item { padding: 45px 10px 14px;}
  .index4 .list1 .item p { font-size: 14px;}
  .index4 .list1 .item .tit { font-size: 18px;}
}
@media screen and (max-width: 767px) {
  .index4 .list .item { margin-top: 30px; width: 100%; margin-right: 0;} 
  .index4 .list .item:nth-child(2n) { margin-right: 0;}
  .index4 .list1 .item { flex: unset; width: 100%; margin-right: 0; margin-top: 40px;}
  .index4 .list1 .item .icon { width: 50px; height: 50px; margin-left: -25px;top: -25px;}
  .index4 .list1 .item .icon img { width: 48%; height: auto;}
  .index4 .list1 .item p { margin-top: 10px; font-size: 12px; line-height: 22px;}
  .index4 .list1 .item .tit {font-size: 18px; line-height: 28px; margin-top: 0;}
} 
.index5 .cont { margin-top: 118px; text-align: center; position: relative;}
.index5 .cont .center { width: 74%;}
.index5 .cont .center1 { display: none;}
.index5 .cont .item p:nth-of-type(1) {font-size: 20px; font-weight: bold; color: #000000; line-height: 40px;}
.index5 .cont .item p:nth-of-type(2) {font-size: 16px; color: #666666; line-height: 30px;}
.index5 .cont .item {position: absolute; width: 246px; height: 115px; padding: 10px; border-radius: 20px; display: flex; display: -webkit-flex; align-items: center;-webkit-box-orient: vertical; -webkit-flex-flow: column; flex-flow: column;justify-content: center;}
.index5 .cont .item p { position: relative; z-index: 2;}
.index5 .cont .item::before { content: ''; position: absolute; left: -22px; bottom: -13px; width: 77px; height: 82px; background: #EAF0FF; opacity: 0.45; border-radius: 20px;z-index: 1;}
.index5 .cont .item::after { content: ''; position: absolute; top: -18px; right: -25px; width: 77px; height: 82px; background: #EAF0FF; opacity: 0.45; border-radius: 20px;z-index: 1;}
.index5 .cont .item1 {background: #EAF0FF;left: 41.7%;top: -59px;}
.index5 .cont .item1::before { background: #EAF0FF;}
.index5 .cont .item1::after { background: #EAF0FF;}
.index5 .cont .item2 {background: #D7D5FE; top: 29%;left: 5.4%;}
.index5 .cont .item2::before { background: #D7D5FE;}
.index5 .cont .item2::after { background: #D7D5FE;}
.index5 .cont .item3 {background: #A4CCFF; top: 29%;right: 5.4%;}
.index5 .cont .item3::before { background: #A4CCFF;}
.index5 .cont .item3::after { background: #A4CCFF;}
.index5 .cont .item4 {background: #C2E1FF; bottom: -14px;left: 17.8%;}
.index5 .cont .item4::before { background: #C2E1FF;}
.index5 .cont .item4::after { background: #C2E1FF;}
.index5 .cont .item5 {background: #BDBAF6; bottom: -14px;right: 17.8%;}
.index5 .cont .item5::before { background: #BDBAF6;}
.index5 .cont .item5::after { background: #BDBAF6;}
.index5 .btn-box { text-align: center; margin-top: 65px;}
.index5 .wave { margin-top: 98px;}
@media screen and (max-width: 1219px) {
  .index5 .cont .item { width: 220px;height: 100px;}
  .index5 .cont .item p:nth-of-type(1) {font-size: 18px;}
  .index5 .cont .item p:nth-of-type(2) {font-size: 14px; line-height: 26px;}
}
@media screen and (max-width: 991px) {
  .index5 .cont .item { width: 200px;height: 70px;}
  .index5 .cont .item p:nth-of-type(1) {font-size: 16px;}
  .index5 .cont .item p:nth-of-type(2) {font-size: 12px; line-height: 22px;}
  .index5 .cont .item1 { left: 37%;}
  .index5 .cont .item2 { left: 0;}
  .index5 .cont .item3 { right: 0;}
  .index5 .cont .item4 { left: 10%;}
  .index5 .cont .item5 { right: 10%;}
}
@media screen and (max-width: 767px) {
  .index5 .cont {margin-top: 0;} 
  .index5 .cont .center { display: none;}
  .index5 .cont .center1 { margin: 0 auto; margin-top: 40px; width: 74%; display: block;}
  .index5 .cont .item { margin: 0 auto; margin-top: 40px; width: 70%; position: relative; top: unset;left: unset;right: 0;}
  .index5 .btn-box { margin-top: 30px;}
  .index5 .wave { margin-top: 28px;}
}

.index6 { padding-bottom: 100px;}
.index6 .list { margin-top: 27px;}
.index6 .list .item { margin-top: 50px; width: calc(25% - 40px); text-align: center;}
.index6 .list .item .icon { margin: 0 auto; width: 99px; height: 99px; background: #436DFA; border-radius: 50%; position: relative; display: flex; justify-content: center;align-items: center;}
.index6 .list .item .icon::after { content: '';width: 85px; height: 85px; border: 1px dashed #FFFFFF; border-radius: 50%; position: absolute;top: 6px;left: 6px;}
.index6 .list .item .tit { margin: 0 auto; margin-top: 24px; width: 100%; height: 59px; background: url(../image/manage.png); background-size: 100% 100%; font-size: 24px; color: #333333; line-height: 59px;}
.index6 .list .item .text { margin: 0 auto; margin-top: 40px; width: 100%; font-size: 18px; color: #000000; line-height: 34px;}
@media screen and (max-width: 1219px) {
  .index6 .list .item { width: calc(25% - 30px);}
  .index6 .list .item .tit { font-size: 20px; }
  .index6 .list .item .text { font-size: 16px; }
}
@media screen and (max-width: 991px) {
  .index6 .list .item { width: calc(25% - 20px);}
  .index6 .list .item .tit { height: 50px; line-height: 50px; font-size: 16px; }
  .index6 .list .item .text { font-size: 14px; }
  .index6 .list .item .icon { width: 70px; height: 70px;}
  .index6 .list .item .icon::after { content: '';width: 60px; height: 60px;top: 5px;left: 5px;}

}
@media screen and (max-width: 767px) {
  .index6 { padding-bottom: 0;}
  .index6 .list { margin-top: 17px;}
  .index6 .list .item { width: calc(50% - 15px); margin-top: 30px;}
  .index6 .list .item .tit { margin-top: 14px; height: 40px; line-height: 40px; font-size: 14px; }
  .index6 .list .item .text { font-size: 12px; line-height: 24px; margin-top: 25px;}
} 
.index7 { background: #EFEFFF;padding-bottom: 100px; margin-top: 75px;}
.index7 .list { margin-top: 100px;}
.index7 .list .item { flex: 1; text-align: center; padding: 0 15px;}
.index7 .list .item .num { display: inline-block; width: 110px;height: 110px; background: url(../image/circle.png) no-repeat; background-size: 100% 100%; font-size: 34px;font-weight: 800;font-style: italic;color: #5178FA;line-height: 110px;text-align: center; position: relative;}
.index7 .list .item .text { padding-bottom: 7px; text-align: center;}
.index7 .list .item .text p:nth-of-type(1) { margin-top: 16px; font-size: 22px; font-weight: bold; color: #333333; line-height: 40px;}
.index7 .list .item .text p:nth-of-type(2) { margin-top: 9px; font-size: 18px; color: #666666; line-height: 32px;}
.index7 .list .item1 { min-width: 220px;}
.index7 .list .item6 { min-width: 242px;}
.index7 .list .item:nth-child(2n) { margin-top: -53px;}
.index7 .list .item .num::after { content: ''; width: 200px; height: 1px; transform-origin: 0 0; transform: rotate(30deg); background-color: #436DFA; position: absolute; left: 110px; top: 55px;}
.index7 .list .item:nth-child(2n) .num::after { content: ''; width: 200px; height: 1px; transform-origin: 0 0; transform: rotate(-30deg); background-color: #436DFA; position: absolute; left: 110px; top: 55px;}
.index7 .list .item6 .num::after { height: 0 !important;}

.index7 .btn-box { text-align: center;}
@media screen and (max-width: 1600px) {
  .index7 .list { zoom: 0.9;}
}
@media screen and (max-width: 1219px) {
  .index7 .list { zoom: 0.7;}
}
@media screen and (max-width: 1023px) {
  .index7 .list { zoom: 0.6;}
}
@media screen and (max-width: 991px) {
  .index7 .list { zoom: 0.54;}
}
@media screen and (max-width: 767px) {
  .index7 .list { zoom: 1;}
  .index7 { padding-bottom: 70px;}
  .index7 .list { margin-top: 0;}
  .index7 .list .item { margin-top: 40px !important; width: 100%; flex: unset;}
  .index7 .list .item .num { float: left; width: 70px; height: 70px; margin-right: 20px;font-size: 24px; line-height: 70px;}
  .index7 .list .item::after { content: ''; display: block; clear: both;}
  .index7 .list .item .num::after { height: 0 !important;}
  .index7 .list .item .text { width: calc(100% - 90px); text-align: left; float: right;}
  .index7 .list .item .text p:nth-of-type(1) { margin-top: 0; font-size: 18px; line-height: 28px;}
  .index7 .list .item .text p:nth-of-type(2) { margin-top: 10px; font-size: 14px; line-height: 24px; }
}