.c-slot-txt__line {
  display: flex;
  height: 1.23em;
  overflow: hidden;
  margin: 0 auto;
}
.c-slot-txt__letter {
  position: relative;
  width: 1em;
}
.c-slot-txt__letter img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: block;
  font-size: inherit;
  width: 1.1714em;
  max-width: none;
  height: auto;
  margin: auto;
  transform: translateY(-100%);
}
.c-slot-txt__letter.h img, .c-slot-txt__letter.td img, .c-slot-txt__letter.t img, .c-slot-txt__letter.s img, .c-slot-txt__letter.y img, .c-slot-txt__letter.b img, .c-slot-txt__letter.u img, .c-slot-txt__letter.i img, .c-slot-txt__letter.dd img, .c-slot-txt__letter.dd2 img, .c-slot-txt__letter.qm img {
  top: -1.5em;
}
.c-slot-txt__letter.a, .c-slot-txt__letter.s, .c-slot-txt__letter.b, .c-slot-txt__letter.u {
  margin: 0 -0.1em;
}
.c-slot-txt__letter.y, .c-slot-txt__letter.qm {
  margin: 0 -0.15em;
}
.c-slot-txt__letter.t, .c-slot-txt__letter.dd, .c-slot-txt__letter.dd2 {
  margin: 0 -0.2em;
}
.c-slot-txt__letter.i {
  margin: 0 -0.25em;
}
.c-slot-txt__ws {
  width: 0.36em;
}
.c-slot-txt__ws2 {
  width: 0.2em;
}
@media screen and (max-width: 750px) {
  .c-slot-txt__line {
    padding-left: 0;
  }
  .c-slot-txt__letter.a, .c-slot-txt__letter.s, .c-slot-txt__letter.b, .c-slot-txt__letter.u {
    margin: 0 -0.15em;
  }
  .c-slot-txt__letter.y {
    margin: 0 -0.18em;
  }
}

.member-overlay {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  height: calc(var(--vh) * 100);
  background: #000;
  pointer-events: none;
  z-index: 10000;
}
.member-overlay__ttl {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 235px;
  height: 598px;
  background: url(../img/member/ol-ttl.png) center/contain no-repeat;
  margin: auto;
  opacity: 0;
  z-index: 2;
}
.member-overlay__ttl img {
  opacity: 0;
}
@media screen and (max-width: 750px) {
  .member-overlay__ttl {
    width: 118px;
    height: 300px;
  }
}

.no-animation .member-overlay {
  display: none;
}

.member .contents {
  background: #3FE425;
}
@media screen and (max-width: 1199px) {
  .member .header {
    height: 0;
  }
  .member .header-nav-sp .header-logo {
    display: none;
  }
}

.member-fixedbg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #3FE425 url(../img/member/fixed-bg.png) center top/1800px auto no-repeat;
}
@media screen and (max-width: 1200px) {
  .member-fixedbg {
    display: none;
  }
}

.member-fv {
  position: relative;
  width: 100%;
  height: 100vh;
  height: calc(var(--vh) * 100);
  max-height: 1020px;
  overflow: hidden;
}
.member-fv__bg {
  width: 1220px;
  height: 100%;
  margin: 0 auto;
  background: #3FE425 url(../img/member/fv-bg.jpg) center top/100% auto no-repeat;
  z-index: 1;
}
.member-fv__front1, .member-fv__txt, .member-fv__front2 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  max-width: 1100px;
  height: 100%;
  max-height: 100%;
  margin: 0 auto;
}
.member-fv__front1 {
  background: url(../img/member/fv-front1.png) center top/contain no-repeat;
  opacity: 0;
  z-index: 2;
}
.member-fv__ttl-en, .member-fv__ttl {
  position: absolute;
  overflow: hidden;
}
.member-fv__ttl-en .marker, .member-fv__ttl .marker {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: #36b02b;
  transform: translateX(-101%);
  z-index: 1;
}
.member-fv__ttl-en .line, .member-fv__ttl .line {
  position: relative;
  display: inline-block;
  -webkit-clip-path: inset(0 105% 0 -5%);
          clip-path: inset(0 105% 0 -5%);
  z-index: 2;
}
.member-fv__ttl-en {
  top: 5.2%;
  left: 0.4%;
  z-index: 2;
}
.member-fv__ttl {
  top: 38.63%;
  left: 1.05%;
  z-index: 4;
}
.member-fv__chara {
  position: absolute;
  top: -111px;
  left: calc(50% - 256px);
  width: 1091px;
  height: 1120px;
  background: url(../img/member/fv-chara.png) center/contain no-repeat;
  z-index: 3;
}
.member-fv__front2 {
  background: url(../img/member/fv-front2.png) center top/contain no-repeat;
  opacity: 0;
  z-index: 4;
}
@media screen and (max-width: 1100px) {
  .member-fv__chara {
    left: calc(50% - 23.3vw);
    width: 99.2vw;
    height: 101.2vw;
  }
}
@media screen and (min-width: 750px) and (max-height: 1020px) {
  .member-fv__front1, .member-fv__txt, .member-fv__front2 {
    height: 80%;
  }
  .member-fv__ttl-en {
    width: 70vh;
  }
  .member-fv__ttl {
    top: 38.63vh;
    width: 40vh;
  }
  .member-fv__chara {
    left: calc(50% - 20vh);
    width: 106vh;
    height: 109vh;
  }
}
@media screen and (max-width: 750px) {
  .member-fv {
    height: 217vw;
  }
  .member-fv__bg {
    width: 100%;
    height: 163.46vw;
    background: url(../img/member/fv-bg_sp.jpg) center/cover no-repeat;
  }
  .member-fv__front1 {
    display: none;
  }
  .member-fv__txt {
    top: auto;
    bottom: 0;
    height: 53.33vw;
  }
  .member-fv__ttl-en {
    top: 23px;
    left: 22px;
    width: 316px;
    height: 142px;
  }
  .member-fv__ttl {
    top: 165px;
    left: 20px;
    width: 335px;
    height: 28px;
  }
  .member-fv__chara {
    width: 149.33vw;
    height: 153.33vw;
    left: calc(50% - 62.5vw);
    top: 7.7vw;
    background-image: url(../img/member/fv-chara_sp.png);
  }
  .member-fv__front2 {
    height: 163.46vw;
    background: url(../img/member/fv-front2_sp.png) center/cover no-repeat;
  }
}

.no-animation .member-fv {
  background: none;
}
.no-animation .member-fv__front1, .no-animation .member-fv__front2 {
  opacity: 1;
}

.member-intro {
  position: relative;
  padding: 60px 0 25px;
}
.member-intro .c-reveal {
  transition-duration: 2s;
}
.member-intro .c-slot-txt {
  font-size: 70px;
}
.member-intro .c-slot-txt__line {
  justify-content: center;
  padding-left: 0.25em;
}
.member-intro__left-img {
  position: absolute;
  left: 0;
  top: 30px;
  filter: drop-shadow(13px 20px 0 #fff);
}
.member-intro__left-img img {
  display: block;
  width: calc(50vw - 332px);
  height: 383px;
  -webkit-clip-path: polygon(0 0, 100% 0, calc(100% - 155px) 100%, 0 100%);
          clip-path: polygon(0 0, 100% 0, calc(100% - 155px) 100%, 0 100%);
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: right;
     object-position: right;
}
.member-intro__right-img {
  position: absolute;
  right: 0;
  bottom: 0;
  filter: drop-shadow(16px 19px 0 #fff);
}
.member-intro__right-img img {
  display: block;
  width: calc(50vw - 318px);
  height: 383px;
  -webkit-clip-path: polygon(155px 0, 100% 0, 100% 100%, 0 100%);
          clip-path: polygon(155px 0, 100% 0, 100% 100%, 0 100%);
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: left;
     object-position: left;
}
.member-intro__catch {
  color: #000;
  font-size: 45px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.15;
  margin-top: 30px;
  text-align: center;
}
.member-intro__catch span {
  display: inline-block;
  background: #EBFF00;
  padding-left: 0.5em;
}
.member-intro__desc {
  color: #fff;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 2;
  margin-top: 27px;
  text-align: center;
}
.member-intro__catch2 {
  position: relative;
  color: #052A98;
  font-size: 60px;
  font-style: italic;
  font-weight: 900;
  line-height: 1.25;
  margin-top: 30px;
  text-align: center;
  z-index: 1;
}
.member-intro__catch2 .line {
  position: relative;
  display: inline-block;
  padding: 0 20px;
}
.member-intro__catch2 .txt {
  display: inline-block;
  -webkit-clip-path: inset(0 105% 0 -5%);
          clip-path: inset(0 105% 0 -5%);
  transition: -webkit-clip-path 0.4s ease-in-out 0.4s;
  transition: clip-path 0.4s ease-in-out 0.4s;
  transition: clip-path 0.4s ease-in-out 0.4s, -webkit-clip-path 0.4s ease-in-out 0.4s;
}
.member-intro__catch2 .marker {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: #EBFF00;
  transform: skew(-25deg);
  transform-origin: center;
  -webkit-clip-path: inset(0 105% 0 -5%);
          clip-path: inset(0 105% 0 -5%);
  transition: -webkit-clip-path 0.4s ease-in-out;
  transition: clip-path 0.4s ease-in-out;
  transition: clip-path 0.4s ease-in-out, -webkit-clip-path 0.4s ease-in-out;
  z-index: -1;
}
.member-intro__catch2 .inview .txt,
.member-intro__catch2 .inview .marker {
  -webkit-clip-path: inset(0 -5% 0 -5%);
          clip-path: inset(0 -5% 0 -5%);
}
@media screen and (max-width: 1599px) {
  .member-intro__left-img img, .member-intro__right-img img {
    height: 22vw;
  }
}
@media screen and (max-width: 1400px) {
  .member-intro .c-slot-txt__line {
    font-size: 46px;
  }
  .member-intro__left-img img, .member-intro__right-img img {
    width: calc(50vw - 280px);
  }
}
@media screen and (max-width: 1200px) {
  .member-intro__catch {
    font-size: 30px;
  }
  .member-intro__desc {
    font-size: 15px;
  }
  .member-intro__catch2 {
    font-size: 40px;
  }
  .member-intro__left-img img, .member-intro__right-img img {
    width: calc(50vw - 200px);
    height: 24vw;
  }
  .member-intro__left-img img {
    -webkit-clip-path: polygon(0 0, 100% 0, calc(100% - 120px) 100%, 0 100%);
            clip-path: polygon(0 0, 100% 0, calc(100% - 120px) 100%, 0 100%);
  }
  .member-intro__right-img img {
    -webkit-clip-path: polygon(120px 0, 100% 0, 100% 100%, 0 100%);
            clip-path: polygon(120px 0, 100% 0, 100% 100%, 0 100%);
  }
}
@media screen and (max-width: 959px) {
  .member-intro__left-img img, .member-intro__right-img img {
    width: calc(50vw - 160px);
  }
}
@media screen and (max-width: 750px) {
  .member-intro {
    padding: 70px 0 25px;
  }
  .member-intro .c-slot-txt__line {
    font-size: 38px;
    padding: 0;
  }
  .member-intro .c-slot-txt__letter {
    filter: drop-shadow(0 3px 3px rgba(0, 0, 0, 0.6));
  }
  .member-intro__catch {
    font-size: 20px;
    line-height: 1.5;
    margin-top: 55px;
  }
  .member-intro__desc {
    font-size: 14px;
  }
  .member-intro__catch2 {
    font-size: 27.5px;
  }
  .member-intro__catch2 .line {
    padding: 0 12px;
  }
  .member-intro__left-img {
    top: 33px;
    filter: drop-shadow(4px 6px 0 #fff);
  }
  .member-intro__left-img img {
    width: calc(50vw - 52px);
    height: 118px;
    -webkit-clip-path: polygon(0 0, 100% 0, calc(100% - 46px) 100%, 0 100%);
            clip-path: polygon(0 0, 100% 0, calc(100% - 46px) 100%, 0 100%);
    -o-object-position: 89% center;
       object-position: 89% center;
  }
  .member-intro__right-img {
    top: 65px;
    bottom: auto;
    filter: drop-shadow(5px 6px 0 #fff);
  }
  .member-intro__right-img img {
    width: calc(50vw - 46px);
    height: 118px;
    -webkit-clip-path: polygon(48px 0, 100% 0, 100% 100%, 0 100%);
            clip-path: polygon(48px 0, 100% 0, 100% 100%, 0 100%);
  }
}

.member-chara {
  background: url(../img/member/chara-bg.png) center/2097px auto no-repeat;
  overflow: hidden;
  padding: 94px 0 15px;
}
.member-chara__inner {
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 100px;
}
.member-chara__ttl {
  position: relative;
  width: 100%;
  height: 52.5px;
  margin-bottom: -2px;
}
.member-chara__ttl img {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: auto;
  height: 100%;
  transition: 0.3s ease-out;
}
.member-chara__ttl.man img:nth-child(1) {
  opacity: 1;
}
.member-chara__ttl.man img:nth-child(2) {
  opacity: 0;
}
.member-chara__ttl.woman img:nth-child(1) {
  opacity: 0;
}
.member-chara__ttl.woman img:nth-child(2) {
  opacity: 1;
}
@media screen and (max-width: 1300px) {
  .member-chara__inner {
    max-width: 1200px;
    padding: 0 50px;
  }
}
@media screen and (max-width: 959px) {
  .member-chara__ttl {
    height: 35px;
  }
}
@media screen and (max-width: 750px) {
  .member-chara {
    background: none;
    padding: 23px 0 15px;
  }
  .member-chara__inner {
    padding: 0 20px;
  }
  .member-chara__ttl {
    margin-bottom: -1px;
    height: 20px;
  }
}

.member-chara-frame {
  position: relative;
  width: 100%;
  height: 840px;
  background: rgba(0, 0, 0, 0.4);
}
.member-chara-frame__tab {
  position: absolute;
  left: 100%;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 65px;
  height: 362px;
  background: rgba(0, 0, 0, 0.4);
  -webkit-clip-path: polygon(0 0, 100% 45px, 100% calc(100% - 45px), 0 100%);
          clip-path: polygon(0 0, 100% 45px, 100% calc(100% - 45px), 0 100%);
  padding: 0;
  transition: 0.3s;
}
.member-chara-frame__tab:hover {
  background: #fa7f05;
}
@media screen and (max-width: 1300px) {
  .member-chara-frame {
    height: 70vw;
  }
  .member-chara-frame__tab {
    width: 45px;
  }
}
@media screen and (max-width: 750px) {
  .member-chara-frame {
    height: calc((100vw - 40px) * 2.0746);
  }
  .member-chara-frame__tab {
    display: none;
  }
}

.member-chara-panel {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: 13.4% 10.6% no-repeat;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease-out;
  z-index: 1;
}
.member-chara-panel.active {
  opacity: 1;
  visibility: visible;
}
.member-chara-panel--01 {
  background: url(../img/member/chara01-panel-bg.png) 13.4% 10.6%/31.3% 16.42% no-repeat;
}
.member-chara-panel--02 {
  background: url(../img/member/chara02-panel-bg.png) 10.7% 10.6%/31.3% 16.42% no-repeat;
}
.member-chara-panel::before, .member-chara-panel::after {
  content: "";
  position: absolute;
  display: block;
  width: 48.18%;
  pointer-events: none;
}
.member-chara-panel::before {
  top: 1.5%;
  left: 1%;
  height: 18.5%;
  background: url(../img/member/frame-lt.png) center/contain no-repeat;
}
.member-chara-panel::after {
  bottom: 3.2%;
  right: 1.8%;
  height: 18%;
  background: url(../img/member/frame-rb.png) center/contain no-repeat;
}
.member-chara-panel__chara {
  position: absolute;
  transform: translateX(200%);
}
.member-chara-panel--01 .member-chara-panel__chara {
  left: 21.8%;
  top: -17.5%;
  width: 76%;
  height: 85%;
  opacity: 0;
}
.member-chara-panel--01 .member-chara-panel__chara img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  transition: opacity 0.3s;
}
.member-chara-panel--01 .member-chara-panel__chara img.wing {
  opacity: 0;
}
.member-chara-panel--01 .member-chara-panel__chara:hover img.wing {
  opacity: 1;
}
.member-chara-panel--02 .member-chara-panel__chara {
  left: 28.5%;
  top: 7.5%;
  width: 43.2%;
  height: 79%;
}
.member-chara-panel__data {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 74%;
  background: center top/contain no-repeat;
  pointer-events: none;
}
.member-chara-panel__data .speed,
.member-chara-panel__data .power,
.member-chara-panel__data .brains {
  position: absolute;
  display: block;
  left: 23.9%;
  background: #00FF00;
  border: solid 1px #fff;
  width: 100px;
  height: 1.4%;
  transform: scaleX(0);
  transform-origin: left;
}
.member-chara-panel__data .speed {
  bottom: 8.1%;
}
.member-chara-panel__data .power {
  bottom: 5.8%;
}
.member-chara-panel__data .brains {
  bottom: 3.5%;
}
.member-chara-panel--01 .member-chara-panel__data {
  background-image: url(../img/member/chara01-img-label.png);
}
.member-chara-panel--01 .member-chara-panel__data .speed {
  width: 70%;
}
.member-chara-panel--01 .member-chara-panel__data .power {
  width: 57%;
}
.member-chara-panel--01 .member-chara-panel__data .brains {
  width: 57%;
}
.member-chara-panel--01 .member-chara-panel__desc01 {
  position: absolute;
  right: 4.8%;
  top: 32.2%;
  width: 23%;
  height: auto;
  animation: yure 5s ease infinite;
}
.member-chara-panel--01 .member-chara-panel__desc02 {
  position: absolute;
  left: 4.7%;
  top: 47.2%;
  width: 25.55%;
  height: auto;
  animation: yure 5s ease infinite;
}
.member-chara-panel--01 .member-chara-panel__desc03 {
  position: absolute;
  right: 8.8%;
  top: 5.7%;
  width: 27.73%;
  height: auto;
  animation: yure 5s ease infinite;
}
.member-chara-panel--02 .member-chara-panel__data {
  background-image: url(../img/member/chara02-img-label.png);
}
.member-chara-panel--02 .member-chara-panel__data .speed {
  width: 49.8%;
}
.member-chara-panel--02 .member-chara-panel__data .power {
  width: 37%;
}
.member-chara-panel--02 .member-chara-panel__data .brains {
  width: 70%;
}
.member-chara-panel--02 .member-chara-panel__desc01 {
  position: absolute;
  left: 13.1%;
  top: 37.7%;
  width: 25.64%;
  height: auto;
  animation: yure 5s ease infinite;
}
.member-chara-panel--02 .member-chara-panel__desc02 {
  position: absolute;
  right: 15.1%;
  top: 6.5%;
  width: 21.45%;
  height: auto;
  animation: yure 5s ease infinite;
}
.member-chara-panel__txt {
  position: absolute;
  bottom: 7.6%;
  left: 7.5%;
  height: 18%;
  width: 75%;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 2;
}
.member-chara-panel__btn {
  position: absolute;
  bottom: 9%;
  right: 6%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 13.1%;
  height: 17.1%;
  padding: 1% 0 0;
  margin: 0;
  cursor: pointer;
  background: center/100% 100% no-repeat;
  transition: background-size 0.3s;
}
.member-chara-panel__btn .btn-txt path {
  transition: fill 0.3s;
}
@media screen and (min-width: 750px) {
  .member-chara-panel__btn:hover {
    background-size: 110% 110%;
  }
  .member-chara-panel__btn:hover .btn-txt path {
    fill: #fa7f05;
  }
}
.member-chara-panel--01 .member-chara-panel__btn {
  background-image: url(../img/member/chara02_btn.png);
}
.member-chara-panel--02 .member-chara-panel__btn {
  background-image: url(../img/member/chara01_btn.png);
}
.member-chara-panel__btn-secret {
  display: none;
}
.member-chara-panel--secret {
  background: none;
  padding: 3% 0;
}
.member-chara-panel--secret::before, .member-chara-panel--secret::after {
  content: none;
}
.member-chara-panel__comic {
  width: auto;
  max-width: 63%;
  margin: 0 auto;
}
.member-chara-panel__comic img {
  display: block;
  max-width: 100%;
  height: auto;
  max-height: 100%;
  margin: 0 auto;
}
.member-chara-panel__close {
  display: block;
  width: 18%;
  background: none;
  margin: 0 0 0 auto;
  padding: 0 2% 0 0;
}
@keyframes yure {
  0% {
    transform: translateY(5%);
  }
  50% {
    transform: translateY(-5%);
  }
  100% {
    transform: translateY(5%);
  }
}
@media screen and (max-width: 1300px) {
  .member-chara-panel__txt {
    font-size: 1.385vw;
  }
}
@media screen and (max-width: 750px) {
  .member-chara-panel::before, .member-chara-panel::after {
    width: 84%;
    pointer-events: none;
  }
  .member-chara-panel::before {
    top: 1.4%;
    left: 2%;
    height: 11.6%;
  }
  .member-chara-panel::after {
    bottom: 1.6%;
    right: 3%;
    height: 11.6%;
  }
  .member-chara-panel--01 {
    background-position: 19% 15%;
    background-size: 71% 13.8%;
  }
  .member-chara-panel--02 {
    background-position: 19% 15%;
    background-size: 71% 13.8%;
  }
  .member-chara-panel--01 .member-chara-panel__chara {
    left: 10.8%;
    top: -1.2%;
    width: 111.5%;
    height: 44%;
  }
  .member-chara-panel--02 .member-chara-panel__chara {
    left: 17.5%;
    top: 4.5%;
    width: 64.5%;
    height: 44%;
  }
  .member-chara-panel__data {
    height: 57%;
  }
  .member-chara-panel__data .speed,
  .member-chara-panel__data .power,
  .member-chara-panel__data .brains {
    left: 30.6%;
  }
  .member-chara-panel__data .speed {
    bottom: 4.8%;
  }
  .member-chara-panel__data .power {
    bottom: 3%;
  }
  .member-chara-panel__data .brains {
    bottom: 1.2%;
  }
  .member-chara-panel--01 .member-chara-panel__data {
    background-image: url(../img/member/chara01-img-label_sp.png);
  }
  .member-chara-panel--01 .member-chara-panel__data .speed {
    width: 74.5%;
  }
  .member-chara-panel--01 .member-chara-panel__data .power {
    width: 65%;
  }
  .member-chara-panel--01 .member-chara-panel__data .brains {
    width: 65%;
  }
  .member-chara-panel--01 .member-chara-panel__desc01 {
    right: auto;
    left: 3.9%;
    top: 53.8%;
    width: 43%;
  }
  .member-chara-panel--01 .member-chara-panel__desc02 {
    left: 6.1%;
    top: 5.5%;
    width: 49%;
  }
  .member-chara-panel--01 .member-chara-panel__desc03 {
    right: 3.3%;
    top: 21.5%;
    width: 47%;
  }
  .member-chara-panel--02 .member-chara-panel__data {
    background-image: url(../img/member/chara02-img-label_sp.png);
  }
  .member-chara-panel--02 .member-chara-panel__data .speed {
    width: 64%;
  }
  .member-chara-panel--02 .member-chara-panel__data .power {
    width: 47.5%;
  }
  .member-chara-panel--02 .member-chara-panel__data .brains {
    width: 74.5%;
  }
  .member-chara-panel--02 .member-chara-panel__desc01 {
    left: 4.6%;
    top: 44.3%;
    width: 41.8%;
  }
  .member-chara-panel--02 .member-chara-panel__desc02 {
    right: 2.7%;
    top: 5.7%;
    width: 34%;
  }
  .member-chara-panel__txt {
    bottom: 20.6%;
    left: 5.5%;
    height: 21%;
    width: 90%;
    font-size: 12px;
  }
  .member-chara-panel__btn {
    bottom: 5.5%;
    left: 9%;
    right: auto;
    width: 28%;
    height: 13.4%;
    padding: 2% 1% 0 0px;
  }
  .member-chara-panel__btn .btn-txt {
    width: 78%;
  }
  .member-chara-panel__btn-secret {
    position: absolute;
    bottom: 5.5%;
    right: 9%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 49%;
    height: 13.3%;
    background: rgba(0, 0, 0, 0.4);
    padding: 0;
    margin: 0;
  }
  .member-chara-panel__btn-secret img {
    display: block;
    width: 84%;
  }
  .member-chara-panel--secret {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 9%;
  }
  .member-chara-panel__comic {
    max-width: none;
    width: 95%;
    margin: 0 -2% 0 0;
  }
  .member-chara-panel__close {
    width: 20%;
    padding-right: 3%;
  }
}

.member-about {
  position: relative;
  padding: 112px 0 98px;
}
.member-about .c-reveal {
  transition-duration: 0.8s;
}
.member-about__wrap {
  position: relative;
  background: #fff;
  overflow: hidden;
  transform: skewY(-6.4deg);
}
.member-about__before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 40px;
  background: #fff;
  box-shadow: inset 0 8px 6px rgba(0, 0, 0, 0.24);
  z-index: 1;
}
.member-about__before::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 20px;
  background: #3FE425;
  box-shadow: 0 8px 6px rgba(0, 0, 0, 0.24);
}
.member-about__after {
  position: absolute;
  bottom: 20px;
  left: 0;
  display: block;
  width: 100%;
  height: 20px;
  background: #3FE425;
  box-shadow: 0 8px 6px rgba(0, 0, 0, 0.24);
  z-index: 1;
}
.member-about__inner {
  position: relative;
  background: url(../img/member/about-bg.jpg) center/100% auto no-repeat;
  padding: 152px 0 94px;
  transform: skewY(6.4deg);
}
.member-about__deco {
  position: absolute;
  top: 8.5%;
  left: calc(50% + 102px);
  width: 453px;
  height: 394px;
  background: url(../img/member/about-deco.svg) center/contain no-repeat;
}
.member-about__ttl-en {
  font-size: 80px;
  padding-left: 5.2%;
}
.member-about__ttl-en .c-slot-txt__line:nth-child(2) {
  margin-top: -0.25em;
  padding-left: 45px;
}
.member-about__ttl-en .c-slot-txt__letter.h img, .member-about__ttl-en .c-slot-txt__letter.t img, .member-about__ttl-en .c-slot-txt__letter.s img, .member-about__ttl-en .c-slot-txt__letter.y img, .member-about__ttl-en .c-slot-txt__letter.i img, .member-about__ttl-en .c-slot-txt__letter.dd img, .member-about__ttl-en .c-slot-txt__letter.dd2 img, .member-about__ttl-en .c-slot-txt__letter.qm img {
  top: -1.53em;
}
.member-about__ttl {
  font-size: 45px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.4;
  margin-top: 20px;
  padding-left: 18%;
}
.member-about__ttl span {
  display: inline-block;
  background: #EBFF00;
  padding: 0 5px;
}
.member-about__desc {
  max-width: 600px;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0;
  margin: 10px 0 0 18%;
  text-align: center;
}
@media screen and (max-width: 750px) {
  .member-about {
    padding: 32px 0 50px;
  }
  .member-about__before {
    height: 22px;
    box-shadow: inset 0 8px 11px rgba(0, 0, 0, 0.24);
  }
  .member-about__before::before {
    height: 11px;
    box-shadow: 0 8px 11px rgba(0, 0, 0, 0.24);
  }
  .member-about__after {
    bottom: 11px;
    height: 11px;
    box-shadow: 0 8px 11px rgba(0, 0, 0, 0.24);
  }
  .member-about__inner {
    background-image: url(../img/member/about-bg_sp.jpg);
    padding: 66px 0 38px;
  }
  .member-about__ttl-en {
    padding-left: 0;
  }
  .member-about__ttl-en .c-slot-txt__line:nth-child(1) {
    font-size: 31px;
  }
  .member-about__ttl-en .c-slot-txt__line:nth-child(2) {
    font-size: 32px;
    margin-top: -0.15em;
    padding-left: 20px;
  }
  .member-about__ttl {
    font-size: 20px;
    line-height: 1.6;
    margin-top: 15px;
    padding-left: 0;
  }
  .member-about__ttl span {
    padding: 0 12px;
  }
  .member-about__desc {
    font-size: 14px;
    margin: 11px 0 0;
    text-align: left;
  }
  .member-about__deco {
    top: 6px;
    left: calc(50% - 6px);
    width: 202px;
    height: 176px;
  }
}

.member-member {
  position: relative;
  background: url(../img/member/chara-bg.png) center top 23.5%/2097px auto no-repeat;
  padding: 15px 0;
  overflow: hidden;
}
.member-member__inner {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 50px;
}
.member-member__ttl {
  position: relative;
  width: 422px;
  height: 52px;
  margin-bottom: -1px;
}
.member-member__ttl::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  display: block;
  width: 109px;
  height: 100%;
  background: url(../img/member/member-ttl-deco.svg) center/contain no-repeat;
}
.member-member__ttl span {
  position: relative;
  display: block;
  width: calc(100% - 109px);
  height: 100%;
  overflow: hidden;
}
.member-member__ttl span img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: left;
     object-position: left;
  animation: ttl-scroll1 18s linear infinite;
}
.member-member__ttl span::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 17px;
  height: 100%;
  background: linear-gradient(to right, rgba(63, 228, 37, 0), rgb(63, 228, 37));
  z-index: 1;
}
.member-member__ttl span::after {
  content: "";
  position: absolute;
  left: 120%;
  top: 0;
  width: 100%;
  height: 100%;
  background: url(../img/member/member-ttl.svg) left/contain no-repeat;
  animation: ttl-scroll2 18s linear 9s infinite;
}
@keyframes ttl-scroll1 {
  0% {
    transform: translateX(-120%);
  }
  100% {
    transform: translateX(120%);
  }
}
@keyframes ttl-scroll2 {
  0% {
    transform: translateX(-240%);
  }
  100% {
    transform: translateX(0);
  }
}
@media screen and (max-width: 750px) {
  .member-member {
    background: url(../img/member/chara-bg_sp.png) center top 6%/750px auto no-repeat;
  }
  .member-member__inner {
    padding: 0 20px;
  }
  .member-member__ttl {
    width: 174px;
    height: 21px;
    margin-bottom: -1px;
  }
  .member-member__ttl::after {
    width: 44px;
  }
  .member-member__ttl span {
    width: calc(100% - 44px);
  }
  .member-member__ttl span::before {
    width: 6px;
  }
}

.member-member-frame {
  position: relative;
  width: 100%;
  height: 1003px;
  background: rgba(0, 0, 0, 0.4);
}
.member-member-frame::before, .member-member-frame::after {
  content: "";
  position: absolute;
  display: block;
  width: 48.18%;
  pointer-events: none;
}
.member-member-frame::before {
  top: 0;
  left: 1%;
  height: 18%;
  background: url(../img/member/frame-lt.png) center/contain no-repeat;
}
.member-member-frame::after {
  bottom: 0.2%;
  right: 1.3%;
  height: 17.5%;
  background: url(../img/member/frame-rb.png) center/contain no-repeat;
}
@media screen and (max-width: 1200px) {
  .member-member-frame {
    height: 79.58vw;
  }
}
@media screen and (max-width: 750px) {
  .member-member-frame {
    height: 810px;
  }
  .member-member-frame::before, .member-member-frame::after {
    width: 281px;
    height: 78px;
  }
  .member-member-frame::before {
    top: 7px;
    left: 3px;
  }
  .member-member-frame::after {
    bottom: 15px;
    right: 3px;
  }
}

.member-member-panel {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/member/square-deco.png) right 8.35% top 28.6%/19.25% 19.3% no-repeat;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease-out;
  z-index: 1;
}
.member-member-panel.active {
  opacity: 1;
  visibility: visible;
}
.member-member-panel__pic {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
  height: 60.85%;
  padding-bottom: 0.5%;
}
.member-member-panel__pic picture {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.member-member-panel__pic img {
  max-width: none;
}
.member-member-panel--01 .member-member-panel__pic img {
  width: 45.18%;
  margin-left: 5.3%;
}
.member-member-panel--02 .member-member-panel__pic img {
  width: 66%;
  margin-left: -10.7%;
}
.member-member-panel--03 .member-member-panel__pic img {
  width: 64.18%;
  margin-left: -7.1%;
}
.member-member-panel--04 .member-member-panel__pic img {
  width: 61.72%;
  margin-left: -4.6%;
}
.member-member-panel--05 .member-member-panel__pic img {
  width: 70.27%;
  margin-left: -15.2%;
}
.member-member-panel--06 .member-member-panel__pic img {
  width: 66.36%;
  margin-left: -1.7%;
}
.member-member-panel--07 .member-member-panel__pic img {
  width: 48.18%;
  margin-left: 10.6%;
}
.member-member-panel--08 .member-member-panel__pic img {
  width: 105.63%;
  margin-left: 9.5%;
}
.member-member-panel--09 .member-member-panel__pic img {
  width: 61.72%;
  margin-left: -4.7%;
}
.member-member-panel--10 .member-member-panel__pic img {
  width: 41.27%;
  margin-left: 4.3%;
}
.member-member-panel--11 .member-member-panel__pic img {
  width: 47.63%;
  margin-left: -8.7%;
  padding-bottom: 0.9%;
}
.member-member-panel--12 .member-member-panel__pic img {
  width: 70.36%;
  margin-left: 3.4%;
  padding-bottom: 2.1%;
}
.member-member-panel__data {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 60.85%;
  background: center top/contain no-repeat;
  pointer-events: none;
}
.member-member-panel__data .speed,
.member-member-panel__data .power,
.member-member-panel__data .brains {
  position: absolute;
  display: block;
  left: 23.5%;
  background: #00FF00;
  border: solid 1px #fff;
  width: 100px;
  height: 1.7%;
  transform-origin: left;
  transform: scaleX(0);
}
.member-member-panel__data .speed {
  bottom: 6%;
}
.member-member-panel__data .power {
  bottom: 3.3%;
}
.member-member-panel__data .brains {
  bottom: 0.8%;
}
.member-member-panel__data .graph {
  position: absolute;
  top: 15.3%;
  right: 8.2%;
  width: 25%;
  padding-top: 21.6%;
}
.member-member-panel__data .graph .value {
  position: absolute;
  left: -100%;
  right: -100%;
  top: -100%;
  bottom: -100%;
  margin: auto;
  transform-origin: center;
  transform: scale(0);
}
.member-member-panel__data .graph .base {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/member/graph-base.png) center/contain no-repeat;
}
.member-member-panel__data .graph span {
  position: absolute;
  display: inline-block;
  width: 10em;
  color: #fff;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}
.member-member-panel__data .graph span.param1 {
  top: -10.5%;
  left: -12%;
}
.member-member-panel__data .graph span.param2 {
  top: -10.5%;
  left: 42%;
}
.member-member-panel__data .graph span.param3 {
  top: 46%;
  left: 102%;
  text-align: left;
}
.member-member-panel__data .graph span.param4 {
  top: 102%;
  left: 42%;
}
.member-member-panel__data .graph span.param5 {
  top: 102%;
  left: -12%;
}
.member-member-panel__data .graph span.param6 {
  top: 46%;
  right: 102%;
  text-align: right;
}
.member-member-panel--01 .member-member-panel__data {
  background-image: url(../img/member/member01-label.png);
}
.member-member-panel--01 .member-member-panel__data .speed {
  width: 75.5%;
}
.member-member-panel--01 .member-member-panel__data .power {
  width: 31%;
}
.member-member-panel--01 .member-member-panel__data .brains {
  width: 53.5%;
}
.member-member-panel--01 .member-member-panel__data .graph .value {
  width: 111%;
  height: 223%;
  background: url(../img/member/member01-graph.svg) right top/95% 81.3% no-repeat;
}
.member-member-panel--02 .member-member-panel__data {
  background-image: url(../img/member/member02-label.png);
}
.member-member-panel--02 .member-member-panel__data .speed,
.member-member-panel--02 .member-member-panel__data .power,
.member-member-panel--02 .member-member-panel__data .brains {
  left: 26.5%;
}
.member-member-panel--02 .member-member-panel__data .speed {
  width: 15.2%;
}
.member-member-panel--02 .member-member-panel__data .power {
  width: 66.8%;
}
.member-member-panel--02 .member-member-panel__data .brains {
  width: 54.5%;
}
.member-member-panel--02 .member-member-panel__data .graph .value {
  width: 77%;
  height: 157%;
  background: url(../img/member/member02-graph.svg) left top/88% 75% no-repeat;
}
.member-member-panel--03 .member-member-panel__data {
  background-image: url(../img/member/member03-label.png);
}
.member-member-panel--03 .member-member-panel__data .speed,
.member-member-panel--03 .member-member-panel__data .power,
.member-member-panel--03 .member-member-panel__data .brains {
  left: 26.5%;
}
.member-member-panel--03 .member-member-panel__data .speed {
  width: 35.7%;
}
.member-member-panel--03 .member-member-panel__data .power {
  width: 43.3%;
}
.member-member-panel--03 .member-member-panel__data .brains {
  width: 66.2%;
}
.member-member-panel--03 .member-member-panel__data .graph .value {
  width: 78%;
  height: 79%;
  background: url(../img/member/member03-graph.svg) right bottom/80% 94% no-repeat;
}
.member-member-panel--04 .member-member-panel__data {
  background-image: url(../img/member/member04-label.png);
}
.member-member-panel--04 .member-member-panel__data .speed,
.member-member-panel--04 .member-member-panel__data .power,
.member-member-panel--04 .member-member-panel__data .brains {
  left: 26.5%;
}
.member-member-panel--04 .member-member-panel__data .speed {
  width: 58.5%;
}
.member-member-panel--04 .member-member-panel__data .power {
  width: 67%;
}
.member-member-panel--04 .member-member-panel__data .brains {
  width: 15.5%;
}
.member-member-panel--04 .member-member-panel__data .graph .value {
  width: 81%;
  height: 165%;
  background: url(../img/member/member04-graph.svg) left top/74% 74.3% no-repeat;
}
.member-member-panel--05 .member-member-panel__data {
  background-image: url(../img/member/member05-label.png);
}
.member-member-panel--05 .member-member-panel__data .speed,
.member-member-panel--05 .member-member-panel__data .power,
.member-member-panel--05 .member-member-panel__data .brains {
  left: 26.5%;
}
.member-member-panel--05 .member-member-panel__data .speed {
  width: 51%;
}
.member-member-panel--05 .member-member-panel__data .power {
  width: 66%;
}
.member-member-panel--05 .member-member-panel__data .brains {
  width: 46%;
}
.member-member-panel--05 .member-member-panel__data .graph .value {
  width: 79%;
  height: 79%;
  background: url(../img/member/member05-graph.svg) right top/100% 100% no-repeat;
}
.member-member-panel--06 .member-member-panel__data {
  background-image: url(../img/member/member06-label.png);
}
.member-member-panel--06 .member-member-panel__data .speed,
.member-member-panel--06 .member-member-panel__data .power,
.member-member-panel--06 .member-member-panel__data .brains {
  left: 25%;
}
.member-member-panel--06 .member-member-panel__data .speed {
  width: 44%;
}
.member-member-panel--06 .member-member-panel__data .power {
  width: 67.8%;
}
.member-member-panel--06 .member-member-panel__data .brains {
  width: 56%;
}
.member-member-panel--06 .member-member-panel__data .graph .value {
  width: 79%;
  height: 79%;
  background: url(../img/member/member06-graph.svg) right top/100% 87% no-repeat;
}
.member-member-panel--07 .member-member-panel__data {
  background-image: url(../img/member/member07-label.png);
}
.member-member-panel--07 .member-member-panel__data .speed,
.member-member-panel--07 .member-member-panel__data .power,
.member-member-panel--07 .member-member-panel__data .brains {
  left: 26.5%;
}
.member-member-panel--07 .member-member-panel__data .speed {
  width: 66.8%;
}
.member-member-panel--07 .member-member-panel__data .power {
  width: 57.8%;
}
.member-member-panel--07 .member-member-panel__data .brains {
  width: 33%;
}
.member-member-panel--07 .member-member-panel__data .graph .value {
  width: 79%;
  height: 79%;
  background: url(../img/member/member07-graph.svg) left top/76% 100% no-repeat;
}
.member-member-panel--08 .member-member-panel__data {
  background-image: url(../img/member/member08-label.png);
}
.member-member-panel--08 .member-member-panel__data .speed {
  width: 61.8%;
}
.member-member-panel--08 .member-member-panel__data .power {
  width: 70%;
}
.member-member-panel--08 .member-member-panel__data .brains {
  width: 3.8%;
}
.member-member-panel--08 .member-member-panel__data .graph .value {
  width: 108%;
  height: 215%;
  background: url(../img/member/member08-graph.svg) right top/68% 68.5% no-repeat;
}
.member-member-panel--09 .member-member-panel__data {
  background-image: url(../img/member/member09-label.png);
}
.member-member-panel--09 .member-member-panel__data .speed,
.member-member-panel--09 .member-member-panel__data .power,
.member-member-panel--09 .member-member-panel__data .brains {
  left: 26.5%;
}
.member-member-panel--09 .member-member-panel__data .speed {
  width: 47.8%;
}
.member-member-panel--09 .member-member-panel__data .power {
  width: 59.5%;
}
.member-member-panel--09 .member-member-panel__data .brains {
  width: 21.8%;
}
.member-member-panel--09 .member-member-panel__data .graph .value {
  width: 79%;
  height: 79%;
  background: url(../img/member/member09-graph.svg) left top/94.5% 93.5% no-repeat;
}
.member-member-panel--10 .member-member-panel__data {
  background-image: url(../img/member/member10-label.png);
}
.member-member-panel--10 .member-member-panel__data .speed,
.member-member-panel--10 .member-member-panel__data .power,
.member-member-panel--10 .member-member-panel__data .brains {
  left: 26.5%;
}
.member-member-panel--10 .member-member-panel__data .speed {
  width: 66.4%;
}
.member-member-panel--10 .member-member-panel__data .power {
  width: 66.4%;
}
.member-member-panel--10 .member-member-panel__data .brains {
  width: 66.4%;
}
.member-member-panel--10 .member-member-panel__data .graph .value {
  width: 99%;
  height: 99%;
  background: url(../img/member/member10-graph.svg) left top/100% 90% no-repeat;
}
.member-member-panel--11 .member-member-panel__data {
  background-image: url(../img/member/member11-label.png);
}
.member-member-panel--11 .member-member-panel__data .speed,
.member-member-panel--11 .member-member-panel__data .power,
.member-member-panel--11 .member-member-panel__data .brains {
  left: 26.5%;
}
.member-member-panel--11 .member-member-panel__data .speed {
  width: 66.4%;
}
.member-member-panel--11 .member-member-panel__data .power {
  width: 66.4%;
}
.member-member-panel--11 .member-member-panel__data .brains {
  width: 66.4%;
}
.member-member-panel--11 .member-member-panel__data .graph .value {
  width: 99%;
  height: 116%;
  background: url(../img/member/member11-graph.svg) right bottom/85% 92% no-repeat;
}
.member-member-panel--12 .member-member-panel__data {
  background-image: url(../img/member/member12-label.png);
}
.member-member-panel--12 .member-member-panel__data .speed,
.member-member-panel--12 .member-member-panel__data .power,
.member-member-panel--12 .member-member-panel__data .brains {
  display: none;
}
.member-member-panel--12 .member-member-panel__data .graph .value {
  display: none;
}
.member-member-panel__txt {
  position: absolute;
  top: 8.4%;
  left: 7.3%;
  width: 75%;
  color: #fff;
  text-shadow: 0 0 6px rgba(0, 0, 0, 0.4);
}
.member-member-panel__catch {
  font-size: 21px;
  font-weight: 700;
  letter-spacing: 0;
}
.member-member-panel__name {
  font-size: 45px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.4;
}
.member-member-panel__desc {
  max-width: 42%;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 2;
  margin-top: 12px;
}
.member-member-panel__background {
  position: absolute;
  top: 39.2%;
  right: 5%;
  width: 340px;
  color: #fff;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 2;
  text-shadow: 0 0 6px rgba(0, 0, 0, 0.4);
}
@media screen and (max-width: 1199px) {
  .member-member-panel__catch {
    font-size: 1.75vw;
  }
  .member-member-panel__name {
    font-size: 3.75vw;
  }
  .member-member-panel__desc {
    font-size: 1.5vw;
  }
  .member-member-panel__background {
    font-size: 1.5vw;
  }
}
@media screen and (max-width: 750px) {
  .member-member-panel {
    height: auto;
    background-position: 10px 24px;
    background-size: 195px 178px;
  }
  .member-member-panel__pic {
    height: 280px;
    padding-bottom: 0;
  }
  .member-member-panel--01 .member-member-panel__pic img {
    width: 232px;
    margin-left: -27.7%;
  }
  .member-member-panel--02 .member-member-panel__pic img {
    width: 280px;
    margin-left: -36%;
  }
  .member-member-panel--03 .member-member-panel__pic img {
    width: 298px;
    margin-left: -41%;
  }
  .member-member-panel--04 .member-member-panel__pic img {
    width: 298px;
    margin-left: -23%;
  }
  .member-member-panel--05 .member-member-panel__pic img {
    width: 335px;
    margin-left: -49%;
  }
  .member-member-panel--06 .member-member-panel__pic img {
    width: 288px;
    margin-left: -27%;
  }
  .member-member-panel--07 .member-member-panel__pic img {
    width: 258px;
    margin-left: -35%;
  }
  .member-member-panel--08 .member-member-panel__pic img {
    width: 486px;
    margin-left: -32%;
  }
  .member-member-panel--09 .member-member-panel__pic img {
    width: 285px;
    margin-left: -36%;
  }
  .member-member-panel--10 .member-member-panel__pic img {
    width: 255px;
    margin-left: -37%;
  }
  .member-member-panel--11 .member-member-panel__pic img {
    width: 255px;
    margin-left: -39%;
  }
  .member-member-panel--12 .member-member-panel__pic img {
    width: 301px;
    margin-left: -3%;
    padding-bottom: 10px;
  }
  .member-member-panel__data {
    position: relative;
    height: 360px;
    background-position: left 40% bottom;
  }
  .member-member-panel__data .speed,
  .member-member-panel__data .power,
  .member-member-panel__data .brains {
    left: 42%;
  }
  .member-member-panel__data .speed {
    bottom: 28px;
  }
  .member-member-panel__data .power {
    bottom: 18px;
  }
  .member-member-panel__data .brains {
    bottom: 8px;
  }
  .member-member-panel__data .graph {
    top: 49px;
    right: 8.6%;
    width: 39.3%;
    padding-top: 33.7%;
  }
  .member-member-panel__data .graph span {
    font-size: 10px;
    transform-origin: left;
    transform: scale(0.8);
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
  }
  .member-member-panel__data .graph span.param6 {
    transform-origin: right;
  }
  .member-member-panel--01 .member-member-panel__data {
    background-image: url(../img/member/member01-label_sp.png);
  }
  .member-member-panel--01 .member-member-panel__data .speed {
    width: 63%;
  }
  .member-member-panel--01 .member-member-panel__data .power {
    width: 26%;
  }
  .member-member-panel--01 .member-member-panel__data .brains {
    width: 44.5%;
  }
  .member-member-panel--02 .member-member-panel__data {
    background-image: url(../img/member/member02-label_sp.png);
  }
  .member-member-panel--02 .member-member-panel__data .speed,
  .member-member-panel--02 .member-member-panel__data .power,
  .member-member-panel--02 .member-member-panel__data .brains {
    left: 46.5%;
  }
  .member-member-panel--02 .member-member-panel__data .speed {
    width: 12.8%;
  }
  .member-member-panel--02 .member-member-panel__data .power {
    width: 48.8%;
  }
  .member-member-panel--02 .member-member-panel__data .brains {
    width: 40.5%;
  }
  .member-member-panel--03 .member-member-panel__data {
    background-image: url(../img/member/member03-label_sp.png);
  }
  .member-member-panel--03 .member-member-panel__data .speed,
  .member-member-panel--03 .member-member-panel__data .power,
  .member-member-panel--03 .member-member-panel__data .brains {
    left: 46.5%;
  }
  .member-member-panel--03 .member-member-panel__data .speed {
    width: 33.2%;
  }
  .member-member-panel--03 .member-member-panel__data .power {
    width: 50.3%;
  }
  .member-member-panel--03 .member-member-panel__data .brains {
    width: 42%;
  }
  .member-member-panel--04 .member-member-panel__data {
    background-image: url(../img/member/member04-label_sp.png);
  }
  .member-member-panel--04 .member-member-panel__data .speed,
  .member-member-panel--04 .member-member-panel__data .power,
  .member-member-panel--04 .member-member-panel__data .brains {
    left: 46.5%;
  }
  .member-member-panel--04 .member-member-panel__data .speed {
    width: 44.5%;
  }
  .member-member-panel--04 .member-member-panel__data .power {
    width: 50%;
  }
  .member-member-panel--04 .member-member-panel__data .brains {
    width: 12.5%;
  }
  .member-member-panel--05 .member-member-panel__data {
    background-image: url(../img/member/member05-label_sp.png);
  }
  .member-member-panel--05 .member-member-panel__data .speed,
  .member-member-panel--05 .member-member-panel__data .power,
  .member-member-panel--05 .member-member-panel__data .brains {
    left: 46.5%;
  }
  .member-member-panel--05 .member-member-panel__data .speed {
    width: 38%;
  }
  .member-member-panel--05 .member-member-panel__data .power {
    width: 49%;
  }
  .member-member-panel--05 .member-member-panel__data .brains {
    width: 34%;
  }
  .member-member-panel--06 .member-member-panel__data {
    background-image: url(../img/member/member06-label_sp.png);
  }
  .member-member-panel--06 .member-member-panel__data .speed,
  .member-member-panel--06 .member-member-panel__data .power,
  .member-member-panel--06 .member-member-panel__data .brains {
    left: 47%;
  }
  .member-member-panel--06 .member-member-panel__data .speed {
    width: 32%;
  }
  .member-member-panel--06 .member-member-panel__data .power {
    width: 50%;
  }
  .member-member-panel--06 .member-member-panel__data .brains {
    width: 41.8%;
  }
  .member-member-panel--07 .member-member-panel__data {
    background-image: url(../img/member/member07-label_sp.png);
  }
  .member-member-panel--07 .member-member-panel__data .speed,
  .member-member-panel--07 .member-member-panel__data .power,
  .member-member-panel--07 .member-member-panel__data .brains {
    left: 46.5%;
  }
  .member-member-panel--07 .member-member-panel__data .speed {
    width: 49%;
  }
  .member-member-panel--07 .member-member-panel__data .power {
    width: 43%;
  }
  .member-member-panel--07 .member-member-panel__data .brains {
    width: 25%;
  }
  .member-member-panel--08 .member-member-panel__data {
    background-image: url(../img/member/member08-label_sp.png);
  }
  .member-member-panel--08 .member-member-panel__data .speed,
  .member-member-panel--08 .member-member-panel__data .power,
  .member-member-panel--08 .member-member-panel__data .brains {
    left: 46.5%;
  }
  .member-member-panel--08 .member-member-panel__data .speed {
    width: 45.8%;
  }
  .member-member-panel--08 .member-member-panel__data .power {
    width: 52%;
  }
  .member-member-panel--08 .member-member-panel__data .brains {
    width: 3.5%;
  }
  .member-member-panel--09 .member-member-panel__data {
    background-image: url(../img/member/member09-label_sp.png);
  }
  .member-member-panel--09 .member-member-panel__data .speed,
  .member-member-panel--09 .member-member-panel__data .power,
  .member-member-panel--09 .member-member-panel__data .brains {
    left: 46.5%;
  }
  .member-member-panel--09 .member-member-panel__data .speed {
    width: 35.8%;
  }
  .member-member-panel--09 .member-member-panel__data .power {
    width: 44.5%;
  }
  .member-member-panel--09 .member-member-panel__data .brains {
    width: 17%;
  }
  .member-member-panel--10 .member-member-panel__data {
    background-image: url(../img/member/member10-label_sp.png);
  }
  .member-member-panel--10 .member-member-panel__data .speed,
  .member-member-panel--10 .member-member-panel__data .power,
  .member-member-panel--10 .member-member-panel__data .brains {
    left: 46.5%;
  }
  .member-member-panel--10 .member-member-panel__data .speed {
    width: 49%;
  }
  .member-member-panel--10 .member-member-panel__data .power {
    width: 49%;
  }
  .member-member-panel--10 .member-member-panel__data .brains {
    width: 49%;
  }
  .member-member-panel--11 .member-member-panel__data {
    background-image: url(../img/member/member11-label_sp.png);
  }
  .member-member-panel--11 .member-member-panel__data .speed,
  .member-member-panel--11 .member-member-panel__data .power,
  .member-member-panel--11 .member-member-panel__data .brains {
    left: 46.5%;
  }
  .member-member-panel--11 .member-member-panel__data .speed {
    width: 49%;
  }
  .member-member-panel--11 .member-member-panel__data .power {
    width: 49%;
  }
  .member-member-panel--11 .member-member-panel__data .brains {
    width: 49%;
  }
  .member-member-panel--12 .member-member-panel__data {
    background-image: url(../img/member/member12-label_sp.png);
  }
  .member-member-panel__txt {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    margin-top: 11px;
    padding: 0 17.5px;
    text-shadow: none;
  }
  .member-member-panel__catch {
    font-size: 14px;
  }
  .member-member-panel__name {
    font-size: 25px;
    font-weight: 700;
    line-height: 1.2;
  }
  .member-member-panel__desc {
    max-width: none;
    font-size: 12px;
    margin-top: 10px;
  }
  .member-member-panel__background {
    top: 188px;
    right: 4%;
    width: 300px;
    font-size: 10px;
    font-weight: 700;
    text-align: right;
  }
}

.member-member-nav {
  position: absolute;
  left: 9%;
  right: 9%;
  bottom: 7.3%;
  height: 29.8%;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 4% 1.5%;
  z-index: 1;
}
.member-member-nav__item {
  position: relative;
  background: #000;
  border: solid 5px #79BC28;
  border-radius: 2px;
  margin: 0;
  padding: 0;
  transform-origin: center;
  transform: skew(-14deg);
  cursor: pointer;
}
.member-member-nav__item::before {
  content: "";
  position: absolute;
  top: -3.5px;
  left: -3.5px;
  width: calc(100% + 3px);
  height: calc(100% + 3px);
  border: solid 2px #CEE190;
  border-radius: 2px;
}
.member-member-nav__item::after {
  content: "";
  position: absolute;
  bottom: -3.5px;
  left: -3.5px;
  width: 0;
  height: 2px;
  margin: auto;
  background: #fa7f05;
  transition: 0.3s;
}
.member-member-nav__item:hover::after {
  width: calc(100% + 3px);
}
.member-member-nav__item-img {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.member-member-nav__item-img img {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -100%;
  right: -100%;
  display: block;
  width: 126%;
  max-width: none;
  height: 100%;
  margin: auto;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  opacity: 0.53;
  transform: skew(14deg);
  transition: 0.3s;
}
.member-member-nav__item:hover .member-member-nav__item-img img {
  opacity: 1;
  transform: skew(14deg) scale(1.1);
}
.member-member-nav__item-name {
  position: absolute;
  bottom: 4%;
  left: 0;
  display: block;
  width: 100%;
  height: 10.5%;
  transform: skew(14deg);
}
.member-member-nav__item-name img {
  display: block;
  width: auto;
  height: 100%;
  margin: 0 auto;
}
.member-member-nav__item:nth-child(12) .member-member-nav__item-name {
  bottom: 40%;
  height: 15.5%;
}
@media screen and (max-width: 750px) {
  .member-member-nav {
    left: 0;
    right: 0;
    bottom: 36px;
    width: 286px;
    height: 222px;
    margin: auto;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(3, 1fr);
    gap: 8px 6px;
  }
  .member-member-nav__item {
    border: solid 3px #79BC28;
  }
  .member-member-nav__item::before {
    top: -2px;
    left: -2px;
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    border: solid 1px #CEE190;
  }
  .member-member-nav__item::after {
    content: "";
    position: absolute;
    bottom: -3.5px;
    left: -3.5px;
    width: 0;
    height: 2px;
    margin: auto;
    background: #fa7f05;
    transition: 0.3s;
  }
  .member-member-nav__item:hover::after {
    width: calc(100% + 3px);
  }
  .member-member-nav__item-name {
    bottom: 5px;
  }
}

.member-manpower {
  padding: 153px 0 157px;
  overflow: hidden;
}
.member-manpower .c-inner {
  position: relative;
}
.member-manpower__ttl-wrap {
  position: relative;
  display: flex;
  align-items: flex-end;
  height: 357px;
}
.member-manpower__ttl-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  transform: skewY(-6.4deg);
}
.member-manpower__ttl-bg::before, .member-manpower__ttl-bg::after {
  content: "";
  position: absolute;
  left: 0;
  display: block;
  width: 100%;
  height: 8px;
  background: rgba(0, 0, 0, 0.5);
}
.member-manpower__ttl-bg::before {
  top: -16px;
}
.member-manpower__ttl-bg::after {
  bottom: -16px;
}
.member-manpower__ttl {
  position: relative;
  max-width: 630px;
  padding: 0 0 0 6%;
}
.member-manpower__ttl-logo {
  position: absolute;
  left: 7.7%;
  top: -192px;
  width: 131px;
  height: 114px;
  background: url(../img/member/manpower-logo.svg) center/contain no-repeat;
}
.member-manpower__body-wrap {
  padding-top: 80px;
  position: relative;
}
.member-manpower__bg {
  position: absolute;
  left: 0;
  top: -245px;
  width: 100%;
  height: 600px;
  background: url(../img/member/manpower-bg.png) center/100% 100% no-repeat;
  mix-blend-mode: overlay;
}
.member-manpower__bg-logo {
  position: absolute;
  left: calc(50% - 141px);
  top: -393px;
  width: 810px;
  height: 704px;
  background: url(../img/member/manpower-bg_logo.png) center/contain no-repeat;
  mix-blend-mode: overlay;
}
.member-manpower__pic {
  position: absolute;
  left: calc(50% - 230px);
  bottom: -57px;
  width: 871px;
  height: 832px;
  background: url(../img/member/manpower-pic.png) center/contain no-repeat;
}
.member-manpower__catch {
  position: relative;
  color: #fff;
  font-size: 35px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.6;
  margin-bottom: 28px;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
  padding: 0 0 0 6%;
}
.member-manpower__catch .marker {
  display: inline-block;
  background: #EBFF00;
  color: #000;
  font-size: 45px;
  line-height: 1.2;
  margin-right: 3px;
  padding: 3px 9px 5px;
  text-shadow: none;
}
.member-manpower__desc {
  position: relative;
  max-width: 600px;
  color: #fff;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 2;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
  padding: 0 0 0 6%;
}
@media screen and (max-width: 1200px) {
  .member-manpower__pic {
    left: calc(50% - 153px);
    width: 580px;
    height: 554px;
  }
}
@media screen and (max-width: 750px) {
  .member-manpower {
    padding: 73px 0 52px;
  }
  .member-manpower__ttl-wrap {
    height: 140px;
    align-items: center;
    padding-top: 5px;
  }
  .member-manpower__ttl-bg::before, .member-manpower__ttl-bg::after {
    height: 4px;
  }
  .member-manpower__ttl-bg::before {
    top: -7px;
  }
  .member-manpower__ttl-bg::after {
    bottom: -7px;
  }
  .member-manpower__ttl {
    max-width: 210px;
    padding-left: 4%;
    z-index: 1;
  }
  .member-manpower__ttl img {
    width: 194px;
  }
  .member-manpower__ttl-logo {
    left: 8.7%;
    top: -58px;
    width: 40px;
    height: 35px;
  }
  .member-manpower__body-wrap {
    padding-top: 178px;
  }
  .member-manpower__bg {
    top: -47px;
    width: 100%;
    height: 132px;
    background: url(../img/member/manpower-bg_sp.png) center/100% 100% no-repeat;
  }
  .member-manpower__bg-logo {
    left: calc(50% - 39px);
    top: -203px;
    width: 234px;
    height: 203px;
  }
  .member-manpower__pic {
    bottom: auto;
    top: -156px;
    left: calc(50% - 172px);
    width: 345px;
    height: 321px;
    background-image: url(../img/member/manpower-pic_sp.png);
  }
  .member-manpower__catch {
    font-size: 23px;
    margin-bottom: 22px;
    padding: 0;
    white-space: nowrap;
  }
  .member-manpower__catch .marker {
    font-size: 25px;
    padding: 2px 3px 4px;
  }
  .member-manpower__desc {
    max-width: none;
    font-size: 14px;
    line-height: 2;
    padding: 0;
  }
}

.member-gallery {
  position: relative;
  background: #AFA568;
  overflow: hidden;
  padding: 35px 0;
}
.member-gallery::before, .member-gallery::after {
  content: "";
  position: absolute;
  display: block;
  width: 211px;
  height: 193px;
  background: url(../img/member/square-deco.png) center/contain no-repeat;
}
.member-gallery::before {
  bottom: 63px;
  left: 7.5%;
}
.member-gallery::after {
  top: 84px;
  right: 2%;
}
.member-gallery__ttl {
  text-align: center;
  margin-bottom: 20px;
}
.member-gallery__slider {
  position: relative;
  width: 100%;
  height: 600px;
  overflow: hidden;
}
.member-gallery .swiper {
  position: absolute;
  top: 0;
  left: -100%;
  right: -100%;
  width: 1800px;
  height: 542px;
  margin: auto;
  overflow: visible;
}
.member-gallery .swiper::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 767px;
  height: 542px;
  margin: auto;
  background: url(../img/member/slide-frame.png) center/contain no-repeat;
  pointer-events: none;
  z-index: 2;
}
.member-gallery .swiper-wrapper {
  align-items: center;
}
.member-gallery .swiper-slide {
  position: relative;
  height: auto;
}
.member-gallery .swiper-slide img {
  opacity: 0;
  transform: scale(0.82);
  transform-origin: center;
  transition: 0.4s ease-out;
}
.member-gallery .swiper-slide-visible {
  z-index: 1;
}
.member-gallery .swiper-slide-visible img {
  opacity: 0.35;
  transform: scale(0.82);
}
.member-gallery .swiper-slide-next,
.member-gallery .swiper-slide-prev {
  z-index: 2;
}
.member-gallery .swiper-slide-next img,
.member-gallery .swiper-slide-prev img {
  opacity: 0.7;
}
.member-gallery .swiper-slide-next img {
  transform: scale(1.4) translateX(72px);
}
.member-gallery .swiper-slide-prev img {
  transform: scale(1.4) translateX(-72px);
}
.member-gallery .swiper-slide-active {
  z-index: 3;
}
.member-gallery .swiper-slide-active img {
  opacity: 1;
  transform: scale(1.94);
}
.member-gallery .swiper-horizontal > .swiper-pagination-bullets, .member-gallery .swiper-pagination-bullets.swiper-pagination-horizontal {
  bottom: -60px;
}
.member-gallery .swiper-pagination-bullet {
  width: 15px;
  height: 15px;
  background: #fff;
  opacity: 0.5;
}
.member-gallery .swiper-pagination-bullet.swiper-pagination-bullet-active {
  opacity: 1;
}
.member-gallery .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .member-gallery .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 13.5px;
}
.member-gallery .swiper-button-prev,
.member-gallery .swiper-button-next {
  display: none;
}
@media screen and (max-width: 750px) {
  .member-gallery {
    padding: 17px 0 23px;
  }
  .member-gallery::before, .member-gallery::after {
    width: 75px;
    height: 69px;
  }
  .member-gallery::before {
    bottom: 20px;
    left: -14%;
  }
  .member-gallery::after {
    top: 30px;
    right: -5%;
  }
  .member-gallery__ttl {
    margin-bottom: 14px;
  }
  .member-gallery__slider {
    height: 202px;
  }
  .member-gallery .swiper {
    height: 202px;
    width: 476px;
  }
  .member-gallery .swiper::before {
    width: 285px;
    height: 100%;
    background-image: url(../img/member/slide-frame_sp.png);
  }
  .member-gallery .swiper-slide-next img {
    transform: scale(1.07);
  }
  .member-gallery .swiper-slide-prev img {
    transform: scale(1.07);
  }
  .member-gallery .swiper-slide-active img {
    opacity: 1;
    transform: scale(1.64);
  }
  .member-gallery .swiper-pagination {
    display: none;
  }
  .member-gallery .swiper-button-prev,
  .member-gallery .swiper-button-next {
    top: 52%;
    display: block;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #BABABA url(../img/member/slider-arrow.svg) right 60% center no-repeat;
  }
  .member-gallery .swiper-button-prev::after,
  .member-gallery .swiper-button-next::after {
    content: none;
  }
  .member-gallery .swiper-button-prev {
    left: calc(50% - 167.5px);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.8);
  }
  .member-gallery .swiper-button-next {
    right: calc(50% - 167.5px);
    box-shadow: 0 -3px 6px rgba(0, 0, 0, 0.8);
    transform: rotate(180deg);
  }
}
