/* 主体 */
.wrapSwiper {
  height: 100%;
}

/* 首页 */
.pageIndex {
  background: url(https://res1-nte.iwplay.com.tw/images/pageIndex/pageIndex.jpg)
    no-repeat center center;
  background-size: cover;
}
.page_video {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.pageIndex .slogan {
  width: 8rem;
  height: auto;
  bottom: 5rem;
  left: 50%;
  z-index: 90;
}
.pageIndex .sloganImg {
  width: 100%;
  height: 100%;
}
.indexVideoBtn {
  bottom: 5.37rem;
  width: 1.21rem;
  height: 1.23rem;
  left: 50%;
  transform: translate(-50%);
  background: url(https://res1-nte.iwplay.com.tw/images/pageIndex/indexVideoBtn.png)
    no-repeat 0 0;
  background-size: 100% auto;
  z-index: 99;
}
.indexVideoBtn:hover {
  background-position: 0 100%;
}
.indexBtns {
  bottom: 2.5rem;
  display: flex;
  gap: .2rem;
  justify-content: center;
  align-items: flex-end;
}
.indexBtns a,
.indexBtns button {
  transition: transform 0.3s;
}
.indexBtns a:hover,
.indexBtns button:hover {
  transform: translateY(0.04rem);
}
.indexFoot {
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1.2rem;
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageIndex/indexFoot.png)
    no-repeat center top;
  background-size: 25.6rem 1.2rem;
}
.index_otherPlatform {
  top: 1.38rem;
  left: 1.79rem;
}
.indexFootNte {
  top: 1.49rem;
  left: 0.49rem;
  height: 0.43rem;
}
.indexFootWelcome {
  top: 1.49rem;
  right: 0.43rem;
  height: 0.43rem;
}

/* 情報速遞 */
.pageNews::before, .pageNews::after {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageNews/line.png) no-repeat 0 0/100% auto;
  content: "";
  height: .05rem;
  position: absolute;
  width: 22.46rem;
  margin-top: 1.05rem;
  top: 50%;
  transform: translateY(-50%);
}
.pageNews::before {
  margin-right: 10rem;
  right: 50%;
}
.pageNews::after {
  left: 50%;
  margin-left: 10rem;
}
.newsSwiper {
  top: 4.3rem;
  left: 50%;
  margin-left: 0.35rem;
}
.newsSwiper .banner {
  display: flex;
  flex-direction: column;
}
.newsSwiper .carousel-inner {
  border-radius: 0.15rem;
  padding: 0.06rem;
  width: 9.4rem;
  height: 5.33rem;
  background: #363636;
  order: 1;
}
.newsSwiper .carousel-item {
  border-radius: 0.1rem;
  overflow: hidden;
}
.newsSwiper .carousel-inner img {
  width: 100%;
  height: 100%;
}
.carousel-indicators {
  position: relative;
  display: flex;
  justify-content: center;
  gap: 0.13rem;
  margin: 0 auto;
  margin-top: 0.13rem;
  width: 100%;
  list-style: none;
  order: 2;
}
.carousel-indicators li {
  opacity: 1;
  margin: 0 auto;
  width: 100%;
  height: 0.1rem;
  box-sizing: border-box;
  background: #313131;
  border: 0.02rem solid #696969;
  cursor: pointer;
  overflow: hidden;
  position: relative;
}
.carousel-indicators li::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: var(--progress, 0%);
  background: #7ce3f2;
  transition: width var(--progress-duration, 3s) ease;
}
.newsSwiperTit {
  top: 6.6rem;
  right: 1.8rem;
  width: 9rem;
}
.news_info .newsdetails-badge p {
  height: 0.37rem;
  line-height: 0.37rem;
  text-align: center;
  transform: skew(-15deg);
  border-radius: 0.05rem;
}
.news_info .newsdetails-actbadge {
  background-color: #7958cb;
  color: #fff;
}
.news_info .newsdetails-socialbadge {
  background-color: #bababa;
  color: #313131;
}
.news_info .newsdetails-newsbadge {
  background-color: #7ce3f2;
  color: #313131;
}
.news_info .newsdetails-sysbadge {
  background-color: #fe5a95;
  color: #fff;
}
.newsList {
  top: 3.65rem;
  right: 50%;
  margin-right: 0.35rem;
}
.newsHead {
  width: 9.26rem;
  height: 1.96rem;
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageNews/newsHead.png)
    no-repeat 0 0;
  background-size: 100% auto;
}
.newsNav {
  top: 1.28rem;
  left: 0.35rem;
  display: flex;
  gap: 0.1rem;
}
.newsNav .news_nav_tab {
  width: 1.57rem;
  height: 0.62rem;
}
.newsNav .news_nav_tab div {
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.newsNav .news_nav_tab:hover,
.newsNav .active {
  background: #1d1d1d;
  transform: skew(-15deg);
  border-radius: 0.1rem;
}
.newsNav .news_nav_tab div:hover,
.newsNav .active div {
  background-position: 0 100%;
  transform: skew(15deg);
}
.newsMore {
  top: 1.32rem;
  right: 0.35rem;
  display: flex;
}
.newsMore a {
  width: 0.54rem;
  height: 0.54rem;
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageNews/newsMore.png) no-repeat 0 0;
  background-size: 100% auto;
}
.newsMore a:hover {
  background-position: 0 100%;
}
.newsCont {
  top: 2.2rem;
  left: 0;
  width: 9.27rem;
}

.news_info .news_right_box .news_r_con_box {
  display: none;
}
.news_info .news_right_box .news_r_con_box.active {
  display: block;
}

/*-------一環_新---------*/
.system-single {
  display: flex;
  font-size: 0.29rem;
  width: 99%;
  height: auto;
  z-index: 5;
  transition: 0.3s ease-in-out;
  padding: 0.23rem 0;
  border-bottom: 0.03rem solid #313131;
}
.system-single:hover {
  transition: 0.5s ease-in-out;
}
.intelSlides {
  display: none;
}
.intelSwiperInfo {
  width: 100%;
}
.news_con_big_main .systemurl.intelSlideTit {
  width: 5.5rem;
  margin-left: 0.33rem;
  padding-bottom: 0;
  cursor: pointer;
  color: #dfdfdf;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  line-clamp: 1;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.system-single:hover .systemurl.intelSlideTit {
  color: #7ce3f2;
}
.news_con_big_main .systemurl.intelSlideDes {
  display: none !important;
}
.intelDate {
  width: 1.75rem;
  height: auto;
  right: 0;
  z-index: 3;
  color: #dfdfdf;
}

/* 角色介绍 */
.factionsWrap {
  height: 100%;
  left: 0;
  top: 0;
  width: 100%;
  z-index: -1;
}
.pageRoleTit {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-title.png) no-repeat 0 0 / 100% auto;
  height: 0.67rem;
  right: 0;
  margin-top: -2rem;
  top: 50%;
  transform: translateY(-50%);
  width: 3.63rem;
}
.roleNav {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/roleNav.png) no-repeat 0 0/100% auto;
  height: 9.3rem;
  left: 1.2rem;
  margin-top: .6rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.69rem;
}
.factions_nav {
  height: 6.25rem;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 1.38rem;
}
.roleNav .swiper-slide {
  cursor: pointer;
  height: 1.39rem;
  margin-bottom: .22rem;
  width: 1.38rem;
}
.roleNav p {
  height: 100%;
  width: 100%;
}
.role-tab-zero-male p {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-tab-zero-male.png) no-repeat 0 0/100% auto;
}
.role-tab-zero-female p {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-tab-zero-female.png) no-repeat 0 0/100% auto;
}
.role-tab-mint p {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-tab-mint.png) no-repeat 0 0/100% auto;
}
.role-tab-nanally p {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-tab-nanally.png) no-repeat 0 0/100% auto;
}
.role-tab-xiaozhi p {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-tab-xiaozhi.png) no-repeat 0 0/100% auto;
}
.role-tab-jiuyuan p {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-tab-jiuyuan.png) no-repeat 0 0/100% auto;
}
.role-tab-hasuoer p {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-tab-hasuoer.png) no-repeat 0 0/100% auto;
}
.role-tab-baicang p {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-tab-baicang.png) no-repeat 0 0/100% auto;
}
.role-tab-fadiya p {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-tab-fadiya.png) no-repeat 0 0/100% auto;
}
.role-tab-dfde p {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-tab-dfde.png) no-repeat 0 0/100% auto;
}
.role-tab-zaowu p {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-tab-zaowu.png) no-repeat 0 0/100% auto;
}
.roleNav .swiper-slide-active p {
  background-position: 0 100%;
}
.factionsPrev,.factionsNext {
  height: .78rem;
  left: 50%;
  transform: translateX(-50%);
  width: .78rem;
}
.factionsPrev {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/factionsPrev.png) no-repeat 0 0/100% auto;
  top: .53rem;
}
.factionsNext {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/factionsNext.png) no-repeat 0 0/100% auto;
  bottom: .53rem;
}
.factionsPrev:hover,.factionsNext:hover {
  background-position: 0 100%;
}
.roleSwiper {
  height: 100%;
  left: 0;
  top: 0;
  width: 100%;
  z-index: -1;
}
.roleBg {
  height: 14.4rem;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: 25.6rem;
}
.role_name {
  height: 1.05rem;
  left: 0;
  top: -1.86rem;
}
.role_des {
  margin-bottom: .3rem;
}
.role_cont {
  left: 50%;
  margin-left: -9.1rem;
  top: 7.1rem;
}
.role-dec-zero {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-dec-zero.png) no-repeat 0 0/100% auto;
  height: .53rem;
  width: 6.52rem;
}
.role-dec-mint {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-dec-mint.png) no-repeat 0 0/100% auto;
  height: 1.03rem;
  width: 5.97rem;
}
.role-dec-nanally {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-dec-nanally.png) no-repeat 0 0/100% auto;
  height: 1.61rem;
  width: 9.34rem;
}
.role-dec-xiaozhi {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-dec-xiaozhi.png) no-repeat 0 0/100% auto;
  height: 1.11rem;
  width: 8.22rem;
}
.role-dec-jiuyuan {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-dec-jiuyuan.png) no-repeat 0 0/100% auto;
  height: .47rem;
  width: 7.97rem;
}
.role-dec-hasuoer {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-dec-hasuoer.png) no-repeat 0 0/100% auto;
  height: 1.11rem;
  width: 9.89rem;
}
.role-dec-baicang {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-dec-baicang.png) no-repeat 0 0/100% auto;
  height: 1.11rem;
  width: 7.97rem;
}
.role-dec-fadiya {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-dec-fadiya.png) no-repeat 0 0/100% auto;
  height: 1.06rem;
  width: 7.42rem;
}
.role-dec-dfde {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-dec-dfde.png) no-repeat 0 0/100% auto;
  height: 1.05rem;
  width: 7.97rem;
}
.role-dec-zaowu {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageRole/role-dec-zaowu.png) no-repeat 0 0/100% auto;
  height: 1.11rem;
  width: 11.33rem;
}
.role_text .cont {
  box-sizing: border-box;
  color: #afafaf;
  font-size: .2rem;
  height: 1.8rem;
  line-height: .3rem;
  overflow: hidden;
  padding-right: .06rem;
  width: 7.8rem;
}
.role_text .cont dt {
  display: none;
}
.role_text .cont::-webkit-scrollbar {
  background: #616161;
  border-radius: .03rem;
  width: .06rem;
}
.role_text .cont::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: .03rem;
}
.role_text .cont:hover {
  overflow-x: hidden;
  overflow-y: auto;
}

/* 世界全景 */
.pageView::before, .pageView::after {
  content: "";
  height: .07rem;
  position: absolute;
  top: 10.54rem;
}
.pageView::before {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageView/lineLeft.png) no-repeat 0 0/100% auto;
  left: 0;
  width: 5.5rem;
  z-index: 1;
}
.pageView::after {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageView/lineRight.png) no-repeat 0 0/100% auto;
  right: 0;
  width: 22.46rem;
}
.pageViewTit {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageView/pageViewTit.png) no-repeat 0 0/100% auto;
  height: 3.28rem;
  left: 50%;
  margin-left: -11.7rem;
  top: 7rem;
  width: 7.73rem;
}
.plateChangeBtns {
  align-items: center;
  justify-content: space-between;
  display: flex;
  right: 1.25rem;
  width: 14.8rem !important;
  top: 10.15rem;
  z-index: 1;
}
.plateChangeBtns button {
  height: 1.04rem;
  width: .63rem;
}
.plateLeft {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageView/plateLeft.png) no-repeat 0 0/100% auto;
}
.plateRight {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageView/plateRight.png) no-repeat 0 0/100% auto;
}
.plateChangeBtns button:hover {
  background-position: 0 100%;
}
.plateTitle {
  display: flex;
  align-items: center;
  gap: .15rem;
}
.plateMore {
  position: relative;
  width: .37rem;
  height: .37rem;
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageView/plateMore.png) no-repeat 0 0;
  background-size: 100% auto;
  pointer-events: none;
  opacity: 1;
  transition: .3s ease-in-out;
}
.brandSwiper:hover .plateMore {
  opacity: 0;
}
.plateinfo {
  bottom: .5rem;
  right: .5rem;
  left: initial !important;
  width: 11rem;
  text-align: right;
  overflow: hidden;
  z-index: 2;
  pointer-events: none;
  transform: translate(0, .5rem) !important;
  transition: transform .3s ease-in-out;
}
.brandSwiper:hover .plateinfo {
  transform: translate(0, 0) !important;
}
.plateTitle {
  align-items: center;
  display: flex;
  justify-content: flex-end;
  margin-bottom: .15rem;
}
.plateinfo2 {
  top: 7.35rem;
  z-index: 1;
}
.plateTit {
  height: .68rem;
}
.plateinfo .plateTit {
  height: .57rem;
}
.plateDes {
  color: #c3c3c3;
  font-size: .2rem;
  line-height: .27rem;
  opacity: 0;
  transition: opacity .3s ease-in-out;
}
.brandSwiper:hover .plateDes {
  opacity: 1;
}
.brand {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageView/brand.png) no-repeat 0 0/100% auto;
  height: 8.65rem;
  left: 50%;
  margin-left: -3.45rem;
  top: 2.74rem;
  width: 15.19rem;
  z-index: 1;
}
.brandSwiper {
  display: none;
  height: 7.09rem;
  left: .04rem;
  top: .04rem;
  width: 15.12rem;
}
.brandSwiper::before {
  background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.2), transparent);
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 2;
}
.brandSwiper .swiper {
  height: 100%;
}
.brandSwiper .swiper-slide > img {
  height: 100%;
  width: 100%;
}
.brandSwiper .location {
  top: -.5rem;
  display: flex;
  right: 0;
}
.brandSwiper .location img {
  display: none;
  height: .29rem;
}
.brandSwiper .location img:first-child {
  display: block;
}
.brandPagination {
  bottom: -.12rem !important;
  display: flex;
  font-size: 0;
  line-height: 0;
  z-index: 2;
}
.brandPagination .swiper-pagination-bullet {
  background: #313131;
  border: .01rem solid #a0a0a0;
  border-radius: 0;
  flex: 1;
  height: .11rem;
  margin: 0 .14rem 0 0!important;
  opacity: 1;
  position: relative;
}
.brandPagination .swiper-pagination-bullet:first-child {
  margin-left: -.03rem !important;
}
.brandPagination .swiper-pagination-bullet:last-child {
  margin-right: -.01rem !important;
}
.brandPagination .swiper-pagination-bullet:after {
  background: #7ce3f2;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 0;
}
.brandPagination .swiper-pagination-bullet-active:after {
  transition: all 5s ease;
  width: 100%;
}
.brandCounter {
  border-radius: .25rem;;
  bottom: -1.4rem;
  padding: .08rem .4rem;
  color: #b2b2b2;
  font-size: .21rem;
  font-weight: 500;
  left: 50%;
  transform: translateX(-50%);
  line-height: .2rem;
  background: #1b1b1b;
  z-index: 1;
}

/* 都市映像 */
.pageCity::before, .pageCity::after {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageNews/line.png) no-repeat 0 0/100% auto;
  content: "";
  height: .05rem;
  position: absolute;
  width: 22.46rem;
  margin-top: -0.2rem;
  top: 50%;
  transform: translateY(-50%);
}
.pageCity::before {
  margin-right: 10rem;
  right: 50%;
}
.pageCity::after {
  left: 50%;
  margin-left: 10rem;
}
.citySwiper {
  background: #767676;
  border: .02rem solid #161616;
  height: 7.46rem;
  left: 50%;
  transform: translateX(-50%);
  top: 1.8rem;
  width: 16.14rem;
}
.citySwiper .swiper-slide {
  box-sizing: border-box;
  padding: .07rem;
}
.citySwiper .swiper-slide img {
  display: block;
  height: 100%;
  width: 100%;
}
.citySlidePrev,.citySlideNext {
  height: 2.78rem;
  top: 4.5rem;
  width: .71rem;
  z-index: 1;
}
.citySlidePrev {
  background: url(https://res1-nte.iwplay.com.tw/images/pageCity/citySlidePrev.png) no-repeat 0 0;
  background-size: 200% auto;
  margin-right: 8.37rem;
  right: 50%;
}
.citySlideNext {
  background: url(https://res1-nte.iwplay.com.tw/images/pageCity/citySlideNext.png) no-repeat 0 0;
  background-size: 200% auto;
  left: 50%;
  margin-left: 8.37rem;
}
.citySlidePrev:hover,.citySlideNext:hover {
  background-position: 100% 0
}
.citySlideTit {
  background: url(https://res1-nte.iwplay.com.tw/260403/images/pageCity/citySlideTit.png) no-repeat 0 0/100% auto;
  height: 1.99rem;
  top: 9.65rem;
  width: 16.24rem;
}
.cityPagination {
  bottom: auto!important;
  display: flex;
  left: 50%!important;
  margin-left: -8.1rem;
  top: 10.95rem;
  width: 4rem!important;
}
.cityPagination .swiper-pagination-bullet {
  background: #313131;
  border: .01rem solid #a0a0a0;
  border-radius: 0;
  flex: 1;
  height: .08rem;
  margin: 0 .04rem 0 0!important;
  opacity: 1;
  position: relative;
}
.cityPagination .swiper-pagination-bullet:last-child {
  margin-right: 0!important;
}
.cityPagination .swiper-pagination-bullet:after {
  background: #7ce3f2;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 0;
}
.cityPagination .swiper-pagination-bullet-active:after {
  transition: all 3s ease;
  width: 100%;
}
/* .pageCity .cityPagination {
  bottom: unset;
  left: 50%;
  margin-left: -8.15rem;
  top: 10.95rem;
}
.cityPagination .swiper-pagination-bullet {
  background: #616161;
  height: .14rem;
  margin: 0 .15rem!important;
  opacity: 1;
  outline: .08rem solid #373737;
  width: .14rem;
}
.cityPagination .swiper-pagination-bullet-active {
  background: #50e5fb;
  outline-color: #b8b8b8;
} */

/* 通掉底 */
.footer {
  display: none;
}