@charset "UTF-8";
body {
 background: url(../img/chara/chapter4/bg.jpg);
}

.ballBg {
  background: url(../img/chara/chapter4/bg.jpg) center top;
  width: 120%;
  height: 110%;
  position: fixed;
  z-index: -1;
  top: -40px;
  left: 0;
}

.wrapper .title h2 {
  background: url("../img/chara/chapter4/pc_title_chara.png") no-repeat left;
}

.wrapper .ditail {
  padding: 0 0 70px;
}

.wrapper .ditail .returnBtna {
  position: absolute;
  top: -15px;
}

.wrapper {
  font-family: "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

.wrapper img {
  max-width: 100%;
}

.wrapper .chap4_title {
  text-align: center;
  padding: 65px 0 0;
}

.wrapper .chap4_sub_title {
  margin-top: 10px;
  text-align: center;
}

.wrapper .chap4_sub_txt {
  margin-top: 15px;
  text-align: center;
  color: #fff;
  font-weight: bold;
  line-height: 1.6;
  font-size: 19px;
  font-style: italic;
  text-shadow: 2px 2px 1px #000;
}

.wrapper .chap4_chara_title {
  width: 500px;
  margin: 60px auto 50px;
  text-align: center;
}

.wrapper .chap4_slide {
  margin-top: 30px;
}

.wrapper .chap4_slide .pc {
  -webkit-transition: opacity .5s;
          transition: opacity .5s;
}

.wrapper .chap4_slide .pc:hover {
  opacity: 0.8;
  filter: alpha(opacity=80);
}

.wrapper .chap4_list li {
  position: relative;
  float: left;
  width: 160px;
  margin-right: 8px;
  margin-top: 8px;
}

.wrapper .chap4_list li:nth-child(6n) {
  margin-right: 0;
}

.wrapper .chap4_list li a {
  display: block;
  width: 100%;
  padding-bottom: 100%;
}

.wrapper .chap4_list li.btn_no01 a {
  background: url(../img/chara/chapter4/btn_01.jpg) no-repeat top center;
}

.wrapper .chap4_list li.btn_no02 a {
  background: url(../img/chara/chapter4/btn_02.jpg) no-repeat top center;
}

.wrapper .chap4_list li.btn_no03 a {
  background: url(../img/chara/chapter4/btn_03.jpg) no-repeat top center;
}

.wrapper .chap4_list li.btn_no04 a {
  background: url(../img/chara/chapter4/btn_04.jpg) no-repeat top center;
}

.wrapper .chap4_list li.btn_no05 a {
  background: url(../img/chara/chapter4/btn_05.jpg) no-repeat top center;
}

.wrapper .chap4_list li.btn_no06 a {
  background: url(../img/chara/chapter4/btn_06.jpg) no-repeat top center;
}

.wrapper .chap4_list li.btn_no07 a {
  background: url(../img/chara/chapter4/btn_07.jpg) no-repeat top center;
}

.wrapper .chap4_list li.btn_no08 a {
  background: url(../img/chara/chapter4/btn_08.jpg) no-repeat top center;
}

.wrapper .chap4_list li.btn_no09 a {
  background: url(../img/chara/chapter4/btn_09.jpg) no-repeat top center;
}

.wrapper .chap4_list li.btn_no10 a {
  background: url(../img/chara/chapter4/btn_10.jpg) no-repeat top center;
}

.wrapper .chap4_list li.btn_no11 a {
  background: url(../img/chara/chapter4/btn_11.jpg) no-repeat top center;
}

.wrapper .chap4_list li.btn_no12 a {
  background: url(../img/chara/chapter4/btn_12.jpg) no-repeat top center;
}

.wrapper .chap4_list li:hover a {
  background-position: bottom center;
}

.wrapper .chap4_chara_list {
  margin-top: 70px;
  text-align: left;
}

.wrapper .chap4_chara_list li {
  position: relative;
  float: left;
  width: 300px;
  margin: 0 16px 30px;
  background: url(../img/chara/chapter4/chara_bg.jpg) no-repeat top center;
  -webkit-background-size: contain;
          background-size: contain;
}

.wrapper .chap4_chara_list li .chara_name_box {
  position: absolute;
  left: 15px;
  top: 15px;
}

.wrapper .chap4_chara_list li .chara_name {
  font-size: 32px;
  color: #fff;
  font-style: italic;
  letter-spacing: -.035em;
  font-weight: bold;
  text-shadow: 2px 2px 1px #000;
}

.wrapper .chap4_chara_list li .chara_cv {
  margin-top: 7px;
  padding-left: 5px;
  color: #fff100;
  font-size: 13px;
  font-weight: bold;
}

.wrapper .chap4_chara_list li .chara_txt {
  position: absolute;
  bottom: 0;
  left: 7%;
  width: 86%;
  height: 83px;
  border-top: 1px solid #000;
  padding-top: 8px;
  font-size: 13px;
  line-height: 1.4;
  font-weight: 500;
}

.wrapper .chap4_chara_list li .category {
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
  padding: 15px 0 0 0;
  font-size: 20px;
  line-height: 2.3;
  letter-spacing: .1em;
  font-weight: bold;
  -ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.wrapper .chap4_chara_list li .category.kaio {
  background: url(../img/chara/chapter4/tag_03.png) no-repeat top right;
  -webkit-background-size: contain;
          background-size: contain;
}

.wrapper .chap4_chara_list li .category.senshi {
  background: url(../img/chara/chapter4/tag_02.png) no-repeat top center;
  -webkit-background-size: contain;
          background-size: contain;
}

.wrapper .chap4_chara_list li .category.hakai {
  background: url(../img/chara/chapter4/tag_04.png) no-repeat top center;
  -webkit-background-size: contain;
          background-size: contain;
  color: #fff;
}

.wrapper .chap4_chara_list li .category.tenshi {
  background: url(../img/chara/chapter4/tag_01.png) no-repeat top center;
  -webkit-background-size: contain;
          background-size: contain;
}

footer .copy {
  color: #fff;
}