@charset "utf-8";
body,ul,h1,h2,h3,p {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body {
  width: 10rem;
  font-family: "微软雅黑";
  overflow-x: hidden;
  padding-top: 1.4rem;
}
img {
  display: block;
  margin: 0 auto;
  border: 0 none;
  width: 100%;
  pointer-events: none;
}
a {
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.fl {
  float: left;
}
.fr {
  float: right;
}
.pa {
  position: absolute;
}
.pr {
  position: relative;
}
.pf {
  position: fixed;
}
.oh {
  overflow: hidden;
}
ul,
li {
  list-style: none;
}
input,
textarea {
  outline: 0;
  border: 0;
  vertical-align: middle;
}
textarea {
  resize: none;
}
.w100 {
  width: 10rem;
}
.h100 {
  height: 100vh;
}
.z2 {
  z-index: 2;
}
.z7 {
  z-index: 7;
}
.z9 {
  z-index: 9;
}
div {
  background-repeat: no-repeat !important;
}
@-webkit-keyframes dx {
    0% {
    transform:scale(.98);
}
100% {
    transform:scale(1.05);
}
}@keyframes dx {
    0% {
    transform:scale(.98);
}
100% {
    transform:scale(1.05);
}
}.dx {
    animation:dx .6s linear infinite alternate;
    -webkit-animation:dx .6s linear infinite alternate;
}
@-webkit-keyframes sx {
    from {
    transform:translateY(-.08rem);
}
to {
    transform:translateY(.08rem);
}
}@keyframes sx {
    from {
    transform:translateY(-.08rem);
}
to {
    transform:translateY(.08rem);
}
}.sx {
    -webkit-animation:sx 1s linear infinite alternate;
    animation:sx 1s linear infinite alternate;
}
.ani {
  -webkit-animation-duration:1s;animation-duration:1s;
  -webkit-animation-fill-mode:both;animation-fill-mode:both
}
@-webkit-keyframes bounceIn {
    0%,20%,40%,60%,80%,to {
    -webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);
    animation-timing-function:cubic-bezier(.215,.61,.355,1)
}
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:scaleX(1);
    transform:scaleX(1)
}
}@keyframes bounceIn {
    0%,20%,40%,60%,80%,to {
    -webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);
    animation-timing-function:cubic-bezier(.215,.61,.355,1)
}
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:scaleX(1);
    transform:scaleX(1)
}
}.bounceIn {
    -webkit-animation-name:bounceIn;
    animation-name:bounceIn
}
@-webkit-keyframes fadeIn {
    0% {
    opacity:0
}
to {
    opacity:1
}
}@keyframes fadeIn {
    0% {
    opacity:0
}
to {
    opacity:1
}
}.fadeIn {
    -webkit-animation-name:fadeIn;
    animation-name:fadeIn
}
@-webkit-keyframes slideInLeft {
    0% {
    -webkit-transform:translate3d(-100%,0,0);
    transform:translate3d(-100%,0,0);
    visibility:visible
}
to {
    -webkit-transform:translateZ(0);
    transform:translateZ(0)
}
}@keyframes slideInLeft {
    0% {
    -webkit-transform:translate3d(-100%,0,0);
    transform:translate3d(-100%,0,0);
    visibility:visible
}
to {
    -webkit-transform:translateZ(0);
    transform:translateZ(0)
}
}.slideInLeft {
    -webkit-animation-name:slideInLeft;
    animation-name:slideInLeft
}
@-webkit-keyframes slideInRight {
    0% {
    -webkit-transform:translate3d(100%,0,0);
    transform:translate3d(100%,0,0);
    visibility:visible
}
to {
    -webkit-transform:translateZ(0);
    transform:translateZ(0)
}
}@keyframes slideInRight {
    0% {
    -webkit-transform:translate3d(100%,0,0);
    transform:translate3d(100%,0,0);
    visibility:visible
}
to {
    -webkit-transform:translateZ(0);
    transform:translateZ(0)
}
}.slideInRight {
    -webkit-animation-name:slideInRight;
    animation-name:slideInRight
}
@-webkit-keyframes fadeInLeft {0% {opacity:0;-webkit-transform:translate3d(-2rem,0,0);transform:translate3d(-2rem,0,0)}
to {opacity:1;-webkit-transform:none;transform:none}
}
@keyframes fadeInLeft {0% {opacity:0;-webkit-transform:translate3d(-2rem,0,0);transform:translate3d(-2rem,0,0)}
to {opacity:1;-webkit-transform:none;transform:none}
}
.fadeInLeft {-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}
@-webkit-keyframes fadeInRight {0% {opacity:0;-webkit-transform:translate3d(2rem,0,0);transform:translate3d(2rem,0,0)}
to {opacity:1;-webkit-transform:none;transform:none}
}
@keyframes fadeInRight {0% {opacity:0;-webkit-transform:translate3d(2rem,0,0);transform:translate3d(2rem,0,0)}
to {opacity:1;-webkit-transform:none;transform:none}
}
.fadeInRight {-webkit-animation-name:fadeInRight;animation-name:fadeInRight}

.head {
  top: 0;
  width: 10rem;
  height: 1.4rem;
  background: rgba(255, 255, 255, .95) url(../img/head.png) top / 10rem auto;
}
.head > div {
  float: right;
  width: 2.0533rem;
  height: 1.4rem;
  margin-right: .3rem;
}
.foot {
  background: #008c5a url(../img/foot_bg.png) .6133rem .6133rem /
  8.7333rem auto;
  height: 11.04rem;
}
.foot > input {
  position: absolute;
  width: 2.7rem;
  height: .4267rem;
  padding: 0 .10rem;
  font-size: .2133rem;
  background: transparent;
}
.foot > input::-webkit-input-placeholder {
  color: #bfbfbf;
}
#name {
  top: 4.5333rem;
  left: 1.2533rem;
}
#area {
  top: 4.5333rem;
  left: 5.0667rem;
}
#phone {
  top: 5.32rem;
  left: 1.2533rem;
}
#msg {
  top: 5.32rem;
  left: 5.0667rem;
}
#btn {
  position: absolute;
  top: 4.5333rem;
  right: .64rem;
  width: 1.12rem;
  height: 1.2133rem;
}
.foot > img {
  position: absolute;
  top: 7.1867rem;
  right: .7867rem;
  width: 2.2267rem;
  pointer-events: auto;
}
.foot > .call {
  top: 1.4533rem;
  right: .6667rem;
  width: 3.04rem;
  height: .36rem;
}
.foot > .icp {
  bottom: .4667rem;
  right: 1.5733rem;
  width: 4.56rem;
  height: .1867rem;
}
#menu {
  position: fixed;
  top: 0;
  left: -7.3867rem;
  width: 7.3867rem;
  height: 100vh;
  background: #008c5a url(../img/menu.png) top / 7.3867rem auto;
  z-index: 11;
  padding-top: 2.35rem;
  -webkit-transition: transform .4s;
  transition: transform .4s;
}
#menu.show {
  -webkit-transform: translate3d(7.3867rem, 0, 0);
  transform: translate3d(7.3867rem, 0, 0);
}
#menu > a {
  float: left;
  width: 2.2533rem;
  height: 1.04rem;
  margin: 0 1.5333rem 1.1333rem;
}
#mask {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  z-index: 10;
  width: 10rem;
  height: 100vh;
  background: rgba(0, 0, 0, .66);
}
#mask > img {
  position: absolute;
  top: .96rem;
  right: .8533rem;
  width: 1.2533rem;
}

.pick_city {
  top: 0;
  right: -10rem;
  background: #fff;
  transition: transform .4s;
  z-index: 10;
}
.pick_city.show {
  transform: translate3d(-10rem,0,0);
}
.pick_city > div {
  float: left;
  width: 33.33%;
  overflow-y:scroll;
  height: 100vh;
}
.pick_city > div > p {
  padding: .2rem 0;
  font-size: .4rem;
  color: #333;
  text-align: center;
  -webkit-transition: all .4s;
  transition: all .4s;
}
.pick_city > div > p.current {
  color: #fff;
  background: #0c8c59;
}