* {
  margin: 0;
  padding: 0;
}

body {
  /* max-width:6.4rem;*/
  max-width: 640px;
  height: 100vh;
  font-size: 0.14rem;
  /* background-color: rgb(25, 25, 30); */
  margin: auto;
  overflow: hidden;
  position: relative;
}

.start_active {
  background-image: url("static/img/Feature/dk_verticalbarSelect.png");
  background-size: cover;
}

.swiper-pagination-bullet .start_active {
  width: 0.7rem;
  height: 2.77rem;
}

li {
  list-style: none;
}

a {
  display: inline-block;
  outline: none;
}

.hidden {
  display: none;
}

/* 禁止页面滚动 */
.forbid-scroll {
  height: 100vh;
  overflow: hidden;
}

.swiper-main {
  width: 100%;
  height: 100%;
  /* margin-top: -58px */
}

/* .swiper-main img{height: 100%}
 */
/* header */
#header {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  /* z-index:1;*/
  background-image: url("../img/Home/bg_home_bac.png");
  background-size: cover;
  animation: homeScale 1s linear;
}

@keyframes homeScale {
  0% {
    transform: scale(1.1);
  }

  100% {
    transform: scale(1);
  }
}

.header {
  width: 6.4rem;
  margin-top: 0.6rem;
}

/* 播放按钮 */
#header #play {
  position: absolute;
  width: 1rem;
  height: 1rem;
  right: 0.5rem;
  top: 3.1rem;
  z-index: 2;
  background-size: contain;
  background-repeat: no-repeat;
}

/* nav下载 */
#header .nav {
  width: 100%;
  height: 1.06rem;
  position: absolute;
  top: 0;
  left: 0;
  background-size: cover;
}

#main nav {
  width: 0.4rem;
  height: 1.2rem;
  position: fixed;
  top: 2.4rem;
  right: 0;
  background: url(../img//beCurrent/Dk_\ Side\ jump\ link.png) no-repeat;
  background-size: 100% 100%;
  z-index: 3;
}

#main nav ul {
  width: 0.4rem;
  text-align: center;
  display: block;
  /* margin-right: 0.3rem; */
  /* margin-left: 0.03rem; */
  margin-top: 0.29rem;
}

@font-face {
  font-family: "feedback-iconfont";
  src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"),
    url("../fonts/font_1031158_u69w8yhxdu.woff") format("woff"),
    url("../fonts/font_1031158_u69w8yhxdu.ttf") format("truetype");
  font-style: normal;
  font-weight: normal;
}

.dhy {
  position: fixed;
  top: 4.4rem;
  right: 0;
  width: 0.9rem;
  height: 0.9rem;
  background: url(../fonts/b16e6c1c1fb0411ab06e02f76d18310d.woff);
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
  position: relative;
}

.active>ul>li .btn-wechat {
  /* margin-left: 0.06rem !important; */
  margin-bottom: 0.09rem !important;
}

#main nav .btn-more svg {
  width: 0.3rem;
  cursor: pointer;
  display: inline-block;
  position: relative;
  fill: white;
}

.btn-wechat svg {
  fill: white;
  margin-bottom: 0.06rem;
  /* margin-left: -0.1rem; */
}

#main nav svg {
  width: 0.24rem;
  fill: white;
}

#main nav .btn-close {
  /* width:.42rem;*/
  height: 0.3rem;
  cursor: pointer;
  display: none;
  position: relative;
  transform: rotate(180deg);
  margin-top: -0.2rem;
}

#main nav .btn-wechat .wx-qr {
  display: none;
  width: 1.68rem;
  height: 1.56rem;
  position: absolute;
  top: -0.36rem;
  /* top: 0.1rem; */
  left: -1.7rem;
}

.active ul li .btn-wechat .wx-qr {
  /* display: none; */
  width: 1.68rem;
  height: 1.56rem;
  position: absolute;
  /* top: 0.36rem; */
  top: 0.1rem !important;
  left: -1.7rem;
}

#main nav .btn-wechat:hover>.wx-qr {
  display: block;
}

#main nav.active .btn-wechat {
  margin-top: 0.5rem;
}

#main nav .btn-sina {
  height: 0.3rem;
  margin-bottom: 0.16rem;
  cursor: pointer;
  display: none;
}

#main nav .btn-bilibili {
  width: 0.67rem;
  height: 0.65rem;
  display: none;
}

#main nav .btn-douyin {
  width: 0.59rem;
  height: 0.7rem;
  display: none;
}

#main nav .btn-baidu {
  width: 0.68rem;
  height: 0.68rem;
  display: none;
}

#main nav .btn-pro {
  width: 0.67rem;
  height: 0.65rem;
  display: none;
}

#main nav.active {
  display: flex;
  justify-content: center;
  width: 0.5rem;
  height: 5.74rem;
  background: url(../img/dk_侧边跳转链接\ 展开.png) no-repeat;
  background-size: 100% 100%;
}

#main nav.active .btn-wechat,
#main nav.active .btn-sina,
#main nav.active .btn-bilibili,
#main nav.active .btn-douyin,
#main nav.active .btn-baidu,
#main nav.active .btn-pro,
#main nav.active .btn-close {
  display: inline-block;
}

#main nav.active .btn-more {
  display: none;
}

.info {
  width: 2.5rem;
  height: 1.3rem;
  position: absolute;
  bottom: 1.2rem;
  left: 50%;
  margin-left: -1.25rem;
}

.info2 {
  width: 2.5rem;
  position: absolute;
  bottom: 0rem;
  left: 50%;
  margin-left: -1.25rem;
}

.info img.download {
  width: 2.5rem;
  margin: 0.05rem 0;
}

.info .pay_btn {
  position: relative;
}

.icon_nav {
  width: 1.5rem;
  margin: -0.1rem 0.5rem 0;
}

.icon_nav1 {
  width: 1rem;
  margin: 0rem 0.7rem 0.59rem;
}

#header .logo {
  position: relative;
  width: 5rem;
  top: 0.5rem;
  display: block;
  margin: 0 auto;
}

#header .slogan {
  position: relative;
  width: 5.66rem;
  top: 1rem;
  display: block;
  margin: 0 auto;
}

.hero_title,
.feat_title,
.news_title,
.fame_title,
.civilization_title {
  background: url(../img/IntroductiontoHeroicSouls/IntroductionYingling//title.png) no-repeat;
  background-size: 100%;
  width: 5.53rem;
  height: 0.81rem;
  position: absolute;
  top: 0.3rem;
  left: 50%;
  margin-left: -2.76rem;
  transform: scale(0.85);
  z-index: 3;
}

.hero_title {
  position: absolute;
}

.jumper {
  width: 1.9rem;
  position: absolute;
  height: 0.72rem;
  left: 0;
  top: 1.1rem;
  animation: scale 2s linear infinite alternate;
}

.jumper img {
  width: 100%;
}

@keyframes scale {
  0% {
    transform: scale(0.9);
  }

  100% {
    transform: scale(1.2);
  }
}

/* 新闻资讯 */
#news {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  /* z-index: 1; */
}

.swiper-container .swiper-hero .swiper-container-initialized .swiper-container-horizontal {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: initial !important;
  list-style: none;
  padding: 0;
  z-index: 1;
}

/* 资讯banner轮播 */
.swiper-news {
  width: 5.89rem;
  /* width:90%;*/
  height: 3.87rem;
  border: 1px solid rgba(44, 82, 120, 0.8);
  position: absolute;
  left: 50%;
  transform: translate(-50%);
  /* bottom:5.6rem;*/
  bottom: 41%;
  /* top:1.8rem;*/
}

.swiper-news img {
  /* width:5.89rem;*/
  width: 100%;
}

/* 分页 */
.news-page {
  position: absolute;
  width: 5.89rem;
  /* width:90%;*/
  height: 0.5rem;
  line-height: 0.5rem;
  background-color: rgba(0, 0, 0, 0.3);
  left: 50%;
  transform: translate(-50%);
  bottom: 41%;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
}

.news-page .swiper-pagination-bullet {
  width: 0.18rem;
  height: 0.18rem;
  background-size: cover;
  margin: 0 0.1rem 0 0.1rem;
  outline: none;
  opacity: 1;
  border-radius: 0;
}

.news-page .swiper-pagination-bullet-active {
  width: 0.41rem;
  height: 0.41rem;
  background: url(../img/CareerIntroduction/Select\ Light\ Effect.png) no-repeat;
  background-size: cover;
}

.news-bar {
  width: 3rem;
  height: 1px;
  position: absolute;
  line-height: 0.5rem;
  left: 50%;
  transform: translate(-50%);
  bottom: 5.33rem;
  z-index: 1;
}

/* 新闻列表 */
.news_info {
  width: 5.92rem;
  height: 3.48rem;
  background-size: cover;
  position: absolute;
  bottom: 4%;
  left: 50%;
  transform: translate(-50%);
}

.news_list {
  color: #fcfcfd;
  font-size: 0.3rem;
  position: absolute;
  bottom: 6.6%;
  left: 50%;
  margin-left: -2.6rem;
  width: 5.2rem;
  height: 3rem;
  font-weight: bold;
  z-index: 1;
}

.list_title {
  margin: 0px 0 0.3rem 0.3rem;
}

.news_item {
  color: #83a9bc;
  font-size: 0.2rem;
  margin: 0.15rem 0 0.15rem -0.1rem;
  border-bottom: 1px solid rgb(131, 169, 188, 0.2);
  padding-bottom: 0.1rem;
  display: flex;
  justify-content: space-between;
  cursor: pointer;
}

.item_title {
  width: 3.8rem;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.news_item:first-child {
  /* margin:0px 0 0.4rem 0.6rem;*/
  text-align: center;
  border-bottom: none;
  font-size: 0.28rem;
  color: #f2f2f2;
  margin-top: -0rem;
  margin-bottom: 0.3rem;
}

.news_item:first-child .item_title {
  width: 5.2rem;
}

.news_item:first-child .item_date {
  display: none;
}

.news_more {
  position: absolute;
  bottom: 5%;
  right: 0.6rem;
  width: 1.2rem;
  height: 0.21rem;
  background-size: contain;
  z-index: 2;
}

/* 粒子 */
#news_particle {
  position: absolute;
  top: 0;
  left: 0;
}

.civilization {
  background: url(../img/CareerIntroduction/bac.png) no-repeat center top;
  background-size: cover;
  -moz-user-select: none;
  -o-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.civilization_title {
  background: url(../img/CareerIntroduction/title.png) no-repeat;
  background-size: contain;
}

.civilization .civilization-flags {
  position: absolute;
  z-index: 4;
  left: 0;
  bottom: 1rem;
}

.civilization .civilization-flags .block {
  font-size: 0;
  position: relative;
  margin: 0;
  padding: 0 15px;
  -webkit-overflow-scrolling: touch;
  white-space: nowrap;
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 10px;
}

.civilization .civilization-flags .flag {
  display: inline-block;
  width: 1.1rem;
  height: 0.74rem;
  background-size: contain;
  background-repeat: no-repeat;
  position: relative;
  vertical-align: text-top;
  outline: 0;
}

.swiper-container05-01-civilization .swiper-slide {
  text-align: center;
}

.swiper-container05-01-civilization .swiper-slide img {
  width: 90%;
  /* height: 100%; */
  object-fit: scale-down;
  object-position: top;
  margin-top: 1.5rem;
}

.swiper-container05-01-country {
  width: 100%;
  height: 70px;
  position: absolute;
  bottom: 0.6rem;
  z-index: 100;
}

.swiper-container05-01-country .swiper-slide {
  background-position: center;
  background-size: cover;
  width: 1rem !important;
  height: 66px;
  margin-right: -7px !important;
  opacity: 0.5;
}

.swiper-container05-01-country .swiper-wrapper .swiper-slide.active {
  background: url("../img/CareerIntroduction/Select\ Light\ Effect.png") no-repeat center;
  background-size: contain;
  height: 1rem;
  border-radius: 12px;
  opacity: 1;
  z-index: -1;
}

.swiper-container05-02-country {
  width: 251px;
  height: 312px;
  margin-left: 13%;
  margin-right: 13%;
}

.swiper-container05-02-country .swiper-slide {
  background-position: center;
  background-size: cover;
  width: 251px;
  height: 312px;
}

.swiper-container05-01-country .swiper-wrapper {
  margin-left: -160px;
  margin-top: 0.2rem;
}

/* 英雄介绍 */
#hero {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
}

*/

/* 英雄轮播 */
.swiper-container05-01-civilization .swiper-slide,
.swiper-slide {
  height: 100vh;
}

.swiper-hero {
  height: 100%;
}

.swiper-hero-skill img {
  position: relative;
  z-index: 92;
  width: 78%;
  bottom: 54%;
  margin-left: 1rem;
}

.detail {
  position: absolute;
  bottom: 2.1rem;
  left: 0rem;
  display: inline-block;
  z-index: 1000;
}

.detail img {
  z-index: 92;
  width: 78%;
  bottom: 54%;
  margin-left: 0.83rem;
}

.swiper-hero .hero-person {
  width: 8rem;
  /* height: 80%; */
  margin-left: -0.71rem;
  top: 3%;
  z-index: 102;
  position: relative;
}

.swiper-hero>.detail .hero-skill {
  width: 88%;
  margin-left: 0.56rem;
  top: -23%;
  z-index: 102;
  position: relative;
}

/* 英雄技能 */
.skill {
  opacity: 0;
  position: absolute;
  width: 0.5rem;
  height: 0.6rem;
  border: 1px solid red;
  z-index: 5;
  left: 18%;
  top: 7.93rem;
}

.skill1 {
  left: 21.6%;
}

.skill2 {
  left: 30.5%;
}

.skill3 {
  left: 40%;
}

.skill4 {
  left: 48.8%;
}

.skill5 {
  left: 58%;
}

/* 英雄视频播放 */
.media {
  display: inline-block;
  width: 0.8rem;
  height: 0.8rem;
  position: absolute;
  top: 7.8rem;
  border: 1px solid black;
  z-index: 5;
  opacity: 0;
  font-size: 0.16rem;
}

.media5 {
  width: 0.7rem;
  left: 4.3rem;
}

.media4 {
  width: 0.6rem;
  right: 2rem;
}

/* 凯撒 */
.music {
  transition: transform 0.5s ease-in-out;
  width: 0.63rem;
  height: 0.65rem;
  background: url(../img//IntroductiontoHeroicSouls/video.png);
  z-index: 1001;
  background-size: cover;
  position: absolute;
  bottom: 4.8rem;
  right: 1rem;
  display: inline-block;
}

/* 头像轮播 */
.swiper-container.swiper-avatar {
  position: absolute;
  z-index: 4;
  bottom: -0.6rem;
  width: 4rem;
  height: 2.5rem;
  -webkit-transform: translate(50%);
  margin-left: -0.7rem;
}

.swiper-avatar .swiper-slide {
  width: 0.8rem;
  height: 0.9rem;
  text-align: center;
  filter: saturate(0.5);
}

.swiper-avatar .swiper-slide-prev,
.swiper-avatar .swiper-slide-next {
  /* bottom: -0.4rem */
}

.swiper-avatar .swiper-slide.swiper-slide-active {
  filter: saturate(1);
  padding-top: 0.1rem;
  /* bottom: -0.2rem */
}

.swiper-avatar .swiper-slide.swiper-slide-active {
  height: 36%;
  /* background:red; */
  background-image: url("../img//IntroductiontoHeroicSouls/Dk_\ Check\ box.png");
  background-size: 100% 100%;
}

.swiper-avatar img {
  width: 80%;
}

.hero_bar_Arrowleft {
  position: absolute;
  z-index: 4;
  bottom: 0.95rem;
  left: 0.5rem;
}

.hero_bar_ArrowRight {
  position: absolute;
  z-index: 4;
  bottom: 0.95rem;
  right: 0.3rem;
}

/* 粒子 */
#hero_particle,
#civilization_particle {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

#hero_particleSkill {
  position: absolute;
  top: 0.2rem;
  left: 0;
  z-index: 2;
}

/* 游戏特色 */
#feat {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.feat_title {
  position: absolute;
  background: url(../img/Feature/title.png) no-repeat;
  background-size: 100%;
}

.feat_swiper {
  position: relative;
}

/* 轮播 */
.swiper-feat {
  /* position: absolute;
  top: 2.5rem;
  left: 0; */
  width: 6.4rem;
  text-align: center;
  margin: auto;
}

.swiper-feat .swiper-wrapper {
  width: 4.8rem;
}

.swiper-feat .swiper-slide {
  transform: scale(0.85);
  transition: 300ms;
}

.swiper-feat .swiper-slide-active {
  transform: scale(1);
}

.swiper-feat img {
  width: 100%;
  /* height: 100%; */
}

.banner_line {
  height: 8px;
  background: url(../img/Feature/Divider.png);
  background-size: cover;
  margin: 0.2rem 0;
}

/* 分页 */
.feat-page.swiper-pagination {
  position: relative;
  width: 100%;
  height: 2.77rem;
}

.feat-page .swiper-pagination-bullet {
  width: 0.84rem;
  height: 2.77rem;
  margin: 0 0.2rem 0 0.2rem;
  background: none;
  outline: none;
  opacity: 1;
  border-radius: 0;
}

/* 关注 */
#feat .attention {
  position: absolute;
  bottom: 0.1rem;
  width: 100%;
}

#feat .more {
  text-align: center;
  margin-bottom: 0.1rem;
}

#feat .more img {
  width: 2.6rem;
}

#feat .qr {
  /* display:flex;justify-content:space-evenly;*/
  text-align: center;
}

#feat .qr img {
  width: 1.63rem;
  margin: 0 0.4rem;
}

/* 视频播放 */
#video-wrap {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 999;
}

#video-wrap .video-container {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 6.4rem;
  height: 3.6rem;
}

#video-wrap video {
  width: 100%;
  height: 100%;
  outline: none;
}

/* 查看更多 */
/* 下滑查看更多 */
.next {
  animation: next 2s infinite;
}

/* 上滑查看更多 */
.prev {
  transform: rotate(180deg);
  animation: prev 2s infinite;
}

@keyframes next {
  0% {
    opacity: 1;
    bottom: 0.3rem;
  }

  100% {
    opacity: 0;
    bottom: 0rem;
  }
}

@keyframes prev {
  0% {
    opacity: 1;
    bottom: 0rem;
  }

  100% {
    opacity: 0;
    bottom: 0.3rem;
  }
}

/* 技能信息 */
.skill_info {
  /* background-color:rgba(0,0,0,.6);*/
  color: rgba(255, 255, 255, 0.8);
  padding: 5px;
  border: 1px solid #88b040;
}

.yellow_border {
  border: 1px solid #e3a76d;
}

.skill_outer {
  z-index: 2;
  width: 70%;
  height: auto;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  color: rgba(255, 255, 255, 0.8);
  padding: 3px;
  background: rgba(0, 0, 0, 0.6);
  background: linear-gradient(135deg, transparent 10px, rgba(0, 0, 0, 0.6) 0) top left,
    linear-gradient(-135deg, transparent 10px, rgba(0, 0, 0, 0.6) 0) top right,
    linear-gradient(-45deg, transparent 10px, rgba(0, 0, 0, 0.6) 0) bottom right,
    linear-gradient(45deg, transparent 10px, rgba(0, 0, 0, 0.6) 0) bottom left;
  background-size: 50% 50%;
  background-repeat: no-repeat;
}

/* 技能信息框 */
.skill_name {
  font-weight: bold;
  font-size: 18px;
}

.skill_add {
  font-weight: bold;
  font-size: 16px;
  margin: 8px 0 5px 0;
}

.skill_need {
  font-weight: bold;
  font-size: 14px;
  margin-bottom: 3px;
}

.skill_effect1 {
  font-size: 12px;
}

.skill_effect2 {
  font-size: 12px;
}

/* 设备兼容 */
/* 宽高屏占比为：9:16 */
.hero916 .hero_bar {
  bottom: -0.7rem;
}

.hero916 .swiper-container.swiper-avatar {
  bottom: -0.5rem;
}

/* .hero916 .swiper-avatar img {
  width: 100%
} */

/* 名人堂 */
#fame {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  /* z-index: 1; */
}

.fame_bg {
  width: 4.2rem;
  /* width:90%;*/
  height: 6.3rem;
  border: 1px solid rgba(44, 82, 120, 0.8);
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  /* bottom:5.6rem;*/
  top: 50%;
  /* bottom:20%;*/
  /* top:1.8rem;*/
  background-size: 100%;
  /* z-index:2;*/
}

.fame_frame {
  width: 4.2rem;
  /* width:90%;*/
  height: 6.3rem;
  border: 1px solid rgba(44, 82, 120, 0.8);
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  /* bottom:5.6rem;*/
  top: 50%;
  /* bottom:20%;*/
  /* top:1.8rem;*/
  background-size: 100%;
  /* z-index:2;*/
}

.swiper-fame {
  width: 3.97rem;
  /* width:90%;*/
  height: 6rem;
  border: 1px solid rgba(44, 82, 120, 0.8);
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  /* bottom:5.6rem;*/
  top: 50%;
  /* bottom:20%;*/
  /* top:1.8rem;*/
}

.player {
  width: 100%;
  height: 100%;
  background: rgb(39, 37, 37);
}

.player-image {
  height: 80%;
  width: 100%;
}

.player-image img {
  /* width:5.89rem;*/
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.player-profile {
  height: 12%;
  width: 100%;
  display: flex;
  align-items: center;
}

.player-icon {
  width: 0.5rem;
  height: 0.5rem;
  margin-left: 0.1rem;
}

.player-icon img {
  width: 0.5rem;
  height: 0.5rem;
  object-fit: cover;
  border-radius: 5px;
}

.player-id {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  padding-left: 5px;
  box-sizing: border-box;
  color: white;
  font-size: 0.25rem;
}

.player-content {
  width: 100%;
  height: 8%;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  padding-left: 5px;
  color: gray;
}

.player-content p {
  font-size: 12px;
}

.fame-button {
  position: absolute;
  width: 5.2rem;
  height: 0.5rem;
  line-height: 0.5rem;
  left: 50%;
  transform: translate(-50%, -50%);
  top: 50%;
}

.fame-button .left-button {
  float: left;
  height: 0.5rem;
  width: 0.5rem;
  line-height: 0.5rem;
  outline: none;
}

.fame-button .left-button img {
  float: left;
  height: 100%;
  outline: none;
}

.fame-button .right-button {
  float: right;
  height: 0.5rem;
  width: 0.5rem;
  line-height: 0.5rem;
  outline: none;
}

.fame-button .right-button img {
  float: right;
  height: 100%;
  outline: none;
}

.fame-more-btn {
  position: absolute;
  width: 3.97rem;
  height: 0.45rem;
  line-height: 0.45rem;
  left: 50%;
  transform: translate(-50%, -50%);
  top: 50%;
  margin-top: 4rem;
}

.fame-more-btn img {
  width: 100%;
}

/* 分页 */
.fame-page {
  position: absolute;
  width: 3.97rem;
  /* width:90%;*/
  height: 0.5rem;
  line-height: 0.5rem;
  /* background-color:rgba(0,0,0,.3);*/
  left: 50%;
  transform: translate(-50%, -50%);
  top: 50%;
  margin-top: 3.5rem;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fame-page .swiper-pagination-bullet {
  width: 0.18rem;
  height: 0.18rem;
  background-size: cover;
  margin: 0 0.1rem 0 0.1rem;
  outline: none;
  opacity: 1;
  border-radius: 0;
}

.fame-page .swiper-pagination-bullet-active {
  width: 0.18rem;
  height: 0.18rem;
  background-size: cover;
}

.wanguozhi_player {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

nav .btn-wanguozhi {
  display: none;
}

.footer_imgage img {
  width: 0.6rem;
  height: 0.6rem;
}

nav.active .btn-wanguozhi {
  display: inline-block;
}

.rotate {
  animation: rotateAnimation 2s linear infinite;
}

@keyframes rotateAnimation {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

.next_icon {
  background: url(../img/Home//huadong.png) no-repeat;
  background-size: cover;
  position: fixed;
  bottom: 10px;
  left: calc(50% - 0.35rem);
  width: 0.7rem;
  height: 0.47rem;
  z-index: 3;
}

/* 下滑查看更多 */

.next {
  animation: next 2s infinite;
}

/* 上滑查看更多 */

.prev {
  transform: rotate(180deg);
  animation: prev 2s infinite;
}