body,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
blockquote,
dialog,
dl,
dt,
dd,
ul,
ol,
li,
pre,
form,
fieldset,
legend,
button,
input,
textarea,
th,
td {
  margin: 0;
  padding: 0;
}

button,
input,
select,
textarea {
  font: 12px/1.5 arial, tahoma, simsun, sans-serif;
  font-size: 100%;
  overflow: visible;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}

address,
cite,
em,
var {
  font-style: normal;
}

code,
kbd,
pre,
samp {
  font-family: courier new, courier, monospace;
}

ul,
ol {
  list-style: none;
}

a,
a:hover {
  outline: none;
  text-decoration: none;
}

legend {
  color: #333;
}

fieldset,
img {
  border: 0 none;
  vertical-align: top;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
menu,
nav,
section,
time,
audio,
video {
  display: block;
  margin: 0;
  padding: 0;
}

html {
  font-size: 14px;
  height: 100%;
}

body {
  background-color: #fff;
  color: #333;
  font: 1rem/1.5 "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei", \9ED1\4F53, Arial, sans-serif;
  height: 100%;
}

.none {
  display: none;
}

.fix-wp {
  margin: 0 auto;
  max-width: 640px;
}

.container-ios {
  height: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.container,
.container-ios {
  font-family: \5FAE\8F6F\96C5\9ED1;
  margin: 0 auto;
  max-width: 640px;
  position: relative;
}

.container img,
.container-ios img,
.fix-wp img {
  display: block;
  width: 100%;
  max-width: 640px;
}

.pof {
  position: fixed;
  top: 0;
  left: auto;
  z-index: 10;
}

.pob {
  position: static;
  bottom: 0;
  left: auto;
  z-index: 10;
}

.pof img,
img.pof {
  /* position: fixed; */
  top: 0px;
  left: auto;
  z-index: 10;
}

.pofb img,
img.pofb {
  position: fixed;
  bottom: 0px;
  left: auto;
  z-index: 10;
}

.footer {
  font-size: 0.8rem;
  text-align: center; 
  color: #12130E;
}

.footer p {
  margin: .2rem 0;
}

.fot {
  position: fixed;
  bottom: 120px;
  left: auto;
}

.pofb2 {
  position: fixed;
  width: 100%;
  left: 0;
  bottom: 10%;
  z-index: 999;
}

.common-tpl img {
  width: 100% !important;
  height: auto !important;
}

.common-tpl .__data__ {
  left: 40px;
}

#w3c_v img {
  width: 36px !important;
  height: 24px !important;
}

/* 自动弹红包 */
.tpl-rb-wp {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0px;
  left: 0px;
  background: rgba(0, 0, 0, 0.5);
  z-index: 400;
}

.tpl-rb-pos {
  width: 75%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

.tpl-rb-close {
  width: 14vw;
  height: 14vw;
  position: absolute;
  top: 0px;
  right: 0px;
  background: rgba(0, 0, 0, 0);
  z-index: 3;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.bounceIn {
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@keyframes bounceIn {

  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

/*退弹*/
.back-mask {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 10;
  background: rgba(0, 0, 0, .5);
}

.back-img {
  max-width: 50%;
  position: fixed;
  top: 50%;
  left: 50%;
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 11;
}

.back-img img {
  max-width: 100% !important;
  height: auto !important;
}

.__data__:nth-child(2) {
  top: 25px;
}

.__data__:nth-child(3) {
  top: 50px;
}

.__data__:nth-child(4) {
  top: 75px;
}

.__data__:nth-child(5) {
  top: 100px;
}

.__data__:nth-child(6) {
  top: 125px;
}

.__data__:nth-child(7) {
  top: 150px;
}

.__data__:nth-child(8) {
  top: 175px;
}

.__data__:nth-child(9) {
  top: 200px;
}