○属性固定召喚石・推しキャラ のHTML,CSSの変更

[yudukiak]

○属性固定召喚石

変更前

<div class="type1">
  <div class="title type_icon">火属性固定召喚石</div>
  <div class="content">
    <div class="image"><img src="image/thumbnail/2040034000.jpg"></div>
    <div class="spec rank3">スキル「機炎方陣」の効果が100%UP</div>
  </div>
</div>

修正後

<div class="type1">
  <div class="title type_icon">火属性固定召喚石</div>
  <div class="content">
    <div class="image">
      <img src="image/thumbnail/2040034000.jpg">
      <span class="quality">+99</span>
    </div>
    <div class="spec">
      <div class="name">Lv150 コロサス・マグナ</div>
      <div class="info rank3">スキル「機炎方陣」の効果が100%UP</div>
    </div>
  </div>
</div>

.image {
  position: relative;
  width: 90px;
  height: 51px;
}
.quality {
  bottom: 3px;
  right: 10px;
  position: absolute;
  color: #ffff5f;
  text-shadow: 0 0 1px #150f0f, 0 0 1px #150f0f, 0 0 1px #150f0f, 0 0 1px #150f0f, 0 0 2px #150f0f, 0 0 2px #150f0f, 0 0 2px #150f0f, 0 0 2px #150f0f;
}

[yudukiak]

推しキャラ

変更前

<div class="type8">
  <div class="title">推しキャラ</div>
  <div class="content breakword">
    <div class="image"><img src="image/thumbnail/3040102000_02.jpg"></div>
    <div class="spec">　　＼＼アッカリ～ン／／　 　　　は～い！ゆるゆり、　 　　 はっじまーるよぉ～♪</div>
  </div>
</div>

修正後

<div class="type8">
  <div class="title type-npc">
    Lv80 メリッサベル
    <div class="npc-rank">
      <div class="ico-npc-rank"></div>
      <div class="txt-npc-rank">6</div>
    </div>
  </div>
  <div class="content">
    <div class="image">
      <img src="image/thumbnail/3040102000_02.jpg">
      <span class="quality">+99</span>
    </div>
    <div class="spec">
      <div class="name"></div>
      <div class="info">　　＼＼アッカリ～ン／／　 　　　は～い！ゆるゆり、　 　　 はっじまーるよぉ～♪</div>
    </div>
  </div>
</div>

.type-npc{
  position: relative;
}
.npc-rank {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 29px;
}
.ico-npc-rank {
    display: block;
    background: url(image/icon_type/icon_type8.png) no-repeat ;
    -webkit-background-size: 29px 29px;
    background-size: 29px 29px;
    width: 29px;
    height: 29px;
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 4px;
    left: 0px;
    margin: auto;
}
.txt-npc-rank {
    text-shadow: 0px 0px 1px #570980, 0px 0px 1px #570980, 0px 0px 1px #570980, 0px 0px 2px #570980, 0px 0px 2px #570980, 0px 0px 2px #570980;
    color: #ffffff;
    position: relative;
    text-align: center;
}