/* block */
#block,#share-tips,#pay-tips,.toast-login-block{
  display: none;
  position: fixed;
  z-index: 500;
  top:0;left:0;
  right: 0;bottom: 0;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
.f-block,.page-share{
  position: fixed;
  z-index: 500;
  top:0;left:0;
  right: 0;bottom: 0;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  display: block;
  opacity: 0;
  pointer-events: none;
}
#share-block.on,#share-tips.on,#pay-tips.on,.toast-login-block.on{display: block;}
.f-block.on,.f-block.active,.page-share.on{opacity: 1;pointer-events: auto;-webkit-transition: opacity .2s ease;}
.f-block,#share-block,.toast-login-block{background-color:rgba(0,0,0,.8)}

#block{opacity: 0;pointer-events:none;display: block;-webkit-transition:all .2s ease;-moz-transition:all .2s ease;transition:all .2s ease;}
.toast{
  position: absolute;
  position: fixed;
  pointer-events:none;
  opacity:0;
  z-index: 521;
  top:20%;
  left: 0;
  width:100%;
  text-align: center;
  -webkit-transition:all .2s ease;
  -moz-transition:all .2s ease;
  transition:all .2s ease;
  font-size:14px;
}
.toast a{cursor: pointer;}
.toast.on,#block.on{
  display: block;
  opacity:1;
}
.toast.on2,#block.on{pointer-events:auto}
/*.toast>div{min-width: 175px}*/
.toast>div,.toast>.toast-list,.toast>.toast-confirm{
  display: inline-block;
  padding: 16px;
  font-size: 12px;
  line-height: 1.4;
  color:#fff;
  background: #000;
  /*background: rgba(0,0,0,.65);*/
  -webkit-border-radius: 6px;border-radius: 6px;
  box-shadow: 0 0 3px rgba(0,0,0,.375);
}
.toast-icon{
  display: inline-block;
  font-size: 40px;
  padding: 20px;
}
.toast-list ul,.toast-confirm ul,.toast-list li,.toast-confirm li{margin: 0;padding: 0;list-style: none;}
.toast>.toast-list,.toast>.toast-confirm{
  display:block;
  width:260px;
  margin:auto;
  padding:0;
  line-height:1.4;
  background-color: #000;
}
.toast-title{
  padding: 1.2em;
  border-bottom:1px solid #fff;
  word-wrap:break-word
}
.toast-title p{margin: 0;}
.toast-list li{border-bottom:#fff}
.toast-list li.b,.toast-confirm li.b{font-weight:bold}
.toast-list li a,.toast-confirm li a{display:block;padding:1em 0;color:#fff;}
.toast-list li:last-child{border:none}
.toast-confirm ul{overflow:hidden}
.toast-confirm .toast-title{text-align:center}
.toast-confirm a{font-size: 14px;}
.toast-confirm li{float:left;width:50%}
.toast-confirm li.ok{box-shadow:0 -1px 0 1px #fff;/*font-weight:bold*/}

.toast-icon{
  display: inline-block;
  width: 40px;
  font-size: 26px;
  padding: 5px 15px 15px;
}
.toast-tick{height:34px;width: 34px;background-size:34px auto;}
.toast-warn{height:34px;width: 34px;background-size:34px auto;}
.toast-tel{height:18px;width: 6em;margin-bottom: 8px;padding:0 0 0 21px;background:url(../images/wx/tel.png) no-repeat 0 2px;background-size:16px auto;font-size: 12px;position: relative;font-size:14px;}
.toast-tel:after{display: inline;content:'联系客服电话';font-style: normal;white-space: nowrap;}
.toast-load{display: block;margin: auto;width: 16px;height: 16px;/*background: url(../images/ajax-loader.gif) no-repeat 50%;*/}

.toast>.toast-login{background: #fff;color:#333;width: 246px;font-size: 14px;}
.toast-login .t-l-title{font-weight: normal;margin: 0;font-size: 16px;}
.toast-login .t-l-handle .btn{font-size: 14px;}

/* loader */
@-webkit-keyframes rotate {
  0% {-webkit-transform: rotate(0deg) scale(1); }

  50% {-webkit-transform: rotate(180deg) scale(0.6);}

  100% {-webkit-transform: rotate(360deg) scale(1);}
}
.ball-rotate{position: relative;width: 100px;height: 70px;}
.ball-rotate > div {
    background-color: #fff;
    width: 15px;
    height: 15px;
    border-radius: 100%;
    margin: 2px;
    -webkit-animation-fill-mode: both;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -8px 0 0 -8px;
}
.ball-rotate > div:first-child {
    -webkit-animation: rotate 1s 0s cubic-bezier(.7, -.13, .22, .86) infinite;
}
.ball-rotate > div:before, .ball-rotate > div:after {
    background-color: #fff;
    width: 15px;
    height: 15px;
    border-radius: 100%;
    margin: 2px;
    content: "";
    position: absolute;
    opacity: .8;
}
.ball-rotate > div:before {top: 0px;left: -28px}
.ball-rotate > div:after {top: 0px;left: 25px}