@charset "UTF-8";
.character__paging {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 105%;
  z-index: 1;
}

@media (min-width: 768px) {
  .character__paging {
    width: calc(100% + 140px);
    position: absolute;
    top: 50%;
    left: -70px;
  }
}

.character__paging__item {
  width: 32px;
  height: 32px;
}

@media (min-width: 768px) {
  .character__paging__item {
    width: 45px;
    height: 45px;
  }
}

.character__paging__item img {
  width: 100%;
}

.character__select {
  position: relative;
  margin-top: 32px;
  z-index: 1;
}

.character__select__ttl img {
  height: 12px;
}

.character__select ul {
  margin: 8px -5px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  max-width: 350px;
}

@media (min-width: 768px) {
  .character__select ul {
    max-width: 420px;
  }
}

.character__select__item {
  position: relative;
  width: calc(20% - 10px);
  margin: 5px;
}

.character__select__item img {
  width: 100%;
}

@media (min-width: 768px) {
  .character__select__item {
    width: 60px;
  }
}

.character__select__item a {
  display: block;
}

.character__select__item a:after {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  content: '';
  width: 100%;
  height: 100%;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.character__select__item.-active a:after, .character__select__item:hover a:after {
  opacity: .7;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}

.character {
  z-index: 1;
  position: relative;
}

@media (min-width: 768px) {
  .character__bg {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 680px;
  }
}

.character__info {
  position: relative;
  min-height: 520px;
}

@media (min-width: 768px) {
  .character__info {
    min-height: initial;
  }
}

.character__name {
  padding-top: 20px;
}

@media (min-width: 768px) {
  .character__name {
    padding-top: 0;
  }
}

.character__name img {
  height: 78px;
}

@media (min-width: 768px) {
  .character__name img {
    height: 122px;
  }
}

.character__txt {
  margin-top: 20px;
  width: 50%;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 2;
}

@media (min-width: 768px) {
  .character__txt {
    font-size: 0.875rem;
    min-height: 140px;
    margin-top: 40px;
    width: 380px;
  }
}

.character__face {
  margin-top: 16px;
  width: 128px;
}

.character__face img {
  width: 100%;
}

@media (min-width: 768px) {
  .character__face {
    margin-top: 20px;
    width: 480px;
    margin-left: -100px;
  }
}

.character__ph {
  position: absolute;
  top: -60px;
  right: -30px;
  overflow: hidden;
  width: calc(50% + 30px);
  height: calc(100% + 200px);
}

@media (min-width: 768px) {
  .character__ph {
    position: absolute;
    top: -50px;
    right: 0;
    width: 50%;
    height: 100%;
    overflow: visible;
  }
}

.character__ph__item {
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

@media (min-width: 768px) {
  .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
}

.character__ph__item.-active {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.character__switch {
  position: absolute;
  top: 60%;
  left: 45%;
  z-index: 1;
  cursor: pointer;
  border-radius: 50%;
  width: 55px;
  height: 55px;
}

@media (min-width: 768px) {
  .character__switch {
    position: absolute;
    top: 0;
    left: auto;
    right: 0;
    width: 80px;
    height: 80px;
  }
}

.character__switch:before {
  position: absolute;
  top: -15px;
  left: 50%;
  content: '';
  height: 10px;
  width: 45px;
  background: url(/assets/img/common/ico/ico_change.svg) no-repeat;
  background-size: 100%;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
}

@media (min-width: 768px) {
  .character__switch:before {
    position: absolute;
    top: -20px;
    left: 50%;
    height: 12px;
    width: 60px;
  }
}

/* ================================
　草摩慊人設定
================================ */
.akito .c-cont_ttl {
  background: #6c6c7a;
}

.akito .character__bg {
  background: url(/assets/img/character/akito/ph_bg.png) no-repeat top right;
}

.akito .character__ph {
  width: calc(60% + 20px);
}

@media (min-width: 768px) {
  .akito .character__ph {
    width: 50%;
  }
}

.akito .character__ph__item {
  position: absolute;
  top: 0;
  left: 55%;
}

.akito .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .akito .character__ph__item {
    position: absolute;
    top: 0;
    left: 45%;
  }
  .akito .character__ph__item img {
    height: auto;
  }
}

.akito .character__select__item a:after {
  background: #6c6c7a;
}

/* ================================
　魚谷 ありさ設定
================================ */
.arisa .c-cont_ttl {
  background: #ba99c7;
}

.arisa .character__bg {
  background: url(/assets/img/character/arisa/ph_bg.png) no-repeat top right;
}

.arisa .character__ph {
  width: calc(60% + 30px);
}

@media (min-width: 768px) {
  .arisa .character__ph {
    width: 50%;
  }
}

.arisa .character__ph__item {
  position: absolute;
  top: 0;
  left: 62%;
}

.arisa .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .arisa .character__ph__item {
    position: absolute;
    top: 0;
    left: 45%;
  }
  .arisa .character__ph__item img {
    height: auto;
  }
}

.arisa .character__select__item a:after {
  background: #ba99c7;
}

/* ================================
　草摩 綾女設定
================================ */
.ayame .c-cont_ttl {
  background: #ed9191;
}

.ayame .character__bg {
  background: url(/assets/img/character/ayame/ph_bg.png) no-repeat top right;
}

.ayame .character__ph {
  width: calc(70% + 30px);
}

@media (min-width: 768px) {
  .ayame .character__ph {
    width: 50%;
  }
}

.ayame .character__txt {
  width: 40%;
}

@media (min-width: 768px) {
  .ayame .character__txt {
    width: 380px;
  }
}

.ayame .character__ph__item {
  position: absolute;
  top: 10px;
  left: 59%;
}

.ayame .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .ayame .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .ayame .character__ph__item img {
    height: auto;
  }
}

.ayame .character__ph__item.-animal {
  position: absolute;
  top: 100px;
  left: 60%;
}

.ayame .character__ph__item.-animal img {
  height: 300px;
}

@media (min-width: 768px) {
  .ayame .character__ph__item.-animal {
    position: absolute;
    top: 100px;
    left: 50%;
  }
  .ayame .character__ph__item.-animal img {
    height: auto;
  }
}

.ayame .character__switch {
  background: url(/assets/img/character/ayame/ph_switch.png) no-repeat center;
  background-size: 100%;
  background-color: #ed9191;
}

.ayame .character__switch.-active {
  background: url(/assets/img/common/ico/ico_close_w.svg) no-repeat center;
  background-size: 40% 40%;
  background-color: #ed9191;
}

.ayame .character__select__item a:after {
  background: #ed9191;
}

/* ================================
　草摩 はとり設定
================================ */
.hatori .c-cont_ttl {
  background: #8d87ab;
}

.hatori .character__bg {
  background: url(/assets/img/character/hatori/ph_bg.png) no-repeat top right;
}

.hatori .character__ph {
  width: calc(60% + 30px);
}

@media (min-width: 768px) {
  .hatori .character__ph {
    width: 50%;
  }
}

.hatori .character__ph__item {
  position: absolute;
  top: 0;
  left: 58%;
}

.hatori .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .hatori .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .hatori .character__ph__item img {
    height: auto;
  }
}

.hatori .character__ph__item.-animal {
  position: absolute;
  top: 100px;
  left: 50%;
}

.hatori .character__ph__item.-animal img {
  height: 300px;
}

@media (min-width: 768px) {
  .hatori .character__ph__item.-animal {
    position: absolute;
    top: 100px;
    left: 50%;
  }
  .hatori .character__ph__item.-animal img {
    height: auto;
  }
}

.hatori .character__switch {
  background: url(/assets/img/character/hatori/ph_switch.png) no-repeat center;
  background-size: 100%;
  background-color: #8d87ab;
}

.hatori .character__switch.-active {
  background: url(/assets/img/common/ico/ico_close_w.svg) no-repeat center;
  background-size: 40% 40%;
  background-color: #8d87ab;
}

.hatori .character__select__item a:after {
  background: #8d87ab;
}

/* ================================
　草摩 潑春設定
================================ */
.hatsuharu .c-cont_ttl {
  background: #9696a0;
}

.hatsuharu .character__bg {
  background: url(/assets/img/character/hatsuharu/ph_bg.png) no-repeat top right;
}

.hatsuharu .character__ph {
  width: calc(60% + 30px);
}

@media (min-width: 768px) {
  .hatsuharu .character__ph {
    width: 50%;
  }
}

.hatsuharu .character__ph__item {
  position: absolute;
  top: 10px;
  left: 53%;
}

.hatsuharu .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .hatsuharu .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .hatsuharu .character__ph__item img {
    height: auto;
  }
}

.hatsuharu .character__ph__item.-animal {
  position: absolute;
  top: 170px;
  left: 55%;
}

.hatsuharu .character__ph__item.-animal img {
  height: 220px;
}

@media (min-width: 768px) {
  .hatsuharu .character__ph__item.-animal {
    position: absolute;
    top: 100px;
    left: 50%;
  }
  .hatsuharu .character__ph__item.-animal img {
    height: auto;
  }
}

.hatsuharu .character__switch {
  background: url(/assets/img/character/hatsuharu/ph_switch.png) no-repeat center;
  background-size: 100%;
  background-color: #9696a0;
}

.hatsuharu .character__switch.-active {
  background: url(/assets/img/common/ico/ico_close_w.svg) no-repeat center;
  background-size: 40% 40%;
  background-color: #9696a0;
}

.hatsuharu .character__select__item a:after {
  background: #9696a0;
}

/* ================================
　草摩 燈路設定
================================ */
.hiro .c-cont_ttl {
  background: #d7be96;
}

.hiro .character__bg {
  background: url(/assets/img/character/hiro/ph_bg.png) no-repeat top right;
}

.hiro .character__ph {
  width: calc(60% + 30px);
}

@media (min-width: 768px) {
  .hiro .character__ph {
    width: 50%;
  }
}

.hiro .character__ph__item {
  position: absolute;
  top: 10px;
  left: 53%;
}

.hiro .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .hiro .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .hiro .character__ph__item img {
    height: auto;
  }
}

.hiro .character__ph__item.-animal {
  position: absolute;
  top: 100px;
  left: 50%;
}

.hiro .character__ph__item.-animal img {
  height: 300px;
}

@media (min-width: 768px) {
  .hiro .character__ph__item.-animal img {
    height: auto;
  }
}

.hiro .character__switch {
  background: url(/assets/img/character/hiro/ph_switch.png) no-repeat center;
  background-size: 100%;
  background-color: #d7be96;
}

.hiro .character__switch.-active {
  background: url(/assets/img/common/ico/ico_close_w.svg) no-repeat center;
  background-size: 40% 40%;
  background-color: #d7be96;
}

.hiro .character__select__item a:after {
  background: #d7be96;
}

/* ================================
　草摩 依鈴　設定
================================ */
.isuzu .c-cont_ttl {
  background: #aa697d;
}

.isuzu .character__bg {
  background: url(/assets/img/character/isuzu/ph_bg.png) no-repeat top right;
}

.isuzu .character__ph {
  top: -75px;
  width: calc(70% + 90px);
}

@media (min-width: 768px) {
  .isuzu .character__ph {
    top: -50px;
    width: 52%;
  }
}

.isuzu .character__ph__item {
  position: absolute;
  top: 10px;
  left: 68%;
}

.isuzu .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .isuzu .character__ph__item {
    position: absolute;
    top: 0;
    left: 45%;
  }
  .isuzu .character__ph__item img {
    height: auto;
  }
}

.isuzu .character__ph__item.-animal {
  position: absolute;
  top: 110px;
  left: 66%;
}

.isuzu .character__ph__item.-animal img {
  height: 260px;
}

@media (min-width: 768px) {
  .isuzu .character__ph__item.-animal {
    position: absolute;
    top: 110px;
    left: 50%;
  }
  .isuzu .character__ph__item.-animal img {
    height: auto;
  }
}

.isuzu .character__switch {
  background: url(/assets/img/character/isuzu/ph_switch.png) no-repeat center;
  background-size: 100%;
  background-color: #aa697d;
}

.isuzu .character__switch.-active {
  background: url(/assets/img/common/ico/ico_close_w.svg) no-repeat center;
  background-size: 40% 40%;
  background-color: #aa697d;
}

.isuzu .character__select__item a:after {
  background: #aa697d;
}

/* ================================
　草摩 楽羅設定
================================ */
.kagura .c-cont_ttl {
  background: #ba9999;
}

.kagura .character__bg {
  background: url(/assets/img/character/kagura/ph_bg.png) no-repeat top right;
}

.kagura .character__ph__item {
  position: absolute;
  top: 0;
  left: 45%;
}

.kagura .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .kagura .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .kagura .character__ph__item img {
    height: auto;
  }
}

.kagura .character__ph__item.-animal {
  position: absolute;
  top: 150px;
  left: 50%;
}

.kagura .character__ph__item.-animal img {
  height: 260px;
}

@media (min-width: 768px) {
  .kagura .character__ph__item.-animal {
    position: absolute;
    top: 100px;
    left: 50%;
  }
  .kagura .character__ph__item.-animal img {
    height: auto;
  }
}

.kagura .character__switch {
  background: url(/assets/img/character/kagura/ph_switch.png) no-repeat center;
  background-size: 100%;
  background-color: #ba9999;
}

.kagura .character__switch.-active {
  background: url(/assets/img/common/ico/ico_close_w.svg) no-repeat center;
  background-size: 40% 40%;
  background-color: #ba9999;
}

.kagura .character__select__item a:after {
  background: #ba9999;
}

/* ================================
　真鍋 翔設定
================================ */
.kakeru .c-cont_ttl {
  background: #7bad76;
}

.kakeru .character__bg {
  background: url(/assets/img/character/kakeru/ph_bg.png) no-repeat top right;
}

.kakeru .character__ph {
  width: calc(60% + 20px);
}

@media (min-width: 768px) {
  .kakeru .character__ph {
    width: 50%;
  }
}

.kakeru .character__ph__item {
  position: absolute;
  top: -1%;
  left: 55%;
}

.kakeru .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .kakeru .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .kakeru .character__ph__item img {
    height: auto;
  }
}

.kakeru .character__select__item a:after {
  background: #7bad76;
}

/* ================================
　草摩 藉真設定
================================ */
.kazuma .c-cont_ttl {
  background: #7188b5;
}

.kazuma .character__bg {
  background: url(/assets/img/character/kazuma/ph_bg.png) no-repeat top right;
}

.kazuma .character__ph {
  width: calc(60% + 20px);
}

@media (min-width: 768px) {
  .kazuma .character__ph {
    width: 50%;
  }
}

.kazuma .character__ph__item {
  position: absolute;
  top: -1%;
  left: 55%;
}

.kazuma .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .kazuma .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .kazuma .character__ph__item img {
    height: auto;
  }
}

.kazuma .character__select__item a:after {
  background: #7188b5;
}

/* ================================
　草摩 杞紗設定
================================ */
.kisa .c-cont_ttl {
  background: #ffe296;
}

.kisa .character__bg {
  background: url(/assets/img/character/kisa/ph_bg.png) no-repeat top right;
}

.kisa .character__ph {
  width: calc(60% + 30px);
}

@media (min-width: 768px) {
  .kisa .character__ph {
    width: 50%;
  }
}

.kisa .character__ph__item {
  position: absolute;
  top: 10px;
  left: 53%;
}

.kisa .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .kisa .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .kisa .character__ph__item img {
    height: auto;
  }
}

.kisa .character__ph__item.-animal {
  position: absolute;
  top: 100px;
  left: 55%;
}

.kisa .character__ph__item.-animal img {
  height: 300px;
}

@media (min-width: 768px) {
  .kisa .character__ph__item.-animal img {
    height: auto;
  }
}

.kisa .character__switch {
  background: url(/assets/img/character/kisa/ph_switch.png) no-repeat center;
  background-size: 100%;
  background-color: #ffe296;
}

.kisa .character__switch.-active {
  background: url(/assets/img/common/ico/ico_close_w.svg) no-repeat center;
  background-size: 40% 40%;
  background-color: #ffe296;
}

.kisa .character__select__item a:after {
  background: #ffe296;
}

/* ================================
　草摩 紅野　設定
================================ */
.kureno .c-cont_ttl {
  background: #cc9f95;
}

.kureno .character__bg {
  background: url(/assets/img/character/kureno/ph_bg.png) no-repeat top right;
}

.kureno .character__ph {
  top: -75px;
  width: calc(70% + 90px);
}

@media (min-width: 768px) {
  .kureno .character__ph {
    top: -50px;
    width: 52%;
  }
}

.kureno .character__ph__item {
  position: absolute;
  top: 10px;
  left: 68%;
}

.kureno .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .kureno .character__ph__item {
    position: absolute;
    top: 0;
    left: 45%;
  }
  .kureno .character__ph__item img {
    height: auto;
  }
}

.kureno .character__ph__item.-animal {
  position: absolute;
  top: 110px;
  left: 73%;
}

.kureno .character__ph__item.-animal img {
  height: 260px;
}

@media (min-width: 768px) {
  .kureno .character__ph__item.-animal {
    position: absolute;
    top: 96px;
    left: 59%;
  }
  .kureno .character__ph__item.-animal img {
    height: auto;
  }
}

.kureno .character__switch {
  background: url(/assets/img/character/kureno/ph_switch.png) no-repeat center;
  background-size: 100%;
  background-color: #cc9f95;
}

.kureno .character__switch.-active {
  background: url(/assets/img/common/ico/ico_close_w.svg) no-repeat center;
  background-size: 40% 40%;
  background-color: #cc9f95;
}

.kureno .character__select__item a:after {
  background: #cc9f95;
}

/* ================================
　草摩 夾設定
================================ */
.kyo .c-cont_ttl {
  background: #fac78a;
}

.kyo .character__bg {
  background: url(/assets/img/character/kyo/ph_bg.png) no-repeat top right;
}

.kyo .character__ph__item {
  position: absolute;
  top: 0;
  left: 60%;
}

.kyo .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .kyo .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .kyo .character__ph__item img {
    height: auto;
  }
}

.kyo .character__ph__item.-animal {
  position: absolute;
  top: 100px;
  left: 50%;
}

.kyo .character__ph__item.-animal img {
  height: 300px;
}

@media (min-width: 768px) {
  .kyo .character__ph__item.-animal {
    position: absolute;
    top: 100px;
    left: 50%;
  }
  .kyo .character__ph__item.-animal img {
    height: auto;
  }
}

.kyo .character__switch {
  background: url(/assets/img/character/kyo/ph_switch.png) no-repeat center;
  background-size: 100%;
  background-color: #fac78a;
}

.kyo .character__switch.-active {
  background: url(/assets/img/common/ico/ico_close_w.svg) no-repeat center;
  background-size: 40% 40%;
  background-color: #fac78a;
}

.kyo .character__select__item a:after {
  background: #fac78a;
}

/* ================================
　草摩慊人設定
================================ */
.kyoko .c-cont_ttl {
  background: #e8cc7d;
}

.kyoko .character__bg {
  background: url(/assets/img/character/kyoko/ph_bg.png) no-repeat top right;
}

.kyoko .character__ph {
  width: calc(60% + 20px);
}

@media (min-width: 768px) {
  .kyoko .character__ph {
    width: 50%;
  }
}

.kyoko .character__ph__item {
  position: absolute;
  top: 0;
  left: 58%;
}

.kyoko .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .kyoko .character__ph__item {
    position: absolute;
    top: 0;
    left: 45%;
  }
  .kyoko .character__ph__item img {
    height: auto;
  }
}

.kyoko .character__select__item a:after {
  background: #e8cc7d;
}

/* ================================
　倉伎 真知設定
================================ */
.machi .c-cont_ttl {
  background: #b7beb0;
}

.machi .character__bg {
  background: url(/assets/img/character/machi/ph_bg.png) no-repeat top right;
}

.machi .character__ph {
  width: calc(60% + 20px);
}

@media (min-width: 768px) {
  .machi .character__ph {
    width: 50%;
  }
}

.machi .character__ph__item {
  position: absolute;
  top: -1%;
  left: 55%;
}

.machi .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .machi .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .machi .character__ph__item img {
    height: auto;
  }
}

.machi .character__select__item a:after {
  background: #7188b5;
}

/* ================================
　草摩 紅葉設定
================================ */
.momiji .c-cont_ttl {
  background: #e6d773;
}

.momiji .character__bg {
  background: url(/assets/img/character/momiji/ph_bg.png) no-repeat top right;
}

.momiji .character__ph {
  width: calc(60% + 30px);
}

@media (min-width: 768px) {
  .momiji .character__ph {
    width: 50%;
  }
}

.momiji .character__ph__item {
  position: absolute;
  top: 0;
  left: 58%;
}

.momiji .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .momiji .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .momiji .character__ph__item img {
    height: auto;
  }
}

.momiji .character__ph__item.-animal {
  position: absolute;
  top: 100px;
  left: 50%;
}

.momiji .character__ph__item.-animal img {
  height: 300px;
}

@media (min-width: 768px) {
  .momiji .character__ph__item.-animal {
    position: absolute;
    top: 100px;
    left: 50%;
  }
  .momiji .character__ph__item.-animal img {
    height: auto;
  }
}

.momiji .character__switch {
  background: url(/assets/img/character/momiji/ph_switch.png) no-repeat center;
  background-size: 100%;
  background-color: #e6d773;
}

.momiji .character__switch.-active {
  background: url(/assets/img/common/ico/ico_close_w.svg) no-repeat center;
  background-size: 40% 40%;
  background-color: #e6d773;
}

.momiji .character__select__item a:after {
  background: #e6d773;
}

/* ================================
　草摩 利津設定
================================ */
.ritsu .c-cont_ttl {
  background: #afd791;
}

.ritsu .character__bg {
  background: url(/assets/img/character/ritsu/ph_bg.png) no-repeat top right;
}

.ritsu .character__ph {
  width: calc(70% + 90px);
}

@media (min-width: 768px) {
  .ritsu .character__ph {
    width: 52%;
  }
}

.ritsu .character__ph__item {
  position: absolute;
  top: 10px;
  left: 58%;
}

.ritsu .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .ritsu .character__ph__item {
    position: absolute;
    top: 0;
    left: 43%;
  }
  .ritsu .character__ph__item img {
    height: auto;
  }
}

.ritsu .character__ph__item.-animal {
  position: absolute;
  top: 110px;
  left: 66%;
}

.ritsu .character__ph__item.-animal img {
  height: 260px;
}

@media (min-width: 768px) {
  .ritsu .character__ph__item.-animal {
    position: absolute;
    top: 110px;
    left: 50%;
  }
  .ritsu .character__ph__item.-animal img {
    height: auto;
  }
}

.ritsu .character__switch {
  background: url(/assets/img/character/ritsu/ph_switch.png) no-repeat center;
  background-size: 100%;
  background-color: #afd791;
}

.ritsu .character__switch.-active {
  background: url(/assets/img/common/ico/ico_close_w.svg) no-repeat center;
  background-size: 40% 40%;
  background-color: #afd791;
}

.ritsu .character__select__item a:after {
  background: #afd791;
}

.ritsu .character__txt {
  width: 40%;
}

/* ================================
　花島 咲設定
================================ */
.saki .c-cont_ttl {
  background: #89a1bf;
}

.saki .character__bg {
  background: url(/assets/img/character/saki/ph_bg.png) no-repeat top right;
}

.saki .character__ph__item {
  position: absolute;
  top: 0;
  left: 50%;
}

.saki .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .saki .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .saki .character__ph__item img {
    height: auto;
  }
}

.saki .character__select__item a:after {
  background: #89a1bf;
}

/* ================================
　草摩 紫呉設定
================================ */
.shigure .c-cont_ttl {
  background: #c7c791;
}

.shigure .character__bg {
  background: url(/assets/img/character/shigure/ph_bg.png) no-repeat top right;
}

.shigure .character__ph {
  width: calc(70% + 30px);
}

@media (min-width: 768px) {
  .shigure .character__ph {
    width: 50%;
  }
}

.shigure .character__txt {
  width: 40%;
}

@media (min-width: 768px) {
  .shigure .character__txt {
    width: 380px;
  }
}

.shigure .character__ph__item {
  position: absolute;
  top: 10px;
  left: 63%;
}

.shigure .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .shigure .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .shigure .character__ph__item img {
    height: auto;
  }
}

.shigure .character__ph__item.-animal {
  position: absolute;
  top: 100px;
  left: 60%;
}

.shigure .character__ph__item.-animal img {
  height: 300px;
}

@media (min-width: 768px) {
  .shigure .character__ph__item.-animal {
    position: absolute;
    top: 100px;
    left: 50%;
  }
  .shigure .character__ph__item.-animal img {
    height: auto;
  }
}

.shigure .character__switch {
  background: url(/assets/img/character/shigure/ph_switch.png) no-repeat center;
  background-size: 100%;
  background-color: #c7c791;
}

.shigure .character__switch.-active {
  background: url(/assets/img/common/ico/ico_close_w.svg) no-repeat center;
  background-size: 40% 40%;
  background-color: #c7c791;
}

.shigure .character__select__item a:after {
  background: #c7c791;
}

/* ================================
　本田透設定
================================ */
.tohru .c-cont_ttl {
  background: #ff9ec6;
}

.tohru .character__bg {
  background: url(/assets/img/character/tohru/ph_bg.png) no-repeat top right;
}

.tohru .character__ph__item {
  position: absolute;
  top: 0;
  left: 45%;
}

.tohru .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .tohru .character__ph__item {
    position: absolute;
    top: 0;
    left: 45%;
  }
  .tohru .character__ph__item img {
    height: auto;
  }
}

.tohru .character__select__item a:after {
  background: #ff9ec6;
}

/* ================================
　草摩 由希設定
================================ */
.yuki .c-cont_ttl {
  background: #cccccc;
}

.yuki .character__bg {
  background: url(/assets/img/character/yuki/ph_bg.png) no-repeat top right;
}

.yuki .character__ph__item {
  position: absolute;
  top: 0;
  left: 54%;
}

.yuki .character__ph__item img {
  height: 660px;
}

@media (min-width: 768px) {
  .yuki .character__ph__item {
    position: absolute;
    top: 0;
    left: 50%;
  }
  .yuki .character__ph__item img {
    height: auto;
  }
}

.yuki .character__ph__item.-animal {
  position: absolute;
  top: 100px;
  left: 50%;
}

.yuki .character__ph__item.-animal img {
  height: 300px;
}

@media (min-width: 768px) {
  .yuki .character__ph__item.-animal {
    position: absolute;
    top: 100px;
    left: 50%;
  }
  .yuki .character__ph__item.-animal img {
    height: auto;
  }
}

.yuki .character__switch {
  background: url(/assets/img/character/yuki/ph_switch.png) no-repeat center;
  background-size: 100%;
  background-color: #cccccc;
}

.yuki .character__switch.-active {
  background: url(/assets/img/common/ico/ico_close_w.svg) no-repeat center;
  background-size: 40% 40%;
  background-color: #cccccc;
}

.yuki .character__select__item a:after {
  background: #cccccc;
}
