/* WP默认的是1200居中。改写为100% */
.mk-grid, .mk-inner-grid{
  max-width: 100%;
}
/* 头部样式 */
#nav_wapper {
  background: rgb(27, 38, 83, 0);
  position: fixed;
  transition: all ease 0.3s;
  -webkit-transition: all ease 0.3s;
}
#nav_wapper:hover {
  background: rgb(27, 38, 83, 0.95) !important;
}
/* banner */
#wapper_banner{
  position: relative;
  height: 520px;
  width: 100%;
}
.banner-01{
  position: absolute;
  width: 100%;
  height: 520px;
  top: 0;
  left: 0;
  background: url(/resource/images/1688/banner.png)no-repeat center;
}
.banner-text-box{
  width: 1170px;
  margin: 0 auto;
  height: 520px;
}
.banner-text{
  position: absolute;
  top: 200px;
  opacity: 0;
  opacity: 1\0;
}
.banner-text-title{
  font-size: 40px;
  line-height: 56px;
  margin-bottom: 24px;
  color: #FFF;
  letter-spacing: 0;
}
.banner-text p{
  font-size: 20px;
  color: #FFFFFF;
  letter-spacing: 0;
  line-height: 30px;
}

/* 功能点 */
.product-box{
  width: 1170px;
  margin: 72px auto;
}
.product-item{
  width: 386px;
  display: inline-block;
}
.product-item .item-pic:hover{
  transform:rotate(360deg);
  -ms-transform:rotate(360deg);
  -webkit-transform:rotate(360deg);
  -o-transform:rotate(360deg);
  -moz-transform:rotate(360deg);
  transition: 0.3s;
  -ms-transition: 0.3s;
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  -moz-transition: 0.3s;
}
.product-item .item-pic{
  width: 80px;
  height: 80px;
  margin: 0 auto;
  margin-bottom: 24px;
  background: url(/resource/images/1688/icon-sprite-1688.png)no-repeat center;
}
.product-item .item-pic.pic01{
  background-position: 0 -64px;
}
.product-item .item-pic.pic02{
  background-position: 0 -144px;
}
.product-item .item-pic.pic03{
  background-position: 0 -224px;
}
.product-item .decs{
  font-size: 16px;
  color: #212121;
  letter-spacing: 0;
  text-align: center;
  line-height: 24px;
}
/* 价值 */
#wapper_values{
  background: url(/resource/images/1688/values-bg.png)no-repeat center;
  height: 596px;
  width: 100%;
  background-size: 100% 100%;
}
.values-box{
  width: 1170px;
  margin: 0 auto;
  padding-top:72px;
}
.values-title{
  font-size: 30px;
  color: #212121;
  letter-spacing: 0;
  text-align: center;
  line-height: 48px;
  margin-bottom: 56px;
}
.values-item-box {
  width: 1190px;
}
.values-item{
  width: 25%;
  padding: 0 10px;
  height: 348px;
  display: inline-block;
  margin-right: -4px;
}
.values-item:hover .item-pic{
  width: 278px;
}
.values-item:hover .item-decs{
  width: 278px;
  box-shadow: 0 8px 24px 0 rgba(0,0,0,0.10);
}
.values-item .item-pic{
  display: inline-block;
  width: 277px;
  height: 180px;
}
.values-item .item-pic img{
  width: 100%;
}
.values-item .item-decs{
  width: 277px;
  padding: 0 20px;
  background: #FFFFFF;
  border: 1px solid #E6E6E6;
  height:168px;
  overflow: hidden;
}
.values-item .title{
  font-size: 16px;
  color: #212121;
  letter-spacing: 0;
  line-height: 24px;
  margin-top: 16px;
  margin-bottom: 8px;
}
.values-item p{
  font-size: 14px;
  color: #666666;
  letter-spacing: 0;
  line-height: 24px;
}
/* 移动生意管理 */
.manage-bg{
  position: absolute;
  background: url(/resource/images/1688/app-manage-bg.png)no-repeat center;
  background-size: 100% 100%;
  width: 100%;
  height: 560px;
  z-index: -1;
}
.manage-01{
  position: absolute;
  background: url(/resource/images/1688/app-manage-pic.png)no-repeat center;
  height: 560px;
  width: 100%;
  z-index: -1;
  -webkit-animation: imgFlow 1.5s infinite alternate;
  -moz-animation: imgFlow 1.5s infinite alternate;
  animation: imgFlow 1.5s infinite alternate;
}
.manage-text-box{
  width: 1170px;
  height: 560px;
  margin: 0 auto;
  padding-top: 128px;
  color: #FFFFFF;
}
.manage-text-title{
  font-size: 30px;
  letter-spacing: 0;
  line-height: 48px;
  margin-bottom: 16px;
}
.magage-text{
  opacity: 0;
  opacity: 1\0;
}
.magage-text p{
  font-size: 16px;
  letter-spacing: 0;
  line-height: 32px;
  color: #FFFFFF;
}
.magage-text .manage-text-btn{
  width: 136px;
  height: 40px;
  text-align: center;
  margin-top: 40px;
  background: #00CCC5;
  color: #FFFFFF;
  border-radius: 1px;
  font-size: 16px;
  line-height: 40px;
}

/* 常见问题 */
#wapper_problem{
  background-color: #F6F8FA;
  position: relative;
  background: url(/resource/images/1688/problem-bg.png)no-repeat center;
  background-size: 100% 100%;
}
.problem-content-box{
  width: 1170px;
  margin: 0 auto;
  padding-top: 72px;
  padding-bottom: 104px;
}
.problem-title{
  width: 100%;
  text-align: center;
  font-size: 30px;
  color: #212121;
  letter-spacing: 0; 
  line-height: 48px;
  margin-bottom: 56px;
}
.problem-list-box {
  /* border: 1px solid #E6E6E6; */
}
.problem-list-box .list{
  position: relative;
  border-right: 1px solid #e6e6e6;
  border-left: 1px solid #e6e6e6;
}
.problem-list-box .list:nth-child(1):before{
  content: "";
  position: absolute;
  display: inline-block;
  width: 100%;
  height: 1px;
  left:0;
  right:0;
  border-bottom:1px solid #E6E6E6;
  top:0;
}
.problem-list-box .list:after{
  content: "";
  position: absolute;
  display: inline-block;
  width: 100%;
  height: 1px;
  left:0;
  right:0;
  border-bottom:1px solid #E6E6E6;
  bottom:0;
}
.problem-list-box .list:nth-child(1){
  box-shadow: 0 8px 24px 0 rgba(0,0,0,0.10);
}
.problem-list-box .list-qus{
  background: #FFFFFF;
  height: 72px;
  line-height: 72px;
  color: #212121;
  font-size: 16px;
  padding: 0 20px 0 24px;
}
.problem-list-box .list.active .list-qus {
  background: #00CCC5;
  color: #FFFFFF;
}
.problem-list-box .list-ans{
  background: #E5F9F9;
  height: 64px;
  line-height: 64px;
  color: #212121;
  font-size: 14px;
  padding: 0 20px 0 24px;
  display: none;
}
.problem-list-box .list.active .list-ans{
  display: block;
}
.problem-list-box .icon{
  width: 32px;
  height:32px;
  cursor: pointer;
  display: inline-block;
  float: right;
  margin-top: 20px;
  background: url(/resource/images/1688/icon-sprite-1688.png)no-repeat center;
  background-position: 0 -32px;
}
.problem-list-box .list.active .icon{
  background-position: 0 0;
}

/* 方案定制 */
#wapper_case{
  position: relative;
  background: url(/resource/images/1688/account-bg.png)no-repeat center;
  height: 328px;
  padding: 72px 0px;
  background-size: 100% 100%;
}
.case-title{
  width: 100%;
  font-size: 30px;
  color: #FFFFFF;
  letter-spacing: 0;
  text-align: center;
  line-height: 48px;
  margin-bottom: 8px;
}
.case-decs{
  font-size: 16px;
  color: #FFFFFF;
  letter-spacing: 0;
  text-align: center;
  line-height: 24px;
  margin-bottom: 56px;
}
.case-input-box{
  width: 640px;
  margin: 0 auto;
}
.case-input-box input{
  width: 448px;
  height: 48px;
  font-size: 16px;
  color: #999999;
  letter-spacing: 0;
  line-height: 48px;
  padding: 0 24px;
  margin-right: -4px;
  vertical-align: top;
}
.case-input-box .case-input-btn{
  display: inline-block;
  width: 192px;
  height: 48px;
  line-height: 48px;
  background-color: #00CCC5;
  border-radius: 1px;
  color: #FFFFFF;
  font-size: 16px;
  text-align: center;
  cursor: pointer;
}
.input-tips {
  font-size: 14px;
  line-height: 36px;
  width: 640px;
  margin:0 auto;
  color: red;
}
.success-input-box{
  display: none;
  width: 640px;
  margin: 0 auto;
  text-align: center;
  font-size: 16px;
  color: #fff;
}
/* 方案定制弹窗 */
.wapper-dialog{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1001;
  display: none;
}
#case_dialog{
  color: #212121;
  position: absolute;
  width: 504px;
  height: 500px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #FFFFFF;
}
.input-cell{
  margin-bottom: 32px;
}
.case-content{
  height: 312px;
  padding-left: 24px;
  overflow: auto;
}
.case-dialog-title{
  padding: 0 24px;
  height: 40px;
  line-height: 40px;
  font-size: 18px;
  letter-spacing: 0;
  position: relative;
  background: #00CCC5;
  color: #FFFFFF;
}
/* .case-dialog-title:after{
  content: " ";
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  border-bottom: 1px solid #E6E6E6;
} */
.dialog-close{
  display: inline-block;
  font-size: 20px;
  height: 16px;
  line-height: 16px;
  width: 16px;
  float: right;
  margin-top: 16px;
  text-align: center;
  cursor: pointer;
}
.case-dialog-decs{
  /* margin-top: 24px; */
  background: #00CCC5;
  padding: 0 24px 20px 24px;
}
.case-dialog-decs p{
  font-size: 16px;
  line-height: 24px;
  margin-bottom: 8px;
  color: #FFFFFF;
}
.case-dialog-decs .warm{
  /* color: #FF7500; */
}
.case-input{
  display: inline-block;
  width: 360px;
  height: 64px;
  padding-top: 22px;
  border-bottom: 1px solid #E6E6E6;
}
.case-input input{
  height: 40px;
  width: 100%;
  line-height: 24px;
  border: none;
  padding: 0;
}
.case-content .ques-title{
  font-size: 16px;
  line-height: 24px;
  margin-bottom: 8px;
}
.case-content select{
  height: 32px;
  width: 200px;
}
.wapper-isUsed{
  margin-bottom: 8px;
}
.wapper-erpUse{
  display: none;
  /* padding-top: 32px; */
}
.case-dialog-ft{
  padding: 0 24px;
  height: 72px;
  position: relative;
}
.case-dialog-ft .btn{
  display: inline-block;
  padding: 0;
  float: right;
  width: 96px;
  height: 32px;
  line-height: 32px;
  font-size: 16px;
  text-align: center;
  margin-top: 16px;
}
.case-dialog-ft .confirm{
  background-color: #00CCC5;
  color: #FFFFFF;
  margin-right: 16px;
}
.case-dialog-ft .cancel{
  border: 1px solid #999999;
}
.case-dialog-ft:before{
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  border-bottom: 1px solid #E6E6E6;
}
.mask{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.5;
  display: none;
  z-index: 1000;
}
.case-content::-webkit-scrollbar{  /*滚动条整体样式*/
  width: 8px;
  height: 50%;
  border-radius: 4px;
  /* background: rgba(153,153,153,0.50); */
}
.case-content::-webkit-scrollbar-track {  /*滚动条里面轨道*/
  /* border-radius: 4px; */
}
.case-content::-webkit-scrollbar-thumb {  /*滚动条里面小方块*/
  background-color: rgba(153,153,153,0.50);
  transition: all .2s;
  border-radius: 4px;
}

/* 下拉选择框 */
.cell-select{
  width: 200px;
  position: relative;
}
.select-input-suffix{
  width: 100%;
  margin-bottom: 8px;
  font-size: 14px;
  position: relative;
}
.select.active .select-input-suffix .select-input{
  border: 1px solid #00CCC5;
}
input.select-input{
  padding-right: 32px;
  cursor: pointer;
  background-color: #fff;
  border: 1px solid #e6e6e6;
  color: #999999;
  height: 32px;
  line-height: 32px;
  padding: 0 15px;
  width: 100%;
}
.input__suffix{
  position: absolute;
  height: 100%;
  right: 5px;
  top: 0;
  text-align: center;
  color: #dcdfe6;
  transition: all .3s;
  pointer-events: none;
}
.input__suffix-inner{
  pointer-events: all;
}
.select-icon-i{
  width: 16px;
  height: 16px;
  margin-top: 8px;
  display:inline-block;
  text-align: center;
  font-size: 14px;
  transition: transform .3s;
  cursor: pointer;
  background: url(/resource/images/1688/icon-down.svg)no-repeat;
}
.select.active .select-icon-i{
  background: url(/resource/images/1688/icon-up.svg)no-repeat;
}
.select-lists{
  position: absolute;
  width: 200px;
  background-color: #FFFFFF;
  list-style: none;
  display: none;
  padding: 8px 0;
  border: 1px solid #00CCC5;
  z-index: 1;
  height: 128px;
  overflow: auto;
}
.select-lists::-webkit-scrollbar{  /*滚动条整体样式*/
  width: 8px;
  height: 50%;
  border-radius: 4px;
  /* background: rgba(153,153,153,0.50); */
}
.select-lists::-webkit-scrollbar-track {  /*滚动条里面轨道*/
  /* border-radius: 4px; */
}
.select-lists::-webkit-scrollbar-thumb {  /*滚动条里面小方块*/
  background-color: rgba(153,153,153,0.50);
  transition: all .2s;
  border-radius: 4px;
}
.cell-select.active .select-lists{
  display: block;
}
.select-dropdown-item{
  margin-left: 0;
  font-size: 14px;
  padding: 0 15px;
  position: relative;
  overflow: hidden;
  height: 34px;
  cursor: pointer;
  line-height: 34px;
}
.select-lists .select-dropdown-item:hover{
  color: #00CCC5;
  background: rgba(0,204,197,0.10);
}
/* 单选按钮样式 */
.cell-radio{
  display: inline-block;
}
.radio-input{
  vertical-align: middle;
}
.radio-icon{
  border: 1px solid #999999;
  border-radius: 100%;
  width: 16px;
  height: 16px;
  position: relative;
  cursor: pointer;
  display: inline-block;
}
.radio-icon:after{
  width: 8px;
  height: 8px;
  background-color: #FFFFFF;
  border-radius: 100%;
  content: " ";
  position: absolute;
  left: 50%;
  top:50%;
  transform: translate(-50%, -50%) scale(0);
}
.radio-original{
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0;
  z-index: -1;
  outline: none;
}
.is-checked .radio-icon{
  border-color: #00CCC5;
  background: #00CCC5;
}
.is-checked .radio-icon:after{
  transform: translate(-50%, -50%)scale(1);
}
.radio-label{
  padding-left: 8px;
}
/* 动画--上下浮动 */
@-webkit-keyframes imgFlow {
  0% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  100% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
}
@-moz-keyframes imgFlow {
  0% {
    -moz-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  100% {
    -moz-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
}
@keyframes imgFlow {
  0% {
    -webkit-transform: translate3d(0, -10px, 0);
    -moz-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  100% {
    -webkit-transform: translate3d(0, 10px, 0);
    -moz-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
}
/* 从下往上进入 */
.swiper_in{
  -moz-animation: swiper-in 1s;
  -webkit-animation: swiper-in 1s;
  animation: swiper-in 1s;
  animation-fill-mode: forwards;
}
@-webkit-keyframes swiper-in {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}
@-moz-keyframes swiper-in {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}
@-ms-keyframes swiper-in {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}
@keyframes swiper-in {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}
/* 逐渐消失 */
.fade_out{
  -moz-animation: fade-out 1s;
  -webkit-animation: fade-out 1s;
  animation: fade-out 1s;
  animation-fill-mode: forwards;
}
@-webkit-keyframes fade-out {
  0% {
    /* transform: translateY(50px); */
    opacity: 1;
  }
  100% {
    /* transform: translateY(0px); */
    opacity: 0;
  }
}
@-moz-keyframes fade-out {
  0% {
    /* transform: translateY(50px); */
    opacity: 1;
  }
  100% {
    /* transform: translateY(0px); */
    opacity: 0;
  }
}
@-ms-keyframes fade-out {
  0% {
    /* transform: translateY(50px); */
    opacity: 1;
  }
  100% {
    transform: translateY(0px);
    opacity: 0;
  }
}
@keyframes fade-out {
  0% {
    /* transform: translateY(50px); */
    opacity: 1;
  }
  100% {
    /* transform: translateY(0px); */
    opacity: 0;
  }
}