html,
body,
div,
p,
ul,
li,
dl,
dt,
dd,
em,
i,
span,
a,
img,
input,
h1,
h2,
h3,
h4,
h5 {
  margin: 0;
  padding: 0
}

a,
img,
input {
  border: none;
}

body {
  font: 14px/1.75 -apple-system, "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

a {
  text-decoration: none;
}

ul,
li {
  list-style: none
}

a,
img {
  -webkit-touch-callout: none;
  /* 禁止长按链接与图片弹出菜单，根据需要选择是否删除 */
}

html,
body {
  -webkit-user-select: none;
  /* 禁止选中文本（如无文本选中需求，此为必选项） */
  user-select: none;
}

/* reset end */
html {
  font-size: 50px;
  /* 兼容不支持vw的系统 */
  font-size: 13.33333333vw;
  /* 7.5rem === 100vw */
}

@media (max-width: 1024px) {

  html,
  body {
    max-width: 1024px;
  }
}

#afooter {
  background-color: #191219;
  text-align: center;
  font-size: .22rem;
  padding: .2rem 0;
}

#afooter,
#afooter a {
  color: #c0c0c0;
  text-decoration: none;
}

/* 图片分离路径示例 */
/* .bg{background-image: url(//game.gtimg.cn/images/lol/act/a20190510battle/bg.jpg);} */
.wrap {
  /* background: url('//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/bgc.jpg') no-repeat center top; */
  background-size: cover;
  font-family: Arial;
  /* min-height: 65.60rem; */
}

.jcc {
  display: inline-block;
  margin: .44rem 0 0 .23rem;
  width: 1.73rem;
  height: .39rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/logo.png") no-repeat center center/100% 100%;
}

.slogan {
  margin: 5.7rem auto 0;
  text-align: center;
  width: 6.4rem;
  height: 1.87rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/slogan.png") no-repeat center center/100% 100%;
}

.top{
  background: url('//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/top.jpg') no-repeat center top;
  background-size: 100% 100%;
  min-height: 8.77rem;
}

.content {
  margin-top: -1px;
  margin-bottom: -2px;
  background: url('//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/bgc.jpg') no-repeat center top;
  padding-top: 0.4rem;
  background-size: 100% 100%;
  min-height: 56.83rem;
}

.title {
  text-align: center;
  margin: .2rem auto;
}

.title1 {
  width: 5.21rem;
  height: .89rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/title1.png") no-repeat center center/100% 100%;
}

.part1 .part1-tabs {
  display: flex;
  justify-content: space-between;
  margin: 0.1rem auto;
  width: 6.2rem;
  box-sizing: border-box;
}

.part1-item {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.1rem 0.05rem;
  box-sizing: border-box;
  width: 1.84rem;
  height: 2.5rem;
}
.part1-item-img1{
  width: 1.74rem;
  height: 2.3rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part1-img1.png") no-repeat center center/100% 100%;
}
.part1-item-img2{
  width: 1.74rem;
  height: 2.3rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part1-img2.png") no-repeat center center/100% 100%;
}
.part1-item-img3{
  width: 1.74rem;
  height: 2.3rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part1-img3.png") no-repeat center center/100% 100%;
}
/* .part1-item img {
  
} */

.part1-active {
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part1-img-active.png") no-repeat center center/100% 100%;
}

.part1-area {
  /* background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part1-bgc.png") no-repeat center center/100% 100%; */
  width: 6.4rem;
  height: 6.66rem;
  box-sizing: border-box;
  padding: 0.3rem 0 0;
}

.part1-area-title {
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part1-area-title.png") no-repeat center center/100% 100%;
  width: 5.72rem;
  height: 0.36rem;
  margin: 0 auto;
}

.part1-area-title2 {
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part1-area-title2.png") no-repeat center center/100% 100%;
}

.part1-area-title3 {
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part1-area-title3.png") no-repeat center center/100% 100%;
}

.part1-area-ftitle {
  font-size: 0.2rem;
  padding: 0.2rem 0;
  text-align: center;
  color: #dcc4ff;
  line-height: .3rem;
  font-weight: bold;
}

.part1-big-img {
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part1-big-img1.png") no-repeat center center/100% 100%;
  width: 6.4rem;
  height: 4.21rem;
  margin: 0 auto;
}

.part1-big-img2 {
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part1-big-img1.png") no-repeat center center/100% 100%;
}

.part1-big-img3 {
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part1-big-img1.png") no-repeat center center/100% 100%;
}

.part1 {
  /* padding-bottom: 0.4rem; */
}

/* PART2 */
.title2 {
  width: 6.19rem;
  height: 1.45rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/title2.png") no-repeat center center/100% 100%;
}

.part2 {
  padding: 0.2rem 0 0.2rem;
}

.part2-ftitle {
  width: 4.8rem;
  font-size: 0.20rem;
  text-align: center;
  margin: 0 auto;
  color: #fff;
  font-weight: bold;
}

/* swiper */
.mySwiper {

  position: relative;
  height: 100%;
  max-width: 6.8rem;
  overflow: hidden;
  box-sizing: border-box;
  padding: 0 0.6rem 0.2rem;
}

.swiper-container {
  width: 100%;
  height: 100%;
}

.swiper-slide {
  text-align: center;
  font-size: 0.18rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  flex-direction: column;
  display: flex;
  /* justify-content: space-between; */
  align-items: center;
}

.mySwiper .swiper-button-prev {
  background-image: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/prev.png");
  background-size: 100% 100%;
  width: 0.50rem;
  height: 0.75rem;
}

.mySwiper .swiper-button-next {
  background-image: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/next.png");
  background-size: 100% 100%;
  width: 0.50rem;
  height: 0.75rem;
}

.mySwiper1 .swiper-slide {
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part2-bgc.png") no-repeat center center/100% 100%;
  padding: .45rem 0.5rem;
  height: 4.39rem;
  box-sizing: border-box;
}

.mySwiper1 .swiper-pagination {
  width: 5.2rem;
  /* background-color: #fff; */
  /* height: 0 0.15rem; */
  left: 50%;
  transform: translateX(-50%);
  bottom: -0.1rem;
}

.mySwiper1 .swiper-pagination-bullet {
  margin: 0 0.15rem;
  width: 0.12rem;
  height: 0.13rem;
  opacity: 1;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/swiper-point.png") center center /100% 100%;
}

.mySwiper1 .swiper-pagination-bullet-active {
  width: 0.12rem;
  height: 0.13rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/swiper-active-point.png") center center /100% 100%;
}

.part2-img {
  width: 4.75rem;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: .02rem .02rem;
  height: 2.62rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part2-img-bgc.png") no-repeat center center/100% 100%;
}

.part2-img img {
  width: 100%;
  height: 100%;
}

.part2-img-title {
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part2-title-bgc.png") no-repeat center center/100% 100%;
  width: 2.91rem;
  height: .2rem;
  line-height: .3rem;
  font-size: .2rem;
  color: #fff;
  text-align: center;
  font-weight: bold;
  margin-bottom: 0.15rem;
}

.part2-text {
  width: 4rem;
  /* min-height: .6rem; */
  margin: 0 auto;
  color: #fff;
  font-size: 0.17rem;
  line-height: .3rem;
  font-weight: bold;
  padding: 0.1rem 0;
  box-sizing: border-box;
}

/* PART3 */
.title3 {
  width: 6.27rem;
  height: 0.89rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/title3.png") no-repeat center center/100% 100%;
}

.part3 {
  padding: 0.7rem 0 0.2rem;
}
.part-pc{
  display: none;
}
.part3-item {
  position: relative;
  width: 6.40rem;
  height: 6.26rem;
  margin-bottom: 0.1rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-bgc1.png") no-repeat center center/100% 100%;
}

.part3-text {
  position: absolute;
  top: 0.55rem;
  right: 0.35rem;
  width: 3.91rem;
  padding: 0.2rem 0.32rem;
  box-sizing: border-box;
  color: #fff;
  height: 4.88rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-text-bgc.png") no-repeat center center/100% 100%;
}
.part3-warning{
  color: #e244e5;
}

.part3-item-title {
  padding-top: 0.5rem;
  color: #00ffff;
  font-weight: bold;
  font-size: 0.25rem;
}

.part3-item-text {
  font-size: 0.18rem;
  line-height: 0.3rem;
}

.part3-item-hero {
  width: 3.09rem;
  height: .4rem;
  margin-top: 0.1rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-hero1.png") no-repeat center center/100% 100%;
}

.part3-item2 {
  height: 5.86rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-bgc2.png") no-repeat center center/100% 100%;
}

.p1 {
  margin-bottom: 0.1rem;
}

.part3-text2 {
  position: absolute;
  top: 0.55rem;
  left: 0.35rem;
  width: 3.91rem;
  padding: 0.2rem 0.32rem;
  box-sizing: border-box;
  color: #fff;
  height: 4.51rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-text-bgc2.png") no-repeat center center/100% 100%;
}

.part3-item-hero2 {
  width: 3.17rem;
  height: .40rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-hero2.png") no-repeat center center/100% 100%;
}

.part3-item-title2 {
  padding-top: 0.6rem;
}

/* part3-item3 */
.part3-item3 {
  height: 4.73rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-bgc3.png") no-repeat center center/100% 100%;
}

.part3-text3 {
  position: absolute;
  top: 0.55rem;
  right: 0.35rem;
  width: 3.91rem;
  padding: 0.2rem 0.32rem;
  box-sizing: border-box;
  color: #fff;
  height: 3.35rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-text-bgc3.png") no-repeat center center/100% 100%;
}

.part3-item-hero3 {
  width: 2.73rem;
  height: .40rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-hero3.png") no-repeat center center/100% 100%;
}

.part3-item-title3 {
  /* margin-top: 0.15rem; */
}

/* part3-item4 */
.part3-item4 {
  height: 5.45rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-bgc4.png") no-repeat center center/100% 100%;
}

.part3-text4 {
  position: absolute;
  top: 0.55rem;
  left: 0.35rem;
  width: 3.91rem;
  padding: 0.2rem 0.32rem;
  box-sizing: border-box;
  color: #fff;
  height: 4.07rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-text-bgc4.png") no-repeat center center/100% 100%;
}

.part3-item-hero4 {
  width: 2.69rem;
  height: .40rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-hero4.png") no-repeat center center/100% 100%;
}

.part3-item-title4 {
  margin-top: 0.15rem;
}
/* part3-item5 */
.part3-item5 {
  height: 6.07rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-bgc5.png") no-repeat center center/100% 100%;
}
.part3-item-hero5 {
  width: .42rem;
  height: .41rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-hero5.png") no-repeat center center/100% 100%;
}
.part3-text5 {
  position: absolute;
  top: 0.55rem;
  right: 0.35rem;
  width: 3.91rem;
  padding: 0.2rem 0.32rem;
  box-sizing: border-box;
  color: #fff;
  height: 4.69rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-text-bgc5.png") no-repeat center center/100% 100%;
}

.part3-item-title5 {
  margin-top: 0.15rem;
}
/* part3-item6 */
.part3-item6 {
  height: 4.97rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-bgc6.png") no-repeat center center/100% 100%;
}
.part3-item-hero6 {
  width: .42rem;
  height: .41rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-hero6.png") no-repeat center center/100% 100%;
}

.part3-text6 {
  position: absolute;
  top: 0.55rem;
  left: 0.35rem;
  width: 3.91rem;
  padding: 0.2rem 0.32rem;
  box-sizing: border-box;
  color: #fff;
  height: 3.59rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/h5/part3-text-bgc6.png") no-repeat center center/100% 100%;
}

.part3-item-title6 {
  /* margin-top: 0.20rem; */
  padding-top: 0.5rem;
}
.p2{
  line-height: .3rem;
  font-size: 0.2rem;
  text-align: center;
  color: #756eff;
  padding: 0.2rem 0;
  font-weight: bold;
}
.music {
  display: inline-block;
  position: absolute;
  top: -0.1rem;
  right: 0.1rem;
  width: 1.05rem;
  height: 1.03rem;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/play-icon1.png") no-repeat center center/100% 100%;
}

.part1-big-img {
  position: relative;
}

.playMusic {
  animation-name: rotate;
  animation-duration: 2s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  background: url("//game.gtimg.cn/images/jk/act/a20231103voiceduel/play-icon.png") no-repeat center center/100% 100%;
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}


.Shine_landscape {
    display: none;
}

@media screen and (orientation: landscape) {
    .Shine_landscape {
        display: block;
        width: 100%;
        height: 100%;
        background: #32373b;
        position: fixed;
        left: 0;
        top: 0;
        z-index: 9999;
        text-align: center;
        -webkit-animation: Shine_landscapeAni2 1.5s ease infinite alternate;
    }

    .Shine_landscape_box {
        position: relative;
        margin-left: auto;
        margin-right: auto;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
    }

    .Shine_landscape span {
        font-size: 0.30rem;
        display: block;
        color: #ffd40a;
        text-align: center;
        width: 100%;
        padding-top: 0.10rem;
        line-height: 2;
    }

    .Shine_landscape img {
        -webkit-animation: Shine_landscapeAni 1.5s ease infinite alternate;
        width: auto !important;
        animation: Shine_landscapeAni 1.5s ease infinite alternate;
        width: 128px;
        height: 194px;
    }

    @-webkit-keyframes Shine_landscapeAni {
        0% {
            -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
        }

        30% {
            -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
        }

        70% {
            -webkit-transform: rotate(0);
            transform: rotate(0);
        }

        100% {
            -webkit-transform: rotate(0);
            transform: rotate(0);
        }
    }

    @keyframes Shine_landscapeAni {
        0% {
            -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
        }

        30% {
            -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
        }

        70% {
            -webkit-transform: rotate(0);
            transform: rotate(0);
        }

        100% {
            -webkit-transform: rotate(0);
            transform: rotate(0);
        }
    }

    @-webkit-keyframes Shine_landscapeAni2 {
        0% {
            -webkit-transform: rotate(0);
            transform: rotate(0);
        }

        30% {
            -webkit-transform: rotate(0);
            transform: rotate(0);
        }

        70% {
            -webkit-transform: rotate(0);
            transform: rotate(0);
        }

        100% {
            -webkit-transform: rotate(0);
            transform: rotate(0);
        }
    }

    @keyframes Shine_landscapeAni2 {
        0% {
            -webkit-transform: rotate(0);
            transform: rotate(0);
        }

        30% {
            -webkit-transform: rotate(0);
            transform: rotate(0);
        }

        70% {
            -webkit-transform: rotate(0);
            transform: rotate(0);
        }

        100% {
            -webkit-transform: rotate(0);
            transform: rotate(0);
        }
    }
}