﻿* {
  margin: 0;
  padding: 0;
}

html {
  font-family: '微软雅黑', 'Microsoft Yahei';  
}

html,
body {
  height: 100%;
  width: 100%;
}

body {
  overflow-x: hidden;
  overflow-y: auto;
  margin: 0 auto !important;
  background-color: #fff;
}

/* 清除浮动 */
.clearfix:after {
  content: '';
  display: block;
  clear: both;
}
/* 标题下横条 */
.title-bottom-img {
  width: 63px;
  height: 6px;
  background: linear-gradient(270deg, rgba(120, 27, 255, 0) 0%, #804BFD 100%);
  opacity: 1;
  margin-top: -4px;
}
/* 紫色圆点 */
.violet-circle {
  display: inline-block;
  width: 6px;
  height: 6px;
  background-color: #781bFF;
  border-radius: 50%;
}



.wrap {
  display: flex;
  flex-direction: column;
  text-align: center;
}

.top-nav {
  position: relative;
}

.top-nav > img {
  width: 100%;
  display: block;
  box-shadow: none !important;
}

.wrap img {
  box-shadow: 0 0 8px 0 #f2f2f2;
}
/* banner样式 */
.top-nav > a {
  display: inline-block;
  width: 120px;
  height: 40px;
  line-height: 40px;
  position: absolute;
  top: 60%;
  left: 18.8%;
  border: 1px solid #fff;
  color: #fff;
}
.top-nav .banner-desc {
  width: 637px;
  position: absolute;
  top: 26%;
  left: 18.8%;
  text-align: left;
}
.top-nav .banner-desc .banner-title {
  font-size: 40px;
  color: #fff;
}
.banner-desc .banner-desc-text {
  margin-top: 21px;
  font-size: 16px;
  color: #fff;
  line-height: 28px;
}


.nav-part {
  height: 50px;
  width: 100%;
  background-image: url('../images/new_retail/tab_background.png');
}

.nav-part ul {
  height: 50px;
  align-items: center;
}

.nav-scroll {
  background: #fff;
  color: #303445;
  position: fixed;
  top: 0;
  z-index: 50;
}

.nav-part.nav-scroll ul {
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

.wrap ul {
  list-style: none;
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin: -1px auto;
}

.nav-part ul > li {
  display: inline-block;
  width: 12.97%;
  height: 100%;
  line-height: 50px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nav-part ul > li:hover {
  background-color: #9A6FFD;
}

.nav-part.nav-scroll ul > li:hover {
  background-color: #FFFFFF;
}

.nav-part ul > li i {
  color: #fff;
  margin-right: 6px;
}

.nav-part.nav-scroll ul>li i {
  color: #9fa5bb;
}

.nav-part ul > li a {
  text-decoration: none;
  color: #fff;
  font-size: 14px;
  padding-top: 16px;
  padding-bottom: 15px;
  font-weight: bold;
}

.nav-part.nav-scroll ul>li a {
  text-decoration: none;
  color: #59607b;
  font-size: 15px;
}

.nav-part.nav-scroll ul>li.active a {
  color: #5D33F7;
  height: 48px;
  display: block;
  margin: 0 20px;
  border-bottom: 2px solid #5D33F7;
  padding: 0;
}
/* 私域动态 */
.scene-resolution {
  height: 560px;
  box-sizing: border-box;
}

.scene-resolution .scene-title {
  color: #010101;
  font-size: 32px;
  font-weight: bold;
  height: 32px;
  line-height: 32px;
  letter-spacing: 1px;
  padding-top: 80px;
  padding-bottom: 90px;
}

.scene-resolution .scene-list {
  width: 1200px;
  justify-content: space-between;
}

.scene-list li {
  width: 329px;
  text-align: center;
}

.scene-list li img {
  width: 95px;
  height: 95px;
  box-shadow: none;
  /* transition: all 0.6s; */
}
.scene-list li:hover img{
  transform: translateZ(0) translateY(-8px) scale(1.08);
  transition: transform .6s;
}

.scene-list li h3 {
  font-size: 22px;
  font-weight: normal;
  color: #303445;
  padding-top: 23px;
  padding-bottom: 15px;
  font-weight: bold;
}

.scene-list li p {
  display: inline-block;
  width: 329px;
  text-align: left;
  color: #9FA5BB;
  font-size: 16px;
  line-height: 26px;
  padding-left: 12px;
  text-align: center;
}

/* 社群运营 ---即客云 */
.on-off-linkage {
  background: linear-gradient(90deg, #F9F5F5 0%, #E2E8FF 100%);;
  box-sizing: border-box;
  font-size: 0;
  box-sizing: border-box;
}
.on-off-linlage-bg {
  background: url('../images/new_retail/guestCloud.png');  
  background-repeat: no-repeat;
  background-position-x: 110px;
}

.on-off-linkage .linkage-title {
  color: #303445;
  font-size: 32px;
  letter-spacing: 1px;
  font-weight: bold;
  padding-top: 98px;
  padding-bottom: 54px;
}

.on-off-linkage .linkage-wrap {
  font-size: 0;
  margin: 0 auto;
  width: 1200px;
  display: flex;
  justify-content: space-between;
}

.linkage-wrap .linkage-pic {
  width: 369px;
  height: 396px;
  margin-top: -54px;
  margin-bottom: 49px;
}

.linkage-pic img {  
  box-shadow: none;
  width: 100%;
  height: 100%;
}

/*  左侧文字 */
.linkage-wrap .linkage-text {
  width: 486px;
  text-align: left;
  padding-top: 94px;
}

.linkage-text h3 {
  color: #101010;
  font-size: 26px;
  height: 40px;
  line-height: 40px;
  font-weight: bold;
  letter-spacing: 1px;
  margin-top: -26px;
}

.linkage-text p {
  font-size: 18px;
  color: #59607B;
  height: 22px;
  line-height: 24px;
  padding-bottom: 50px;
}

.linkage-text .linkage-desc {
  height: 64px;
  width: 539px;
  font-size: 16px;
  line-height: 32px;
  color: rgba(129, 139, 162, 1);
  position: relative;
  margin-top: 29px;
}

/* 四大功能亮点 */
.four-fun-heighlights {
  padding-bottom: 52px;
  background-color: #fff;
}
.four-fun-heighlights .four-fun-title {
  color: rgba(1, 1, 1, 1);
  font-size: 32px;
  letter-spacing: 1px;
  font-weight: bold;
  padding-top: 103px;
  padding-bottom: 74px;
}
.four-heighlights-content {
  width: 1241px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  margin: 0 auto;
}
.heighlight-item {
  padding: 30px 28px 28px 38px;
  box-sizing: border-box;
  width: 597px;
  height: 210px;
  background: #FFFFFF;
  border: 1px solid #EAEBEC;
  box-shadow: 0px 6px 23px rgba(84, 97, 139, 0.16);
  opacity: 1;
  margin-bottom: 42px;
  border-radius: 10px;
}
.heighlight-item .heighlight-top {
  display: flex;
  justify-content: left;
  align-items: center;
}
.heighlight-top .heighlight-title {
  font-size: 19px;
  color: #3E3B52;
  font-weight: bold;
}
.heighlight-top .heighlight-img-box {
  width: 63px;
  height: 63px;
  border-radius: 16px;
  margin-right: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.heighlight-top .heighlight-img-box > img {
  box-shadow: none;
  
}
.heighlight-text {
  margin-top: 32px;
  text-align: left;
}
.heighlight-text > span {
  font-size: 14px;
  color: #7e828c;

}
/* 四大功能亮点的颜色 */
.heighlight-violet {
  background-color: rgba(127, 29, 254, 1);
}
.heighlight-tomato {
  background-color: rgba(255, 83, 88, 1);
}
.heighlight-tea {
  background-color: rgba(37, 189, 138, 1);
}
.heighlight-sky {
  background-color: rgba(53, 121, 249, 1);
}


/* 门店导购-即速导购 */
.store-guide {
  width: 100%;
  background-color: rgba(250, 249, 251, 1);
}
.store-guide .store-guid-bg {
  background: url('../images/new_retail/guestCloud.png'); 
  background-repeat: no-repeat;
  background-position-x: 62px;
}
.store-guid-conten {
  width: 1200px;
  margin: 0 auto;
  display: flex;
}
.store-guid-conten .store-guid-text > h3 {
  margin-top: -30px;
}
.store-guide .store-guide-title {
  font-size: 32px;
  font-weight: bold;
  margin-top: 98px;
  margin-bottom: 69px;
}
.store-guid-text {
  float: left;
  width: 480px;
  text-align: left;
  padding-top: 158px;
}
.store-guid-text > h3 {
  font-size: 28px;
  color: #010101;
  margin-top: -26px;
}
.store-guid-desc {
  margin-top: 22px;
  font-size: 16px;
  font-weight: 400;
  color: #60646f;
  line-height: 30px;
}
.store-guid-pic {
  margin-bottom: 92px;
  margin-left: 94px;
}
.store-guid-pic > img {
  width: 100%;
  height: 100%;
}


/* 即速导购功能亮点 */
.shopping-giude-heighlights {
  width: 100%;
  margin-bottom: 138px;
}
.shopping-guide-heighlights-title {
  font-size: 32px;
  color: #101010;
  text-stroke: 1 rgba(0, 0, 0, 0);
  -webkit-text-stroke: 1 rgba(0, 0, 0, 0);
  font-weight: bold;
  margin-top: 99px;
  margin-bottom: 77px;
}
.shopping-guide-heighlights-content {
  text-align: center;
  width: 1243.4px;
  height: 476.4px;
  background-color: #f7f6f9;
  margin: 0 auto;
  position: relative;
}
.shopping-guid-heighlights-pic {
  position: absolute;
}
.shopping-guid-heighlights-pic > img {
  box-shadow: none;
  margin-left: -113px;
  margin-top: -25px;
}
.shopping-guid-heighlights-text {
  width: 451px;
  float: left;
  margin-left: 704px;
  margin-top: 82px;
}
.shopping-guid-heighlights-text-title-box {
  text-align: left;
}
.shopping-guid-heighlights-text-title-box > h3 {
  font-size: 26px;
  font-weight: bold;
  color: #3e3b52;
  -webkit-text-stroke: 1 rgba(0, 0, 0, 0);
  text-troke: 1 rgba(0, 0, 0, 0);
  margin-top: -32px;
}
.shopping-guid-heighlights-text-title-box .shopping-giude-smallTitle {
  margin-top: 16px;
}
.shopping-guid-heighlights-text-title-box .shopping-giude-smallTitle.first {
  margin-top: 40px;
}
.shopping-guid-heighlights-text-title-box .shopping-giude-smallTitle > h3{
  font-size: 16px;
  font-weight: bold;
  color: #3e3b52;
  -webkit-text-stroke: 1 rgba(0, 0, 0,0);
  text-stroke: 1 rgba(0, 0, 0, 0);
  display: inline-block;
  vertical-align: middle;
}
.shopping-guid-heighlights-text-title-box .shopping-guid-smalldesc {
  margin-top: 10px;
  font-size: 16px;
  color: #7e828c;
  -webkit-text-stroke: 1 rgba(0, 0, 0, 0);
  text-stroke: 1 rgba(0, 0, 0, 0);
  line-height: 26px;
}


/* 小程序-即速应用 */
.applets-instant-app {
  width: 100%;
  background-color: rgba(250, 249, 251, 1);
}
.applets-instant-app .applets-instant-bg {
  width: 100%;
  background: url('../images/new_retail/guestCloud.png');
  background-repeat: no-repeat;
  background-position-x: 62px;
}
.applets-instant-app .applets-instant-title {
  font-size: 32px;
  font-weight: bold;color: #010101;
  margin-top: 100px;
  margin-bottom: 89px;
}
.applets-instant-content {
  width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
.applets-instant-left {
  width: 434px;
  text-align: left;
  margin-top: 120px;
}
.applets-instant-left > h3 {
  font-size: 26px;
  font-weight: bold;
  color: #363b4e;
  -webkit-text-stroke: 1 rgba(0, 0, 0, 0);
  text-stroke: 1 rgba(0, 0, 0, 0);
  margin-top: -26px;
}
.applets-instant-desc {
  font-size: 16px;
  font-weight: 400;
  color: #60646f;
  margin-top: 12px;
  line-height: 26px;
}
ul.applets-instant-right {
  width: 657px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 91px;
  margin-left: 136px;
}
.applets-instant-item {
  width: 133px;
  height: 89px;
  position: relative;
  background-color: #fff;
  margin-top: 58px;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.2s linear;
}
.applets-instant-item:hover {
  transform: translateY(-8px);
}
.applets-instant-item:hover .img-box > img {
  transform: scale(1.08);
}
.applets-instant-item .img-box {
  position: absolute;
  top: -33.31px;
  left: 33px;
}
.applets-instant-item .img-box > img {
  box-shadow: none;
  transition: all 0.2s linear;
}
.applets-instant-item > p {
  margin-top: 48px;
}

/* 智慧零售精品案例 */
.flow-change {
  box-sizing: border-box;
  background: #fff;
  text-align: center;
  padding-top: 91px;
  padding-bottom: 60px;
  position: relative;
}
.flow-change .block-title {
  font-size: 32px;
  font-weight: bold;
  color: #010101;
  margin-top: 100px;
  margin-bottom: 64px;
}
.flow-change .decorate {
  position: absolute;
  right: 0;
  width: 508px;
  height: 802px;
  top: 0;
}
.flow-change .switch-carousel-items{
  width: 1424px;
  height: 678px;
  background: url(../images/new_retail/selected-bg0.png);
  background-repeat: no-repeat;
  background-size: 1424px 678px;
}
.flow-change .switch-carousel-items>li{
  width: 100%;
  height: 100%;
  padding: 33px 0 32px 84px;
  box-sizing: border-box;
  text-align: left;
}
.carousel-item-left,
.carousel-item-right{
  display: inline-block;
  vertical-align: middle;
  width: 400px;
  text-align: left;
}
.carousel-item-right {
  width: 454px;
  height: 352.8px;
}
.carousel-item-left{
  width: 660px;
  height: 587px;
  margin-right: 90px;
}
.carousel-item-left img{
  width: 100%;
  height: 100%;
}
.carousel-item-right>p{
  margin-left: 15px;
  margin-bottom: 10px;
  font-size: 30px;
  font-family: 'Microsoft YaHei';
  font-weight: bold;
  color:#333333;
}
ul.carousel-item-detail{
  width: 118%;
  display: flex;
  flex-wrap: wrap;
  justify-content: left;
}
.carousel-item-detail li{
  list-style: none;
  float: left;
  text-align: center;
  margin-right: 10px;
}
.carousel-item-detail li:nth-child(1){
  margin-left: 0;
}
.carousel-item-detail li>div{
  margin-top: 11px;
  font-size: 16px;
  font-family: 'Microsoft YaHei';
  color: #7450F6;
  background-color: rgba(150,122,253, .1);
  padding: 9px 18px 9px 14px;
  border-radius: 20px;
}
.carousel-item-right .carousel-item-desc {
  font-size: 16px;
  color: #8f929B;
  -webkit-text-stroke: 1 rgba(0, 0, 0, 0);
  text-stroke: 1 rgba(0, 0, 0, 0);
  font-weight: 400;
}
.carousel-item-right .qr-code{
  margin-top: 35px;
  width: 149px;
  height: 149px;
  margin-left: 16px;
}
.switch-carousel-item .carousel-item-right .qr-code img{
  width: 100%;
  height: 100%;
  image-rendering: auto;
}
.carousel-item-right .sweep-code{
  margin-top: 33px;
  color: rgba(13, 15, 43, 0.6);
  margin-left: 16px;
  font-size: 18px;
  font-family: 'Microsoft YaHei';
}

.flow-change > img {
  height: 61px;
  margin-bottom: 40px;
}

.flow-change .flow-text {
  font-size:18px;
  font-weight:400;
  color:rgba(93,100,127,1);
  letter-spacing:2px;
  padding-bottom: 80px;
}

.flow-change .flow-wrap {
  width: 1364px;
  margin: 0 auto;
  margin-top: 63px;
  position: relative;
}
.flow-change .flow-wrap img {
  box-shadow: none;
  image-rendering: -webkit-optimize-contrast;
}

.flow-change .swiper-wrapper:after {
  content: '';
  display: block;
  clear: both;
}

.flow-change .switch-carousel-nav {
  width: 1424px;
  margin: 0 auto 10px;
}

.flow-change .switch-carousel-nav:after {
  content: '';
  display: block;
  clear: both;
}

.flow-change .switch-carousel-nav .active {
  position: relative;
  color: rgba(48, 52, 69, 1);
  opacity: 1;
}

.flow-change .switch-carousel-nav .active:after {
  content: '';
  display: block;
  height: 6px;
  width: 50px;
  background: linear-gradient(180deg, #923BFF 0%, #6755FF 100%);
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 10px;
}

.flow-change .switch-carousel-nav li {
  width: 300px;
  float: left;
  padding-bottom: 17px;
  font-size: 26px;
  font-weight: 400;
  color: rgba(13, 15, 43, 0.6);
  opacity: 0.6;
  letter-spacing: 2px;
  cursor: pointer;
}

.flow-change .switch-carousel-item {
  display: none;
}

.flow-change .switch-carousel-item.active {
  display: block;
}

.flow-change .swiper-slide img {
  width: 468px;
  margin-bottom: 30px;
}

.flow-change .swiper-title span {
  font-size: 30px;
}

.flow-change .change-last-desc {
  position: relative;
  height: 16px;
  line-height: 16px;
}

.flow-change .change-last-desc span {
  
position: absolute;
}

.flow-change .nav-dot {
  width: 64px;  
  margin-left: auto;  
  margin-right: auto;  
  display: flex;  
  justify-content: space-between;
}

.flow-change .nav-dot span.active {
  background: #3552BC;
}




/* 旧的 样式 */


.count-part {
  position: relative;
  background: url(../images/takeout/number_bg.jpg);
  height: 400px;
}

.count-part>img {
  width: 100%;
}

.count-part ul {
  position: absolute;
  width: 80%;
  top: 22%;
  display: flex;
  left: 14%;
  align-items: center;
}

.count-part ul>li {
  margin-right: 7%;
  width: auto;
  vertical-align: middle;
  height: auto;
}

.count-part ul>li:last-child {
  width: 32%;
  margin-right: 0;
}

.tel-num p:nth-child(1) {
  color: #303445 !important;
}

.count-part ul>li>p:first-child {
  color: #5D33F7;
  font-size: 38px;
  margin-bottom: 30px;
}

.count-part ul>li>p:last-child {
  font-size: 22px;
  color: #303445;
}

.tel-num>p:nth-child(2) {
  color: #59607B;
  font-size: 22px;
  margin: 1.5vmax 0;
}

.tel-num>p:last-child:hover {
  background: #7D3DFF;
}

.tel-num>p:last-child {
  width: 100%;
  padding: 10px 0;
  margin: 0 auto;
  background: #5D33F7;
  color: #fff !important;
  border-radius: 4px;
  max-width: 340px;
}

/* 侧边栏 覆盖right_corner.css样式*/
.icon-part > span {
  background: #5D33F7 !important;
}

.exclusive-customer-service,
.online-service {
  background-color: #5D33F7 !important;
}

/* 媒体查询 */
@media screen and (max-width: 1440px) {
  .top-nav .banner-desc {
    top: 11%;
    left: 11.8%;
  }
  .top-nav > a {
    left: 11.8%;
  }
  .on-off-linkage .linkage-wrap {
    width: 960px;
  }
  .store-guid-conten {
    width: 960px;
  }
  .applets-instant-content {
    width: 960px;
  }
  .applets-instant-item {
    width: 106px;
  }
  .applets-instant-item .img-box {
    left: 20px;
  }
  .store-guid-pic {

    margin-top: 90px;
  }
  margin-top
}
