@import url('//hyrz.qq.com/ingame/a20200410wsq/css/main.css');
 [v-cloak] {
            display: none;
        }
.ninja .content-box .content{padding:0.1rem;}

.ninja .content-box .content .top {
  width: 100%;
  height: 0.9rem;
  display: flex;
  position:relative;
  overflow: hidden;
}
.ninja .content-box .content .top .filter-box {
  width: 0.9rem;
  height: 0.9rem;
  flex: none;
  position: relative;
}
.ninja .content-box .content .top .filter-box.filter-qb {
  background: url("//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/filter-qb.png") no-repeat center / 100%;
}
.ninja .content-box .content .top .filter-box.filter-s {
  background: url("//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/filter-s.png") no-repeat center / 100%;
}
.ninja .content-box .content .top .filter-box.filter-a {
  background: url("//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/filter-a.png") no-repeat center / 100%;
}
.ninja .content-box .content .top .filter-box.filter-b {
  background: url("//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/filter-b.png") no-repeat center / 100%;
}
.ninja .content-box .content .top .filter-box.filter-c {
  background: url("//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/filter-c.png") no-repeat center / 100%;
}
.ninja .content-box .content .top .filter-box .filter-con {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
}
.ninja .content-box .content .top .ninja-list {
  margin-left: 0.1rem;
  display: flex;
  width: 82%;
  max-width: 100%;
  overflow-x: auto;
}
.ninja .content-box .content .top .ninja-list .list-item {
  margin-left: 0.2rem;
  width: 0.9rem;
  height: 0.9rem;
  position: relative;
  background: url("//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/ninjaTx-bg.png") no-repeat center / 100%;
  flex: none;
}
.ninja .content-box .content .top .ninja-list .list-item.act {
  border: 2px solid #ffec4f;
}
.ninja .content-box .content .top .ninja-list .list-item img {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
}
.ninja .content-box .content .top .ninja-list .list-item .text {
  position: absolute;
  width: 100%;
  text-align: center;
  font-size: 0.18rem;
  color: #fff;
  background: rgba(0, 0, 0, 0.7);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  z-index: 10;
  bottom: 0;
}
.ninja .content-box .content .top .allninjal{
  position:absolute;right:0;top:0;z-index:99; 
    width: 0.9rem;
  height: 0.9rem;
  background: url("//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/icon-qbz.png") no-repeat center / 100%;
}


.ninja .content-box .content .bottom {
  height: 90%;
  padding-bottom: 0.3rem;
  padding-top: 0.1rem;
  display:flex;justify-content:space-between;
}
.content .bottom .left{width:51%;height:98%;background-color:#ece2d6;overflow:auto;}
.content .bottom .right{width:48%;height:98%;background-color:#ece2d6; position:relative;}

.left .pic-box{width:100%; max-height:50%;height:2rem; position:relative;overflow:hidden;background-color:#000;}
.pic-box img{display:block;width:100%;position:relative;}
.pic-box div{position:absolute;width:100%;bottom:0;left:0;overflow:hidden;background-color:rgba(0,0,0,0.5);color:#fff;
             font-weight:bold;font-size:0.25rem;padding:0.05rem 0.2rem;}
.pic-box div span:nth-child(1){float:left;}
.pic-box div span:nth-child(2){float:right;}

.skill-box{width:100%;height:2.1rem; font-size:0.2rem;overflow:hidden;position:relative;}
.skill-box .name{width:60%;position:absolute;top:0.1rem;overflow:hidden;padding-left:0.1rem;}
.skill-box .name span{color:#816B5D;margin:0.1rem 0 0.2rem 0;line-height:0.2rem; display:block;}
.skill-box .name span:nth-child(1){border-left:2px solid #816B5D;padding:0 0.1rem;font-size:0.25rem;font-weight:bold;}
.skill-box .name .sp{width:100%; overflow:hidden;}
.skill-box .name .sp label{float:left;color:#816B5D;}

.skill-box .name .sp ul{overflow:hidden;clear:both;padding:0.1rem 0;}
.skill-box .name .sp ul li{float:left;margin:0 0.1rem 0.1rem 0;background-color:#D7CBBD;color:#816B5D;border-radius:5px;padding:0rem 0.1rem;}
.skill-box .volume-chart{position:absolute;top:0.15rem;right:0;
  width:3rem;
  height: 2rem;
  margin: 0 auto;
  transform:scale(0.75);
  transform-origin:top right;-ms-transform:scale(0.75);-o-tranform:scale(0.75);-webkit-transform:scale(0.75);-moz-transform:scale(0.75);-o-transform-origin:top right;-webkit-transform-origin:top right; 
}



.tab-switch{width:100%;overflow:hidden;font-size:0.2rem;background:#D8CCBD;}
.tab-switch li{float:left;height:0..5rem;padding:0.1rem;line-height:0.35rem;width:33.3%;background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/icon-lbbg3.png') no-repeat center/100%; text-align:center;}
.tab-switch li.act{background-color:#ece2d6;color:#fff;}


.right .container{
  width:100%;height:100%;
}
.right .container>div{ width:100%;height:85%;overflow:auto;position:relative;}

.c-0{font-size:0.2rem;}
.right .container>div.c-1{font-size:0.2rem;overflow:hidden;}
.c-2{font-size:0.2rem;}


.c-0 .list-item {
  width: 100%;
  padding: 0.15rem;
  display: flex;
  border-bottom: 1px solid #cec2bb;
}
.c-0 .list-item.list-item2 {
  height: 1.2rem;
  background: url("//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/icon-zwgd.png") no-repeat center / 100%;
  background-size: 1.1rem 0.32rem;
  background-position: 50% 50%;
}
.c-0 .list-item:nth-child(2) {
  border-bottom: none;
}
.c-0 .list-item .item-left {
  flex: none;
  width: 2rem;
  height: 1.2rem;
  position: relative;
  background: url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/character-item-left-bg.png') no-repeat center / 100%;
}
.c-0 .list-item .item-left img {
  display: block;
  width: auto;
  max-width: 100%;
  height: 100%;
}
.c-0 .list-item .item-left .mask {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  top: 0;
  left: 0;
}
.c-0 .list-item .item-left .mask .icon-play {
  position: absolute;
  width: 0.36rem;
  height: 0.41rem;
  background: url("//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/icon-play.png") no-repeat center / 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.c-0 .list-item .item-right {
  flex: auto;
  margin-left: 0.1rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.c-0 .list-item .item-right .title {
  font-size: 0.22rem;
  color: #816150;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.c-0 .list-item .item-right .dec {
  display: flex;
  position: relative;
}
.c-0 .list-item .item-right .dec .type {
  display: inline-block;
  font-size: 0.2rem;
  color: #866758;
  border: 1px solid #866758;
  border-radius: 3px;
  padding: 0 2px;
}
.c-0 .list-item .item-right .dec .see-num {
  position: absolute;
  font-size: 0.18rem;
  color: #99918d;
  top: 0;
  left: 50%;
}
.c-0 .list-item .item-right .dec .see-num::after {
  content: "";
  position: absolute;
  width: 0.3rem;
  height: 0.18rem;
  background: url("//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/icon-eye.png") no-repeat center / 100%;
  left: -0.32rem;
  top: 50%;
  margin-top: -0.09rem;
}
.c-0 .list-item .item-right .dec .time {
  position: absolute;
  font-size: 0.18rem;
  color: #99918d;
  top: 0;
  right: 0;
}

.c-0 .nodata{
  width:100%;height:100%;
  background: url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/icon-mrgl.png') no-repeat;
  background-size: 3.5rem 0.54rem;
  background-position: 50% 50%;
}
.c-0 .nodata--0{
  width:1.1rem;height:0.32rem;
  background: url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/icon-zwgd.png') no-repeat;
  background-size:100% 100%;
  margin:0.5rem auto;
}


.c-1 .skill-details {

  width:4.1rem;
  height:100%;
  overflow:auto;
  padding: 0rem 0.2rem;
  position: absolute;top:0;left:0;
}
.c-1 .skill-details .skill-img-box {
  width: 100%;
  height: 1.85rem;margin:0.1rem auto;

}
.c-1 .skill-details .skill-img-box img {
  display: block;
  width: 100%;
  height: 100%;
}
/* .c-1 .skill-details .skill-list*/
.c-1 .skill-list {
  margin-left: 0.1rem;
  /* display: flex;*/
  justify-content:space-around;
  position: absolute;
  top:0.15rem;
  right:0;
  background:transparent;
  width:1.2rem;
  height:100%;
  overflow: hidden;
 
  border-left:1px solid #CBC4B9;
}
.c-1 .skill-list .list-item {
  width: 0.73rem;
  height: 0.73rem;
  position: relative;
  margin:0.1rem auto;
 
}
.c-1  .skill-list .list-item.act .mask {
  display: none;
}
.c-1  .skill-list .list-item.act::after {
  content: "";
  position: absolute;
  width: 1px;
  height: 1px;
  border: 0.15rem solid;
  border-color:transparent  transparent  transparent #c12801;
  left: -0.2rem;
  top:35%;

}
.c-1  .skill-list .list-item .img-box {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
}
.c-1 .skill-list .list-item .img-box img {
  display: block;
  width: 100%;
  height: 100%;
}
.c-1 .skill-list .list-item .mask {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 5;
  background: rgba(0, 0, 0, 0.4);
  border-radius: 50%;
}
.c-1  .skill-list .list-item label{
  width:3rem;display:block;position:absolute;left:50%;margin-left:-1.5rem;
  font-size:0.15rem;
}

.skill-details .skill-text{color:#372214;}
.skill-details .name{font-weight:bold;font-size:0.25rem;color:#372214;border-left:2px solid #372214;padding-left:0.1rem;margin-top:0.1rem;}


.c-2{padding:0.15rem;color:#9A7F74;}
.c-2 h5{font-size:0.3rem;font-weight:bold;color:#6E5D56;}
.c-2 h5:before{content:'';width:0.25rem;height:0.25rem;margin-right:0.1rem;background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/icon-darts.png') no-repeat;background-size:100%; display:inline-block;}
.c-2 p{font-size:0.2rem;padding:0.1rem;}

.compared-list{width:100%;overflow:hidden;}
.compared-list li{border-bottom:1px solid #CBC4B9;margin:0.15rem 0;overflow:hidden;}
.compared-list li:last-child{border:none;}
.compared-list li .img-border{width:1rem;height:1rem;margin-top:0.05rem;float:left;background: url("//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/ninjaTx-bg.png") no-repeat center / 100%;}
.compared-list li .img-border img{width:100%;height:100%;}
.compared-list li p{float:left;width:78%;padding-top:0;}
.compared-list li p b{display:block;font-weight:bold;color:#6E5D56;font-size:0.25rem;}

.recode-tit{display:block;color:#816B5D;font-size:0.2rem;line-height:0.5rem;padding-left:0.1rem;}
.user-recode{width:100%;height:1.1rem;overflow:hidden;position:relative;margin-top:-0.1rem;font-size:0.2rem;margin-bottom:0.2rem;}

.current-recode{width:1rem;height:1rem;margin:0 0.1rem;position:absolute;left:0.1rem;}
.current-recode i{width:100%;height:100%;display:block;}

.current-recode i.icon-recode0-m{background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/grade-2000.png') no-repeat center/100%;}
.current-recode i.icon-recode1-m{background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/grade-5000.png') no-repeat center/100%;}
.current-recode i.icon-recode2-m{background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/grade-9000.png') no-repeat center/100%;}
.current-recode i.icon-recode3-m{background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/grade-14000.png') no-repeat center/100%;}
.current-recode i.icon-recode4-m{background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/grade-20000.png') no-repeat center/100%;}
.current-recode i.icon-recode5-m{background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/grade-28000.png') no-repeat center/100%;}

.recode-box{position:absolute;right:0.1rem;top:-0.1rem;width:6rem;
        transform:scale(0.7);transform-origin:center right;
        -ms-transform:scale(0.7);-o-tranform:scale(0.7);-webkit-transform:scale(0.7);-moz-transform:scale(0.7); -o-transform-origin:center right;  -webkit-transform-origin:center right; 

      }
.recode-box ul{width:100%;overflow:hidden;}
.recode-box ul li{float:left;width:1rem;height:1.5rem;text-align:center;color:#978B7F;}
.recode-box ul li i{width:0.5rem;height:0.5rem;display:inline-block;margin-bottom:0.2rem;border-radius:0.4rem; background-color:#ccc;}
.recode-box ul li span{display:inline-block;width:100%;font-size:0.2rem;}
.recode-box ul li.act span:nth-child(2){font-weight:bold;color:#483D34;}

.recode-box .bar-box{position:absolute;top:0.6rem;left:0;width:100%;height:0.1rem;overflow:hidden;background-color:#A79C95;border-radius:0.1rem;}
.recode-box .bar-box i{width:50%;height:100%;background-color:#B04F0D;display:block;}

.recode-box ul li i.icon-recode0{background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/grade-2000-s.png') no-repeat center/100%;}
.recode-box ul li i.icon-recode1{background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/grade-5000-s.png') no-repeat center/100%;}
.recode-box ul li i.icon-recode2{background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/grade-9000-s.png') no-repeat center/100%;}
.recode-box ul li i.icon-recode3{background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/grade-14000-s.png') no-repeat center/100%;}
.recode-box ul li i.icon-recode4{background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/grade-20000-s.png') no-repeat center/100%;}
.recode-box ul li i.icon-recode5{background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/grade-28000-s.png') no-repeat center/100%;}
.myskill-box{position:absolute;right:0.1rem;width:4.5rem;height:1rem;
    display:flex;justify-content:space-between;padding: 0.1rem;
    transform:scale(0.9);transform-origin:center right;
        -ms-transform:scale(0.9);-o-tranform:scale(0.9);-webkit-transform:scale(0.9);-moz-transform:scale(0.9); -o-transform-origin:center right;  -webkit-transform-origin:center right;
   }
.myskill-box>div{display:block;padding-top:0.05rem; text-align:center; width:1.3rem;height:100%; background:url('//game.gtimg.cn/images/hyrz/ingame/a20200410wsq/box_bg0512.png') no-repeat;background-size:100% 100%;}
.myskill-box>div b{font-size:0.26rem;font-weight:bold;display:block;}

/* #t6Hl8#CF3B07B3BF8577A22283A8208DEAA133 */