﻿/* layer */
.layer-wrap {  position: fixed;  top: 0px;  left: 0px;  width: 100%;  height: 100%;  z-index: 9997; background: rgba(0,0,0,0.6);}
.layer-bg {  position: fixed;  top: 0px;  left: 0px;  width: 100%;  height: 100%;}
.layer-box{width:100%; overflow: hidden;  position: relative;  z-index: 2; top: 30%; padding:0 9%;}
.layer-inner{width: 100%; position: relative;  background-color: #f9f9f9;  -webkit-border-radius: 10px; border-radius: 10px;}
.layer-inner .layer-title{ text-align: center; color: #666; padding: 15px 0; }
.layer-inner .layer-title h5{font-size: 18px; font-weight: 700; }
.layer-inner .layer-close{ display: inline-block; width: 28px; height: 28px; position: absolute; right: 10px; top: 10px; z-index: 900; -webkit-border-radius: 14px; border-radius: 14px; background: #e0e0e0 url(../img2/common-v2/tp_close.png) center center no-repeat; background-size:16px; }
.layer-footer-actions{ display: -webkit-box; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-box-align: center; border-top:1px solid #d4d4d4;}
.layer-footer-actions .layer-btn-lg{ display: block;width: 100%; -webkit-box-flex: 1; text-align: center;border-right:1px solid #d4d4d4;}
.layer-footer-actions .layer-btn-lg:last-child{border-right:0 none;}
.layer-btn-txt{ display: block; line-height: 44px; font-size: 16px; color: #15c35a; }
.layer-content{ padding:20px; font-size: 14px; color: #666; text-align: center; line-height: 20px; }
.layer-txt-h{ font-size: 18px; color: #333; font-weight: normal; line-height: 24px; margin-bottom: 10px; }
.layer-txt-c{ font-size: 14px; color: #999; }
.layer-img-top{ text-align: center; overflow: hidden; }
.picture-toppic1{ background: #f2f2f2; height: 140px; overflow: hidden; -webkit-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; }
.picture-toppic2{ padding-top:25px; }
/* actionsheet */
.ft-actionsheet { position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 9999; opacity: 0; pointer-events: none; display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-pack: center; -webkit-box-align: end; background: rgba(0, 0, 0, 0.5); }
.ft-actionsheet.show { pointer-events: inherit; opacity: 1; }
.ft-actionsheet.show .ft-actionsheet-cnt { -webkit-transform: translateY(0); -webkit-transition-delay: 0.3s; }
.ft-actionsheet-cnt { font-size: 18px; position: fixed; bottom: 0; padding: 0 8px; width: 100%; box-sizing: border-box; text-align: center; -webkit-transform: translateY(100%); -webkit-transition-property: all; -webkit-transition-timing-function: ease-out; -webkit-transition-duration: 0.3s; }
.ft-actionsheet button, .ft-actionsheet h4 { background: rgba(255, 255, 255, 0.95); display: block; width: 100%; color: #0079ff; box-sizing: border-box; }
.ft-actionsheet button { line-height: 44px; height: 44px; }
.ft-actionsheet h4 { line-height: 24px; padding-left: 20px; padding-right: 20px; padding-top: 10px; padding-bottom: 10px; border-top-left-radius: 3px; border-top-right-radius: 3px; }
.ft-actionsheet button:not(:last-child) { border-top: 1px #ccc solid; }
.ft-actionsheet button:last-child { margin: 8px 0; border-radius: 3px; }
.ft-actionsheet button:nth-last-child(2) { border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; }
.ft-actionsheet button:active { opacity: 0.95; }
.ft-actionsheet h4 { font-size: 13px; color: #8a8a8a; }
.ft-actionsheet .ft-actionsheet-del { color: #fd472b; }
@media screen and (-webkit-min-device-pixel-ratio: 2) {
	.ft-actionsheet button:not(:last-child) { border: 0; background-position: left top; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.5, transparent), color-stop(0.5, #ccc), to(#ccc)); background-repeat: repeat-x; -webkit-background-size: 100% 1px; }
}

.show { display: block; opacity: 1; }
.hide { 
  -webkit-animation: fadeOutDown .6s ease both;
  animation: fadeOutDown .6s ease both;
}
.layer-box {
  -webkit-animation: fadeInDown .6s ease both;
  animation: fadeInDown .6s ease both;
}
.noshow { display: none }
@-webkit-keyframes fadeInDown { 0% {
opacity:0;
-webkit-transform:translate3d(0, -50%, 0);
transform:translate3d(0, -50%, 0)
}
100% {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes fadeInDown { 0% {
opacity:0;
-webkit-transform:translate3d(0, -50%, 0);
transform:translate3d(0, -50%, 0)
}
100% {
opacity:1;
-webkit-transform:none;
-ms-transform:none;
transform:none
}
}
@-webkit-keyframes fadeOutDown {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeOutDown {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }
}

@media(max-width:320px) {
  .layer-box{padding: 0 6%;}
}



