/* @charset "utf-8"; */

.theme2 {
    height: 21.59rem;
    padding-bottom: 0.3rem;
}

.mapGame {
    position: relative;
    width: 37.17rem;
    height: 18.22rem;
    margin: 0 auto;
    border-radius: 0.3rem;
    background: url(../images/背景.png) center no-repeat;
    background-size: 37.17rem 18.22rem;
    /* border: 3rem solid #5F250D; */
}

.mapGame .img-zg {
    width: 36.90rem;
    height: 18rem;
    position: absolute;
    top: 0.12rem;
    left: 0.14rem;
}


/* 手绘元素 */

.mapGame .mapItm {
    display: inline-block;
    position: absolute;
    /* z-index: 3; */
}

.mapItm:hover {
    cursor: pointer;
    transform: scale(1.1);
    transition: all .3s;
    transform-origin: center center
}

.mapItm:hover .db {
    -webkit-animation: float ease-in-out .4s infinite;
    animation: float ease-in-out .4s infinite;
}

.name1 {
    font-size: 0.33rem;
    font-family: mySecondFont;
    font-weight: bold;
    color: #0E0E0E;
    position: relative;
    white-space: nowrap;
}

.db {
    position: absolute;
    width: 0.44rem;
    height: 0.66rem;
    background: url(../images/db.png) no-repeat;
    background-size: 100% 100%;
}

.name {
    border: 0.02rem solid #171101;
    border-radius: 0.1rem;
    background: #FFFFFF;
    position: absolute;
    font-size: 0.3rem;
    font-family: mySecondFont;
    font-weight: bold;
    color: #BD090C;
    line-height: 0.45rem;
    padding: 2px 2px;
    white-space: nowrap;
}


/* .name span {
   
} */

.mapItm1 img {
    width: 3.17rem;
    height: 1.56rem;
}

.mapItm2 img {
    width: 1.84rem;
    height: 3.85rem;
}

.mapItm3 img {
    width: 1.70rem;
    height: 2.45rem;
}

.mapItm4 img {
    width: 2.22rem;
    height: 2.52rem;
}

.mapItm5 img {
    width: 2.91rem;
    height: 2.39rem;
}

.mapItm6 img {
    width: 4.77rem;
    height: 3.19rem;
}

.mapItm7 img {
    width: 3.40rem;
    height: 1.68rem;
}

.mapItm8 img {
    width: 4.73rem;
    height: 1.26rem;
}

.mapItm9 img {
    width: 2.21rem;
    height: 2.98rem;
}

.mapItm10 img {
    width: 3.45rem;
    height: 2.89rem;
}

.mapItm11 img {
    width: 3.57rem;
    height: 1.93rem;
}

.mapItm12 img {
    width: 2.49rem;
    height: 6.14rem;
}

.mapItm13 img {
    width: 3.93rem;
    height: 2.89rem;
}

.mapItm14 img {
    width: 5.26rem;
    height: 4.37rem;
}

.mapItm15 img {
    width: 1.62rem;
    height: 2.22rem;
}

.mapItm16 img {
    width: 1.64rem;
    height: 2.07rem;
}

.mapItm17 img {
    width: 2.04rem;
    height: 2.28rem;
}

.mapItm18 img {
    width: 6.97rem;
    height: 5.35rem;
}

.mapItm19 img {
    width: 1.72rem;
    height: 2.19rem;
}

.mapItm20 img {
    width: 1.84rem;
    height: 2.19rem;
}

.mapItm21 img {
    width: 1.9rem;
    height: 2.39rem;
}

.mapItm22 img {
    width: 2.4rem;
    height: 4.05rem;
}

.mapItm23 img {
    width: 2.45rem;
    height: 3.4rem;
}

.mapItm24 img {
    width: 2.66rem;
    height: 3.3rem;
}

.mapItm25 img {
    width: 3.06rem;
    height: 4.52rem;
}

.mapItm26 img {
    width: 2.06rem;
    height: 2.45rem;
}

.mapItm27 img {
    width: 3.73rem;
    height: 3.45rem;
}

.mapItm28 img {
    width: 1.8rem;
    height: 2.4rem;
}

.mapItm29 img {
    width: 1.69rem;
    height: 2.27rem;
}

.mapItm30 img {
    width: 1.87rem;
    height: 2.19rem;
}

.mapItm31 img {
    width: 2.47rem;
    height: 2.98rem;
}

.mapItm32 img {
    width: 2.43rem;
    height: 3.53rem;
}

.mapItm33 img {
    width: 2.49rem;
    height: 3.57rem;
}

.mapItm34 img {
    width: 2.65rem;
    height: 2.72rem;
}

.mapItm35 img {
    width: 4.71rem;
    height: 3.28rem;
}

.mapItm36 img {
    width: 1.71rem;
    height: 2.26rem;
}

.mapItm1 {
    position: absolute;
    left: 15.29rem;
    bottom: 4.63rem;
}

.mapItm1 .name {
    left: 0.70rem;
    bottom: -0.30rem;
}

.mapItm1 .db {
    left: 1.30rem;
    bottom: -0.80rem;
}

.mapItm2 {
    left: 7.53rem;
    top: 6.78rem;
}

.mapItm2 .db {
    left: -0.27rem;
    top: 2.79rem;
}

.mapItm2 .name {
    left: 1.50rem;
    top: 0.50rem;
}

.mapItm3 {
    left: 12.37rem;
    top: 3.63rem;
}

.mapItm3 .name {
    left: -1rem;
    top: 2rem;
}

.mapItm3 .db {
    bottom: 0.70rem;
}

.mapItm4 {
    left: 12.23rem;
    bottom: 5.7rem;
}

.elements .mapItm4 .name {
    left: 0.28rem;
    bottom: -1.2rem;
    /* z-index: 3; */
}

.mapItm4 .db {
    left: 2rem;
    bottom: -1.8rem;
}

.mapItm5 {
    left: 10rem;
    bottom: 0.65rem;
}

.mapItm5 .name {
    top: 2rem;
    left: 1rem;
}

.mapItm5 .db {
    bottom: 1rem;
}

.mapItm6 {
    left: 15.06rem;
    bottom: 0.04rem;
}

.mapItm6 .name {
    left: 0;
    bottom: 2rem;
}

.mapItm6 .db {
    left: -0.30rem;
    bottom: 2rem;
}

.mapItm7 {
    right: 10.93rem;
    top: 7.18rem;
}

.mapItm7 .name {
    left: 1rem;
}

.mapItm7 .db {
    left: 2.50rem;
    top: -0.25rem;
}

.mapItm8 {
    right: 9.50rem;
    top: 5.50rem;
}

.mapItm8 .name {
    top: -0.50rem;
    left: 2rem;
}

.mapItm8 .db {
    left: 3rem;
    bottom: -0.25rem;
}

.mapItm9 {
    left: 18rem;
    bottom: 3.24rem;
}

.mapItm9 .name {
    left: 0.70rem;
    top: -0.60rem;
}

.mapItm9 .name2 {
    line-height: 0.45rem;
    position: absolute;
    left: -2.24rem;
    bottom: -0.56rem;
    font-size: 0.3rem;
    font-family: mySecondFont;
    font-weight: bold;
    color: #BD090C;
    background: #FFFFFF;
    border: 0.02px solid #171101;
}

.mapItm9 .db {
    left: -2.70rem;
    bottom: -0.70rem;
}

.mapItm10 {
    left: 8.35rem;
    top: 0;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm10 .name1 {
    width: 1.65rem;
    height: 0.71rem;
    left: 3rem;
    top: -2.65rem;
}

.mapItm11 {
    left: 19.50rem;
    bottom: 1.21rem;
}

.mapItm11 .name {
    left: 1rem;
}

.mapItm11 .name2 {
    line-height: 0.45rem;
    position: absolute;
    left: -4.35rem;
    bottom: -0.93rem;
    font-size: 0.3rem;
    font-family: mySecondFont;
    font-weight: bold;
    color: #BD090C;
    background: #FFFFFF;
    border: 0.02px solid #171101;
}

.mapItm11 .db {
    left: -4.81rem;
    bottom: -0.98rem;
}

.mapItm12 {
    left: 27.43rem;
    bottom: 6.95rem;
}

.mapItm12 .name {
    left: -1.35rem;
    top: 4.65rem;
}

.mapItm12 .db {
    left: -0.50rem;
    bottom: 0;
}

.mapItm13 {
    left: 14.63rem;
    bottom: 8.79rem;
}

.mapItm13 .db {
    left: 3rem;
    bottom: 0;
}

.mapItm14 {
    left: 0;
    top: 3.32rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm14 .name1 {
    left: 0.50rem;
    top: -3rem;
}

.mapItm15 {
    left: 6.08rem;
    bottom: 0;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm15 .name1 {
    left: -0.9rem;
    bottom: 1.5rem;
}

.mapItm16 {
    left: 6.18rem;
    top: 0;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm16 .name1 {
    left: -0.80rem;
    bottom: 1.50rem;
}

.mapItm17 {
    left: 0;
    top: 7.93rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm17 .name1 {
    left: 2rem;
    top: -1.70rem;
}

.mapItm18 {
    left: 6.21rem;
    bottom: 0;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm18 .name1 {
    left: 2rem;
    top: -4rem;
}

.mapItm19 {
    left: 0;
    bottom: 5.25rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm19 .name1 {
    left: -0.70rem;
    top: -1.70rem;
}

.mapItm20 {
    left: 3.53rem;
    bottom: 0;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm20 .name1 {
    left: -0.90rem;
    top: -1.70rem;
}

.mapItm21 {
    left: 0;
    top: 7.23rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm21 .name1 {
    left: -0.90rem;
    top: -1.70rem;
}

.mapItm22 {
    left: 0;
    bottom: 0.83rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm22 .name1 {
    left: 2rem;
    top: -3.50rem;
}

.mapItm23 {
    left: 0;
    top: 7.90rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm23 .name1 {
    left: 1.80rem;
    top: -2.50rem;
}

.mapItm24 {
    right: 7.01rem;
    bottom: 0;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm24 .name1 {
    left: -0.50rem;
    top: -2.50rem;
}

.mapItm25 {
    right: 10.78rem;
    bottom: 0;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm25 .name1 {
    left: 1.50rem;
    top: -4rem;
}

.mapItm26 {
    left: 0;
    bottom: 4rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm26 .name1 {
    left: -0.50rem;
    top: -1.80rem;
}

.mapItm27 {
    right: 4.49rem;
    top: 0;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm27 .name1 {
    left: 3.50rem;
    top: -1.80rem;
}

.mapItm28 {
    right: 0;
    top: 2.57rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm28 .name1 {
    left: -0.50rem;
    top: -1.80rem;
}

.mapItm29 {
    right: 0;
    bottom: 1.56rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm29 .name1 {
    left: -0.80rem;
    top: -1.80rem;
}

.mapItm30 {
    right: 0;
    bottom: 3.16rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm30 .name1 {
    left: 1.80rem;
    top: -1.80rem;
}

.mapItm31 {
    right: 0;
    top: 5.86rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm31 .name1 {
    left: 1.70rem;
    top: -2.50rem;
}

.mapItm32 {
    right: 0;
    bottom: 5.19rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm32 .name1 {
    left: -0.50rem;
    top: -3rem;
}

.mapItm33 {
    right: 0;
    top: 5.27rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm33 .name1 {
    left: -0.50rem;
    top: -3rem;
}

.mapItm34 {
    right: 3.93rem;
    bottom: 0;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm34 .name1 {
    left: 1.80rem;
    top: -2.20rem;
}

.mapItm35 {
    right: 0;
    bottom: 5.65rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm35 .name1 {
    left: 2.40rem;
    top: -2.80rem;
}

.mapItm36 {
    right: 0;
    top: 3.10rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.mapItm36 .name1 {
    left: -0.50rem;
    top: -1.60rem;
}

.mapItm37 {
    left: 20.15rem;
    top: 7.85rem;
}

.mapItm37 .name {
    top: 0.80rem;
}

.mapItm37 .db {
    left: 0.50rem;
}

.mingren {
    width: 2.50rem;
    height: 0.80rem;
    background: #F35023;
    border-radius: 0.10rem;
    position: absolute;
    text-align: center;
}

.mingren span {
    width: 1.86rem;
    height: 0.45rem;
    font-size: 0.48rem;
    font-family: mySecondFont;
    font-weight: normal;
    color: #FFFFFF;
}

.mingren1 {
    left: -4rem;
    top: 4.61rem;
}

.mingren2 {
    right: 0;
    top: 1.08rem;
    filter: alpha(opacity=0);
    opacity: 0;
}

.Brn:hover {
    -webkit-animation-name: jello;
    animation-name: jello;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}


/* 区域地图 */

.shijingshanBx {
    width: 5.45rem;
    height: 5.22rem;
    position: absolute;
    top: 0.10rem;
    left: 13.55rem;
    -webkit-animation: xuanzhuan 3s linear infinite;
    animation: xuanzhuan 3s linear infinite;
    z-index: 10
}