html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

body {
  line-height: 1;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 6.25rem;
  font-size: 16px;
}

*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  line-height: 1.5;
  font-family: "Noto Serif", "Noto Serif JP", serif;
  font-weight: 400;
  color: #fff;
  background-color: #000;
  background-repeat: repeat;
  position: relative;
}

a {
  color: inherit;
  text-decoration: none;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

li {
  list-style: none;
}

img {
  max-width: 100%;
  width: 100%;
  height: auto;
  display: block;
}

input,
textarea {
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  outline: none;
  border: none;
  border-radius: 0;
  resize: none;
}

button {
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  background-color: rgba(0, 0, 0, 0);
  border: none;
  cursor: pointer;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

*:focus {
  outline: none;
}

details summary {
  list-style: none;
  cursor: pointer;
}

details summary::-webkit-details-marker {
  display: none;
}

figure {
  margin: 0;
}

picture {
  display: block;
  height: 100%;
}

.l-main {
  overflow: hidden;
}

.l-main__container {
  position: relative;
  z-index: 1;
}

.l-header {
  height: 5rem;
  width: 100%;
  background-color: #0a0a0a;
  position: fixed;
  z-index: 1000;
  top: 0;
}

.l-header__inner {
  height: inherit;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: space-between;
  /* max-width: 30rem; */
  width: 100%;
  padding-inline: 6px;
  margin-inline: auto;
}

.l-header__gnav-items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  margin-top: 6.25rem;
  -webkit-box-ordinal-group: 4;
  -ms-flex-order: 3;
  order: 3;
  gap: 20px;
  width: 11.875rem;
}

.l-header__gnav-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.l-header__logo {
  margin-right: 12px;
}

.l-header__logo img {
  aspect-ratio: 200/52;
}

.l-header__items {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  /* order: 2; */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* gap: 1.25rem; */
  margin-top: 2.5rem;
}

.l-header__items.sns {
  margin-top: 10rem;
}

.l-header__item {
  width: 3.125rem;
  height: auto;
}

.l-header__item-link img {
  /* aspect-ratio: 1/1; */
}

body.is-fixed {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.l-header__nav {
  background-color: #e7141a;
  height: 100dvh;
  width: 75vw;
  position: absolute;
  top: 0;
  right: 0;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.l-header__menu-btn {
  width: 50px;
  height: 50px;
  position: fixed;
  z-index: 1001;
  /* top: 100px; */
  right: 15px;
  /* background-color: #e7141a; */
  background-color: #000;
  box-shadow: 0px 5px 15px 0px rgb(181 181 181 / 35%);
}

.l-header__menu-btn-bar {
  display: block;
  width: 2.25rem;
  height: 0.1875rem;
  margin-inline: auto;
  background-color: #fff;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}

.l-header__menu-btn-bar:nth-of-type(2) {
  margin-block: 6px;
  -webkit-transform-origin: right;
  transform-origin: right;
}

.l-header.is-open .l-header__menu-btn-bar:nth-of-type(1) {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.l-header.is-open .l-header__menu-btn-bar:nth-of-type(2) {
  -webkit-transform: translateX(-100%) scaleX(0);
  transform: translateX(-100%) scaleX(0);
  margin-block: -0.1875rem;
}

.l-header.is-open .l-header__menu-btn-bar:nth-of-type(3) {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.l-header.is-open .l-header__nav {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  z-index: 1000;
}

.l-header__switcher {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  /* order: 1; */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  /* gap: 1.0625rem; */
  font-family: "Cormorant", "Noto Serif", "Noto Serif JP", serif;
  /* font-weight: 700; */
  letter-spacing: 0.05em;
  margin: 3.25rem 0;
  margin-bottom: 2.25rem;
  width: 11.875rem;
}

.bogo-language-switcher {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.bogo-language-switcher .current {
  color: #0a0a0a;
}

.bogo-language-switcher li:not(:last-of-type)::before {
  content: "/";
  margin-inline: 0.375rem;
  color: #fff;
}

.bogo-language-switcher .ja {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
}

.bogo-language-switcher .en {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
}

.l-footer {
  width: 100%;
  background-color: #000;
  position: relative;
  z-index: 10;
}

.l-footer__inner {
  max-width: 30rem;
  width: 100%;
  padding-inline: 16px;
  padding-block: 2.5rem 3.125rem;
  margin-inline: auto;
  text-align: center;
}

.l-footer__logo {
  width: 12.5rem;
  height: auto;
  margin-inline: auto;
}

.l-footer__logo img {
  aspect-ratio: 200/52;
}

.l-footer__items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 1.5rem;
  margin-top: 4rem;
}

.l-footer__item {
  color: #676767;
}

.l-footer__copy {
  margin-top: 5rem;
  font-family: "Cormorant", "Noto Serif", "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 0.75rem;
  line-height: 1.6;
  color: #676767;
}

.c-btn {
  display: block;
  font-family: "Cormorant", "Noto Serif", "Noto Serif JP", serif;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  background-color: #e7141a;
  padding: 1.25rem 2rem;
}

.c-section-inner {
  max-width: 30rem;
  width: 100%;
  height: auto;
  padding-top: 10rem;
  padding-inline: 16px;
  padding-bottom: 5rem;
  margin-inline: auto;
}

.p-home-story__inner.c-section-inner {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-block: 6.25rem;
}

.p-home-system__inner.c-section-inner {
  min-height: inherit;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  max-width: 20.625rem;
  padding-block: 6.25rem;
}

.p-home-roadmap__inner.c-section-inner {
  min-height: inherit;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-block: 6.25rem;
}

.c-section-container {
  margin-top: 5rem;
  height: 100%;
}

.p-home-system .c-section-container {
  margin-top: 2.5rem;
}

.p-home-news .c-section-container,
.p-home-sns-x .c-section-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  height: 29.375rem;
  max-width: 29.375rem;
  margin-inline: auto;
}

.c-row-section .c-section-inner {
  /* display: grid;
  grid-template-columns: 1fr;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  justify-items: center;
  gap: 6.25rem; */
  margin: 0 auto;
}

.c-section__border-square {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: -1;
  width: 100%;
  height: 100%;
}

.c-section__border-square-img {
  height: 100%;
}

.c-section__border-square-img img {
  height: 100%;
}

.c-section-title {
  text-align: center;
}

.c-section-title__en {
  font-family: "Cormorant", "Noto Serif", "Noto Serif JP", serif;
  text-transform: uppercase;
  font-weight: 400;
  font-size: 1.75rem;
  letter-spacing: 0.15em;
}

.c-section-title__en.is-small {
  font-size: 1.625rem;
}

.c-section-title__ja {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 1.25rem;
  font-weight: 400;
  font-size: 1rem;
  letter-spacing: 0.15em;
  line-height: 1;
  --scaleX: 0;
}

.c-section-title__ja::before {
  content: "";
  width: 4rem;
  height: 1px;
  background-color: #ccb01f;
  -webkit-transform: scaleX(var(--scaleX));
  transform: scaleX(var(--scaleX));
  -webkit-transform-origin: right;
  transform-origin: right;
}

.c-section-title__ja::after {
  content: "";
  width: 4rem;
  height: 1px;
  background-color: #ccb01f;
  -webkit-transform: scaleX(var(--scaleX));
  transform: scaleX(var(--scaleX));
  -webkit-transform-origin: left;
  transform-origin: left;
}

.c-bg-wrap {
  background-color: #000;
  position: relative;
  z-index: 0;
}

.c-section-bg {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url(../img/00_common/bg-sp.jpg);
}

.p-home-fv {
  overflow: hidden;
  margin-top: 0;
  height: 100dvh;
  position: relative;
}

.p-home-fv,
.p-home-fv__inner,
.p-home-fv__movie {
  width: 100%;
  aspect-ratio: 1440/800;
}

.p-home-fv__inner {
  position: fixed;
  z-index: -2;
}

.p-home-fv__movie {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  will-change: filter;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.p-home-fv__movie video {
  height: 100%;
  width: 100%;
}

.p-home-fv__img {
  position: relative;
  will-change: filter;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.p-home-fv__btn-list {
  left: 10vw;
  top: 80vh;
  transform: translate(-50%, -50%);
  position: fixed;
}

.p-home-fv__logo {
  display: block;
  position: absolute;
  top: 10rem;
  left: 50%;
  width: 80%;
  margin-inline: auto;
  opacity: 0;
  -webkit-transform: translate(-50%, -150%);
  transform: translate(-50%, -150%);
  -webkit-animation-name: FVfadeIn;
  animation-name: FVfadeIn;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease;
  animation-timing-function: ease;
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-direction: normal;
  animation-direction: normal;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@-webkit-keyframes FVfadeIn {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -100%);
    transform: translate(-50%, -100%);
  }

  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
  }
}

@keyframes FVfadeIn {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -100%);
    transform: translate(-50%, -100%);
  }

  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
  }
}

.u-sp_only {
  display: block;
}

.p-home-fv__btn {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  /* margin-top: -20rem; */
}

@media screen and (max-width: 960px) {
  .p-home-fv__btn {
    /* margin-top: -14rem; */
  }
}

.p-home-fv__btn p {
  text-align: center;
  font-size: 0.625rem;
}

.p-home-fv__btn a {
  /* margin-top: 0.625rem; */
  display: inline-block;
  /* background-color: #CCB01F; */
  background-color: #000;
  letter-spacing: 0.2em;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  border-radius: 8px;
  padding: 10px 24px;
  text-align: center;
  width: 100%;
}

.p-home-introduction {
  background-image: url(../img/01_home/introduction-bg.jpg);
  background-position: center top 40%;
  background-repeat: no-repeat;
  background-size: cover;
}

.p-home-introduction__inner {
  margin-top: 10dvh;
  padding-block: 10rem 7.5625rem;
}

.p-home-introduction__text {
  font-size: 1rem;
  text-align: center;
  line-height: 2;
}

.p-home-introduction__btn {
  margin-top: 5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1.25rem;
}

.p-home-introduction__btn .c-btn:nth-of-type(1) {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
}

.p-home-introduction__btn .c-btn:nth-of-type(2) {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
}

.p-home-about__logo {
  width: 80%;
  max-width: 12.5rem;
  margin-inline: auto;
}

.p-home-about__text {
  margin-top: 2.375rem;
  text-align: center;
  line-height: 2;
}

.p-home-story__wrap {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin: 0 auto;
  padding-block: 2.5rem;
}

.p-home-story__items {
  width: 100%;
  height: 100%;
  position: relative;
}

.p-home-story__item {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.p-home-story__item + .p-home-story__item {
  margin-top: 7.5rem;
}

.p-home-story__text {
  line-height: 2;
}

.p-home-story__text .is-red {
  color: #e7141a;
}

.p-home-story__text.is-en {
  font-size: 0.875rem;
  line-height: 1.8;
}

.p-home-story__vis {
  max-width: 32.25rem;
  width: 100%;
  position: relative;
  z-index: -1;
}

.p-home-concept__movie {
  width: 100%;
  max-width: 60rem;
  margin-inline: auto;
  aspect-ratio: 1440/800;
  position: relative;
}

.p-home-concept__movie {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.p-home-concept__movie lite-youtube,
.p-home-concept__movie iframe {
  height: 100%;
  width: 100%;
}

.p-home-adventurer__items {
  display: grid;
  gap: 0.625rem;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  justify-items: center;
  grid-template-columns: repeat(4, 1fr);
  margin-inline: auto;
  max-width: 15.875rem;
}

.p-home-adventurer__item {
  width: 100%;
  -webkit-perspective: 600px;
  perspective: 600px;
  will-change: transform;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-perspective-origin: left center;
  perspective-origin: left center;
}

.p-home-adventurer__img img {
  aspect-ratio: 56/100;
  -o-object-fit: cover;
  object-fit: cover;
}

.p-home-adventurer__text {
  margin-top: 2.5rem;
  max-width: 46rem;
  margin-inline: auto;
  font-size: 1rem;
  line-height: 2;
}

.p-home-adventurer__text.is-red {
  color: #e7141a;
}

.p-home-race-and-class__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 2.5rem;
}

.p-home-race-and-class__head {
  width: 100%;
}

.p-home-race-and-class__names {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  gap: 1.25rem;
  overflow: scroll;
  padding-inline: 1.25rem;
}

.p-home-race-and-class__names::-webkit-scrollbar {
  display: none;
}

.p-home-race-and-class__name {
  font-size: 1.25rem;
  line-height: 2;
  color: #676767;
  position: relative;
  -webkit-transition: color 0.3s ease;
  transition: color 0.3s ease;
}

.p-home-race-and-class__name.is-active {
  color: #fff;
}

.p-home-race-and-class__body {
  max-width: 18.75rem;
  width: 18.75rem;
  height: 18.75rem;
  background: -webkit-gradient(linear, left top, left bottom, from(#f0f0f0), to(#fff));
  background: linear-gradient(180deg, #f0f0f0, #fff);
}

.p-home-race-and-class__body-items {
  position: relative;
}

.p-home-race-and-class__body-item {
  position: absolute;
  left: 0;
  top: 0;
}

.p-home-race-and-class__img img {
  aspect-ratio: 1/1;
}

.p-home-race-and-class__text {
  margin-top: 5rem;
  line-height: 1.8;
  font-size: 1rem;
}

.p-home-system {
  min-height: 100dvh;
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
  margin-inline: auto;
}

.p-home-system__item {
  width: calc(100vw - 5rem);
  max-width: 20rem;
}

.p-home-system__item + .p-home-system__item {
  margin-top: 5rem;
}

.p-home-system__img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.p-home-system__img picture {
  width: 100%;
}

.p-home-system__img img {
  width: 100%;
  aspect-ratio: 16/9;
  -o-object-fit: cover;
  object-fit: cover;
  border: 0.25rem solid #fff;
}

.p-home-system__body {
  margin-top: 1rem;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  max-width: 100%;
}

.p-home-system__text {
  font-size: 0.9375rem;
  line-height: 1.6;
}

.p-home-system__text.is-en {
  font-size: 0.875rem;
  line-height: 1.5;
}

.p-home-eternity__inner {
  margin-top: 5.25rem;
  padding-block: 10rem 7.5625rem;
}

.p-home-eternity__text {
  text-align: center;
  font-size: 1rem;
  line-height: 2;
}

.p-home-eternity__text.is-bold {
  font-weight: 700;
}

.p-home-eternity__text .is-red {
  color: #e7141a;
}

.p-home-eternity__text + .p-home-eternity__text {
  margin-top: 0.5rem;
}

.p-home-eternity__btn {
  margin-top: 5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1.25rem;
}

.p-home-crystal {
  background-image: url(../img/01_home/crystal-bg-sp.jpg);
  background-position: center top 50%;
  background-repeat: no-repeat;
  background-size: cover;
}

.p-home-crystal__inner {
  margin-top: 11.25rem;
  padding-block: 10rem 7.5625rem;
}

.p-home-crystal__text {
  text-align: center;
  font-size: 1.25rem;
  line-height: 2;
}

.p-home-crystal__text.is-bold {
  font-weight: 700;
}

.p-home-crystal__text .is-red {
  color: #e7141a;
}

.p-home-crystal__text + .p-home-crystal__text {
  margin-top: 0.5rem;
}

.p-home-crystal__btn {
  margin-top: 5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1.25rem;
}

.p-home-news__container {
  margin-top: 100dvh;
  padding-top: 6%;
}

.p-home-news {
  width: 100%;
}

.p-home-news__inner {
  max-width: 100rem;
  width: 100%;
  height: auto;
  padding-inline: 16px;
  margin-inline: auto;
}

.p-home-news__wrap {
  padding: 0.3rem 0.7rem;
  height: inherit;
  /* display: -webkit-box;
  display: -ms-flexbox; */
  /* display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; */
  background-color: #1d1d1d;
  box-sizing: border-box;
}

.p-home-news__wrap h2 {
  font-size: 1.75rem;
  display: block;
  margin-bottom: 0.25rem;
}

.p-home-news__items {
  max-width: 100%;
  margin-inline: auto;
  height: calc(100% - 4.75rem);
  /* overflow-y: auto; */
}

.p-home-news__items::-webkit-scrollbar {
  height: 0;
  width: 0.3125rem;
}

.p-home-news__items::-webkit-scrollbar-track {
  background-color: rgba(0, 0, 0, 0);
}

.p-home-news__items::-webkit-scrollbar-thumb {
  background-color: #676767;
  border-radius: 0.3125rem;
}

/* .p-home-news__item {
  padding-right: 0.75rem;
} */

.p-home-news__item + .p-home-news__item {
  margin-top: 1rem;
}

.p-home-news__time {
  font-size: 0.875rem;
  display: block;
  line-height: 1;
  font-weight: 700;
}
.p-home-news-tag-day {
  display: flex;
  gap: 5px;
  align-items: center;
}

/* タグごとの背景色を設定 */
.p-home-news__tags span {
  padding: 0 1rem;
  margin-right: 0.5rem;
  font-size: 0.875rem;
}

.p-home-news__tags .tag-announcement,
.p-home-news__tags .tag-announcement_en {
  /* タグのスラッグ名が news の場合 */
  background-color: #c0302b;
}

.p-home-news__tags .tag-campaign_event,
.p-home-news__tags .tag-campaign_event_en {
  /* タグのスラッグ名が campaign_event の場合 */
  background-color: #ca6a51;
}

.p-home-news__tags .tag-update_maintenance,
.p-home-news__tags .tag-update_maintenance_en {
  /* タグのスラッグ名が update_maintenance の場合 */
  background-color: #baa53f;
}

.p-home-news__tags .tag-others,
.p-home-news__tags .tag-others_en {
  /* タグのスラッグ名がothersの場合 */
  background-color: #b9b6b6;
}
/* END tag color */

.p-home-news__thumbnail {
  object-fit: cover;
  border-radius: 15%;
  aspect-ratio: 503 / 283;
}

.p-home-news__body {
  /* font-family: "Open Sans", "Noto Sans JP", sans-serif; */
  font-size: 1rem;
  line-height: 1.8125;
}

.pagination {
  text-align: center;
}
.page-numbers.current {
  text-decoration: underline;
}
.page-numbers {
  font-size: 1.2rem;
  padding-right: 0.25rem;
}

.swiper-container {
  margin-left: auto;
  margin-right: auto;
  max-width: 695px;
  position: relative;
}
.swiper {
  max-width: 662px;
  margin: 0 auto 1rem auto;
}
.swiper-slide img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 503 / 283;
  border-radius: 15%;
  padding: 0 7px;
}
/* 前への矢印 */
.swiper-button-prev {
  left: -7px;
}
/* 次への矢印 */
.swiper-button-next {
  right: -30px;
}
.swiper-button-prev,
.swiper-button-next {
  height: 50px;
  width: 50px;
}
/* 矢印カスタマイズ */
.swiper-button-prev::after,
.swiper-button-next::after {
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  height: 50px;
  margin: auto;
  width: 50px;
}
/* 前への矢印カスタマイズ */
.swiper-button-prev::after {
  background-image: url(../img/00_common/news_prev.png);
}
/* 次への矢印カスタマイズ */
.swiper-button-next::after {
  background-image: url(../img/00_common/news_next.png);
}
/* 画像サイズ調整 */
.swiper-slide img {
  height: auto;
  width: 100%;
}

.p-home-sns-x {
  width: 100%;
}

.p-home-sns-x__inner {
  max-width: 30rem;
  width: 100%;
  height: auto;
  padding-inline: 16px;
  margin-inline: auto;
}

.p-home-sns-x__timeline {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 2rem;
  width: 100%;
  height: 100%;
}

.p-home-sns-x__timeline .twitter-timeline {
  width: 100% !important;
  height: 100%;
}

.p-home-sns-x__timeline .twitter-timeline iframe {
  width: 100% !important;
  height: 100% !important;
  margin-inline: auto;
}

.p-home-roadmap {
  min-height: 100dvh;
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
  margin-inline: auto;
}

.p-home-roadmap__item {
  width: 19.375rem;
  max-width: 19.375rem;
}

.p-home-roadmap__item + .p-home-roadmap__item {
  margin-top: 5rem;
}

.p-home-roadmap__img img {
  aspect-ratio: 310/142;
}

.p-home-roadmap__body {
  padding-left: 2rem;
}

.p-home-roadmap__heading {
  font-size: 1.5rem;
  line-height: 1;
}

.p-home-roadmap__text {
  line-height: 1.8;
  padding-left: 1em;
  position: relative;
}

.p-home-roadmap__text:first-of-type {
  margin-top: 0.8125rem;
}

.p-home-roadmap__text::before {
  content: "・";
  position: absolute;
  left: 0;
  top: 0;
  line-height: 1.8;
}

.p-home-follow {
  min-height: 100dvh;
}

.p-home-follow__text {
  line-height: 1.6;
  font-family: "Open Sans", "Noto Sans JP", sans-serif;
  font-weight: 400;
  text-align: center;
}

.p-home-follow__items {
  margin-top: 2.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 1.25rem;
}

.p-home-follow__item {
  width: 3.125rem;
  height: auto;
}

.p-home-follow__img img {
  aspect-ratio: 1/1;
}

.p-home-partner {
  min-height: 100dvh;
}

.p-home-partner__items {
  display: grid;
  justify-items: center;
  grid-template-columns: repeat(2, 1fr);
  gap: 2.5rem;
}

.p-home-partner__item {
  max-width: 12.5rem;
}

.p-home-partner__img img {
  aspect-ratio: 200/100;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}

.u-hidden-mobile {
  display: none !important;
}

.u-block-hidden-mobile {
  display: none !important;
}

.u-grid-hidden-mobile {
  display: none !important;
}

.u-flex-hidden-mobile {
  display: none !important;
}

.u-hidden-pc {
  display: inline-block !important;
}

.u-block-hidden-pc {
  display: block !important;
}

.u-grid-hidden-pc {
  display: grid !important;
}

.u-flex-hidden-pc {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
}

.u-hidden {
  visibility: hidden;
  display: none;
}

.u-visible {
  visibility: visible !important;
  opacity: 1 !important;
}

.u-bold {
  font-weight: 700 !important;
}

.u-pc_only {
  display: none;
}

#banner {
  position: fixed;
  bottom: -3.5px;
  left: 0;
  z-index: 100;
  width: 100%;
  transition: transform 0.3s ease-out;
}

#banner.hidden {
  transform: translateY(100%);
}

.u-xl-only {
  display: none;
}

@media screen and (min-width: 768px) {
  .l-header__items.sns {
    margin-top: 0;
  }

  .u-sp_only {
    display: none;
  }

  .u-pc_only {
    display: block;
  }

  html {
    font-size: 1.4814814815vw;
    scroll-padding-top: 7.5rem;
  }

  a[href^="tel:"] {
    pointer-events: none;
  }

  .l-header {
    height: 6.25rem;
  }

  .l-header__inner {
    /* max-width: 1130px; */
    padding-inline: 25px;
  }

  .l-header__gnav-items {
    -webkit-box-ordinal-group: unset;
    -ms-flex-order: unset;
    order: unset;
    margin-top: 0;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 2.5rem;
    width: auto;
  }

  .l-header__logo {
    /* width: 12.5rem; */
    margin-right: 0;
  }

  .l-header__items {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    /* order: 1; */
    margin-top: 0;
  }

  .l-header__nav {
    position: static;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    background-color: transparent;
    height: auto;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    gap: 2.3125rem;
  }

  .l-header__switcher {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    /* order: 2; */
    margin-top: 0;
    margin-bottom: 0;
    width: auto;
  }

  .bogo-language-switcher .current {
    color: #e7141a;
  }

  .l-footer__inner {
    max-width: 1130px;
    padding-inline: 25px;
  }

  .l-footer__items {
    gap: 3.625rem;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    margin-top: 2.5rem;
  }

  .c-section-inner {
    max-width: 1130px;
    padding-inline: 25px;
    padding-block: 10rem;
  }

  .p-home-story__inner.c-section-inner {
    padding-block: 7.5rem;
    max-width: 58rem;
  }

  .p-home-partner__inner.c-section-inner {
    max-width: 48.125rem;
  }

  .p-home-race-and-class__inner.c-section-inner {
    max-width: 47.5625rem;
  }

  .p-home-system__inner.c-section-inner {
    max-width: 48.125rem;
  }

  .p-home-roadmap__inner.c-section-inner {
    padding-block: 7.5rem;
  }

  .p-home-story__inner .c-section-container {
    margin-top: 0;
    max-height: 55vh;
  }

  .c-row-section .c-section-inner {
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
  }

  .c-section-title__en {
    font-size: 2rem;
    line-height: 1;
  }

  .c-section-title__en.is-small {
    font-size: 2rem;
  }

  .c-section-title__ja {
    font-size: 1.125rem;
    margin-top: 1.5rem;
    margin-top: 1.875rem;
    gap: 2.6875rem;
  }

  .c-section-title__ja::before {
    width: 5.875rem;
  }

  .c-section-title__ja::after {
    width: 5.875rem;
  }

  .c-section-bg {
    background-image: url(../img/00_common/bg.jpg);
  }

  .p-home-fv {
    margin-top: 6.25rem;
    height: auto;
  }

  .p-home-introduction__inner {
    padding-block: 8rem 6rem;
  }

  .p-home-fv__btn {
    /* margin-inline: auto 2.5rem; */
  }

  .p-home-fv__btn p {
    font-size: 1rem;
    text-align: center;
  }

  .p-home-fv__btn a {
    font-size: 12px;
    padding: 12px 16px;
  }

  .p-home-introduction__text {
    font-size: 1.25rem;
  }

  .p-home-introduction__btn {
    margin-top: 3.5rem;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 5rem;
  }

  .p-home-introduction__btn .c-btn:nth-of-type(1) {
    -webkit-box-ordinal-group: unset;
    -ms-flex-order: unset;
    order: unset;
  }

  .p-home-introduction__btn .c-btn:nth-of-type(2) {
    -webkit-box-ordinal-group: unset;
    -ms-flex-order: unset;
    order: unset;
  }

  .p-home-about__logo {
    max-width: 20.125rem;
  }

  .p-home-story {
    height: 100dvh;
    overflow-x: clip;
  }

  .p-home-story__wrap {
    padding-block: 5rem;
  }

  .p-home-story__item {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0;
    visibility: hidden;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }

  .p-home-story__text.is-en {
    line-height: 2;
    font-size: 1rem;
  }

  .p-home-story__text {
    max-width: 37.5rem;
    margin-inline: auto;
  }

  .p-home-adventurer__items {
    gap: 1.25rem;
    max-width: 100%;
  }

  .p-home-adventurer__img img {
    aspect-ratio: 240/100;
  }

  .p-home-adventurer__text {
    margin-top: 5rem;
  }

  .p-home-race-and-class__wrap {
    padding-inline: 3.5rem;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }

  .p-home-race-and-class__head {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }

  .p-home-race-and-class__names {
    margin-inline: unset;
    padding-inline: unset;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 0.5rem;
    overflow: unset;
  }

  .p-home-race-and-class__name {
    cursor: pointer;
  }

  .p-home-race-and-class__name::before {
    content: url(../img/00_common/pointer.svg);
    position: absolute;
    left: -0.5625rem;
    top: 50%;
    -webkit-transform: translate(-100%, -50%);
    transform: translate(-100%, -50%);
    width: 0.875rem;
    height: auto;
    aspect-ratio: 1/1;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
  }

  .p-home-race-and-class__name.is-active::before {
    visibility: visible;
    opacity: 1;
  }

  .p-home-system__items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }

  .p-home-system__item {
    width: 45rem;
    max-width: 45rem;
  }

  .p-home-system__item + .p-home-system__item {
    margin-top: 0;
    margin-left: 12.5rem;
  }

  .p-home-system__img {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 2.5rem;
  }

  .p-home-system__img picture {
    width: 40%;
  }

  .p-home-system__img img {
    aspect-ratio: 4/3;
  }

  .p-home-eternity__inner {
    padding-block: 8rem 6rem;
  }

  .p-home-eternity__text {
    font-size: 1.25rem;
  }

  .p-home-eternity__text + .p-home-eternity__text {
    margin-top: 1.875rem;
  }

  .p-home-eternity__btn {
    margin-top: 3.5rem;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 5rem;
  }

  .p-home-crystal {
    background-image: url(../img/01_home/crystal-bg.jpg);
  }

  .p-home-crystal__inner {
    padding-block: 11.25rem 11.25rem;
  }

  .p-home-crystal__text {
    font-size: 1.5rem;
  }

  .p-home-crystal__text + .p-home-crystal__text {
    margin-top: 1.875rem;
  }

  .p-home-crystal__btn {
    margin-top: 3.5rem;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 5rem;
  }

  .p-home-news__inner {
    max-width: 650px;
    padding-inline: 0;
  }

  .p-home-news__items {
    /* max-width: 25rem; */
    height: calc(100% - 6.25rem);
  }

  /* .p-home-news__item {
    padding-right: 1.25rem;
  } */

  .p-home-news__post {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1%;
  }

  .p-home-news__post-left {
    width: 85%;
  }

  .p-home-news__post-right {
    width: 30%;
  }

  .p-home-sns-x__inner {
    max-width: 1130px;
    padding-inline: 0;
  }

  .p-home-roadmap__items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }

  .p-home-roadmap__item + .p-home-roadmap__item {
    margin-top: 0;
    margin-left: 2.5rem;
  }

  .p-home-partner__items {
    grid-template-columns: repeat(3, 1fr);
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .p-home-partner__img img {
    aspect-ratio: 1/1;
  }

  .u-hidden-mobile {
    display: inline-block !important;
  }

  .u-block-hidden-mobile {
    display: block !important;
  }

  .u-grid-hidden-mobile {
    display: grid !important;
  }

  .u-flex-hidden-mobile {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }

  .u-hidden-pc {
    display: none !important;
  }

  .u-block-hidden-pc {
    display: none !important;
  }

  .u-grid-hidden-pc {
    display: none !important;
  }

  .u-flex-hidden-pc {
    display: none !important;
  }
}

@media screen and (min-width: 780px) {
  .p-home-story__item + .p-home-story__item {
    margin-top: 0;
  }

  .p-home-system__body {
    margin-top: 2rem;
  }
  .p-home-news__wrap {
    min-height: 484px;
  }
}

@media (min-width: 1024px) {
  .p-home-fv__btn a {
    /* padding: 12px 20px; */
    /* font-size: 14px; */
  }
}

@media (min-width: 1080px) {
  html {
    font-size: 16px;
  }

  .l-header__inner {
    justify-content: center;
  }
}

/* 767px以下の場合 */
@media screen and (max-width: 767px) {
  /* 表示したいスタイルを指定 */
  .u_xl-only {
    display: block;
  }

  .appstore {
    width: 100px;
  }

  .p-home-news__wrap h2 {
    margin-bottom: 1rem;
  }
  .p-home-news__post {
    margin-bottom: 2.2rem;
  }
}

/* 768pxから1439pxの間は非表示にする */
@media screen and (min-width: 768px) and (max-width: 1279px) {
  /* 非表示にしたいスタイルを指定 */
  .u_xl-only {
    display: none;
  }
}

/* 1440px以上の場合 */
@media screen and (min-width: 1440px) {
  /* 表示したいスタイルを指定 */
  .u_xl-only {
    display: block;
  }
}

.l-header__items.hum {
  margin: -24px 12px;
  gap: 0 4px;
}

@media (max-width: 425px) {
  .p-home-fv__btn a {
    font-size: 14px;
    /* padding: 8px 18px; */
  }

  .l-header__inner {
    /* gap: 12px; */
  }

  .appstore {
    width: 82px;
  }

  .btn-gamestart.sp-none {
    display: none;
  }
  .sp-flex {
    margin-right: -10px;
  }

  .swiper-button-prev {
    left: 3px;
  }
  .swiper-button-next {
    right: -24px;
  }
}

@media (max-width: 374px) {
  html {
    font-size: 4.2780748663vw;
  }
}

@media (hover: hover) {
  a:hover {
    text-decoration: none;
    opacity: 0.7;
    cursor: pointer;
  }

  button:hover {
    text-decoration: none;
    opacity: 0.7;
  }

  .p-home-partner__item:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  nav ul li.has-child:hover::before {
    transform: rotate(-45deg) translateY(-50%);
    transition: 0.3s;
  }

  .menu .has-child:hover::before {
    transform: rotate(-45deg) translateY(-50%);
    transition: 0.3s;
  }
}

/*# sourceMappingURL=style.css.map */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

.p-home-ino__table {
  font-family: "Open Sans", "Noto Sans JP", sans-serif;
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.6;
  margin: 0 auto;
}

.p-home-ino__table th:nth-of-type(1) {
  width: 50%;
}

.p-home-ino__table th,
.p-home-ino__table td {
  padding: 0.625rem;
  text-align: left;
  border: 1px solid #fff;
}

.p-home-ino__table th.is-bg-white {
  background-color: #fff;
  color: #0a0a0a;
  text-align: center;
}

.p-home-ino__table td .is-dot {
  padding-left: 1em;
  position: relative;
  display: block;
}

.p-home-ino__table td .is-dot::before {
  content: "・";
  position: absolute;
  left: 0;
  top: 0;
}

.p-home-ino__table td .is-asterisk {
  padding-left: 1em;
  position: relative;
  display: block;
}

.p-home-ino__table td .is-asterisk::before {
  content: "※";
  position: absolute;
  left: 0;
  top: 0.1em;
  font-size: 0.9em;
}

.p-home-ino__table td .is-asterisk.is-en {
  padding-left: 1em;
  position: relative;
  display: block;
}

.p-home-ino__table td .is-asterisk.is-en::before {
  content: "*";
  position: absolute;
  left: 0;
  top: 0.1em;
  font-size: 0.9em;
}

.p-home-ino__table {
  font-size: 1.25rem;
  line-height: 1.6;
}

.p-home-ino__table th:nth-of-type(1) {
  width: 15.625rem;
}

/*========= ナビゲーションドロップダウンのためのCSS ===============*/

/*下の階層のulや矢印の基点にするためliにrelativeを指定*/
nav ul li {
  position: relative;
}

.menu ul li {
  position: relative;
}

/*ナビゲーションのリンク設定*/
.download {
  padding: 14px 32px;
  background-color: #ccb01f;
  letter-spacing: 0.1em;
}

nav ul li li a {
  /* padding: 10px 35px; */
}

/*==矢印の設定*/

/*2階層目を持つliの矢印の設定*/
nav ul li.has-child::before {
  content: "";
  position: absolute;
  left: 20px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(-225deg) translateY(50%);
  transition: 0.3s;
}

/*3階層目を持つliの矢印の設定*/
nav ul ul li.has-child::before {
  content: "";
  position: absolute;
  left: 6px;
  top: 17px;
  width: 6px;
  height: 6px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
}

.menu .has-child::before {
  content: "";
  position: absolute;
  left: 6px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  transition: 0.3s;
}

/*== 2・3階層目の共通設定 */

/*下の階層を持っているulの指定*/
nav li.has-child ul {
  /*絶対配置で位置を指定*/
  position: absolute;
  left: 0;
  top: 46px;
  z-index: 4;
  /*形状を指定*/
  background: #ccb01f;
  width: 100%;
  /*はじめは非表示*/
  visibility: hidden;
  opacity: 0;
  /*アニメーション設定*/
  transition: all 0.3s;
}

.menu .has-child ul {
  /*絶対配置で位置を指定*/
  position: absolute;
  left: 0;
  top: 46px;
  z-index: 4;
  /*形状を指定*/
  background: #ccb01f;
  width: 100%;
  /*はじめは非表示*/
  visibility: hidden;
  opacity: 0;
  /*アニメーション設定*/
  transition: all 0.3s;
}

/*hoverしたら表示*/
nav li.has-child:hover > ul,
nav li.has-child ul li:hover > ul,
nav li.has-child:active > ul,
nav li.has-child ul li:active > ul {
  visibility: visible;
  opacity: 1;
}

/*ナビゲーションaタグの形状*/
nav li.has-child ul li a {
  color: #fff;
  /* border-bottom: solid 1px rgba(255, 255, 255, 0.6); */
}

nav li.has-child ul li:last-child > a {
  border-bottom: none;
}

nav li.has-child ul li a:hover,
nav li.has-child ul li a:active {
  /* background: #3577CA; */
}

/*==3階層目*/

/*3階層目の位置*/
nav li.has-child ul ul {
  top: 0;
  left: 182px;
  /* background: #66ADF5; */
}

nav li.has-child ul ul li a:hover,
nav li.has-child ul ul li a:active {
  /* background: #448ED3; */
}

.btn-googleplay,
.btn-appstore {
  width: 140px;
  margin: 0 auto;
  object-fit: contain;
}

.btn-gamestart {
  white-space: nowrap;
  width: 140px;
}

.btn-list {
  padding: 10px 0;
}

/* .has-child :hover {
  display: block;
} */

.menu .has-child.active > ul {
  visibility: visible;
  opacity: 1;
}

@media (hover: hover) {
  .menu .has-child:where(:any-link, :enabled, summary):hover > ul {
    visibility: visible;
    opacity: 1;
  }
}

.vertical-text {
  writing-mode: vertical-rl;
  text-orientation: upright;
  letter-spacing: 0.1em;
  /* white-space: nowrap; */
  overflow: auto;
  width: 80vw;
  /* 任意の幅 */
  height: 80vh;
  /* 任意の高さ */
  margin: 0 auto;
  color: #f1f1f4;
  font-family: YakuHanMP, "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif;
}

.logue-title {
  font-size: 24px;
  line-height: 2.2;
  font-weight: bold;
}

.logue {
  font-size: 18px;
  line-height: 2;
}

.logue-inner {
  padding-top: 9rem;
  padding-inline: 16px;
  padding-bottom: 5rem;
}

.en-logue {
  max-width: 1120px;
  margin: 0 auto;
}

/*==768px以下の形状*/

@media screen and (max-width: 767px) {
  nav {
    padding: 0;
  }

  nav ul {
    display: none;
  }

  nav li.has-child ul,
  nav li.has-child ul ul {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    visibility: visible;
    opacity: 1;
  }

  /*矢印の位置と向き*/

  nav ul li.has-child::before {
    left: 20px;
  }

  nav ul ul li.has-child::before {
    transform: rotate(135deg);
    left: 20px;
  }

  nav ul li.has-child.active::before {
    /* transform: rotate(-45deg); */
  }

  .menu {
    padding: 0;
    margin-right: 70px;
  }

  .menu .has-child::before {
    transform: rotate(135deg) translateY(50%);
    left: 20px;
  }

  .menu .has-child.active::before {
    transform: rotate(-45deg);
  }

  .menu .has-child > ul,
  .menu .has-child.active > ul {
    /* visibility: hidden;
    opacity: 0; */
  }

  .logue-title {
    font-size: 20px;
    line-height: 2;
    font-weight: bold;
  }

  .logue {
    font-size: 16px;
    line-height: 1.8;
  }
  .p-home-fv__btn-list {
    left: 50%;
    top: 93dvh;
    z-index: 999;
    width: 100%;
  }

  .sp-flex {
    display: flex;
    justify-content: center;
    gap: 3%;
    align-items: center;
    padding: 0 2%;
  }

  .btn-appstore,
  .btn-googleplay,
  .sp-none a {
    height: 55px;
    width: auto;
  }
  .p-home-news__wrap {
    min-height: 1100px;
  }
}

.sp-none a {
  display: flex;
  align-items: center;
  justify-content: center;
}

.sesame {
  text-emphasis: sesame #fff;
  -webkit-text-emphasis: sesame #fff;
}

.dot {
  text-emphasis: dot #fff;
  -webkit-text-emphasis: dot #fff;
}

.logue p {
  text-indent: 1em;
}