.toolbar .title { background-image: url(img/title.png); }

.static,
.button {
  border: .02rem solid #7e5c5e;
  background: center / 100% auto no-repeat;
}

.hhead {
  width: 8.36rem;
  height: .38rem;
  right: .2rem;
  top: .4rem;
  border-width: .04rem;
  border-bottom-width: 0;
  background: center / .7rem url(img/hhead.png) #fadce9 no-repeat;
}

.vhead {
  right: .2rem;
  border-left-width: 0;
  border-bottom-width: 0;
  border-right-width: .04rem;
}
.vhead[data-num="1"] {
  width: .49rem;
  height: 7.52rem;
  top: 3.86rem;
  background-color: #fff9c5;
  background-image: url(img/vhead-1.png);
  background-size: auto 2rem;
}
.vhead[data-num="2"] {
  width: .93rem;
  height: 2.29rem;
  top: 14.51rem;
  border-bottom-width: .04rem;
  background-color: #fff0a8;
  background-image: url(img/vhead-2.png);
  background-size: auto 1.2rem;
}

.button {
  width: .93rem;
  right: .2rem;
  border-left-width: 0;
  border-bottom-width: 0;
  border-right-width: .04rem;
  background-size: cover
}
.vhead3,
.vhead4,
.vhead5,
.vhead6 {
  width: .44rem;
  right: .69rem;
  border-right-width: .02rem;
}
.vhead1 {
  height: 1.25rem;
  top: .78rem;
  border-top-width: .04rem;
  background-image: url(img/button-vhead-1.png);
}
.vhead2 {
  height: 1.83rem;
  top: 2.03rem;
  background-image: url(img/button-vhead-2.png);
}
.vhead3 {
  height: 1.9rem;
  top: 3.86rem;
  background-image: url(img/button-vhead-3.png);
}
.vhead4 {
  height: 1.59rem;
  top: 5.76rem;
  background-image: url(img/button-vhead-4.png);
}
.vhead5 {
  height: 2.46rem;
  top: 7.35rem;
  background-image: url(img/button-vhead-5.png);
}
.vhead6 {
  height: 1.54rem;
  top: 9.81rem;
  background-image: url(img/button-vhead-6.png);
}
.vhead7 {
  height: 1.98rem;
  top: 11.35rem;
  background-image: url(img/button-vhead-7.png);
}
.vhead8 {
  height: 1.18rem;
  top: 13.33rem;
  background-image: url(img/button-vhead-8.png);
}

.body {
  width: 7.43rem;
  height: 16.02rem;
  right: 1.13rem;
  top: .78rem;
  border-width: .04rem;
  background-size: auto 16rem;
  background-position: -.03rem -.02rem;
  background-image: url(img/body.png);
}

.mask {
  width: .54rem;
  border-radius: .08rem;
  background: #cfebf6;
}
.mask1 { height: .59rem; top: .88rem; }
.mask1[data-num="1"] { right: 3.23rem; }
.mask1[data-num="2"] { right: 7.56rem; }
.mask2 { height: .8rem; top: 2.86rem; }
.mask2[data-num="1"] { right: 2rem; }
.mask2[data-num="2"] { right: 4.28rem; }
.mask2[data-num="3"] { right: calc(4.96rem + .74 * 3rem); }
.mask2[data-num="4"] { right: calc(4.96rem + .74 * 4rem); }
.mask3 { height: .63rem; top: 4rem;}
.mask3[data-num="1"] { right: 2rem; }
.mask3[data-num="2"] { height: .3rem; right: 2.4rem; top: 5.05rem;}
.mask3[data-num="3"] { right: 3.36rem; }
.mask3[data-num="4"] { height: .3rem; right: 3.75rem; top: 5.05rem; }
.mask3[data-num="5"] { right: 5.35rem; }
.mask4 { height: 1.2rem; top: 6rem; }
.mask4[data-num="1"] { right: 4.92rem; }
.mask4[data-num="2"] { right: 6.5rem; }
.mask5 { width: .4rem; }
.mask5[data-num="1"] { height: .66rem; right: 4.1rem; top: 7.6rem; }
.mask5[data-num="2"] { height: .58rem; right: 4.52rem; top: 8.12rem; }
.mask5[data-num="3"] { height: .66rem; right: 5.04rem; top: 7.6rem; }
.mask5[data-num="4"] { height: .58rem; right: 5.44rem; top: 8.12rem; }
.mask6 { height: .8rem; top: 10.65rem; }
.mask6[data-num="1"] { right: calc(4.96rem + .74rem); }
.mask6[data-num="2"] { right: calc(4.96rem + .74 * 2rem); }
.mask7 { width: .38rem; }
.mask7[data-num="1"] { height: .61rem; right: 1.25rem; top: 11.56rem; }
.mask7[data-num="2"] { height: .22rem; right: 1.59rem; top: 12.85rem; }
.mask7[data-num="3"] { height: .3rem; right: 2.09rem; top: 11.74rem; }
.mask7[data-num="4"] { height: .56rem; right: 2.77rem; top: 11.74rem; }
.mask7[data-num="5"] { height: .56rem; right: 2.77rem; top: 12.57rem; }
.mask8 { height: 1.06rem; top: 13.42rem; }
.mask8[data-num="1"] { right: 1.31rem; }
.mask8[data-num="2"] { right: calc(1.32rem + .68rem); }
.mask8[data-num="3"] { right: calc(1.32rem + .68 * 2rem); }
.mask8[data-num="4"] { right: calc(1.32rem + .68 * 3rem); }
.mask8[data-num="5"] { right: calc(1.32rem + .68 * 4rem); }
.mask8[data-num="6"] { right: calc(4.96rem); }
.mask8[data-num="7"] { right: calc(4.96rem + .74rem); }
.mask8[data-num="8"] { right: calc(4.96rem + .74 * 2rem); }
.mask8[data-num="9"] { right: calc(4.96rem + .74 * 3rem); }
.mask8[data-num="10"] { right: calc(4.96rem + .74 * 4rem); }