@charset "UTF-8";
body{
  max-width: 750px;
  margin: 0 auto;
  background: rgba(242,242,242,1);
  padding-bottom: env(safe-area-inset-bottom); /* 第二步 iphone x 适配 */
  display: none;
}
.icon {
  display: inline-block;
  background-size: 100% auto;
  background-position: center center;
  background-repeat: no-repeat;
}
.mui-bar .mui-title{
  font-size: .32rem;
  color: #222;
}
/* 遮罩 */
.shade-wrap,
.consult-shade-wrap,
.new-user-pop-up-windows-fixed-wrap{
  position: fixed;
  left: 0;
  top: 0;
  z-index: 88;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
}
/* mui  */
.mui-content {
  background: rgba(242,242,242,1);}

.mui-bar-nav {
  background: #fff;
  box-shadow: 0 1px 6px #ffffff;
  width: 100%;
  max-width: 750px;
  left: 50%;
  transform: translate(-50%, 0);
}
/* 重置mui toast 弹窗居中显示 */
.mui-toast-container{
  bottom: 50% !important;
  font-size: .28rem;
}
/* 返回顶部按钮 */
.scrollTop {
  opacity: 0;
  position: fixed;
  right: 0.24rem;
  top: 10.5rem;
  width: 0.74rem;
  height: 0.74rem;
  border: 0;
  z-index: 9;
}
/* 溢出隐藏显示省略号 单行 双行 三行 */
.overflow-hidden-single-drug-ellipsis{
  word-break: break-all;
  word-wrap: break-word;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}
.overflow-hidden-double-drug-ellipsis{
  word-break: break-all;
  word-wrap: break-word;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.overflow-hidden-three-drug-ellipsis{
  word-break: break-all;
  word-wrap: break-word;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
/* 返回顶部动画 */
.fadeIn {
  animation: fadeIn 0.5s forwards; }

@keyframes fadeIn {
  0% {
    opacity: 0; }
  50% {
    opacity: 0.5; }
  100% {
    opacity: 1; } }
.fadeOut {
  animation: fadeOut 0.5s forwards; }

@keyframes fadeOut {
  0% {
    opacity: 1; }
  50% {
    opacity: 0.5; }
  100% {
    opacity: 0; } }

/* 侧滑右菜单动画 */
.slide-right-on{
  animation: translateSileOn 0.3s forwards;
}
/* 显示侧滑菜单 */
@keyframes translateSileOn {
  0% {
    transform: translateX(5.4rem)
  }
  20% {
    transform: translateX(4.32rem)
  }
  40% {
    transform: translateX(3.24rem)
  }
  60% {
    transform: translateX(2.16rem)
  }
  80% {
    transform: translateX(1.08rem)
  }
  100% {
    transform: translateX(0)
  }
}

.slide-right-off{
  animation: translateSileOff 0.3s forwards;
}
/* 关闭侧滑菜单 */
@keyframes translateSileOff {
  0% {
    transform: translateX(0)
  }
  20% {
    transform: translateX(1.08rem)
  }
  40% {
    transform: translateX(2.16rem)
  }
  60% {
    transform: translateX(3.24rem)
  }
  80% {
    transform: translateX(4.32rem)
  }
  100% {
    transform: translateX(5.4rem)
  }
}

/* 显示预约输入框弹窗 */

.order-consult-cpm-on{
  animation: translateYOn 0.3s forwards;
}
@keyframes translateYOn {
  0% {
    transform: translate3d(0,4.5rem,0);
  }
  25% {
    transform: translate3d(0,3rem,0);
  }
  50% {
    transform: translate3d(0,2rem,0);
  }
  75% {
    transform: translate3d(0,1rem,0);
  }
  100% {
    transform: translate3d(0,0,0);
  }
}

/* 隐藏预约输入框弹窗 */
.order-consult-cpm-off{
  animation: translateYOff 0.3s forwards;
}
@keyframes translateYOff {
  0% {
    transform: translate3d(0,0,0);
  }
  25% {
    transform: translate3d(0,1rem,0);
  }
  50% {
    transform: translate3d(0,2rem,0);
  }
  75% {
    transform: translate3d(0,3rem,0);
  }
  100% {
    transform: translate3d(0,4.5rem,0);

  }
}

/* 显示实名认证输入框弹窗 */
.certification-consult-cpm-on{
  animation: certificationYOn 0.3s forwards;
}
@keyframes certificationYOn {
  from{
    transform: translate3d(0,6.11rem,0);
  }
  to {
    transform: translate3d(0,0,0);
  }
}

/* 隐藏实名认证输入框弹窗 */
.certification-consult-cpm-off{
  animation: certificationYOff 0.3s forwards;
}
@keyframes certificationYOff {
  from {
    transform: translate3d(0,0,0);
  }
  to {
    transform: translate3d(0,6.11rem,0);
  }
}

/* 显示去用车选择门店和方案弹窗 */
.buy-car-shade-on{
  animation: buycarshadeYOn 0.3s forwards;
}
@keyframes buycarshadeYOn {
  from{
    transform: translate3d(0,7rem,0);
  }
  to {
    transform: translate3d(0,0,0);
  }
}

/* 隐藏去用车选择门店和方案弹窗 */
.buy-car-shade-off{
  animation: buycarshadeYOff 0.3s forwards;
}
@keyframes buycarshadeYOff {
  from {
    transform: translate3d(0,0,0);
  }
  to {
    transform: translate3d(0,7rem,0);
  }
}

/* 右侧-底部-悬浮下载按钮动画 */
.right-fadein-shadow-on{
  -webkit-animation:rightFadein 0.3s forwards;
  animation: rightFadein 0.3s forwards;
}
.right-fadein-shadow-off{
  -webkit-animation: rightFadeout 0.3s forwards;
  animation: rightFadeout 0.3s forwards;
}
@-webkit-keyframes rightFadein {

  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes rightFadein {

  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@-webkit-keyframes rightFadeout {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes rightFadeout {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

/* loading 效果*/
.loading-wrap{
  width: 100%;
  height: 100%;
  position: fixed;
  left:0;
  top:0;
  z-index: 1888;
  background:#fff;
}
.load-box{
  display: block;
  position: absolute;
  left: 50%;
  top:40%;
  margin-top:-50px;
  margin-left: -50px;
  width: 100px;
  height: 130px;
}
.load-txt{
  color: #303030;
  text-indent: 5px;
  font-size: 0.28rem;
}
/* 兼容 iphone input-placeholder 文字不能垂直居中显示 */
body input{
  line-height: normal!important; /* for non-ie */
  line-height: 22px\9!important; /* for ie */
}
/* loading end */
/* input placeholder 重置 */
input::-webkit-input-placeholder { /* WebKit browsers */
  color: #B2B2B2;
  font-weight: normal;
}
input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  color: #B2B2B2;
  font-weight: normal;
}
input::-moz-placeholder { /* Mozilla Firefox 19+ */
  color: #B2B2B2;
  font-weight: normal;
}
input:-ms-input-placeholder { /* Internet Explorer 10+ */
  color: #B2B2B2;
  font-weight: normal;
}

/* 重置layer 询问框样式 */
.layui-m-layer0 .layui-m-layerchild {
  width: 5rem!important;
}

.layui-m-layerbtn span[no],
.layui-m-layerbtn span[yes] {
  font-size: .32rem!important;
  color: #0F80FE!important;
}

.layui-m-layerbtn {
  background: #fff!important;
}

.layui-m-layerchild h3 {
  height: 40px!important;
  line-height: 60px!important;
  color: #222!important;
  font-size: .32rem!important;
}

.layui-m-layercont {
  padding: 10px 30px!important;
  font-size: .24rem!important;
  color: #999999!important;
}
@media screen and (orientation:landscape) {
    /*   css[横向定义样式]  */
    /*html {
        font-size: 50.0267px!important;
        max-width: 23rem!important;
        margin:0 auto;
    }
    body .footer-contact-us {
      margin-left:0;
      left:0;
    }*/
    body .subscribe-box {
      overflow: auto;
    }
    body .order-success-area {
      position: absolute;
      overflow: auto;
      height: 800%;
    }
}

/* 拨打电话底部弹层对话框 */
.buttomPop-box{
  position: fixed;
  left: 0;
  top: 0;
  z-index: 99;
  width: 100%;
  height: 100vh;
  background: rgba(1,1,1,.6);
  display: none;
}
.buttomPop-box > .buttonPop-list{
  width: 100%;
  background: #f2f2f2;
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 3;
  -webkit-transform: translate3d(0, 100%,0);
  transition: all .2s linear;
  transform: translate3d(0, 100%,0);
}
.buttonPop-list >li{
  width: 100%;
  height: 1rem;
  background: #fff;
  line-height: 1rem;
  text-align: center;
  font-size: .28rem;
  color: #222;
}
.buttonPop-list > .phone{
  margin-bottom: 1px;
}
.buttonPop-list > .online-service{
  margin-bottom:.12rem;
}
.buttomPop-up{
  animation: buttomPopUp 0.3s forwards;
}
.buttomPop-down{
  animation: buttomPopDown 0.3s forwards;
}
@keyframes buttomPopUp {
  from {
    transform: translate3d(0,100%,0);
  }
  to {
    transform: translate3d(0,0,0);

  }
}
@keyframes buttomPopDown {
  from {
    transform: translate3d(0,0,0);
  }
  to {
    transform: translate3d(0,100%,0);
  }
}
.layui-m-layer-msg .layui-m-layercont{
  color: #fff!important;
}