.wrap {width:1200px; margin:0 auto}
.header {height:94px;  position:relative; z-index:99; width: 100%;}
.header1 {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  background: #C7E7FF ;
}
.header-fixed.index-fixed{
  /* background-image:url("../image/index_fixedbg.png"); */
  background-image: linear-gradient(205deg, #E8E7FF 0%, #C7E7FF 53%, #D0E3FF 100%);
}

.ttlogo {width:17.5rem;height:6rem;background-image:url("../image/shichangLogo.webp");background-size:100% 100%;position:absolute;top:4rem;left:5rem;}
.ttlist {cursor: pointer; width:3.6rem;height:2.9rem;background-image:url("../image/menuClose.gif");background-size:100% 100%;position:absolute;top:5rem;right:5rem;}
.img img {
	width: 100%;
}
.banner {
    width: 100%;
    height: 108rem;
    background: linear-gradient(200deg, #E8E7FF 0%, #C7E7FF 53%, #D0E3FF 100%);
    position: relative;
    min-width: 1280px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}
.banner-text-view{
  padding: 3rem;
  width: 86.8%;
  min-width: 1080px;
  padding-bottom: 34.7rem;
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  /* margin-top: 0; */
}
.banner-text-title{
  font-size: 7.2rem;
  line-height: 10.6rem;
  letter-spacing: 0.5rem;
  text-align: left;
  /* font-weight: bold; */
  display: inline-block;
  /* background: conic-gradient(from 225deg at 100% 100%, #2C65FF 6%, #6CACFF 73%);*/
   background: linear-gradient(346deg, #2C65FF 0%, #6CACFF 100%);
  /* background: conic-gradient(from 225deg at 100% 100%, #2C65FF 6%, #6CACFF 73%); */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  position: relative;
  z-index: 1;
}
.banner-text-view .banner-text-title span{
  font-family: 'MiSans-Bold';
}
.banner-text-title .next-text{
  float: right;
}
.title-img{
  width: 6.7rem;
  vertical-align: text-top;
  margin-left: 3rem;
}
.banner-text-tip{
  font-size: 3.2rem;
  color: #082464;
  line-height: 4.8rem;
  letter-spacing: 1px;
  text-align: left;
  margin-top: 4rem;
  position: relative;
  font-family: 'MiSans-Normal';
}
.banner-img-view{
  position: absolute;
  bottom: 0;
  right: 0;
}
.banner-img-view img{
  width: 77.8rem;
  position: absolute;
  right: 0;
  bottom: 0;
}
.banner0{
  /* background-image: url('../image/index_banner.jpg'); */
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-image: linear-gradient(213deg, #E8E7FF 0%, #C7E7FF 52%, #D0E3FF 97%);
}
.banner1{
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 100;
  overflow: hidden;
  background: linear-gradient( 135deg, #F8F4FF 0%, #FFFFFF 53%, #D0E3FF 100%);
}
.banner-text{
  width: 79rem;
  height: 28rem;
  margin: 18rem auto 6rem;
  font-family: SourceHanSansCN-Heavy, SourceHanSansCN;
  font-weight: 800;
  color: #FFFFFF;
  line-height: 14.2rem;
  letter-spacing: 3px;
  background: linear-gradient(315deg, #2C65FF 6%, #6CACFF 73%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
  /* background: angular-gradient(315deg, #2C65FF 6%, #6CACFF 73%); */
}
.banner-text p{
  font-size: 9.6rem;
}
.banner-text p:nth-child(2){
  text-align: right;
}
.banner-btn {
  width: 83rem;
  height: 9.46rem;
  line-height: 9.46rem;
  text-align: center;
  border-radius: 1.8rem;
  border: 1px solid #4B5B7D;
  font-size: 3.6rem;
  color: #4B5B7D;
  letter-spacing: 3px;
  margin: 0 auto;
}




.select-wrap {
  width: 65%;
  min-width: 850px;
  margin: -15.9rem auto 10rem;
  overflow: hidden;
}
.select-wrap .img{
  width: 60rem;
  height: 45rem;
  margin-right: 8rem;
  float: left;
}
.select-wrap .select-title {
  font-size: 4.8rem;
  font-weight: 800;
  color: #4B5B7D;
  line-height: 7.2rem;
  margin: 22rem 0 1.05rem;
}
.select-text {
  letter-spacing: 1px;
  line-height: 3.6rem;
  font-size: 2.4rem;
}

.main-item{
  width:70.8%;
  min-width: 907px;
  margin: 15rem auto 0;
  color: #7486B1;
  font-size: 1.65rem;
  position: relative;
  z-index: 1;
}
.main-item .title {
  overflow: hidden;
  font-weight: bold;
  color: #4B5B7D;
}
.main-item .title p{
  font-weight: 800;
  font-size: 7.2rem;
  letter-spacing: 2px;
  line-height: 10.5rem;
  color: #296BFF;
  background: linear-gradient(270deg, #62ACFF 0%, #296BFF 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-family: 'MiSans-Bold';
  
}

.main-item .title .title1 {
  font-size: 3.6rem;
  font-weight: normal;
  font-style: italic;
  letter-spacing: 0.9rem;
  line-height: 1;
  margin-top: 5.4rem;
}
.main-text {
  font-weight: 500;
  font-size: 1.8rem;
  background: linear-gradient(270deg, #62ACFF 0%, #296BFF 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 6rem;
  font-family: 'MiSans-Medium';
}

.main-wrap{
  /* background-image:url("../image/bg.jpg");background-size:100% auto; background-repeat: no-repeat; 
  background-position: center top; */
  min-width: 1280px;
  background-image: linear-gradient(158deg, #F4F9FF 0%, #F3FEFF 53%, #D0E3FF 100%);
  position: relative;
  overflow: hidden;
  /* background-attachment: fixed; */
}

.product-wrap{
  overflow: hidden;
  padding: 3rem;
  width:70.8%;
  min-width: 960px;
  margin-bottom: 13rem;
  margin-top: 0;
  box-sizing: border-box;
}
.product-nav {
  display: flex;
  justify-content: space-between;
  position: relative;
}
.product-nav li{
  width: 24rem;
  height: 7.95rem;
  line-height: 7.95rem;
  text-align: center;
  border-radius: 1.2rem;
  font-size: 2.1rem;
  /* font-weight: bold; */
  color: #4B5B7D;
  font-family: 'MiSans-Medium';
  position: relative;
  z-index: 1;
}
.product-nav li.active,.product-nav li:hover{
  background: #fff;
  /* box-shadow:  0.75rem 0.75rem 2.4rem 0 rgba(157,154,232,0.3); */
  /* box-shadow: 0.8rem 0.8rem 2.4rem 0 rgba(157,154,232,0.3); */
  color: #296BFF;
  font-family: 'MiSans-Bold';
}
.product-nav li:last-child{
  margin-right: 0
}
.product-main {
  position: relative;
  height: 60rem;
  margin-top: 4rem;
  display: none;
  /* justify-content: center; */
  align-items: center;
  justify-content: flex-end;
}
.product-nav .product-sel{
  box-shadow: 0.8rem 0.8rem 2.4rem 0 rgba(157, 154, 232, 0.3);
  background: #FFF;
  transition: all .3s;
  width: 24rem;
  height: 7.95rem;
  left: 0;
  top: 0;
  position: absolute;
  z-index: 0;
}

@keyframes productActive
{
    from { width: 10rem; }
    to { width: 95rem; }
}

.product-main .product-item{
  height: 60rem;
  box-shadow: 0 0.75rem 2.4rem 0 rgba(157,154,232,0.12);
  background: #F7FAFF;
  width: 9rem;
  overflow: hidden;
  float: left;
  margin: 0 0.5rem;
  position: relative;
  border-radius: 1.2rem;
  cursor: pointer;
}
.product-main .product-item:first-child{
  margin-left: 0;
}
.product-main .product-item:last-child{
  margin-right: 0;
}

.product-main .product-item.active{
  width: 95rem;
  background: #fff;
  z-index: 10;
  animation: productActive .3s linear 1 alternate;
  /* Safari 与 Chrome: */
  -webkit-animation: productActive .3s linear 1 alternate;
  cursor: default;
}
.product-item a{
  display: block;
  height: 100%;
}
.product-item .img{
  width: 22.5rem;
  height: 100%;
  position: absolute;
  bottom: 0;
  right: 0;
  display: none;
  /* margin-left: 3.75rem; */
  /* float: right;
  display: none; */
}
.product-item .img img{
  position: absolute;
  right: 0;
  bottom: 0;
}
.product-item-right {
  padding: 10rem 0 0 0;
  position: relative;
}
.product-item .content{
  line-height: 2.4rem;
  font-size: 1.8rem;
  font-family: SourceHanSansCN, SourceHanSansCN;
  color: #A4AFC6;
  /* line-height: 2.4rem; */
  display: none;
}
.product-item .title{
  width: 3rem;
  font-size: 2.4rem;
  font-family: 'MiSans-Medium';
  font-weight: 500;
  color: #4B5B7D;
  position: absolute;
  top: 6rem;
  right: 3rem;
  word-wrap: break-word;
  transition: top .5s;
  text-align: center;
}

.product-item.active .title{
  color: #296BFF;
  text-align: left;
}
.product-item.active .product-item-right{
  padding-left: 6rem;
  padding-right: 24rem;
}
.product-item.active .product-item-right .title{
  width: 100%;
  top: 6rem;
  right: auto;
  left: 6rem;
  font-family: 'MiSans-Bold';
}
.product-main .product-item.active .img,.product-main .product-item.active .content{
  display: block;
}

.suc-wrap{
  position: relative;
  z-index: 1;
}
.suc-wrap .img{
  width: 60rem;
  height: 60rem; 
  border-radius: 1.2rem;
  box-shadow: 0.75rem 0.75rem 2.4rem 0 rgba(157,154,232,0.3);
  margin-right: 7.96rem;
}
.suc-wrap-main{
  border-radius: 1.2rem;
  box-shadow: 0.75rem 0.75rem 2.4rem 0 rgba(157,154,232,0.3);
  overflow: hidden;
  position: relative;
}
/* 1.95rem */
.suc-wrap-right{
  display: none;
  position: relative;
  height: 60rem;
  background: #fff;
  padding: 0rem 7.96rem 0 0;
  line-height: 1.6;
}
.suc-wrap-right .img{
  position: relative;
}
.suc-wrap-right a{
  display: block;
  
}
.suc-wrap-main1 .suc-wrap-right {
  /* padding: 0; */
}
.suc-wrap-main1 .suc-wrap-right a{
  overflow: hidden;
  padding: 0rem 7.96rem 0 0;
}
.suc-wrap-right .img a{
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
}
.suc-wrap-right .title{
  line-height: 9.6rem;
  font-size: 2.4rem;
  padding-top: 3rem;
}
.suc-wrap-right ul{
  /* margin-top: 6.8rem; */
  font-size: 1.8rem;
  position: absolute;
  left: 67.96rem;
  bottom: 7rem;
}
.suc-wrap-right li{
  float: left;
  margin-right: 7.25rem;
}
.suc-wrap-right ul .title{
  line-height: 3.6rem;
}
.suc-wrap-main2{
  /* height: 42rem; */
  /* overflow:; */
  box-shadow: none;
}
.suc-wrap-main2 .title{
  line-height: 3.6rem;
  margin-bottom: 0.4rem;
  padding-top: 0;
}
.suc-wrap-main2 .img{
  position: relative;
  height: 23rem;
  width: 32.7rem;
  overflow: hidden;
  margin-right: 2.6rem;
}
.suc-wrap-main2 .suc-wrap-right{
  height: 23rem;
  display: block;
  padding: 0;
  width: 50%;
  float: left;
  background: none;
  width: calc(50% - 1.3rem);
}
.suc-wrap-main2 .suc-wrap-right:nth-child(even){
  margin-left: 2.6rem;
}
.suc-wrap-main2 .suc-wrap-right:nth-child(n+3){
  margin-top: 4rem;
}
.create-bg{
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: inherit;
  filter: blur(13px);
  z-index: 1;
}
.create-img{
  width: 100%;
  height: auto;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: 2;
}
.suc-wrap-main3 {
  overflow: inherit;
  padding: 3rem 10rem 3rem 6rem;
  background: #fff;
}
.suc-wrap-main3 .suc-wrap-right{
  height: 68rem;
  padding: 0;
}

/* 旋转三圈 从小到大 */
@keyframes animate1{
  0%{
    transform: rotateZ(0) scale(0);
    -webkit-transform: rotateZ(0) scale(0);
    -moz-transform: rotateZ(0) scale(0);
    -ms-transform: rotateZ(0) scale(0);
    -o-transform: rotateZ(0) scale(0);
  }
  100%{
    transform: rotateZ(720deg) scale(1);
    -webkit-transform: rotateZ(720deg) scale(1);
    -moz-transform: rotateZ(720deg) scale(1);
    -ms-transform: rotateZ(720deg) scale(1);
    -o-transform: rotateZ(720deg) scale(1);
  }
}

/* 从小到大 */
@keyframes animate2{
  0%{
    transform: scale(0);
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
  }
  100%{
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
  }
}

/* 上下翻转1圈 */
@keyframes animate3{
  0%{
    transform: rotateX(0);
    -webkit-transform: rotateX(0);
    -moz-transform: rotateX(0);
    -ms-transform: rotateX(0);
    -o-transform: rotateX(0);
  }
  100%{
    transform: rotateX(360deg);
    -webkit-transform: rotateX(360deg);
    -moz-transform: rotateX(360deg);
    -ms-transform: rotateX(360deg);
    -o-transform: rotateX(360deg);
  }
}


/* 左右翻转1圈 */
@keyframes animate4{
  0%{
    transform: rotateY(0);
    -webkit-transform: rotateY(0);
    -moz-transform: rotateY(0);
    -ms-transform: rotateY(0);
    -o-transform: rotateY(0);
  }
  100%{
    transform: rotateY(360deg);
    -webkit-transform: rotateY(360deg);
    -moz-transform: rotateY(360deg);
    -ms-transform: rotateY(360deg);
    -o-transform: rotateY(360deg);
  }
}


/* 翻开展示 */
@keyframes animate5{
  0%{
    clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 100% 0%);
  }
  100%{
    clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}


@keyframes animate6{
  0%{
    left: 100%;
  }
  100%{
    left: 0;
  }
}



.animate__1{
  animation: animate1 .5s linear 1 alternate;
  -webkit-animation: animate1 .5s linear 1 alternate;
  -moz-animation: animate1 .5s linear 1 alternate;
  -ms-animation: animate1 .5s linear 1 alternate;
  -o-animation: animate1 .5s linear 1 alternate;
}

.animate__2{
  animation: animate2 .5s linear 1 alternate;
  -webkit-animation: animate2 .5s linear 1 alternate;
  -moz-animation: animate2 .5s linear 1 alternate;
  -ms-animation: animate2 .5s linear 1 alternate;
  -o-animation: animate2 .5s linear 1 alternate;
}


.animate__3{
  animation: animate3 .5s linear 1 alternate;
  -webkit-animation: animate3 .5s linear 1 alternate;
  -moz-animation: animate3 .5s linear 1 alternate;
  -ms-animation: animate3 .5s linear 1 alternate;
  -o-animation: animate3 .5s linear 1 alternate;
}

.animate__4{
  animation: animate4 .5s linear 1 alternate;
  -webkit-animation: animate4 .5s linear 1 alternate;
  -moz-animation: animate4 .5s linear 1 alternate;
  -ms-animation: animate4 .5s linear 1 alternate;
  -o-animation: animate4 .5s linear 1 alternate;
}


.animate__5{
  animation: animate5 .5s linear 1 alternate;
  -webkit-animation: animate5 .5s linear 1 alternate;
  -moz-animation: animate5 .5s linear 1 alternate;
  -ms-animation: animate5 .5s linear 1 alternate;
  -o-animation: animate5 .5s linear 1 alternate;
}


.animate__6{
  animation: animate6 .5s linear 1 alternate;
  -webkit-animation: animate6 .5s linear 1 alternate;
  -moz-animation: animate6 .5s linear 1 alternate;
  -ms-animation: animate6 .5s linear 1 alternate;
  -o-animation: animate6 .5s linear 1 alternate;
}

.suc-wrap-main3 .title{
  line-height: 3.9rem;
  font-weight: bold;
  color: #7486B1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: 1rem;
}
.suc-wrap-main3 .img{
  width: 38.98rem;
  height: 21rem;
  margin-right: 4rem;
  overflow: hidden;
}
.suc-wrap-main3 .img a{
  display: block;
  width: 100%;
}
.news-time{
  font-weight: bold;
  position: relative;
  color: #7486B1;
  text-align: right;
}
.news-con {
  /* padding-top: 3rem; */
}
.news-text{
  color: #7486B1;
  margin: 2rem 0 3rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
}
.news-item {
  display: block;
  margin-bottom: 2.7rem;
  height: 21rem;
}
/* .news-item:nth-child(1)::after,.news-item:nth-child(2)::after{
  content: '';
  display: block;
  height: 1px;
  opacity: 0.36;
  border-radius: 1px;
  background: linear-gradient(315deg, rgba(80,130,243,0) 0%, #0A56FF 53%, rgba(10,86,255,0) 100%);
  position: absolute;
  left: 68rem;
  right: 8rem;
} */
.news-item:hover .title, .news-item:hover .news-time{
  color: #5082F3;
}
.suc-wrap-main .more a{
  letter-spacing: 1px;
  font-size: 2.1rem;
  font-weight: bold;
  color: #5082F3;
  position: absolute;
  right: 1.95rem;
  bottom: 1.95rem;
}
.suc-list-wrap {
  position: relative;
  margin-bottom: 19.5rem;
  z-index: 1;
}
.suc-list {
  background: #fff;
  padding: 1.95rem 2.1rem 1.95rem 2.1rem;
  border-radius: 1.2rem;
  box-shadow: 0.75rem 0.75rem 2.4rem 0 rgba(157,154,232,0.3);
  overflow: hidden;
  margin-top: 19.5rem;
}
.suc-list li{
  width: 20%;
  /* width: 26rem; */
  height: 14rem;
  border-radius: 1.2rem;
  float: left;
  padding: 3rem;
  box-sizing: border-box;
}
.suc-list li a{
  display: block;
}
.suc-list li:hover{
  box-shadow: 0.75rem 0.75rem 2.4rem 0 rgba(157,154,232,0.3);
}
.suc-list li:active{
  background: #F7FAFF;
  box-shadow: none
}
.suc-list li img {
  width: 100%;
  /* width: 20rem; */
  height: 7.96rem;
}
.suc-list-wrap .more a, .suc-wrap-main3 .more a{
  width: 6.6rem;
  height: 31.83rem;
  background: linear-gradient(180deg, #FFFFFF 0%, rgba(255,255,255,0) 100%);
  border-radius: 1.2rem;
  position: absolute;
  right: -10.8rem;
  top: 0;
  font-size: 2.1rem;
  letter-spacing: 1px;
  line-height: 3.15rem;
  /* font-weight: bold; */
  color: #5082F3;
  padding: 1.95rem 1.8rem 0;
  box-sizing: border-box;
  text-align: center;
  font-family: 'MiSans-Medium';
  
}
.suc-list-wrap .more span, .suc-wrap-main3 .more a span{
  /* writing-mode: vertical-rl; */
  font-family: 'MiSans-Medium';
  font-weight: normal;
}
.suc-btns,.create-btns{
  width: 7.96rem;
  position: absolute;
  right: -12rem;
  top: 22.52rem;
}
.create-btns{
  display: none;
}
.suc-btns li,.create-btns li{
  width: 7.96rem;
  height: 1.95rem;
  border-radius: 7px;
  background: #CBD5EB;
  margin-bottom: 3rem;
}
.create-btns li {
  margin-bottom: 1.5rem;
}
.suc-btns li.active,.create-btns li.active{
  background: #fff;
  box-shadow: 0.75rem 0.75rem 2.4rem 0 rgba(157,154,232,0.3);
}
.suc-btns li:hover,.create-btns li:hover{
  background: #AFC5F6;
  box-shadow: 0.75rem 0.75rem 2.4rem 0 rgba(157,154,232,0.3);
}
.suc-btns li:active,.create-btns li:active{
  background: #7486B1;
}



.line{
  margin: 19.5rem auto 7.8rem;
  background: #296BFF;
  width: 90rem;
  height: 1px;
}

.cricle{
  position: absolute;
  opacity: 0.16;  
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -ms-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  background-image: linear-gradient(180deg, rgba(181,210,255,0.00) 0%, #7EA6FF 100%);
}

.cricle-01{
  right: -6rem;
  top: -5rem;
  width: 32rem;
  height: 32rem;
  border-radius: 16rem;
  transform: rotate(-190deg);
  -webkit-transform: rotate(-190deg);
  -moz-transform: rotate(-190deg);
  -ms-transform: rotate(-190deg);
  -o-transform: rotate(-190deg);
}

.cricle-02{
  left: 6rem;
  top: 80rem;
  width: 12rem;
  height: 12rem;
  border-radius: 6rem;
}


.cricle-03{
  left: -16rem;
  top: 95rem;
  width: 32rem;
  height: 32rem;
  border-radius: 16rem;
}


.cricle-04{
  left: 12rem;
  top: 224rem;
  width: 46rem;
  height: 46rem;
  border-radius: 23rem;
}

.cricle-05{
  right: -15rem;
  top: 272rem;
  width: 30rem;
  height: 30rem;
  border-radius: 15rem;
  transform: rotate(-220deg);
  -webkit-transform: rotate(-220deg);
  -moz-transform: rotate(-220deg);
  -ms-transform: rotate(-220deg);
  -o-transform: rotate(-220deg);
}

.cricle-06{
  left: -10rem;
  bottom: 0;
  width: 60rem;
  height: 60rem;
  border-radius: 30rem;
}
.aboutBox{
  position: relative;
  z-index: 1;
}