@charset "UTF-8";
/***
    The new CSS reset - version 1.11.2 (last updated 15.11.2023)
    GitHub page: https://github.com/elad2412/the-new-css-reset
***/
/*
    Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property
    - The "symbol *" part is to solve Firefox SVG sprite bug
    - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36)
 */
*:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) {
  all: unset;
  display: revert;
}

/* Preferred box-sizing value */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Fix mobile Safari increase font-size on landscape mode */
html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* Reapply the pointer cursor for anchor tags */
a, button {
  cursor: revert;
}

/* Remove list styles (bullets/numbers) */
ol, ul, menu, summary {
  list-style: none;
}

/* For images to not be able to exceed their container */
img {
  max-inline-size: 100%;
  max-block-size: 100%;
}

/* removes spacing between cells in tables */
table {
  border-collapse: collapse;
}

/* Safari - solving issue when using user-select:none on the <body> text input doesn't working */
input, textarea {
  -webkit-user-select: auto;
}

/* revert the 'white-space' property for textarea elements on Safari */
textarea {
  white-space: revert;
}

/* minimum style to allow to style meter element */
meter {
  -webkit-appearance: revert;
  appearance: revert;
}

/* preformatted text - use only for this feature */
:where(pre) {
  all: revert;
  box-sizing: border-box;
}

/* reset default text opacity of input placeholder */
::placeholder {
  color: unset;
}

/* fix the feature of 'hidden' attribute.
   display:revert; revert to element instead of attribute */
:where([hidden]) {
  display: none;
}

/* revert for bug in Chromium browsers
   - fix for the content editable attribute will work properly.
   - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/
:where([contenteditable]:not([contenteditable="false"])) {
  -moz-user-modify: read-write;
  -webkit-user-modify: read-write;
  overflow-wrap: break-word;
  -webkit-line-break: after-white-space;
  -webkit-user-select: auto;
}

/* apply back the draggable feature - exist only in Chromium and Safari */
:where([draggable="true"]) {
  -webkit-user-drag: element;
}

/* Revert Modal native behavior */
:where(dialog:modal) {
  all: revert;
  box-sizing: border-box;
}

/* Remove details summary webkit styles */
::-webkit-details-marker {
  display: none;
}

@-webkit-keyframes fadeInanime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes fadeInanime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeInanime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeOutanime {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}
@-moz-keyframes fadeOutanime {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}
@keyframes fadeOutanime {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}
@-webkit-keyframes fadeUpanime {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@-moz-keyframes fadeUpanime {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes fadeUpanime {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@-webkit-keyframes fadeDownanime {
  0% {
    opacity: 0;
    transform: translateY(0);
  }
  100% {
    opacity: 1;
    transform: translateY(-100px);
  }
}
@-moz-keyframes fadeDownanime {
  0% {
    opacity: 0;
    transform: translateY(0);
  }
  100% {
    opacity: 1;
    transform: translateY(-100px);
  }
}
@keyframes fadeDownanime {
  0% {
    opacity: 0;
    transform: translateY(0);
  }
  100% {
    opacity: 1;
    transform: translateY(-100px);
  }
}
@-webkit-keyframes fadeInscrollanime {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@-moz-keyframes fadeInscrollanime {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeInscrollanime {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@-webkit-keyframes topTitleanime {
  0% {
    -webkit-clip-path: inset(0 100% 0 0);
    clip-path: inset(0 100% 0 0);
  }
  100% {
    -webkit-clip-path: inset(0);
    clip-path: inset(0);
  }
}
@-moz-keyframes topTitleanime {
  0% {
    -webkit-clip-path: inset(0 100% 0 0);
    clip-path: inset(0 100% 0 0);
  }
  100% {
    -webkit-clip-path: inset(0);
    clip-path: inset(0);
  }
}
@keyframes topTitleanime {
  0% {
    -webkit-clip-path: inset(0 100% 0 0);
    clip-path: inset(0 100% 0 0);
  }
  100% {
    -webkit-clip-path: inset(0);
    clip-path: inset(0);
  }
}
@-webkit-keyframes topScaleanime {
  0% {
    opacity: 0;
    transform: scale(1.3);
  }
  100% {
    opacity: 100%;
    transform: scale(1);
  }
}
@-moz-keyframes topScaleanime {
  0% {
    opacity: 0;
    transform: scale(1.3);
  }
  100% {
    opacity: 100%;
    transform: scale(1);
  }
}
@keyframes topScaleanime {
  0% {
    opacity: 0;
    transform: scale(1.3);
  }
  100% {
    opacity: 100%;
    transform: scale(1);
  }
}
@-webkit-keyframes scrollarrow {
  0% {
    top: 10px;
  }
  50% {
    top: 26px;
  }
  100% {
    top: 10px;
  }
}
@-moz-keyframes scrollarrow {
  0% {
    top: 10px;
  }
  50% {
    top: 26px;
  }
  100% {
    top: 10px;
  }
}
@keyframes scrollarrow {
  0% {
    top: 10px;
  }
  50% {
    top: 26px;
  }
  100% {
    top: 10px;
  }
}
.top-preorder {
  margin: 0 auto;
}
.top-preorder span {
  display: inline-block;
  -webkit-transform: skew(25deg);
  transform: skew(25deg);
}

.btn-normal {
  text-align: center;
  display: inline-block;
  min-width: 240px;
  /*aaa*/
  font-size: 0.875rem;
}
.btn-normal span {
  display: inline-block;
  -webkit-transform: skew(30deg);
  transform: skew(30deg);
}
.btn-normal a {
  position: relative;
  display: inline-block;
  padding: 1rem 3rem;
  -webkit-transform: skew(-30deg);
  transform: skew(-30deg);
  color: #f0f5fa;
  /* background-image: -webkit-gradient(linear, left top, right top, from(#209cff), to(#68e0cf));
     background-image: -webkit-linear-gradient(left, #209cff 0%, #68e0cf 100%);
     background-image: linear-gradient(to right, #209cff 0%, #68e0cf 100%);
  */
  width: 100%;
  height: fit-content;
  margin: 0 auto;
  transition: all 0.3s;
}
.btn-normal a:hover {
  color: #f0f5fa;
}
.btn-normal.no-link {
  opacity: 0.5;
}
.btn-normal.no-link a {
  pointer-events: none;
}
.btn-normal.no-link:hover {
  filter: none;
}

.btn {
  width: 100%;
  max-width: 280px;
  padding-top: 0.5rem;
}
.btn a {
  position: relative;
  display: inline-block;
  padding: 0.5rem 3rem 0.5rem 1.8rem;
  box-sizing: border-box;
  color: #000000;
  background-color: #968264;
  width: 100%;
  transition: all 0.3s;
  border: 1px solid #968264;
}
.btn a::before {
  position: absolute;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  top: 50%;
  right: 1rem;
  margin-top: 2px;
  border-top: 1px solid #000000;
  border-right: 1px solid #000000;
  transform: rotate(45deg) translateY(-50%) translateX(-50%);
  -webkit-transform: rotate(45deg) translateY(-50%) translateX(-50%);
}
.btn a:hover {
  opacity: 0.8;
}

.video {
  display: block;
  position: relative;
  width: 100%;
  margin: 0 auto;
}
.video::before {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 1px;
  right: -1px;
  bottom: 1px;
  left: 1px;
  content: "";
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
  background: rgba(0, 0, 0, 0.2);
}
.video:hover::before {
  background: rgba(0, 0, 0, 0.1);
}

.is-hide {
  pointer-events: none;
}

/* ローディング画面 */
#loading {
  width: 100vw;
  height: 100vh;
  transition: all 1s;
  background-color: #000000;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

.spinner {
  width: 37px;
  height: 37px;
  margin: 46vh auto;
  background-color: transparent;
  border-radius: 50%;
  animation: sk-scaleout 1s infinite ease-in-out;
}
.spinner .circle-border {
  width: 40px;
  height: 40px;
  padding: 3px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background: #968264;
  background: linear-gradient(0deg, rgba(150, 130, 100, 0.1) 33%, rgba(150, 130, 100, 0.6) 100%);
  animation: spin 0.8s linear 0s infinite;
}
.spinner .circle-core {
  width: 100%;
  height: 100%;
  background-color: #000000;
  border-radius: 50%;
}

/* ローディングアニメーション */
@keyframes spin {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(359deg);
  }
}
.loaded {
  opacity: 0;
  visibility: hidden;
}

/*popup anime*/
/*====== Zoom effect ======*/
.mfp-zoom-in {
  /* start state */
  /* animate in */
  /* animate out */
}
.mfp-zoom-in .mfp-with-anim {
  opacity: 0;
  transition: all 0.3s ease-in-out;
  transform: scale(0.8);
}
.mfp-zoom-in.mfp-bg {
  opacity: 0;
  transition: all 0.3s ease-out;
}
.mfp-zoom-in.mfp-ready .mfp-with-anim {
  opacity: 1;
  transform: scale(1);
}
.mfp-zoom-in.mfp-ready.mfp-bg {
  opacity: 0.8;
}
.mfp-zoom-in.mfp-removing .mfp-with-anim {
  transform: scale(0.8);
  opacity: 0;
}
.mfp-zoom-in.mfp-removing.mfp-bg {
  opacity: 0;
}

/* gallery
/* overlay at start */
.mfp-bg {
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

/* overlay animate in */
.mfp-bg.mfp-ready {
  opacity: 0.8;
}

/* overlay animate out */
.mfp-bg.mfp-removing {
  opacity: 0;
}

/* content at start */
.mfp-wrap .mfp-content {
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

/* content animate it */
.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}

/* content animate out */
.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}

.category-important {
  color: #ab2b15;
  border: 1px solid #ab2b15;
}

.category-update, .category-version-update {
  color: #b1c9d1;
  border: 1px solid #b1c9d1;
}

.category-emergency, .category-completed, .category-failure, .category-follow_up, .category-recovery, .category-information {
  color: #b1c9d1;
  border: 1px solid #b1c9d1;
}

[v-cloak] {
  display: none;
}

img {
  vertical-align: top;
}

li {
  list-style: none;
}

a {
  text-decoration: none;
  transition: all 0.3s;
}
a:hover {
  color: #2882f0;
}

html {
  overflow: auto;
  height: 100%;
}

body {
  position: relative;
  height: 100%;
  font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", Arial, Verdana, Helvetica, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #f0f5fa;
  -webkit-text-size-adjust: 100%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  background: #000000;
}

.wrapper {
  overflow: hidden;
  position: relative;
}

.site-header {
  position: absolute;
  display: flex;
  justify-content: space-between;
  height: 46px;
  width: 100%;
  z-index: 200;
}
@media only screen and (min-width: 768px) {
  .site-header {
    height: 50px;
  }
}
.site-header .hdr-konami {
  width: 100%;
  max-width: 130px;
}
.site-header a {
  display: inline-block;
}
.site-header a .hdr-logo-ebaseball {
  position: absolute;
  top: 8px;
  right: 16px;
  display: block;
  width: 100%;
  max-width: 120px;
}
@media only screen and (min-width: 768px) {
  .site-header a .hdr-logo-ebaseball {
    max-width: 160px;
    transition: all 0.3s;
  }
  .site-header a .hdr-logo-ebaseball:hover {
    filter: brightness(120%);
  }
}
.site-header a .hdr-logo-ebaseball:lang(ko), .site-header a .hdr-logo-ebaseball:lang(zh-tw) {
  pointer-events: none;
}
.site-header .title_anniversary {
  display: block;
  margin: 36px 16px 0 auto;
  width: 100%;
  max-width: 80px;
  -webkit-animation: fadeInanime 1s ease-in 0.5s;
  -moz-animation: fadeInanime 1s ease-in 0.5s;
  animation: fadeInanime 1s ease-in 0.5s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
}
.site-header .title_anniversary img {
  width: 100%;
}
@media only screen and (min-width: 768px) {
  .site-header .title_anniversary {
    max-width: 120px;
    height: auto;
    margin: 40px 16px 0 auto;
  }
}

.announcement_link {
  position: relative;
  z-index: 200;
  width: 100%;
  background-color: #1d1d1d;
  color: #968264;
  top: 46px;
  text-align: center;
}
.announcement_link span {
  display: inline-block;
}
.announcement_link a {
  width: 100%;
  display: inline-block;
  padding: 0.8rem 0;
  box-sizing: border-box;
  transition: all 0.3s;
  /*aaa*/
  font-size: 1.125rem;
}
.announcement_link a:hover {
  color: #f0f5fa;
  background: rgba(150, 130, 100, 0.4);
}

.information-header {
  /*aaa*/
  font-size: 0.875rem;
  top: 0;
  max-width: 980px;
  margin: auto;
  position: relative;
  background: rgba(150, 130, 100, 0.4);
  display: flex;
}
.information-header a {
  width: 100%;
  display: inline-block;
  box-sizing: border-box;
  transition: all 0.3s;
  padding: 1.5rem 3.7rem 1.5rem 2rem;
  color: #f0f5fa;
}
.information-header a > div {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  transition: all 0.5s;
  height: auto;
  transition-delay: 0s;
  opacity: 1;
  visibility: visible;
  padding: 0 1rem;
}
@media only screen and (min-width: 768px) {
  .information-header a > div {
    flex-direction: row;
  }
}
.information-header .post-text {
  padding: 0;
  box-sizing: border-box;
  line-height: 1.8;
}
@media only screen and (min-width: 768px) {
  .information-header .post-text {
    padding: 0 0 0 2.5rem;
    box-sizing: border-box;
  }
}
.information-header .date {
  padding: 0 0 0.3rem;
  box-sizing: border-box;
  /*aaa*/
  font-size: 0.875rem;
  line-height: 1.8;
}

.ftr-dlBtn {
  padding: 15px 0;
}

.btn-home {
  position: relative;
  z-index: 1;
  width: 240px;
  margin: 0 auto 2rem;
}
.btn-home a {
  position: relative;
  display: block;
  padding: 10px;
  color: #f0f5fa;
  background: #2882f0;
  transition: all 0.3s;
  width: 100%;
  min-width: 40%;
  margin: 0 4px;
  box-sizing: border-box;
  max-height: 50px;
  transform: skewX(-30deg);
  background: url("/games/prospi/2024-2025/s/images/common/btn_base.png") no-repeat 0 0;
  font-family: a-otf-ud-shin-go-pr6n;
  font-weight: 500;
  font-style: normal;
  /*aaa*/
  font-size: 1rem;
  text-align: center;
}
.btn-home a span {
  display: inline-block;
  -webkit-transform: skew(30deg);
  transform: skew(30deg);
}
.btn-home a:hover {
  filter: brightness(120%);
}

footer {
  padding: 0 0 50px;
  box-sizing: border-box;
  /*aaa*/
  font-size: 0.625rem;
  text-align: center;
  background: black;
  position: relative;
  z-index: 300;
  color: #878c91;
}
footer::before {
  content: "";
  display: block;
  height: 1px;
  width: 100%;
  background-color: rgba(135, 140, 145, 0.5);
}
footer .share {
  padding: 2rem 0;
  display: flex;
  justify-content: center;
}
footer .share li {
  display: inline-block;
  width: 50px;
  height: 50px;
  margin: 0 10px;
}
footer .share li a {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 3px;
  background-size: 100% auto;
  box-shadow: 0 0 0 0 rgba(85, 85, 85, 0.3);
  transition: box-shadow 0.2s ease;
}
footer .share li a:hover {
  filter: drop-shadow(0 0 2px 3px #555);
}
footer .share li.twitter a {
  background-image: url("/games/prospi/2024-2025/s/images/common/sns_icon_x.png");
}
footer .share li.facebook a {
  background-image: url("/games/prospi/2024-2025/s/images/common/sns_icon_facebook.png");
}
@media screen and (min-width: 980px) {
  footer .share li.line {
    display: none;
  }
}
footer .share li.line a {
  background-image: url("/games/prospi/2024-2025/s/images/common/sns_icon_line.png");
}
footer .ftr-product {
  margin: 0 auto;
  max-width: 96%;
}
footer .ftr-product .ftr-product-list > li {
  position: relative;
  margin-bottom: 40px;
  padding-bottom: 15px;
  border: 1px solid #ea95ff;
  background: #1d1d1d;
}
footer .ftr-product .ftr-product-list > li table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
footer .ftr-product .ftr-product-list > li table th {
  padding: 4px;
  color: #ffffff;
  /*aaa*/
  font-size: 0.8125rem;
  font-weight: normal;
  border-bottom: 1px solid #ea95ff;
  background: #4d6777;
}
footer .ftr-product .ftr-product-list > li table td dl {
  padding: 10px;
}
footer .ftr-product .ftr-product-list > li table td dl dt {
  padding: 2px;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  color: #d2aa78;
  background: #a384ff;
}
footer .ftr-product .ftr-product-list > li table td dl dt.product-bonus {
  background: #248521;
}
footer .ftr-product .ftr-product-list > li table td dl dd {
  padding: 10px 5px;
  text-align: left;
}
footer .license_logo {
  margin: 2rem auto 0;
}
footer .license_logo ul {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  align-items: center;
  flex-direction: column;
}
footer .license_logo ul li {
  box-sizing: border-box;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  margin: 0 0.5rem;
  width: 50%;
  text-align: center;
}
footer .license_logo ul li::before {
  content: "";
  display: block;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center 0;
}
footer .license_logo ul li.eb {
  width: 100%;
  max-width: 302px;
  height: 44px;
}
footer .license_logo ul li.eb::before {
  width: 100%;
  max-width: 302px;
  height: 44px;
  background: url("/games/prospi/2024-2025/s/images/common/logo_ebaseball-engine_h.svg") 0 50% no-repeat;
  background-size: contain;
}
footer .license_logo ul li.ue {
  width: 100%;
  max-width: 220px;
  height: 88px;
}
footer .license_logo ul li.ue::before {
  width: 100%;
  max-width: 220px;
  height: 88px;
  background: url("/games/prospi/2024-2025/s/images/common/logo_ue_h.svg") 0 50% no-repeat;
  background-size: contain;
}
@media only screen and (min-width: 768px) {
  footer .license_logo ul {
    flex-direction: row;
  }
  footer .license_logo ul li {
    margin-bottom: 0;
  }
  footer .license_logo ul li.eb {
    max-width: calc($ue_logo_w * 1.3);
    height: calc($ue_logo_h * 1.3);
  }
  footer .license_logo ul li.eb::before {
    max-width: calc($ue_logo_w * 1.3);
    height: calc($ue_logo_h * 1.3);
  }
  footer .license_logo ul li.ue {
    max-width: 220px;
    height: 88px;
  }
  footer .license_logo ul li.ue::before {
    max-width: 220px;
    height: 88px;
  }
}
footer .pet {
  margin: 0 auto;
  padding: 0 2.5rem;
  box-sizing: border-box;
  max-width: 600px;
}
footer .pet:lang(ko), footer .pet:lang(zh-tw), footer .pet:lang(en) {
  margin-top: 2rem;
}
footer .pet picture img {
  width: 100%;
}
footer .copyright {
  padding: 0 10vw;
  box-sizing: border-box;
  text-align: left;
  line-height: 1.5em;
}
footer .copyright:not(:first-child) {
  margin-top: 2%;
}
footer .copyright span {
  display: inline-block;
}
footer .copyright .img-npb {
  height: 2em;
  padding-right: 1%;
  vertical-align: middle;
}
footer .copyright svg {
  position: relative;
  height: auto;
  max-height: 14px;
  fill: currentColor;
}
footer .copyright svg.icon-ps {
  max-width: 16px;
}
footer .copyright svg.logo-ps4, footer .copyright svg.logo-ps5 {
  max-width: 44px;
}
footer .ftr-bnr {
  margin: 20px auto 0;
}
footer .ftr-bnr ul li img {
  max-width: 100%;
}
footer .kde-nav,
footer .series-link {
  padding: 0 10vw;
  margin: 2rem 0 1rem;
}
footer .kde-nav ul,
footer .series-link ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
footer .kde-nav ul li,
footer .series-link ul li {
  width: 46%;
  padding: 6px;
  display: flex;
  align-content: stretch;
}
footer .kde-nav ul li a,
footer .kde-nav ul li button,
footer .series-link ul li a,
footer .series-link ul li button {
  display: inline-block;
  width: 100%;
}
footer .kde-nav ul li a span,
footer .kde-nav ul li button span,
footer .series-link ul li a span,
footer .series-link ul li button span {
  display: inline-block;
}
footer .kde-nav ul li #ot-sdk-btn,
footer .series-link ul li #ot-sdk-btn {
  color: #878c91;
  transition: 0.5s;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 6px;
  box-sizing: border-box;
  appearance: none;
  /*aaa*/
  font-size: 0.625rem;
  line-height: 1.2;
  display: inline-block;
  width: 100%;
  border-radius: 6px;
}
footer .kde-nav ul li #ot-sdk-btn:hover,
footer .series-link ul li #ot-sdk-btn:hover {
  color: #2882f0;
  background-color: transparent;
}
footer .kde-nav ul li #ot-sdk-btn.ot-sdk-show-settings,
footer .series-link ul li #ot-sdk-btn.ot-sdk-show-settings {
  background-color: transparent;
}
footer .series-link {
  margin: 20px 0 10px 0;
}
footer .series-link ul li {
  /*aaa*/
  font-size: 0.75rem;
  display: flex;
  align-items: stretch;
}
footer .series-link ul li a {
  display: inline-block;
  width: 100%;
  color: #878c91;
  padding: 12px 6px;
  box-sizing: border-box;
  border-radius: 6px;
  transition: all 0.3s;
}
footer .site-copyright {
  padding: 0 10vw 25px;
  line-height: 1.5;
}
footer .site-copyright span {
  display: inline-block;
}

@media only screen and (min-width: 768px) {
  footer {
    /*aaa*/
    font-size: 0.6875rem;
  }
  footer .ftr-product .ftr-product-list {
    display: flex;
    flex-wrap: wrap;
    max-width: 980px;
    margin: 0 auto 20px;
  }
  footer .ftr-product .ftr-product-list > li {
    width: 32.6%;
    margin: 0 10px 10px 0;
  }
  footer .ftr-product .ftr-product-list > li:last-child {
    margin-right: 0;
  }
  footer .ftr-product .ftr-product-list > li table th {
    /*aaa*/
    font-size: 0.9375rem;
  }
  footer .ftr-product .ftr-product-list > li .ftr-product-btn > li a {
    background: rgba(125, 230, 255, 0.3);
  }
  footer .ftr-product .ftr-product-list > li .ftr-product-btn > li a:hover {
    color: #ffffff;
    border: 1px solid #aaa;
    background: rgba(125, 230, 255, 0.5);
  }
  footer .ftr-product .ftr-product-note {
    max-width: 980px;
    margin: auto;
    padding-top: 10px;
  }
  footer .ftr-product .ftr-reservation {
    max-width: 33%;
    margin: 20px auto 30px;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
  }
  footer .ftr-product .ftr-reservation:hover {
    -moz-transform: scale(1.05, 1.05);
    -webkit-transform: scale(1.05, 1.05);
    -o-transform: scale(1.05, 1.05);
    -ms-transform: scale(1.05, 1.05);
  }
  footer .ftr-spec {
    max-width: 980px;
  }
  footer .ftr-spec .ftr-spec-pkg {
    float: left;
    width: 230px;
    margin-left: 15px;
  }
  footer .ftr-spec table {
    padding: 10px;
  }
  footer .ftr-spec table:after:after {
    content: "";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
  }
  footer .ftr-spec table tr th {
    padding-right: 10px;
  }
  footer .pet {
    max-width: 950px;
    margin: 0 auto;
    padding: 0 3rem;
    /*span {
      display: block;
      max-width: 950px;
      margin: 0 auto;
      $mainVisualAspectPc: 77 / 950; // メインビジュアル(背景)の縦横比

      align-items: center;
      padding-top: $mainVisualAspectPc * 100%;
      background: url('/games/prospi/2024-2025/s/images/common/petmark_pc.png') center 0 / 100% auto no-repeat;
    }*/
  }
  footer .copyright {
    padding: 0 3rem;
    max-width: 980px;
    margin: 0 auto;
  }
  footer .copyright:not(:first-child) {
    margin-top: 1%;
  }
  footer .ftr-bnr {
    width: 500px;
  }
  footer .kde-nav ul {
    max-width: 980px;
    margin: 0 auto;
    display: flex;
  }
  footer .kde-nav ul li {
    width: fit-content;
    border-right: 1px solid #878c91;
    padding: 0 0.5rem;
    box-sizing: border-box;
    text-align: center;
    margin-bottom: 1rem;
  }
  footer .kde-nav ul li:last-child {
    border-right: none;
  }
  footer .kde-nav ul li a,
footer .kde-nav ul li button {
    padding: 0;
    background: none;
    color: #878c91;
  }
  footer .kde-nav ul li a:hover,
footer .kde-nav ul li button:hover {
    color: #2882f0;
    background: none;
  }
  footer .kde-nav ul li a:after,
footer .kde-nav ul li button:after {
    top: 13px;
  }
  footer .kde-nav ul li #ot-sdk-btn {
    transition: all 0.2s;
    background: none;
    color: #878c91;
    padding: 0;
  }
  footer .kde-nav ul li #ot-sdk-btn:hover {
    color: #2882f0;
    background: none;
  }
  footer .series-link ul {
    max-width: 980px;
    margin: 0 auto;
  }
  footer .series-link ul li {
    /*aaa*/
    font-size: 0.75rem;
    max-width: calc(100% / 3);
  }
  footer .series-link ul li a {
    padding: 10px;
  }
  footer .series-link ul li a:after {
    top: 20px;
  }
}
.sub-heading {
  position: relative;
  display: flex;
  align-items: center;
  height: 200px;
  padding-top: calc(60px + 46px);
  z-index: 1;
  margin-bottom: 2rem;
}
.sub-heading .logo {
  margin: auto;
  width: 100%;
  max-width: 380px;
  padding: 0 1.5rem;
  box-sizing: border-box;
}
.sub-heading .logo img {
  border: none;
  width: 100%;
}
.sub-heading .logo img:hover {
  border: none;
}
.sub-heading .page-title {
  font-weight: bold;
  text-align: center;
  width: 100%;
  /*aaa*/
  font-size: 1.125rem;
  font-family: a-otf-ud-shin-go-pr6n;
  font-weight: 500;
  font-style: normal;
}
@media only screen and (min-width: 768px) {
  .sub-heading .page-title {
    /*aaa*/
    font-size: 1.75rem;
  }
}
@media only screen and (min-width: 768px) {
  .sub-heading {
    height: 230px;
  }
  .sub-heading .logo {
    max-width: 480px;
  }
}

.global-nav input {
  display: none;
}

.global-nav-icon-slot {
  position: absolute;
  top: 50px;
  right: 0;
}

.global-nav-icon {
  position: relative;
  z-index: 110;
  top: 0;
  right: 0;
  width: 46px;
  height: 46px;
  background: #1d1d1d;
}
.global-nav-icon.fixed-only, .global-nav-icon.fixed {
  position: fixed;
  top: 0;
}
.global-nav-icon label {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  cursor: pointer;
}
.global-nav-icon label::before {
  display: block;
  padding: 2px 0;
  content: "MENU";
  /*aaa*/
  font-size: 0.75rem;
  transition: color 0.3s;
  text-align: center;
  color: #ffffff;
}
.global-nav-icon label > span {
  position: absolute;
  right: 0;
  bottom: 16px;
  left: 0;
  display: block;
  width: 24px;
  height: 1px;
  margin: 0 auto;
  transition: background-color 0.3s;
  background-color: #ffffff;
}
.global-nav-icon label > span::before, .global-nav-icon label > span::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  width: 24px;
  height: 1px;
  content: "";
  transition: background-color 0.3s, transform 0.3s;
  transform: translateY(-5px);
  background-color: #ffffff;
}
.global-nav-icon label > span::after {
  transform: translateY(5px);
}

input:checked ~ .global-nav-icon-slot .global-nav-icon {
  position: fixed;
  z-index: 110;
  top: 0;
  background-color: rgba(0, 0, 0, 0);
}
input:checked ~ .global-nav-icon-slot .global-nav-icon label::before {
  content: "CLOSE";
}
input:checked ~ .global-nav-icon-slot .global-nav-icon label span {
  height: 0;
}
input:checked ~ .global-nav-icon-slot .global-nav-icon label span::before, input:checked ~ .global-nav-icon-slot .global-nav-icon label span::after {
  transform: translateY(0) rotate(-45deg);
}
input:checked ~ .global-nav-icon-slot .global-nav-icon label span::after {
  transform: translateY(0) rotate(45deg);
}

.global-nav-content {
  position: fixed;
  transition: background-color 0.2s ease-out 0s;
  background-color: rgba(0, 0, 0, 0);
}

.global-nav-list {
  display: flex;
  flex-direction: column;
  margin-top: 30px;
  transition: all 0.5s ease-out 0s;
  opacity: 0;
}

.global-nav-item-1 {
  position: relative;
  color: rgba(0, 0, 0, 0.4);
  border-bottom: 1px solid rgba(0, 0, 0, 0.3);
}
.global-nav-item-1.current a {
  color: #f0f5fa;
  background: #ffecfd;
}
.global-nav-item-1.current a:after {
  display: none;
}
.global-nav-item-1 img {
  display: none;
}
.global-nav-item-1 span {
  display: block;
  padding: 10px;
}
.global-nav-item-1 a {
  position: relative;
  display: block;
  height: 100%;
  color: #000000;
  background: rgba(255, 255, 255, 0.2);
}
.global-nav-item-1 a:after {
  position: absolute;
  content: "";
  top: 40%;
  right: 10px;
  width: 8px;
  height: 8px;
  border-top: 1px solid #000000;
  border-right: 1px solid #000000;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

input:checked ~ .global-nav-content-slot .global-nav-content {
  z-index: 100;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: auto;
  height: auto;
  background-color: rgba(33, 65, 85, 0.9);
}
input:checked ~ .global-nav-content-slot .global-nav-content .global-nav-list {
  margin-top: 48px;
  opacity: 1;
}

@media only screen and (min-width: 768px) {
  .global-nav-icon-slot {
    display: none;
  }

  .global-nav-content-slot {
    position: relative;
    height: 64px;
    margin-bottom: 15px;
  }

  .global-nav-content {
    position: relative;
    z-index: 100;
    width: 100%;
    height: auto;
  }
  .global-nav-content.fixed {
    position: fixed;
    top: 0;
    bottom: initial;
    height: auto;
  }

  .global-nav-list {
    flex-direction: row;
    justify-content: space-between;
    max-width: 980px;
    margin: 0 auto;
    transition: none;
    opacity: 1;
  }

  .global-nav-item-1 {
    flex-grow: 1;
    border: none;
  }
  .global-nav-item-1 img {
    display: block;
    width: 80%;
    margin: auto;
    padding: 15px 5px;
    transform: skewX(45deg);
    opacity: 0.2;
  }
  .global-nav-item-1.no-link img {
    transform: skewX(0deg);
  }
  .global-nav-item-1 span {
    display: none;
  }
  .global-nav-item-1.current a {
    background: linear-gradient(-64deg, #fdd6f3 0%, #e4e6f8 50%, #c1fbfe 100%);
  }
  .global-nav-item-1 a {
    padding: 0;
    transform: skewX(-45deg);
    transition: all 250ms ease-out;
    border: none;
    background: none;
  }
  .global-nav-item-1 a:after {
    display: none;
  }
  .global-nav-item-1 a img {
    opacity: 1;
  }
  .global-nav-item-1 a span {
    display: none;
  }
  .global-nav-item-1 a.current a {
    background: linear-gradient(-64deg, #fdd6f3 0%, #e4e6f8 50%, #c1fbfe 100%);
  }
  .global-nav-item-1 a:hover {
    background: linear-gradient(-64deg, #fdd6f3 0%, #e4e6f8 50%, #c1fbfe 100%);
  }
}
/***
    The new CSS reset - version 1.11.2 (last updated 15.11.2023)
    GitHub page: https://github.com/elad2412/the-new-css-reset
***/
/*
    Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property
    - The "symbol *" part is to solve Firefox SVG sprite bug
    - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36)
 */
*:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) {
  all: unset;
  display: revert;
}

/* Preferred box-sizing value */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Fix mobile Safari increase font-size on landscape mode */
html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* Reapply the pointer cursor for anchor tags */
a, button {
  cursor: revert;
}

/* Remove list styles (bullets/numbers) */
ol, ul, menu, summary {
  list-style: none;
}

/* For images to not be able to exceed their container */
img {
  max-inline-size: 100%;
  max-block-size: 100%;
}

/* removes spacing between cells in tables */
table {
  border-collapse: collapse;
}

/* Safari - solving issue when using user-select:none on the <body> text input doesn't working */
input, textarea {
  -webkit-user-select: auto;
}

/* revert the 'white-space' property for textarea elements on Safari */
textarea {
  white-space: revert;
}

/* minimum style to allow to style meter element */
meter {
  -webkit-appearance: revert;
  appearance: revert;
}

/* preformatted text - use only for this feature */
:where(pre) {
  all: revert;
  box-sizing: border-box;
}

/* reset default text opacity of input placeholder */
::placeholder {
  color: unset;
}

/* fix the feature of 'hidden' attribute.
   display:revert; revert to element instead of attribute */
:where([hidden]) {
  display: none;
}

/* revert for bug in Chromium browsers
   - fix for the content editable attribute will work properly.
   - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/
:where([contenteditable]:not([contenteditable="false"])) {
  -moz-user-modify: read-write;
  -webkit-user-modify: read-write;
  overflow-wrap: break-word;
  -webkit-line-break: after-white-space;
  -webkit-user-select: auto;
}

/* apply back the draggable feature - exist only in Chromium and Safari */
:where([draggable="true"]) {
  -webkit-user-drag: element;
}

/* Revert Modal native behavior */
:where(dialog:modal) {
  all: revert;
  box-sizing: border-box;
}

/* Remove details summary webkit styles */
::-webkit-details-marker {
  display: none;
}

@-webkit-keyframes fadeInanime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes fadeInanime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeInanime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeOutanime {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}
@-moz-keyframes fadeOutanime {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}
@keyframes fadeOutanime {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}
@-webkit-keyframes fadeUpanime {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@-moz-keyframes fadeUpanime {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes fadeUpanime {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@-webkit-keyframes fadeDownanime {
  0% {
    opacity: 0;
    transform: translateY(0);
  }
  100% {
    opacity: 1;
    transform: translateY(-100px);
  }
}
@-moz-keyframes fadeDownanime {
  0% {
    opacity: 0;
    transform: translateY(0);
  }
  100% {
    opacity: 1;
    transform: translateY(-100px);
  }
}
@keyframes fadeDownanime {
  0% {
    opacity: 0;
    transform: translateY(0);
  }
  100% {
    opacity: 1;
    transform: translateY(-100px);
  }
}
@-webkit-keyframes fadeInscrollanime {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@-moz-keyframes fadeInscrollanime {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeInscrollanime {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@-webkit-keyframes topTitleanime {
  0% {
    -webkit-clip-path: inset(0 100% 0 0);
    clip-path: inset(0 100% 0 0);
  }
  100% {
    -webkit-clip-path: inset(0);
    clip-path: inset(0);
  }
}
@-moz-keyframes topTitleanime {
  0% {
    -webkit-clip-path: inset(0 100% 0 0);
    clip-path: inset(0 100% 0 0);
  }
  100% {
    -webkit-clip-path: inset(0);
    clip-path: inset(0);
  }
}
@keyframes topTitleanime {
  0% {
    -webkit-clip-path: inset(0 100% 0 0);
    clip-path: inset(0 100% 0 0);
  }
  100% {
    -webkit-clip-path: inset(0);
    clip-path: inset(0);
  }
}
@-webkit-keyframes topScaleanime {
  0% {
    opacity: 0;
    transform: scale(1.3);
  }
  100% {
    opacity: 100%;
    transform: scale(1);
  }
}
@-moz-keyframes topScaleanime {
  0% {
    opacity: 0;
    transform: scale(1.3);
  }
  100% {
    opacity: 100%;
    transform: scale(1);
  }
}
@keyframes topScaleanime {
  0% {
    opacity: 0;
    transform: scale(1.3);
  }
  100% {
    opacity: 100%;
    transform: scale(1);
  }
}
@-webkit-keyframes scrollarrow {
  0% {
    top: 10px;
  }
  50% {
    top: 26px;
  }
  100% {
    top: 10px;
  }
}
@-moz-keyframes scrollarrow {
  0% {
    top: 10px;
  }
  50% {
    top: 26px;
  }
  100% {
    top: 10px;
  }
}
@keyframes scrollarrow {
  0% {
    top: 10px;
  }
  50% {
    top: 26px;
  }
  100% {
    top: 10px;
  }
}
.top-preorder {
  margin: 0 auto;
}
.top-preorder span {
  display: inline-block;
  -webkit-transform: skew(25deg);
  transform: skew(25deg);
}

.btn-normal {
  text-align: center;
  display: inline-block;
  min-width: 240px;
  /*aaa*/
  font-size: 0.875rem;
}
.btn-normal span {
  display: inline-block;
  -webkit-transform: skew(30deg);
  transform: skew(30deg);
}
.btn-normal a {
  position: relative;
  display: inline-block;
  padding: 1rem 3rem;
  -webkit-transform: skew(-30deg);
  transform: skew(-30deg);
  color: #f0f5fa;
  /* background-image: -webkit-gradient(linear, left top, right top, from(#209cff), to(#68e0cf));
     background-image: -webkit-linear-gradient(left, #209cff 0%, #68e0cf 100%);
     background-image: linear-gradient(to right, #209cff 0%, #68e0cf 100%);
  */
  width: 100%;
  height: fit-content;
  margin: 0 auto;
  transition: all 0.3s;
}
.btn-normal a:hover {
  color: #f0f5fa;
}
.btn-normal.no-link {
  opacity: 0.5;
}
.btn-normal.no-link a {
  pointer-events: none;
}
.btn-normal.no-link:hover {
  filter: none;
}

.btn {
  width: 100%;
  max-width: 280px;
  padding-top: 0.5rem;
}
.btn a {
  position: relative;
  display: inline-block;
  padding: 0.5rem 3rem 0.5rem 1.8rem;
  box-sizing: border-box;
  color: #000000;
  background-color: #968264;
  width: 100%;
  transition: all 0.3s;
  border: 1px solid #968264;
}
.btn a::before {
  position: absolute;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  top: 50%;
  right: 1rem;
  margin-top: 2px;
  border-top: 1px solid #000000;
  border-right: 1px solid #000000;
  transform: rotate(45deg) translateY(-50%) translateX(-50%);
  -webkit-transform: rotate(45deg) translateY(-50%) translateX(-50%);
}
.btn a:hover {
  opacity: 0.8;
}

.video {
  display: block;
  position: relative;
  width: 100%;
  margin: 0 auto;
}
.video::before {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 1px;
  right: -1px;
  bottom: 1px;
  left: 1px;
  content: "";
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
  background: rgba(0, 0, 0, 0.2);
}
.video:hover::before {
  background: rgba(0, 0, 0, 0.1);
}

.is-hide {
  pointer-events: none;
}

/* ローディング画面 */
#loading {
  width: 100vw;
  height: 100vh;
  transition: all 1s;
  background-color: #000000;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

.spinner {
  width: 37px;
  height: 37px;
  margin: 46vh auto;
  background-color: transparent;
  border-radius: 50%;
  animation: sk-scaleout 1s infinite ease-in-out;
}
.spinner .circle-border {
  width: 40px;
  height: 40px;
  padding: 3px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background: #968264;
  background: linear-gradient(0deg, rgba(150, 130, 100, 0.1) 33%, rgba(150, 130, 100, 0.6) 100%);
  animation: spin 0.8s linear 0s infinite;
}
.spinner .circle-core {
  width: 100%;
  height: 100%;
  background-color: #000000;
  border-radius: 50%;
}

/* ローディングアニメーション */
@keyframes spin {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(359deg);
  }
}
.loaded {
  opacity: 0;
  visibility: hidden;
}

/*popup anime*/
/*====== Zoom effect ======*/
.mfp-zoom-in {
  /* start state */
  /* animate in */
  /* animate out */
}
.mfp-zoom-in .mfp-with-anim {
  opacity: 0;
  transition: all 0.3s ease-in-out;
  transform: scale(0.8);
}
.mfp-zoom-in.mfp-bg {
  opacity: 0;
  transition: all 0.3s ease-out;
}
.mfp-zoom-in.mfp-ready .mfp-with-anim {
  opacity: 1;
  transform: scale(1);
}
.mfp-zoom-in.mfp-ready.mfp-bg {
  opacity: 0.8;
}
.mfp-zoom-in.mfp-removing .mfp-with-anim {
  transform: scale(0.8);
  opacity: 0;
}
.mfp-zoom-in.mfp-removing.mfp-bg {
  opacity: 0;
}

/* gallery
/* overlay at start */
.mfp-bg {
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

/* overlay animate in */
.mfp-bg.mfp-ready {
  opacity: 0.8;
}

/* overlay animate out */
.mfp-bg.mfp-removing {
  opacity: 0;
}

/* content at start */
.mfp-wrap .mfp-content {
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

/* content animate it */
.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}

/* content animate out */
.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}

.category-important {
  color: #ab2b15;
  border: 1px solid #ab2b15;
}

.category-update, .category-version-update {
  color: #b1c9d1;
  border: 1px solid #b1c9d1;
}

.category-emergency, .category-completed, .category-failure, .category-follow_up, .category-recovery, .category-information {
  color: #b1c9d1;
  border: 1px solid #b1c9d1;
}

[v-cloak] {
  display: none;
}

img {
  vertical-align: top;
}

li {
  list-style: none;
}

a {
  text-decoration: none;
  transition: all 0.3s;
}
a:hover {
  color: #2882f0;
}

html {
  overflow: auto;
  height: 100%;
}

body {
  position: relative;
  height: 100%;
  font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", Arial, Verdana, Helvetica, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #f0f5fa;
  -webkit-text-size-adjust: 100%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  background: #000000;
}

.wrapper {
  overflow: hidden;
  position: relative;
}

.site-header {
  position: absolute;
  display: flex;
  justify-content: space-between;
  height: 46px;
  width: 100%;
  z-index: 200;
}
@media only screen and (min-width: 768px) {
  .site-header {
    height: 50px;
  }
}
.site-header .hdr-konami {
  width: 100%;
  max-width: 130px;
}
.site-header a {
  display: inline-block;
}
.site-header a .hdr-logo-ebaseball {
  position: absolute;
  top: 8px;
  right: 16px;
  display: block;
  width: 100%;
  max-width: 120px;
}
@media only screen and (min-width: 768px) {
  .site-header a .hdr-logo-ebaseball {
    max-width: 160px;
    transition: all 0.3s;
  }
  .site-header a .hdr-logo-ebaseball:hover {
    filter: brightness(120%);
  }
}
.site-header a .hdr-logo-ebaseball:lang(ko), .site-header a .hdr-logo-ebaseball:lang(zh-tw) {
  pointer-events: none;
}
.site-header .title_anniversary {
  display: block;
  margin: 36px 16px 0 auto;
  width: 100%;
  max-width: 80px;
  -webkit-animation: fadeInanime 1s ease-in 0.5s;
  -moz-animation: fadeInanime 1s ease-in 0.5s;
  animation: fadeInanime 1s ease-in 0.5s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
}
.site-header .title_anniversary img {
  width: 100%;
}
@media only screen and (min-width: 768px) {
  .site-header .title_anniversary {
    max-width: 120px;
    height: auto;
    margin: 40px 16px 0 auto;
  }
}

.announcement_link {
  position: relative;
  z-index: 200;
  width: 100%;
  background-color: #1d1d1d;
  color: #968264;
  top: 46px;
  text-align: center;
}
.announcement_link span {
  display: inline-block;
}
.announcement_link a {
  width: 100%;
  display: inline-block;
  padding: 0.8rem 0;
  box-sizing: border-box;
  transition: all 0.3s;
  /*aaa*/
  font-size: 1.125rem;
}
.announcement_link a:hover {
  color: #f0f5fa;
  background: rgba(150, 130, 100, 0.4);
}

.information-header {
  /*aaa*/
  font-size: 0.875rem;
  top: 0;
  max-width: 980px;
  margin: auto;
  position: relative;
  background: rgba(150, 130, 100, 0.4);
  display: flex;
}
.information-header a {
  width: 100%;
  display: inline-block;
  box-sizing: border-box;
  transition: all 0.3s;
  padding: 1.5rem 3.7rem 1.5rem 2rem;
  color: #f0f5fa;
}
.information-header a > div {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  transition: all 0.5s;
  height: auto;
  transition-delay: 0s;
  opacity: 1;
  visibility: visible;
  padding: 0 1rem;
}
@media only screen and (min-width: 768px) {
  .information-header a > div {
    flex-direction: row;
  }
}
.information-header .post-text {
  padding: 0;
  box-sizing: border-box;
  line-height: 1.8;
}
@media only screen and (min-width: 768px) {
  .information-header .post-text {
    padding: 0 0 0 2.5rem;
    box-sizing: border-box;
  }
}
.information-header .date {
  padding: 0 0 0.3rem;
  box-sizing: border-box;
  /*aaa*/
  font-size: 0.875rem;
  line-height: 1.8;
}

.ftr-dlBtn {
  padding: 15px 0;
}

.btn-home {
  position: relative;
  z-index: 1;
  width: 240px;
  margin: 0 auto 2rem;
}
.btn-home a {
  position: relative;
  display: block;
  padding: 10px;
  color: #f0f5fa;
  background: #2882f0;
  transition: all 0.3s;
  width: 100%;
  min-width: 40%;
  margin: 0 4px;
  box-sizing: border-box;
  max-height: 50px;
  transform: skewX(-30deg);
  background: url("/games/prospi/2024-2025/s/images/common/btn_base.png") no-repeat 0 0;
  font-family: a-otf-ud-shin-go-pr6n;
  font-weight: 500;
  font-style: normal;
  /*aaa*/
  font-size: 1rem;
  text-align: center;
}
.btn-home a span {
  display: inline-block;
  -webkit-transform: skew(30deg);
  transform: skew(30deg);
}
.btn-home a:hover {
  filter: brightness(120%);
}

footer {
  padding: 0 0 50px;
  box-sizing: border-box;
  /*aaa*/
  font-size: 0.625rem;
  text-align: center;
  background: black;
  position: relative;
  z-index: 300;
  color: #878c91;
}
footer::before {
  content: "";
  display: block;
  height: 1px;
  width: 100%;
  background-color: rgba(135, 140, 145, 0.5);
}
footer .share {
  padding: 2rem 0;
  display: flex;
  justify-content: center;
}
footer .share li {
  display: inline-block;
  width: 50px;
  height: 50px;
  margin: 0 10px;
}
footer .share li a {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 3px;
  background-size: 100% auto;
  box-shadow: 0 0 0 0 rgba(85, 85, 85, 0.3);
  transition: box-shadow 0.2s ease;
}
footer .share li a:hover {
  filter: drop-shadow(0 0 2px 3px #555);
}
footer .share li.twitter a {
  background-image: url("/games/prospi/2024-2025/s/images/common/sns_icon_x.png");
}
footer .share li.facebook a {
  background-image: url("/games/prospi/2024-2025/s/images/common/sns_icon_facebook.png");
}
@media screen and (min-width: 980px) {
  footer .share li.line {
    display: none;
  }
}
footer .share li.line a {
  background-image: url("/games/prospi/2024-2025/s/images/common/sns_icon_line.png");
}
footer .ftr-product {
  margin: 0 auto;
  max-width: 96%;
}
footer .ftr-product .ftr-product-list > li {
  position: relative;
  margin-bottom: 40px;
  padding-bottom: 15px;
  border: 1px solid #ea95ff;
  background: #1d1d1d;
}
footer .ftr-product .ftr-product-list > li table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
footer .ftr-product .ftr-product-list > li table th {
  padding: 4px;
  color: #ffffff;
  /*aaa*/
  font-size: 0.8125rem;
  font-weight: normal;
  border-bottom: 1px solid #ea95ff;
  background: #4d6777;
}
footer .ftr-product .ftr-product-list > li table td dl {
  padding: 10px;
}
footer .ftr-product .ftr-product-list > li table td dl dt {
  padding: 2px;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  color: #d2aa78;
  background: #a384ff;
}
footer .ftr-product .ftr-product-list > li table td dl dt.product-bonus {
  background: #248521;
}
footer .ftr-product .ftr-product-list > li table td dl dd {
  padding: 10px 5px;
  text-align: left;
}
footer .license_logo {
  margin: 2rem auto 0;
}
footer .license_logo ul {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  align-items: center;
  flex-direction: column;
}
footer .license_logo ul li {
  box-sizing: border-box;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  margin: 0 0.5rem;
  width: 50%;
  text-align: center;
}
footer .license_logo ul li::before {
  content: "";
  display: block;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center 0;
}
footer .license_logo ul li.eb {
  width: 100%;
  max-width: 302px;
  height: 44px;
}
footer .license_logo ul li.eb::before {
  width: 100%;
  max-width: 302px;
  height: 44px;
  background: url("/games/prospi/2024-2025/s/images/common/logo_ebaseball-engine_h.svg") 0 50% no-repeat;
  background-size: contain;
}
footer .license_logo ul li.ue {
  width: 100%;
  max-width: 220px;
  height: 88px;
}
footer .license_logo ul li.ue::before {
  width: 100%;
  max-width: 220px;
  height: 88px;
  background: url("/games/prospi/2024-2025/s/images/common/logo_ue_h.svg") 0 50% no-repeat;
  background-size: contain;
}
@media only screen and (min-width: 768px) {
  footer .license_logo ul {
    flex-direction: row;
  }
  footer .license_logo ul li {
    margin-bottom: 0;
  }
  footer .license_logo ul li.eb {
    max-width: calc($ue_logo_w * 1.3);
    height: calc($ue_logo_h * 1.3);
  }
  footer .license_logo ul li.eb::before {
    max-width: calc($ue_logo_w * 1.3);
    height: calc($ue_logo_h * 1.3);
  }
  footer .license_logo ul li.ue {
    max-width: 220px;
    height: 88px;
  }
  footer .license_logo ul li.ue::before {
    max-width: 220px;
    height: 88px;
  }
}
footer .pet {
  margin: 0 auto;
  padding: 0 2.5rem;
  box-sizing: border-box;
  max-width: 600px;
}
footer .pet:lang(ko), footer .pet:lang(zh-tw), footer .pet:lang(en) {
  margin-top: 2rem;
}
footer .pet picture img {
  width: 100%;
}
footer .copyright {
  padding: 0 10vw;
  box-sizing: border-box;
  text-align: left;
  line-height: 1.5em;
}
footer .copyright:not(:first-child) {
  margin-top: 2%;
}
footer .copyright span {
  display: inline-block;
}
footer .copyright .img-npb {
  height: 2em;
  padding-right: 1%;
  vertical-align: middle;
}
footer .copyright svg {
  position: relative;
  height: auto;
  max-height: 14px;
  fill: currentColor;
}
footer .copyright svg.icon-ps {
  max-width: 16px;
}
footer .copyright svg.logo-ps4, footer .copyright svg.logo-ps5 {
  max-width: 44px;
}
footer .ftr-bnr {
  margin: 20px auto 0;
}
footer .ftr-bnr ul li img {
  max-width: 100%;
}
footer .kde-nav,
footer .series-link {
  padding: 0 10vw;
  margin: 2rem 0 1rem;
}
footer .kde-nav ul,
footer .series-link ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
footer .kde-nav ul li,
footer .series-link ul li {
  width: 46%;
  padding: 6px;
  display: flex;
  align-content: stretch;
}
footer .kde-nav ul li a,
footer .kde-nav ul li button,
footer .series-link ul li a,
footer .series-link ul li button {
  display: inline-block;
  width: 100%;
}
footer .kde-nav ul li a span,
footer .kde-nav ul li button span,
footer .series-link ul li a span,
footer .series-link ul li button span {
  display: inline-block;
}
footer .kde-nav ul li #ot-sdk-btn,
footer .series-link ul li #ot-sdk-btn {
  color: #878c91;
  transition: 0.5s;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 6px;
  box-sizing: border-box;
  appearance: none;
  /*aaa*/
  font-size: 0.625rem;
  line-height: 1.2;
  display: inline-block;
  width: 100%;
  border-radius: 6px;
}
footer .kde-nav ul li #ot-sdk-btn:hover,
footer .series-link ul li #ot-sdk-btn:hover {
  color: #2882f0;
  background-color: transparent;
}
footer .kde-nav ul li #ot-sdk-btn.ot-sdk-show-settings,
footer .series-link ul li #ot-sdk-btn.ot-sdk-show-settings {
  background-color: transparent;
}
footer .series-link {
  margin: 20px 0 10px 0;
}
footer .series-link ul li {
  /*aaa*/
  font-size: 0.75rem;
  display: flex;
  align-items: stretch;
}
footer .series-link ul li a {
  display: inline-block;
  width: 100%;
  color: #878c91;
  padding: 12px 6px;
  box-sizing: border-box;
  border-radius: 6px;
  transition: all 0.3s;
}
footer .site-copyright {
  padding: 0 10vw 25px;
  line-height: 1.5;
}
footer .site-copyright span {
  display: inline-block;
}

@media only screen and (min-width: 768px) {
  footer {
    /*aaa*/
    font-size: 0.6875rem;
  }
  footer .ftr-product .ftr-product-list {
    display: flex;
    flex-wrap: wrap;
    max-width: 980px;
    margin: 0 auto 20px;
  }
  footer .ftr-product .ftr-product-list > li {
    width: 32.6%;
    margin: 0 10px 10px 0;
  }
  footer .ftr-product .ftr-product-list > li:last-child {
    margin-right: 0;
  }
  footer .ftr-product .ftr-product-list > li table th {
    /*aaa*/
    font-size: 0.9375rem;
  }
  footer .ftr-product .ftr-product-list > li .ftr-product-btn > li a {
    background: rgba(125, 230, 255, 0.3);
  }
  footer .ftr-product .ftr-product-list > li .ftr-product-btn > li a:hover {
    color: #ffffff;
    border: 1px solid #aaa;
    background: rgba(125, 230, 255, 0.5);
  }
  footer .ftr-product .ftr-product-note {
    max-width: 980px;
    margin: auto;
    padding-top: 10px;
  }
  footer .ftr-product .ftr-reservation {
    max-width: 33%;
    margin: 20px auto 30px;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
  }
  footer .ftr-product .ftr-reservation:hover {
    -moz-transform: scale(1.05, 1.05);
    -webkit-transform: scale(1.05, 1.05);
    -o-transform: scale(1.05, 1.05);
    -ms-transform: scale(1.05, 1.05);
  }
  footer .ftr-spec {
    max-width: 980px;
  }
  footer .ftr-spec .ftr-spec-pkg {
    float: left;
    width: 230px;
    margin-left: 15px;
  }
  footer .ftr-spec table {
    padding: 10px;
  }
  footer .ftr-spec table:after:after {
    content: "";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
  }
  footer .ftr-spec table tr th {
    padding-right: 10px;
  }
  footer .pet {
    max-width: 950px;
    margin: 0 auto;
    padding: 0 3rem;
    /*span {
      display: block;
      max-width: 950px;
      margin: 0 auto;
      $mainVisualAspectPc: 77 / 950; // メインビジュアル(背景)の縦横比

      align-items: center;
      padding-top: $mainVisualAspectPc * 100%;
      background: url('/games/prospi/2024-2025/s/images/common/petmark_pc.png') center 0 / 100% auto no-repeat;
    }*/
  }
  footer .copyright {
    padding: 0 3rem;
    max-width: 980px;
    margin: 0 auto;
  }
  footer .copyright:not(:first-child) {
    margin-top: 1%;
  }
  footer .ftr-bnr {
    width: 500px;
  }
  footer .kde-nav ul {
    max-width: 980px;
    margin: 0 auto;
    display: flex;
  }
  footer .kde-nav ul li {
    width: fit-content;
    border-right: 1px solid #878c91;
    padding: 0 0.5rem;
    box-sizing: border-box;
    text-align: center;
    margin-bottom: 1rem;
  }
  footer .kde-nav ul li:last-child {
    border-right: none;
  }
  footer .kde-nav ul li a,
footer .kde-nav ul li button {
    padding: 0;
    background: none;
    color: #878c91;
  }
  footer .kde-nav ul li a:hover,
footer .kde-nav ul li button:hover {
    color: #2882f0;
    background: none;
  }
  footer .kde-nav ul li a:after,
footer .kde-nav ul li button:after {
    top: 13px;
  }
  footer .kde-nav ul li #ot-sdk-btn {
    transition: all 0.2s;
    background: none;
    color: #878c91;
    padding: 0;
  }
  footer .kde-nav ul li #ot-sdk-btn:hover {
    color: #2882f0;
    background: none;
  }
  footer .series-link ul {
    max-width: 980px;
    margin: 0 auto;
  }
  footer .series-link ul li {
    /*aaa*/
    font-size: 0.75rem;
    max-width: calc(100% / 3);
  }
  footer .series-link ul li a {
    padding: 10px;
  }
  footer .series-link ul li a:after {
    top: 20px;
  }
}
.sub-heading {
  position: relative;
  display: flex;
  align-items: center;
  height: 200px;
  padding-top: calc(60px + 46px);
  z-index: 1;
  margin-bottom: 2rem;
}
.sub-heading .logo {
  margin: auto;
  width: 100%;
  max-width: 380px;
  padding: 0 1.5rem;
  box-sizing: border-box;
}
.sub-heading .logo img {
  border: none;
  width: 100%;
}
.sub-heading .logo img:hover {
  border: none;
}
.sub-heading .page-title {
  font-weight: bold;
  text-align: center;
  width: 100%;
  /*aaa*/
  font-size: 1.125rem;
  font-family: a-otf-ud-shin-go-pr6n;
  font-weight: 500;
  font-style: normal;
}
@media only screen and (min-width: 768px) {
  .sub-heading .page-title {
    /*aaa*/
    font-size: 1.75rem;
  }
}
@media only screen and (min-width: 768px) {
  .sub-heading {
    height: 230px;
  }
  .sub-heading .logo {
    max-width: 480px;
  }
}

.floating-banner {
  position: fixed;
  z-index: 1000;
  bottom: 0;
  right: -100%;
  display: block;
  transition: all 0.8s;
  height: 41px;
}
.floating-banner span {
  /*aaa*/
  font-size: 0.875rem;
  font-family: a-otf-ud-shin-go-pr6n;
  font-weight: 800;
  font-style: normal;
  text-transform: uppercase;
}
.floating-banner span::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("/games/prospi/2024-2025/s/images/common/pre_order.png") 0 0 no-repeat;
  z-index: -1;
}
.floating-banner.mbp {
  left: 0;
  right: auto;
}
.floating-banner.mbp span {
  display: inline-block;
  overflow: hidden;
  text-indent: 101%;
  white-space: nowrap;
}
.floating-banner.mbp span::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("/games/prospi/2024-2025/s/images/common/mbp_banner.png") 0 0 no-repeat;
  background-size: contain;
  z-index: -1;
}
.floating-banner.mbp.hide {
  left: -100%;
  right: auto;
}
.floating-banner.mbp a {
  padding: 0;
  height: 41px;
}
.floating-banner.mbp a::after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
}
.floating-banner a {
  position: relative;
  display: inline-block;
  color: #ffffff;
  padding: 10px 20px 10px 40px;
  box-sizing: border-box;
  transition: all 0.3s;
  min-width: 200px;
  z-index: 99;
}
.floating-banner a:hover {
  cursor: pointer;
  color: #ffffff;
  filter: contrast(130%);
  width: 100%;
}
.floating-banner a.order::before {
  background: url("/games/prospi/2024-2025/s/images/common/icon_cart.svg") 0 0 no-repeat;
}
.floating-banner a.order::after {
  content: "Pre-Order";
}
.floating-banner a.home {
  padding: 10px 20px 10px 80px;
}
.floating-banner a.home::before {
  width: 26px;
  height: 16px;
  background: url("/games/prospi/2024-2025/s/images/common/icon_home.png") 0 0 no-repeat;
  background-size: contain;
  left: 64px;
  top: 13px;
}
.floating-banner a.home span {
  padding-left: 1.5rem;
}
.floating-banner a::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  width: 20px;
  height: 20px;
  right: auto;
  bottom: 0;
  top: 11px;
  left: 40px;
}
.floating-banner a::after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /*aaa*/
  font-size: 0.75rem;
  top: 12px;
  right: -8rem;
  left: auto;
  bottom: 0;
}

.banner-hide {
  pointer-events: none;
}

@media only screen and (min-width: 768px) {
  .floating-banner {
    min-width: 264px;
    height: 63px;
  }
  .floating-banner span {
    /*aaa*/
    font-size: 1.125rem;
  }
  .floating-banner a {
    width: 100%;
    padding: 18px 20px 18px 46px;
    box-sizing: border-box;
  }
  .floating-banner a::before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    width: 20px;
    height: 20px;
    right: auto;
    bottom: 0;
    top: 36%;
    left: 40px;
  }
  .floating-banner a::after {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*aaa*/
    font-size: 0.875rem;
    top: 22px;
    right: -9.5rem;
    left: auto;
    bottom: 0;
  }
  .floating-banner a.home {
    padding: 18px 20px 18px 86px;
  }
  .floating-banner a.home::before {
    width: 34px;
    height: 21px;
    background: url("/games/prospi/2024-2025/s/images/common/icon_home.png") 0 0 no-repeat;
    background-size: contain;
    left: 60px;
    top: 22px;
  }
  .floating-banner.mbp {
    min-width: 325px;
  }
  .floating-banner.mbp a {
    width: 325px;
    height: 63px;
  }
}
.link_view {
  right: 0;
}

/***
    The new CSS reset - version 1.11.2 (last updated 15.11.2023)
    GitHub page: https://github.com/elad2412/the-new-css-reset
***/
/*
    Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property
    - The "symbol *" part is to solve Firefox SVG sprite bug
    - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36)
 */
*:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) {
  all: unset;
  display: revert;
}

/* Preferred box-sizing value */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Fix mobile Safari increase font-size on landscape mode */
html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* Reapply the pointer cursor for anchor tags */
a, button {
  cursor: revert;
}

/* Remove list styles (bullets/numbers) */
ol, ul, menu, summary {
  list-style: none;
}

/* For images to not be able to exceed their container */
img {
  max-inline-size: 100%;
  max-block-size: 100%;
}

/* removes spacing between cells in tables */
table {
  border-collapse: collapse;
}

/* Safari - solving issue when using user-select:none on the <body> text input doesn't working */
input, textarea {
  -webkit-user-select: auto;
}

/* revert the 'white-space' property for textarea elements on Safari */
textarea {
  white-space: revert;
}

/* minimum style to allow to style meter element */
meter {
  -webkit-appearance: revert;
  appearance: revert;
}

/* preformatted text - use only for this feature */
:where(pre) {
  all: revert;
  box-sizing: border-box;
}

/* reset default text opacity of input placeholder */
::placeholder {
  color: unset;
}

/* fix the feature of 'hidden' attribute.
   display:revert; revert to element instead of attribute */
:where([hidden]) {
  display: none;
}

/* revert for bug in Chromium browsers
   - fix for the content editable attribute will work properly.
   - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/
:where([contenteditable]:not([contenteditable="false"])) {
  -moz-user-modify: read-write;
  -webkit-user-modify: read-write;
  overflow-wrap: break-word;
  -webkit-line-break: after-white-space;
  -webkit-user-select: auto;
}

/* apply back the draggable feature - exist only in Chromium and Safari */
:where([draggable="true"]) {
  -webkit-user-drag: element;
}

/* Revert Modal native behavior */
:where(dialog:modal) {
  all: revert;
  box-sizing: border-box;
}

/* Remove details summary webkit styles */
::-webkit-details-marker {
  display: none;
}

@-webkit-keyframes fadeInanime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes fadeInanime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeInanime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeOutanime {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}
@-moz-keyframes fadeOutanime {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}
@keyframes fadeOutanime {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}
@-webkit-keyframes fadeUpanime {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@-moz-keyframes fadeUpanime {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes fadeUpanime {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@-webkit-keyframes fadeDownanime {
  0% {
    opacity: 0;
    transform: translateY(0);
  }
  100% {
    opacity: 1;
    transform: translateY(-100px);
  }
}
@-moz-keyframes fadeDownanime {
  0% {
    opacity: 0;
    transform: translateY(0);
  }
  100% {
    opacity: 1;
    transform: translateY(-100px);
  }
}
@keyframes fadeDownanime {
  0% {
    opacity: 0;
    transform: translateY(0);
  }
  100% {
    opacity: 1;
    transform: translateY(-100px);
  }
}
@-webkit-keyframes fadeInscrollanime {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@-moz-keyframes fadeInscrollanime {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeInscrollanime {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@-webkit-keyframes topTitleanime {
  0% {
    -webkit-clip-path: inset(0 100% 0 0);
    clip-path: inset(0 100% 0 0);
  }
  100% {
    -webkit-clip-path: inset(0);
    clip-path: inset(0);
  }
}
@-moz-keyframes topTitleanime {
  0% {
    -webkit-clip-path: inset(0 100% 0 0);
    clip-path: inset(0 100% 0 0);
  }
  100% {
    -webkit-clip-path: inset(0);
    clip-path: inset(0);
  }
}
@keyframes topTitleanime {
  0% {
    -webkit-clip-path: inset(0 100% 0 0);
    clip-path: inset(0 100% 0 0);
  }
  100% {
    -webkit-clip-path: inset(0);
    clip-path: inset(0);
  }
}
@-webkit-keyframes topScaleanime {
  0% {
    opacity: 0;
    transform: scale(1.3);
  }
  100% {
    opacity: 100%;
    transform: scale(1);
  }
}
@-moz-keyframes topScaleanime {
  0% {
    opacity: 0;
    transform: scale(1.3);
  }
  100% {
    opacity: 100%;
    transform: scale(1);
  }
}
@keyframes topScaleanime {
  0% {
    opacity: 0;
    transform: scale(1.3);
  }
  100% {
    opacity: 100%;
    transform: scale(1);
  }
}
@-webkit-keyframes scrollarrow {
  0% {
    top: 10px;
  }
  50% {
    top: 26px;
  }
  100% {
    top: 10px;
  }
}
@-moz-keyframes scrollarrow {
  0% {
    top: 10px;
  }
  50% {
    top: 26px;
  }
  100% {
    top: 10px;
  }
}
@keyframes scrollarrow {
  0% {
    top: 10px;
  }
  50% {
    top: 26px;
  }
  100% {
    top: 10px;
  }
}
.top-preorder {
  margin: 0 auto;
}
.top-preorder span {
  display: inline-block;
  -webkit-transform: skew(25deg);
  transform: skew(25deg);
}

.btn-normal {
  text-align: center;
  display: inline-block;
  min-width: 240px;
  /*aaa*/
  font-size: 0.875rem;
}
.btn-normal span {
  display: inline-block;
  -webkit-transform: skew(30deg);
  transform: skew(30deg);
}
.btn-normal a {
  position: relative;
  display: inline-block;
  padding: 1rem 3rem;
  -webkit-transform: skew(-30deg);
  transform: skew(-30deg);
  color: #f0f5fa;
  /* background-image: -webkit-gradient(linear, left top, right top, from(#209cff), to(#68e0cf));
     background-image: -webkit-linear-gradient(left, #209cff 0%, #68e0cf 100%);
     background-image: linear-gradient(to right, #209cff 0%, #68e0cf 100%);
  */
  width: 100%;
  height: fit-content;
  margin: 0 auto;
  transition: all 0.3s;
}
.btn-normal a:hover {
  color: #f0f5fa;
}
.btn-normal.no-link {
  opacity: 0.5;
}
.btn-normal.no-link a {
  pointer-events: none;
}
.btn-normal.no-link:hover {
  filter: none;
}

.btn {
  width: 100%;
  max-width: 280px;
  padding-top: 0.5rem;
}
.btn a {
  position: relative;
  display: inline-block;
  padding: 0.5rem 3rem 0.5rem 1.8rem;
  box-sizing: border-box;
  color: #000000;
  background-color: #968264;
  width: 100%;
  transition: all 0.3s;
  border: 1px solid #968264;
}
.btn a::before {
  position: absolute;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  top: 50%;
  right: 1rem;
  margin-top: 2px;
  border-top: 1px solid #000000;
  border-right: 1px solid #000000;
  transform: rotate(45deg) translateY(-50%) translateX(-50%);
  -webkit-transform: rotate(45deg) translateY(-50%) translateX(-50%);
}
.btn a:hover {
  opacity: 0.8;
}

.video {
  display: block;
  position: relative;
  width: 100%;
  margin: 0 auto;
}
.video::before {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 1px;
  right: -1px;
  bottom: 1px;
  left: 1px;
  content: "";
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
  background: rgba(0, 0, 0, 0.2);
}
.video:hover::before {
  background: rgba(0, 0, 0, 0.1);
}

.is-hide {
  pointer-events: none;
}

/* ローディング画面 */
#loading {
  width: 100vw;
  height: 100vh;
  transition: all 1s;
  background-color: #000000;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

.spinner {
  width: 37px;
  height: 37px;
  margin: 46vh auto;
  background-color: transparent;
  border-radius: 50%;
  animation: sk-scaleout 1s infinite ease-in-out;
}
.spinner .circle-border {
  width: 40px;
  height: 40px;
  padding: 3px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background: #968264;
  background: linear-gradient(0deg, rgba(150, 130, 100, 0.1) 33%, rgba(150, 130, 100, 0.6) 100%);
  animation: spin 0.8s linear 0s infinite;
}
.spinner .circle-core {
  width: 100%;
  height: 100%;
  background-color: #000000;
  border-radius: 50%;
}

/* ローディングアニメーション */
@keyframes spin {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(359deg);
  }
}
.loaded {
  opacity: 0;
  visibility: hidden;
}

/*popup anime*/
/*====== Zoom effect ======*/
.mfp-zoom-in {
  /* start state */
  /* animate in */
  /* animate out */
}
.mfp-zoom-in .mfp-with-anim {
  opacity: 0;
  transition: all 0.3s ease-in-out;
  transform: scale(0.8);
}
.mfp-zoom-in.mfp-bg {
  opacity: 0;
  transition: all 0.3s ease-out;
}
.mfp-zoom-in.mfp-ready .mfp-with-anim {
  opacity: 1;
  transform: scale(1);
}
.mfp-zoom-in.mfp-ready.mfp-bg {
  opacity: 0.8;
}
.mfp-zoom-in.mfp-removing .mfp-with-anim {
  transform: scale(0.8);
  opacity: 0;
}
.mfp-zoom-in.mfp-removing.mfp-bg {
  opacity: 0;
}

/* gallery
/* overlay at start */
.mfp-bg {
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

/* overlay animate in */
.mfp-bg.mfp-ready {
  opacity: 0.8;
}

/* overlay animate out */
.mfp-bg.mfp-removing {
  opacity: 0;
}

/* content at start */
.mfp-wrap .mfp-content {
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

/* content animate it */
.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}

/* content animate out */
.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}

.category-important {
  color: #ab2b15;
  border: 1px solid #ab2b15;
}

.category-update, .category-version-update {
  color: #b1c9d1;
  border: 1px solid #b1c9d1;
}

.category-emergency, .category-completed, .category-failure, .category-follow_up, .category-recovery, .category-information {
  color: #b1c9d1;
  border: 1px solid #b1c9d1;
}

[v-cloak] {
  display: none;
}

img {
  vertical-align: top;
}

li {
  list-style: none;
}

a {
  text-decoration: none;
  transition: all 0.3s;
}
a:hover {
  color: #2882f0;
}

html {
  overflow: auto;
  height: 100%;
}

body {
  position: relative;
  height: 100%;
  font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", Arial, Verdana, Helvetica, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #f0f5fa;
  -webkit-text-size-adjust: 100%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  background: #000000;
}

.wrapper {
  overflow: hidden;
  position: relative;
}

.site-header {
  position: absolute;
  display: flex;
  justify-content: space-between;
  height: 46px;
  width: 100%;
  z-index: 200;
}
@media only screen and (min-width: 768px) {
  .site-header {
    height: 50px;
  }
}
.site-header .hdr-konami {
  width: 100%;
  max-width: 130px;
}
.site-header a {
  display: inline-block;
}
.site-header a .hdr-logo-ebaseball {
  position: absolute;
  top: 8px;
  right: 16px;
  display: block;
  width: 100%;
  max-width: 120px;
}
@media only screen and (min-width: 768px) {
  .site-header a .hdr-logo-ebaseball {
    max-width: 160px;
    transition: all 0.3s;
  }
  .site-header a .hdr-logo-ebaseball:hover {
    filter: brightness(120%);
  }
}
.site-header a .hdr-logo-ebaseball:lang(ko), .site-header a .hdr-logo-ebaseball:lang(zh-tw) {
  pointer-events: none;
}
.site-header .title_anniversary {
  display: block;
  margin: 36px 16px 0 auto;
  width: 100%;
  max-width: 80px;
  -webkit-animation: fadeInanime 1s ease-in 0.5s;
  -moz-animation: fadeInanime 1s ease-in 0.5s;
  animation: fadeInanime 1s ease-in 0.5s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
}
.site-header .title_anniversary img {
  width: 100%;
}
@media only screen and (min-width: 768px) {
  .site-header .title_anniversary {
    max-width: 120px;
    height: auto;
    margin: 40px 16px 0 auto;
  }
}

.announcement_link {
  position: relative;
  z-index: 200;
  width: 100%;
  background-color: #1d1d1d;
  color: #968264;
  top: 46px;
  text-align: center;
}
.announcement_link span {
  display: inline-block;
}
.announcement_link a {
  width: 100%;
  display: inline-block;
  padding: 0.8rem 0;
  box-sizing: border-box;
  transition: all 0.3s;
  /*aaa*/
  font-size: 1.125rem;
}
.announcement_link a:hover {
  color: #f0f5fa;
  background: rgba(150, 130, 100, 0.4);
}

.information-header {
  /*aaa*/
  font-size: 0.875rem;
  top: 0;
  max-width: 980px;
  margin: auto;
  position: relative;
  background: rgba(150, 130, 100, 0.4);
  display: flex;
}
.information-header a {
  width: 100%;
  display: inline-block;
  box-sizing: border-box;
  transition: all 0.3s;
  padding: 1.5rem 3.7rem 1.5rem 2rem;
  color: #f0f5fa;
}
.information-header a > div {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  transition: all 0.5s;
  height: auto;
  transition-delay: 0s;
  opacity: 1;
  visibility: visible;
  padding: 0 1rem;
}
@media only screen and (min-width: 768px) {
  .information-header a > div {
    flex-direction: row;
  }
}
.information-header .post-text {
  padding: 0;
  box-sizing: border-box;
  line-height: 1.8;
}
@media only screen and (min-width: 768px) {
  .information-header .post-text {
    padding: 0 0 0 2.5rem;
    box-sizing: border-box;
  }
}
.information-header .date {
  padding: 0 0 0.3rem;
  box-sizing: border-box;
  /*aaa*/
  font-size: 0.875rem;
  line-height: 1.8;
}

.ftr-dlBtn {
  padding: 15px 0;
}

.btn-home {
  position: relative;
  z-index: 1;
  width: 240px;
  margin: 0 auto 2rem;
}
.btn-home a {
  position: relative;
  display: block;
  padding: 10px;
  color: #f0f5fa;
  background: #2882f0;
  transition: all 0.3s;
  width: 100%;
  min-width: 40%;
  margin: 0 4px;
  box-sizing: border-box;
  max-height: 50px;
  transform: skewX(-30deg);
  background: url("/games/prospi/2024-2025/s/images/common/btn_base.png") no-repeat 0 0;
  font-family: a-otf-ud-shin-go-pr6n;
  font-weight: 500;
  font-style: normal;
  /*aaa*/
  font-size: 1rem;
  text-align: center;
}
.btn-home a span {
  display: inline-block;
  -webkit-transform: skew(30deg);
  transform: skew(30deg);
}
.btn-home a:hover {
  filter: brightness(120%);
}

footer {
  padding: 0 0 50px;
  box-sizing: border-box;
  /*aaa*/
  font-size: 0.625rem;
  text-align: center;
  background: black;
  position: relative;
  z-index: 300;
  color: #878c91;
}
footer::before {
  content: "";
  display: block;
  height: 1px;
  width: 100%;
  background-color: rgba(135, 140, 145, 0.5);
}
footer .share {
  padding: 2rem 0;
  display: flex;
  justify-content: center;
}
footer .share li {
  display: inline-block;
  width: 50px;
  height: 50px;
  margin: 0 10px;
}
footer .share li a {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 3px;
  background-size: 100% auto;
  box-shadow: 0 0 0 0 rgba(85, 85, 85, 0.3);
  transition: box-shadow 0.2s ease;
}
footer .share li a:hover {
  filter: drop-shadow(0 0 2px 3px #555);
}
footer .share li.twitter a {
  background-image: url("/games/prospi/2024-2025/s/images/common/sns_icon_x.png");
}
footer .share li.facebook a {
  background-image: url("/games/prospi/2024-2025/s/images/common/sns_icon_facebook.png");
}
@media screen and (min-width: 980px) {
  footer .share li.line {
    display: none;
  }
}
footer .share li.line a {
  background-image: url("/games/prospi/2024-2025/s/images/common/sns_icon_line.png");
}
footer .ftr-product {
  margin: 0 auto;
  max-width: 96%;
}
footer .ftr-product .ftr-product-list > li {
  position: relative;
  margin-bottom: 40px;
  padding-bottom: 15px;
  border: 1px solid #ea95ff;
  background: #1d1d1d;
}
footer .ftr-product .ftr-product-list > li table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
footer .ftr-product .ftr-product-list > li table th {
  padding: 4px;
  color: #ffffff;
  /*aaa*/
  font-size: 0.8125rem;
  font-weight: normal;
  border-bottom: 1px solid #ea95ff;
  background: #4d6777;
}
footer .ftr-product .ftr-product-list > li table td dl {
  padding: 10px;
}
footer .ftr-product .ftr-product-list > li table td dl dt {
  padding: 2px;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  color: #d2aa78;
  background: #a384ff;
}
footer .ftr-product .ftr-product-list > li table td dl dt.product-bonus {
  background: #248521;
}
footer .ftr-product .ftr-product-list > li table td dl dd {
  padding: 10px 5px;
  text-align: left;
}
footer .license_logo {
  margin: 2rem auto 0;
}
footer .license_logo ul {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  align-items: center;
  flex-direction: column;
}
footer .license_logo ul li {
  box-sizing: border-box;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  margin: 0 0.5rem;
  width: 50%;
  text-align: center;
}
footer .license_logo ul li::before {
  content: "";
  display: block;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center 0;
}
footer .license_logo ul li.eb {
  width: 100%;
  max-width: 302px;
  height: 44px;
}
footer .license_logo ul li.eb::before {
  width: 100%;
  max-width: 302px;
  height: 44px;
  background: url("/games/prospi/2024-2025/s/images/common/logo_ebaseball-engine_h.svg") 0 50% no-repeat;
  background-size: contain;
}
footer .license_logo ul li.ue {
  width: 100%;
  max-width: 220px;
  height: 88px;
}
footer .license_logo ul li.ue::before {
  width: 100%;
  max-width: 220px;
  height: 88px;
  background: url("/games/prospi/2024-2025/s/images/common/logo_ue_h.svg") 0 50% no-repeat;
  background-size: contain;
}
@media only screen and (min-width: 768px) {
  footer .license_logo ul {
    flex-direction: row;
  }
  footer .license_logo ul li {
    margin-bottom: 0;
  }
  footer .license_logo ul li.eb {
    max-width: calc($ue_logo_w * 1.3);
    height: calc($ue_logo_h * 1.3);
  }
  footer .license_logo ul li.eb::before {
    max-width: calc($ue_logo_w * 1.3);
    height: calc($ue_logo_h * 1.3);
  }
  footer .license_logo ul li.ue {
    max-width: 220px;
    height: 88px;
  }
  footer .license_logo ul li.ue::before {
    max-width: 220px;
    height: 88px;
  }
}
footer .pet {
  margin: 0 auto;
  padding: 0 2.5rem;
  box-sizing: border-box;
  max-width: 600px;
}
footer .pet:lang(ko), footer .pet:lang(zh-tw), footer .pet:lang(en) {
  margin-top: 2rem;
}
footer .pet picture img {
  width: 100%;
}
footer .copyright {
  padding: 0 10vw;
  box-sizing: border-box;
  text-align: left;
  line-height: 1.5em;
}
footer .copyright:not(:first-child) {
  margin-top: 2%;
}
footer .copyright span {
  display: inline-block;
}
footer .copyright .img-npb {
  height: 2em;
  padding-right: 1%;
  vertical-align: middle;
}
footer .copyright svg {
  position: relative;
  height: auto;
  max-height: 14px;
  fill: currentColor;
}
footer .copyright svg.icon-ps {
  max-width: 16px;
}
footer .copyright svg.logo-ps4, footer .copyright svg.logo-ps5 {
  max-width: 44px;
}
footer .ftr-bnr {
  margin: 20px auto 0;
}
footer .ftr-bnr ul li img {
  max-width: 100%;
}
footer .kde-nav,
footer .series-link {
  padding: 0 10vw;
  margin: 2rem 0 1rem;
}
footer .kde-nav ul,
footer .series-link ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
footer .kde-nav ul li,
footer .series-link ul li {
  width: 46%;
  padding: 6px;
  display: flex;
  align-content: stretch;
}
footer .kde-nav ul li a,
footer .kde-nav ul li button,
footer .series-link ul li a,
footer .series-link ul li button {
  display: inline-block;
  width: 100%;
}
footer .kde-nav ul li a span,
footer .kde-nav ul li button span,
footer .series-link ul li a span,
footer .series-link ul li button span {
  display: inline-block;
}
footer .kde-nav ul li #ot-sdk-btn,
footer .series-link ul li #ot-sdk-btn {
  color: #878c91;
  transition: 0.5s;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 6px;
  box-sizing: border-box;
  appearance: none;
  /*aaa*/
  font-size: 0.625rem;
  line-height: 1.2;
  display: inline-block;
  width: 100%;
  border-radius: 6px;
}
footer .kde-nav ul li #ot-sdk-btn:hover,
footer .series-link ul li #ot-sdk-btn:hover {
  color: #2882f0;
  background-color: transparent;
}
footer .kde-nav ul li #ot-sdk-btn.ot-sdk-show-settings,
footer .series-link ul li #ot-sdk-btn.ot-sdk-show-settings {
  background-color: transparent;
}
footer .series-link {
  margin: 20px 0 10px 0;
}
footer .series-link ul li {
  /*aaa*/
  font-size: 0.75rem;
  display: flex;
  align-items: stretch;
}
footer .series-link ul li a {
  display: inline-block;
  width: 100%;
  color: #878c91;
  padding: 12px 6px;
  box-sizing: border-box;
  border-radius: 6px;
  transition: all 0.3s;
}
footer .site-copyright {
  padding: 0 10vw 25px;
  line-height: 1.5;
}
footer .site-copyright span {
  display: inline-block;
}

@media only screen and (min-width: 768px) {
  footer {
    /*aaa*/
    font-size: 0.6875rem;
  }
  footer .ftr-product .ftr-product-list {
    display: flex;
    flex-wrap: wrap;
    max-width: 980px;
    margin: 0 auto 20px;
  }
  footer .ftr-product .ftr-product-list > li {
    width: 32.6%;
    margin: 0 10px 10px 0;
  }
  footer .ftr-product .ftr-product-list > li:last-child {
    margin-right: 0;
  }
  footer .ftr-product .ftr-product-list > li table th {
    /*aaa*/
    font-size: 0.9375rem;
  }
  footer .ftr-product .ftr-product-list > li .ftr-product-btn > li a {
    background: rgba(125, 230, 255, 0.3);
  }
  footer .ftr-product .ftr-product-list > li .ftr-product-btn > li a:hover {
    color: #ffffff;
    border: 1px solid #aaa;
    background: rgba(125, 230, 255, 0.5);
  }
  footer .ftr-product .ftr-product-note {
    max-width: 980px;
    margin: auto;
    padding-top: 10px;
  }
  footer .ftr-product .ftr-reservation {
    max-width: 33%;
    margin: 20px auto 30px;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
  }
  footer .ftr-product .ftr-reservation:hover {
    -moz-transform: scale(1.05, 1.05);
    -webkit-transform: scale(1.05, 1.05);
    -o-transform: scale(1.05, 1.05);
    -ms-transform: scale(1.05, 1.05);
  }
  footer .ftr-spec {
    max-width: 980px;
  }
  footer .ftr-spec .ftr-spec-pkg {
    float: left;
    width: 230px;
    margin-left: 15px;
  }
  footer .ftr-spec table {
    padding: 10px;
  }
  footer .ftr-spec table:after:after {
    content: "";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
  }
  footer .ftr-spec table tr th {
    padding-right: 10px;
  }
  footer .pet {
    max-width: 950px;
    margin: 0 auto;
    padding: 0 3rem;
    /*span {
      display: block;
      max-width: 950px;
      margin: 0 auto;
      $mainVisualAspectPc: 77 / 950; // メインビジュアル(背景)の縦横比

      align-items: center;
      padding-top: $mainVisualAspectPc * 100%;
      background: url('/games/prospi/2024-2025/s/images/common/petmark_pc.png') center 0 / 100% auto no-repeat;
    }*/
  }
  footer .copyright {
    padding: 0 3rem;
    max-width: 980px;
    margin: 0 auto;
  }
  footer .copyright:not(:first-child) {
    margin-top: 1%;
  }
  footer .ftr-bnr {
    width: 500px;
  }
  footer .kde-nav ul {
    max-width: 980px;
    margin: 0 auto;
    display: flex;
  }
  footer .kde-nav ul li {
    width: fit-content;
    border-right: 1px solid #878c91;
    padding: 0 0.5rem;
    box-sizing: border-box;
    text-align: center;
    margin-bottom: 1rem;
  }
  footer .kde-nav ul li:last-child {
    border-right: none;
  }
  footer .kde-nav ul li a,
footer .kde-nav ul li button {
    padding: 0;
    background: none;
    color: #878c91;
  }
  footer .kde-nav ul li a:hover,
footer .kde-nav ul li button:hover {
    color: #2882f0;
    background: none;
  }
  footer .kde-nav ul li a:after,
footer .kde-nav ul li button:after {
    top: 13px;
  }
  footer .kde-nav ul li #ot-sdk-btn {
    transition: all 0.2s;
    background: none;
    color: #878c91;
    padding: 0;
  }
  footer .kde-nav ul li #ot-sdk-btn:hover {
    color: #2882f0;
    background: none;
  }
  footer .series-link ul {
    max-width: 980px;
    margin: 0 auto;
  }
  footer .series-link ul li {
    /*aaa*/
    font-size: 0.75rem;
    max-width: calc(100% / 3);
  }
  footer .series-link ul li a {
    padding: 10px;
  }
  footer .series-link ul li a:after {
    top: 20px;
  }
}
.sub-heading {
  position: relative;
  display: flex;
  align-items: center;
  height: 200px;
  padding-top: calc(60px + 46px);
  z-index: 1;
  margin-bottom: 2rem;
}
.sub-heading .logo {
  margin: auto;
  width: 100%;
  max-width: 380px;
  padding: 0 1.5rem;
  box-sizing: border-box;
}
.sub-heading .logo img {
  border: none;
  width: 100%;
}
.sub-heading .logo img:hover {
  border: none;
}
.sub-heading .page-title {
  font-weight: bold;
  text-align: center;
  width: 100%;
  /*aaa*/
  font-size: 1.125rem;
  font-family: a-otf-ud-shin-go-pr6n;
  font-weight: 500;
  font-style: normal;
}
@media only screen and (min-width: 768px) {
  .sub-heading .page-title {
    /*aaa*/
    font-size: 1.75rem;
  }
}
@media only screen and (min-width: 768px) {
  .sub-heading {
    height: 230px;
  }
  .sub-heading .logo {
    max-width: 480px;
  }
}

.side_navi {
  position: fixed;
  top: calc(50% + (70px + .8rem));
  right: -100px;
  transform: translateY(-50%);
  z-index: 400;
  display: block;
  transition: all 0.3s;
  height: 100svh;
}
.side_navi .movie-popup-link {
  display: block;
  max-width: 36px;
  text-align: center;
  position: relative;
  padding-bottom: 6px;
  right: -15px;
  bottom: 0;
  transition: all 0.3s;
}
.side_navi .youtube_icon {
  max-width: 36px;
  width: 100%;
}
.side_navi .youtube_icon svg {
  transition: all 0.3s;
  fill: #878c91;
  max-width: 36px;
  width: 100%;
}
.side_navi .youtube_icon svg:hover {
  fill: #2882f0;
}
@media screen and (orientation: landscape) {
  .side_navi {
    max-height: 38vmin;
    height: 32lvh;
    top: 28lvh;
  }
}
.side_navi ul .side_navi_link {
  /*aaa*/
  font-size: 1.125rem;
}
.side_navi ul .side_navi_link a {
  display: block;
  position: relative;
  font-family: urw-din;
  font-weight: 500;
  font-style: normal;
  right: 0;
  overflow: hidden;
  color: #878c91;
  width: 50px;
  max-height: 56px;
  margin-bottom: 0;
  line-height: 56px;
  text-indent: 100%;
  text-align: center;
  opacity: 0.8;
  transition: all 0.3s;
}
.side_navi ul .side_navi_link a::before {
  content: "";
  display: block;
  position: absolute;
  top: 5px;
  right: 0;
  width: 6px;
  height: 48px;
  background-color: #878c91;
  transition: all 0.3s;
  transform: skewY(135deg);
}
@media screen and (orientation: landscape) {
  .side_navi ul .side_navi_link a {
    height: calc(48px * 0.75);
    line-height: calc(48px * 0.75);
  }
  .side_navi ul .side_navi_link a::before {
    top: 3px;
    height: calc(40px * 0.75);
  }
}
.side_navi ul .side_navi_link.active a {
  text-indent: 0%;
  opacity: 1;
  color: #2882f0;
}
.side_navi ul .side_navi_link.active a::before {
  background-color: #2882f0;
}
.side_navi .side_navi_guide {
  font-family: urw-din;
  font-weight: 500;
  font-style: normal;
  /*aaa*/
  font-size: 1rem;
  color: #878c91;
  transform: rotate(-90deg) translate(-32px, 10px);
}
@media only screen and (min-width: 980px) {
  .side_navi ul .side_navi_link {
    /*aaa*/
    font-size: 1.375rem;
  }
  .side_navi ul .side_navi_link a {
    width: 50px;
    height: 56px;
    line-height: 56px;
  }
  .side_navi ul .side_navi_link a::before {
    top: 5px;
    height: 48px;
  }
  .side_navi ul .side_navi_link a:hover {
    text-indent: 0;
    opacity: 1;
    color: #2882f0;
  }
  .side_navi ul .side_navi_link a:hover::before {
    background-color: #2882f0;
  }
}
@media only screen and (min-width: 980px) and (min-width: 1400px) {
  .side_navi {
    top: calc(50% - 83px);
    /*aaa*/
    font-size: 1.5rem;
  }
  .side_navi .side_navi_link a {
    width: 50px;
    height: 56px;
    line-height: 56px;
  }
  .side_navi .side_navi_link a::before {
    top: 5px;
    height: 48px;
  }
}

.view {
  right: 2%;
}

main {
  font-family: a-otf-ud-shin-go-pr6n;
  font-weight: 500;
  font-style: normal;
  position: relative;
}
main:lang(zh-tw) {
  font-family: true;
  font-weight: 500;
  font-style: normal;
}

.bg_video {
  width: 100%;
  height: 100vh;
  position: relative;
  overflow: hidden;
  z-index: 10;
}
@media only screen and (min-width: 768px) {
  .bg_video {
    height: 100%;
  }
}
.bg_video .video-wrap {
  position: relative;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  overflow: hidden;
  aspect-ratio: 9/16;
}
@media only screen and (min-width: 768px) {
  .bg_video .video-wrap {
    aspect-ratio: 16/9;
    /* 縦横比（アスペクト比） */
  }
}
.bg_video .video-wrap video {
  position: absolute;
  z-index: -1;
  min-width: 100%;
  min-height: 100%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  aspect-ratio: 9/16;
  width: 177.77777778vh;
  height: 56.25vw;
  object-fit: cover;
}
@media only screen and (min-width: 768px) {
  .bg_video .video-wrap video {
    aspect-ratio: 16/9;
    /* 縦横比（アスペクト比） */
  }
}
.bg_video.block {
  position: absolute;
}
.bg_video.fixed {
  position: fixed;
}

#bg_video {
  position: relative;
  z-index: -1;
  /*最背面に設定*/
  width: 100%;
  height: 100%;
}
#bg_video .video-wrap {
  position: fixed;
  z-index: -1;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  overflow: hidden;
}
#bg_video .video-wrap::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background: url("/games/prospi/2024-2025/s/images/common/dot.png") repeat 0 0;
}
#bg_video .video-wrap video {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /*縦横幅指定*/
  /*      width: calc(16vh / 9); !* 16:9 の幅　*!
        height: calc(9vw / 16); !* 16:9の高さ　*!*/
  width: 177.77777778vh;
  height: 56.25vw;
  min-width: 100vw;
  min-height: 100dvh;
}
@media only screen and (min-width: 768px) {
  #bg_video .video-wrap video {
    width: 100%;
    height: auto;
  }
}

.mfp-arrow::after {
  border: none;
}
.mfp-arrow::before {
  display: none;
}

.mfp-arrow-left {
  transition: all 0.3s;
  /*&:hover::after {
    border-color: $clLink;
  }*/
}
.mfp-arrow-left::after {
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  transform: rotate(-135deg);
  border-left: none;
  width: 20px;
  height: 20px;
}

.mfp-arrow-right {
  transition: all 0.3s;
  /* &:hover::after {
     border-color: $clLink;
   }*/
}
.mfp-arrow-right::after {
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  transform: rotate(45deg);
  border-left: none;
  width: 20px;
  height: 20px;
}

.section_trailer {
  width: 100%;
  position: relative;
  z-index: 10;
}
.section_trailer .trailer {
  padding: 0 16vw;
  box-sizing: border-box;
}
.section_trailer .trailer ul {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: nowrap;
  margin: auto;
  justify-content: center;
}
.section_trailer .trailer ul li {
  max-width: 320px;
}
.section_trailer .trailer ul li img {
  width: 100%;
}
@media only screen and (min-width: 768px) {
  .section_trailer .trailer ul {
    flex-direction: row;
    /* li {
       max-width: 880px;
     }*/
  }
}
.section_trailer .trailer ul .videos_ttl {
  padding: 1rem;
  text-align: center;
  color: #968264;
  /*aaa*/
  font-size: 1rem;
}
.section_trailer .trailer ul .videos_ttl span {
  display: inline-block;
  position: relative;
}
.section_trailer .trailer ul .videos_ttl span::before, .section_trailer .trailer ul .videos_ttl span::after {
  position: absolute;
  content: "";
  display: block;
  background-size: cover;
  vertical-align: middle;
  top: -5px;
  left: -3rem;
  height: 38px;
  width: 38px;
}
.section_trailer .trailer ul .videos_ttl span::before {
  background-image: url(/games/prospi/2024-2025/s/images/common/icon_play.png);
}

.js-fadeIn {
  filter: blur(4px);
  opacity: 0;
  transform: scale(1.1);
  transition: all 0.6s ease-out, opacity 0.3s linear, filter 0.7s linear;
}

.scroll-in {
  filter: blur(0);
  opacity: 1;
  transform: translate(0, 0) scale(1);
}

.scroll-out {
  -webkit-animation: fadeUpanime 1.2s ease-in-out 0s;
  -moz-animation: fadeUpanime 1.2s ease-in-out 0s;
  animation: fadeUpanime 1.2s ease-in-out 0s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
  pointer-events: none;
}

.fade-in {
  -webkit-animation: fadeInanime 1.2s ease-in-out 0s;
  -moz-animation: fadeInanime 1.2s ease-in-out 0s;
  animation: fadeInanime 1.2s ease-in-out 0s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
}

.fade-out {
  -webkit-animation: fadeOutanime 1s ease-in-out 0s;
  -moz-animation: fadeOutanime 1s ease-in-out 0s;
  animation: fadeOutanime 1s ease-in-out 0s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
}

.pc {
  display: none;
}

.sp {
  display: block;
}

.info-popup {
  position: relative;
  z-index: 1;
  text-align: center;
  margin: 0 auto 2rem;
  max-width: 400px;
  /*aaa*/
  font-size: 0.75rem;
  width: 100%;
}
.info-popup a {
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.3);
  padding: 0.8rem;
  box-sizing: border-box;
  max-width: 420px;
  width: 76%;
}
.info-popup a span {
  display: inline-block;
}
.info-popup a:hover {
  color: #ffffff;
  background-color: rgba(255, 255, 255, 0.3);
}

#inline-wrap {
  width: 80%;
  max-width: 600px;
  margin: 0 auto;
}
#inline-wrap h1 {
  text-align: center;
  /*aaa*/
  font-size: 1.125rem;
  padding-bottom: 1rem;
}
#inline-wrap h1 span {
  display: inline-block;
}
#inline-wrap p {
  padding-bottom: 0.8rem;
}
#inline-wrap .popup-modal-dismiss {
  margin: 2rem auto;
  text-align: center;
  /*aaa*/
  font-size: 0.75rem;
}
#inline-wrap .popup-modal-dismiss a {
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.3);
  padding: 0.8rem;
  box-sizing: border-box;
  min-width: 200px;
}
#inline-wrap .popup-modal-dismiss a:hover {
  color: #ffffff;
  background-color: rgba(255, 255, 255, 0.3);
}

.main-visual {
  position: relative;
  min-height: 100dvh;
}
.main-visual .main-element {
  position: relative;
  z-index: 100;
}
.main-visual .main-element .title_wrapper {
  min-height: 100svh;
  position: relative;
}
.main-visual .main-element .title_wrapper .scroll-sign {
  position: absolute;
  left: 50%;
  height: 22px;
  bottom: 8svh;
  z-index: 100;
  text-indent: 100%;
  white-space: nowrap;
  transition: all 0.3s;
}
.main-visual .main-element .title_wrapper .scroll-sign.off {
  opacity: 0;
}
.main-visual .main-element .title_wrapper .scroll-sign a {
  position: relative;
  display: inline-block;
}
.main-visual .main-element .title_wrapper .scroll-sign a::before {
  position: absolute;
  content: "";
  display: block;
  top: 0;
  left: 0;
  width: 16px;
  height: 16px;
  transform: rotate(45deg);
  border-bottom: 2px solid #968264;
  border-right: 2px solid #968264;
  transition: all 0.5s;
}
.main-visual .main-element .title_wrapper .scroll-sign a:hover::before {
  border-color: #2882f0;
}
.main-visual .main-element .title_wrapper .scroll-sign span {
  position: absolute;
  font-family: urw-din;
  font-weight: 500;
  font-style: normal;
  color: #968264;
  text-transform: uppercase;
  /* -ms-writing-mode: tb-rl;
  -webkit-writing-mode: sideways-lr;
  writing-mode: sideways-lr;*/
  transform: rotate(-90deg);
  top: -0.5rem;
  left: -1.1rem;
  transition: all 0.5s;
  animation: scrollarrow 1.5s ease-in-out infinite;
}
.main-visual .main-element .title_wrapper .title_anniversary {
  display: block;
  padding-bottom: 1rem;
  margin: auto;
  width: 100%;
  max-width: 160px;
  -webkit-animation: fadeInanime 1s ease-in 0.5s;
  -moz-animation: fadeInanime 1s ease-in 0.5s;
  animation: fadeInanime 1s ease-in 0.5s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
}
.main-visual .main-element .title_wrapper .title_anniversary img {
  width: 100%;
}
.main-visual .main-element .title_wrapper .title {
  width: 80%;
  position: absolute;
  top: calc(50% - 50px);
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: #c8aa90;
  box-sizing: border-box;
}
.main-visual .main-element .title_wrapper .title .title_1 {
  display: block;
  margin: 0 auto;
  width: 100%;
  color: #968264;
  /*aaa*/
  font-size: 2rem;
  font-family: urw-din;
  font-weight: 500;
  font-style: normal;
  -webkit-animation: fadeInanime 1s ease-in 1s;
  -moz-animation: fadeInanime 1s ease-in 1s;
  animation: fadeInanime 1s ease-in 1s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
  line-height: 1.2;
}
.main-visual .main-element .title_wrapper .title .title_1 span {
  display: inline-block;
}
.main-visual .bg_box {
  contain: paint;
  pointer-events: none;
  transition: all 3s ease-in-out;
  opacity: 0;
  margin: 0 auto;
  padding: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  max-height: 100vh;
  overflow: hidden;
  background-color: #000000;
  z-index: -1;
}
.main-visual .bg_box img {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  -o-object-fit: cover;
  object-fit: cover;
}
.main-visual .bg_fixed {
  position: relative;
  height: 100vh;
  overflow: hidden;
}
.main-visual .contents_wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.main-visual .bg_anime {
  position: absolute;
  top: 0;
  display: none;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  transition: none;
  opacity: 0;
}
.main-visual .bg_anime.bg_active {
  position: fixed;
  top: 0;
  opacity: 1;
}
.main-visual .bg_anime.bg_block {
  display: block;
}
.main-visual .key-img {
  position: relative;
  z-index: 1;
}
.main-visual .movie-wrapper {
  height: 100%;
  min-height: 100dvh;
  z-index: 200;
  position: relative;
  padding-top: calc((100vh - 60vh) / 2);
  box-sizing: border-box;
  max-width: 100%;
  margin: auto;
}
.main-visual .movie-wrapper .top-movie {
  width: 70%;
  margin: 0 auto;
  position: relative;
}
.main-visual .movie-wrapper .top-movie .dot {
  display: inline-block;
}
.main-visual .movie-wrapper .top-movie .dot::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("/games/prospi/2024-2025/s/images/common/dot.png") repeat 0 0;
}
.main-visual .movie-wrapper .top-movie.new::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  width: 24px;
  height: 24px;
  top: -8px;
  left: -10px;
  right: auto;
  z-index: 11;
  background-image: url("/games/prospi/2024-2025/s/images/common/icon_new.png");
  background-size: cover;
  transition: all 0.3s;
}
.main-visual .movie-wrapper .top-movie .youtube {
  display: inline-block;
  width: 100%;
  margin: 0 auto;
  z-index: 1;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.4);
}
.main-visual .movie-wrapper .top-movie .youtube::before, .main-visual .movie-wrapper .top-movie .youtube::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  margin: auto;
  content: "";
  vertical-align: middle;
  z-index: 1;
}
.main-visual .movie-wrapper .top-movie .youtube::before {
  width: 4rem;
  height: 4rem;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.3);
  border: 2px solid #ffffff;
  transform: translateX(-25px);
  transition: background-color 0.5s ease;
}
.main-visual .movie-wrapper .top-movie .youtube::after {
  left: 50%;
  box-sizing: border-box;
  width: 10px;
  height: 10px;
  border: 10px solid transparent;
  border-left: 18px solid #ffffff;
}
.main-visual .movie-wrapper .top-movie .youtube:hover::before {
  background: rgba(0, 0, 0, 0.6);
}
.main-visual .movie-wrapper .top-movie .youtube img {
  width: 100%;
}
.main-visual .movie-wrapper .top-movie .youtube h1 {
  display: block;
  /*aaa*/
  font-size: 0.875rem;
}
.main-visual .movie-wrapper .top-movie .youtube h1 span {
  padding: 10px 35px 8px 25px;
  box-sizing: border-box;
}
.main-visual .movie-wrapper .top-movie .video_text {
  padding: 0.5rem 1rem 0;
  box-sizing: border-box;
  text-align: center;
  color: #968264;
  /*aaa*/
  font-size: 1rem;
  z-index: 1;
}
.main-visual .movie-wrapper .top-movie .video_text span {
  z-index: 10;
  display: inline-block;
  position: relative;
}
.main-visual .movie-wrapper .top-movie .video_text.new span::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  width: 22px;
  height: 22px;
  top: 0;
  left: -1.5rem;
  right: auto;
  z-index: 11;
  background-image: url("/games/prospi/2024-2025/s/images/common/icon_new.png");
  background-size: cover;
  transition: all 0.3s;
}
.main-visual .movie-wrapper .top-movie-more {
  max-width: 980px;
  width: 100%;
  margin: 2rem auto;
  text-align: center;
  display: block;
}
.main-visual .movie-wrapper .top-movie-more .top-movie_more-txt {
  font-family: urw-din;
  font-weight: 500;
  font-style: normal;
  vertical-align: top;
  line-height: 26px;
  padding-left: 0.5rem;
  display: inline-block;
}
.main-visual .movie-wrapper .top-movie-more a {
  color: #878c91;
  display: inline-block;
  transition: all 0.3s;
}
.main-visual .movie-wrapper .top-movie-more a svg {
  transition: all 0.3s;
  fill: #878c91;
  max-width: 36px;
  width: 100%;
}
.main-visual .movie-wrapper .top-movie-more a:hover svg {
  fill: #2882f0;
}
.main-visual .movie-wrapper .top-movie-more a:hover {
  color: #2882f0;
}
.main-visual .logo_prospi_2024-2025 {
  margin: 2vh auto 10vh;
  max-width: 620px;
  width: 70%;
}
.main-visual .logo_prospi_2024-2025 img {
  width: 100%;
}
.main-visual .logo-area {
  height: 100vh;
  position: relative;
  margin: auto;
  width: 100%;
  box-sizing: border-box;
  z-index: 3;
}
.main-visual .logo-area .logo_ebaseball {
  width: 75%;
  max-width: 280px;
  margin: 0 auto;
  text-align: center;
}
.main-visual .logo-area .copy_play {
  width: 80vw;
  max-width: 480px;
  padding: 30vh 4rem 3vh;
  box-sizing: border-box;
  margin: 0 auto;
}
.main-visual .release_date {
  text-align: center;
  padding: 32vh 2rem 0;
  max-width: 420px;
  margin: 0 auto;
}
.main-visual .platform_data {
  position: relative;
  left: 0;
  margin: 3vh auto 10vh;
  height: 60vh;
}
.main-visual .platform_data .date {
  position: relative;
  max-width: 520px;
  margin: 0 auto;
}
.main-visual .platform_data .date img {
  width: 100%;
}
.main-visual .platform_data .platform {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  padding: 0 0 2vh;
  align-items: center;
  max-width: 50vw;
  margin: 0 auto;
}
.main-visual .platform_data .platform li {
  color: #ffffff;
  max-width: 200px;
  margin: 0 2%;
  box-sizing: border-box;
  /*&.steam {
    width: 134px;
  }*/
}
.main-visual .platform_data .platform li svg {
  fill: currentColor;
}
@media only screen and (min-width: 768px) {
  .main-visual .logo-area {
    height: 120vh;
  }
  .main-visual .logo-area .copy_play {
    padding: 16vh 4rem 3vh;
  }
  .main-visual .release_date {
    max-width: 580px;
    padding: 0 2rem;
  }
  .main-visual .bg_box img {
    width: 100%;
    height: 100vh;
    -o-object-fit: cover;
    object-fit: cover;
  }
  .main-visual .movie-wrapper .top-movie {
    max-width: 980px;
    width: 100%;
  }
  .main-visual .movie-wrapper .top-movie .youtube {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    z-index: 10;
  }
  .main-visual .movie-wrapper .top-movie .youtube::before, .main-visual .movie-wrapper .top-movie .youtube::after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    margin: auto;
    content: "";
    vertical-align: middle;
    z-index: 1;
  }
  .main-visual .movie-wrapper .top-movie .youtube::before {
    width: 6rem;
    height: 6rem;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.3);
    border: 2px solid #ffffff;
    transform: translateX(-36px);
    transition: background-color 0.5s ease;
  }
  .main-visual .movie-wrapper .top-movie .youtube::after {
    left: 50%;
    box-sizing: border-box;
    width: 18px;
    height: 18px;
    border: 18px solid transparent;
    border-left: 30px solid #ffffff;
  }
  .main-visual .movie-wrapper .top-movie .youtube:hover::before {
    background: rgba(0, 0, 0, 0.6);
  }
  .main-visual .movie-wrapper .top-movie .youtube h1 {
    display: block;
    /*aaa*/
    font-size: 0.875rem;
  }
  .main-visual .movie-wrapper .top-movie .youtube h1 span {
    padding: 10px 35px 8px 25px;
  }
}
@media only screen and (min-width: 768px) and (min-width: 980px) {
  .main-visual .main-visual .logo_prospi_2024-2025 {
    margin: 2vh auto 40vh;
    max-width: 620px;
    width: 80%;
  }
  .main-visual .main-visual .platform {
    max-width: 500px;
  }
}

.information {
  padding-top: 3vh;
  position: relative;
  z-index: 99;
  /* 重要なお知らせ　*/
}
.information .information-title {
  display: inline-block;
  width: 260px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  text-align: center;
  margin: 0 auto 0.5rem;
  background: url("/games/prospi/2024-2025/s/images/topics/information.svg") no-repeat center center;
  background-size: contain;
}
.information .information-wrapper {
  max-width: 980px;
  margin: auto;
  padding: 1.5rem 3.7rem 1.5rem 2rem;
  box-sizing: border-box;
  background: rgba(255, 255, 255, 0.2) url("/games/prospi/2024-2025/s/images/common/dot.png") repeat 0 0;
}
.information .information-wrapper .post-list {
  max-height: 670px;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: 1.5rem;
  box-sizing: border-box;
}
.information .information-wrapper .post-list::-webkit-scrollbar {
  background: rgba(0, 0, 0, 0.3);
  width: 5px;
  height: 5px;
  border-radius: 10px;
}
.information .information-wrapper .post-list::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.6);
  border-radius: 10px;
  transition: all 0.3s;
}
.information .information-wrapper .post-list::-webkit-scrollbar-thumb:hover {
  background-color: #ffffff;
}
.information .information-wrapper .post-list .post {
  display: flex;
  flex-direction: column;
  padding: 1rem 0;
  box-sizing: border-box;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  transition: all 0.5s;
  height: auto;
  transition-delay: 0s;
  opacity: 1;
  visibility: visible;
}
.information .information-wrapper .post-list .post:first-child {
  padding-top: 0;
}
.information .information-wrapper .post-list .post:last-child {
  border-bottom: none;
}
.information .information-wrapper .post-list .post .date {
  color: #968264;
}
.information .information-wrapper .post-list .post .post-text {
  line-height: 1.8;
  /*aaa*/
  font-size: 0.875rem;
}
.information .information-wrapper .post-list .post .post-text.uppercase {
  text-transform: uppercase;
}
.information .information-wrapper .post-list .post.hidden {
  display: none;
  transition: opacity 1s, visibility 0s ease 1s;
  visibility: hidden;
  opacity: 0;
}
.information .information-wrapper .more {
  display: block;
  padding-top: 1rem;
  text-align: center;
  color: #968264;
  margin: auto;
}
.information .information-wrapper .more a {
  position: relative;
  display: inline-block;
  line-height: 30px;
  padding-left: 30px;
  transition: all 0.3s;
  text-transform: uppercase;
  cursor: pointer;
  /*@include before(before) {
    top: 2px;
    left: 0;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    background-image: url("/games/prospi/2024-2025/s/images/common/icon_more.svg");

    &:hover {
      color: $clLink;
      background-color: $clLink;
    }
  }*/
}
.information .information-wrapper .more a:hover {
  color: #2882f0;
  pointer-events: auto;
}
.information .information-wrapper .more a:hover .icon {
  background-color: #2882f0;
}
.information .information-wrapper .more a .icon {
  position: relative;
  top: 7px;
  left: -8px;
  display: inline-block;
  background: #968264;
  mask-size: cover;
  width: 26px;
  height: 26px;
  mask: url("/games/prospi/2024-2025/s/images/common/icon_more.svg");
  transition: all 0.3s;
}
.information .information-wrapper .more a .icon.close {
  left: -6px;
  mask: url("/games/prospi/2024-2025/s/images/common/icon_close.svg");
}
@media only screen and (min-width: 768px) {
  .information .information-wrapper {
    max-width: 980px;
    margin: auto;
    padding: 1.5rem 4rem 2.5rem 2rem;
  }
  .information .information-wrapper .post-list {
    max-height: 570px;
    padding-right: 1.5rem;
  }
  .information .information-wrapper .post-list .post {
    padding: 1rem;
    flex-direction: row;
  }
}
@media only screen and (min-width: 768px) and (min-width: 980px) {
  .information .information-wrapper {
    padding: 1.5rem 3.7rem 1.5rem 2rem;
  }
}
@media only screen and (min-width: 768px) and (min-width: 1400px) {
  .information .information-wrapper {
    padding: 1.5rem;
  }
}
.information.popup {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  /*&::before {
    position: absolute;
    content: '';
    display: block;
    height: 100%;
    width: 100%;
    background-color: rgba($clBase1, 0.6);
    z-index: -1;
  }*/
}
.information.popup .information-wrapper {
  background: rgba(0, 0, 0, 0.3) url("/games/prospi/2024-2025/s/images/common/dot.png") repeat 0 0;
  border: 1px solid rgba(255, 255, 255, 0.3);
}
.information.popup .popup-modal-dismiss {
  margin: 2rem auto 0;
  text-align: center;
  /*aaa*/
  font-size: 0.75rem;
}
.information.popup .popup-modal-dismiss a {
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.3);
  padding: 0.8rem;
  box-sizing: border-box;
  min-width: 200px;
  background-color: rgba(0, 0, 0, 0.3);
}
.information.popup .popup-modal-dismiss a:hover {
  color: #ffffff;
  background-color: rgba(255, 255, 255, 0.3);
}
.information .category {
  margin: 0 auto;
  max-width: 800px;
  padding: 8vh 6vw;
  box-sizing: border-box;
}
.information .category ul {
  display: grid;
  grid-template-rows: repeat(3, 1fr);
  grid-template-columns: repeat(2, 1fr);
  gap: 1.3rem;
  padding: 0 1.8rem;
  box-sizing: border-box;
  margin-bottom: 1.3rem;
}
.information .category ul .category-box .card {
  position: relative;
}
.information .category ul .category-box .card.new::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  width: 24px;
  height: 24px;
  top: -10px;
  left: -10px;
  right: auto;
  z-index: 1;
  background-image: url("/games/prospi/2024-2025/s/images/common/icon_new.png");
  background-size: cover;
  transition: all 0.3s;
}
.information .category ul .category-box .card.new:hover:before {
  transform: scale(1.2);
  filter: brightness(130%);
}
.information .category ul .category-box .card .image {
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.3);
  position: relative;
}
.information .category ul .category-box .card .image::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all 0.3s;
}
.information .category ul .category-box .card .image img {
  transition: all 0.5s;
  width: 100%;
}
.information .category ul .category-box .card .image:hover {
  border: 1px solid rgba(255, 255, 255, 0.6);
}
.information .category ul .category-box .card .image:hover img {
  transform: scale(1.1);
  filter: brightness(130%);
}
.information .category ul.topics-link {
  display: grid;
  grid-template-rows: repeat(2, 1fr);
  grid-template-columns: repeat(1, 1fr);
  min-width: 260px;
}
.information .category ul.topics-link li {
  position: relative;
  border: 1px solid #515151;
  background-color: rgba(81, 81, 81, 0.3);
  transition: all 0.3s;
  min-height: 74px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.information .category ul.topics-link li:hover {
  background-color: rgba(81, 81, 81, 0.6);
}
.information .category ul.topics-link li div {
  line-height: 0;
  width: 100%;
  display: flex;
  align-items: center;
}
.information .category ul.topics-link li div a {
  position: relative;
  width: 100%;
  /*aaa*/
  font-size: 1rem;
  min-height: 74px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.information .category ul.topics-link li div a span {
  position: relative;
  padding-left: calc(38px + .8rem);
  box-sizing: border-box;
}
.information .category ul.topics-link li div a span::before {
  position: absolute;
  content: "";
  display: block;
  width: 38px;
  height: 38px;
  top: 0;
  left: 0;
  transform: translateY(-50%);
}
.information .category ul.topics-link li .update-link {
  transition: all 0.3s;
  opacity: 0.7;
}
.information .category ul.topics-link li .update-link:hover {
  opacity: 1;
}
.information .category ul.topics-link li .update-link a span::before {
  background: url("/games/prospi/2024-2025/s/images/topics/icon_update.png") center center no-repeat;
  background-size: 100% auto;
}
.information .category ul.topics-link li .dlc {
  transition: all 0.3s;
  opacity: 0.7;
}
.information .category ul.topics-link li .dlc:hover {
  opacity: 1;
}
.information .category ul.topics-link li .dlc a span::before {
  background: url("/games/prospi/2024-2025/s/images/topics/icon_dlc.png") center center no-repeat;
  background-size: 100% auto;
}
.information .category ul.topics-link li .faq {
  transition: all 0.3s;
  opacity: 0.7;
}
.information .category ul.topics-link li .faq:hover {
  opacity: 1;
}
.information .category ul.topics-link li .faq a span {
  /*aaa*/
  font-size: 1.125rem;
}
.information .category ul.topics-link li .faq a span::before {
  background: url("/games/prospi/2024-2025/s/images/topics/icon_faq.png") center center no-repeat;
  background-size: 100% auto;
}
.information .category ul.topics-link li .tips {
  transition: all 0.3s;
  opacity: 0.7;
}
.information .category ul.topics-link li .tips:hover {
  opacity: 1;
}
.information .category ul.topics-link li .tips a span::before {
  background: url("/games/prospi/2024-2025/s/images/topics/icon_tips.png") center center no-repeat;
  background-size: 100% auto;
}
.information .category ul.topics-link li.guide .mv_guide {
  min-width: 230px;
}
.information .category ul.topics-link li.guide .mv_guide a {
  opacity: 0.7;
  line-height: 1.5;
  z-index: 1;
  box-sizing: border-box;
  justify-content: left;
  padding-left: 1.8rem;
}
.information .category ul.topics-link li.guide .mv_guide a span {
  padding-left: 0;
  /*aaa*/
  font-size: 0.9375rem;
}
.information .category ul.topics-link li.guide .mv_guide a span em {
  display: block;
}
.information .category ul.topics-link li.guide .mv_guide a span::before {
  display: none;
}
.information .category ul.topics-link li.guide .mv_guide a::before {
  display: none;
}
.information .category ul.topics-link li.guide .mv_guide::after {
  position: absolute;
  content: "";
  display: block;
  width: 100%;
  background: url("/games/prospi/2024-2025/s/images/topics/btn_mv_guideline_2.png") 82% 15px no-repeat;
  background-size: auto 95%;
  bottom: 0;
  right: 0;
  height: 74px;
  transition: all 0.3s;
}
.information .category ul.topics-link li.guide .mv_guide:hover::after {
  opacity: 1;
  background-position: 82% 10px;
}
@media only screen and (min-width: 768px) {
  .information .category ul.topics-link.topics-link {
    grid-template-columns: repeat(2, 1fr);
  }
  .information .category ul.topics-link.topics-link li {
    justify-content: center;
  }
  .information .category ul.topics-link.topics-link li div {
    min-width: auto;
  }
  .information .category ul.topics-link.topics-link li div a {
    min-width: auto;
    /*aaa*/
    font-size: 1rem;
  }
  .information .category ul.topics-link.topics-link li div a span {
    min-width: auto;
  }
  .information .category ul.topics-link.topics-link li .dlc a {
    min-height: 2rem;
    line-height: 1.3;
    padding-left: 0;
    height: 74px;
  }
  .information .category ul.topics-link.topics-link li .dlc a span {
    position: relative;
    padding-left: calc(38px + .8rem);
  }
  .information .category ul.topics-link.topics-link li .dlc a span em {
    display: block;
  }
  .information .category ul.topics-link.topics-link li .dlc a span::before {
    transform: translateY(0);
  }
  .information .category ul.topics-link.topics-link li.guide .mv_guide a {
    min-height: 2rem;
    height: 74px;
  }
  .information .category ul.topics-link.topics-link li.guide .mv_guide a span {
    /*aaa*/
    font-size: 0.9375rem;
    min-width: 14rem;
    padding-left: 2.5rem;
  }
  .information .category ul.topics-link.topics-link li.guide .mv_guide a span em {
    display: block;
    letter-spacing: 0;
  }
  .information .category ul.topics-link.topics-link li.guide .mv_guide::after {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    background: url("/games/prospi/2024-2025/s/images/topics/btn_mv_guideline_2.png") 82% 15px no-repeat;
    background-size: auto 95%;
    bottom: 0;
    right: 0;
    height: 74px;
    transition: all 0.3s;
  }
  .information .category ul.topics-link.topics-link li.guide .mv_guide:hover::after {
    opacity: 1;
    background-position: 82% 10px;
  }
}
.information .attention {
  font-weight: bold;
  /*aaa*/
  font-size: 1rem;
  text-align: center;
  margin: 1rem auto;
  width: clamp(70vw, 75%, 800px);
}
.information .attention a {
  display: inline-block;
  line-height: 1.3;
  padding: 1rem;
  max-width: 750px;
  color: rgba(230, 130, 60, 0.8);
  position: relative;
  border: 1px solid rgba(230, 130, 60, 0.5);
  background-color: rgba(81, 81, 81, 0.3);
  transition: all 0.3s;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.information .attention a:hover {
  color: #e6823c;
  background-color: rgba(81, 81, 81, 0.6);
  border: 1px solid rgba(230, 130, 60, 0.8);
}
@media only screen and (min-width: 768px) {
  .information .information-title {
    width: 100%;
    margin-bottom: 1rem;
  }
  .information .information-wrapper ul .post {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .information .information-wrapper ul .post .date {
    color: #968264;
  }
  .information .information-wrapper ul .post .post-text {
    /*aaa*/
    font-size: 0.875rem;
    box-sizing: border-box;
    padding-left: 1.5rem;
  }
  .information .information-wrapper ul .post .post-text + .post-text {
    width: calc(100% - 1rem);
    padding-left: calc(96px + 1rem);
  }
  .information .category {
    padding: 8vh 0;
    box-sizing: border-box;
  }
  .information .category ul {
    display: grid;
    grid-template-rows: repeat(2, 1fr);
    grid-template-columns: repeat(3, 1fr);
  }
}

.contents::before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: url("/games/prospi/2024-2025/s/images/common/bg_right.png"), url("/games/prospi/2024-2025/s/images/common/bg_left.png");
  background-repeat: repeat-y, repeat-y;
  background-position: 200% top, -200% top;
  background-size: 100% auto, 100% auto;
  z-index: 1;
  transition: all 1s ease-in-out;
  opacity: 0;
}
@media only screen and (min-width: 768px) {
  .contents::before {
    background-position: right top, left top;
    background-size: 35% auto, 35% auto;
  }
}
.contents.active::before {
  opacity: 1;
}
.contents .chapter-bg-wraper {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  z-index: 10;
}
.contents .chapter-bg-wraper .bg-inner {
  position: relative;
  width: 100%;
  height: 100vh;
}
.contents .chapter-bg-wraper .bg-inner .bg-block {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  clip-path: inset(100% 0 0 0);
  text-align: center;
  background: #000;
}
.contents .chapter-bg-wraper .bg-inner .bg-block video {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  object-fit: cover;
}
.contents .chapter-bg-wraper .bg-inner .bg-block::before, .contents .chapter-bg-wraper .bg-inner .bg-block:after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.contents .chapter-bg-wraper .bg-inner .bg-block:after {
  background: rgba(0, 0, 0, 0.4) url("/games/prospi/2024-2025/s/images/common/dot.png") repeat 0 0;
}
.contents .chapter-bg-wraper .bg-inner .bg-block.ch2::before {
  background: url("/games/prospi/2024-2025/s/images/common/detail_bg_sp.png") center top no-repeat;
  background-size: cover;
}
@media screen and (orientation: portrait) {
  .contents .chapter-bg-wraper .bg-inner .bg-block.ch2::before {
    background: url("/games/prospi/2024-2025/s/images/common/detail_bg_sp.png") center top no-repeat;
    background-size: cover;
  }
}
@media screen and (orientation: landscape) {
  .contents .chapter-bg-wraper .bg-inner .bg-block.ch2::before {
    background-image: url("/games/prospi/2024-2025/s/images/common/bg_detail.jpg");
    background-size: 100%;
  }
}
.contents .note {
  /*aaa*/
  font-size: 0.875rem;
  line-height: 1.5;
}
.contents .note ul li {
  text-indent: -1rem;
  padding-left: 1rem;
}
.contents section[class^=chapter] {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  transition: all 0.5s;
}
.contents section[class^=chapter] .chapter-num {
  position: relative;
  top: 2%;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
  color: #878c91;
  font-family: urw-din;
  font-weight: 500;
  font-style: normal;
  /*aaa*/
  font-size: 1rem;
  padding: 0 12px;
}
.contents section[class^=chapter] .chapter-num::before {
  content: "";
  display: block;
  position: absolute;
  height: 1px;
  right: 0;
  top: 50%;
  width: calc(50% - 2.5rem);
  background-color: #878c91;
}
.contents section[class^=chapter] .chapter-num::after {
  content: "";
  display: block;
  position: absolute;
  height: 1px;
  width: calc(50% - 2.5rem);
  top: 50%;
  left: 0;
  background-color: #878c91;
}
.contents section[class^=chapter] .chapter-num::before {
  content: "";
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100lvh;
  min-height: 80rem;
  z-index: -100;
  position: fixed;
  background-size: cover;
  opacity: 0.6;
}
.contents section[class^=chapter] .logo_20th {
  max-width: 320px;
  width: 60%;
  margin: 2rem auto 1rem;
}
.contents section[class^=chapter] .logo_20th img {
  width: 100%;
}
.contents section[class^=chapter] .chapter-wrapper {
  overflow: hidden;
  width: 100%;
}
.contents section[class^=chapter] .chapter-inner {
  position: relative;
  padding: 8vh 0 2vh;
  width: 100%;
  margin: 0 auto;
  z-index: 150;
}
.contents section[class^=chapter] header[class^=point],
.contents section[class^=chapter] header.title {
  margin: 0 auto;
}
.contents section[class^=chapter] header[class^=point] h2,
.contents section[class^=chapter] header.title h2 {
  /*aaa*/
  font-size: 1.5625rem;
}
@media only screen and (min-width: 768px) {
  .contents section[class^=chapter] header[class^=point] h2,
.contents section[class^=chapter] header.title h2 {
    /*aaa*/
    font-size: 2.25rem;
    padding: 1rem 0;
  }
}
.contents section[class^=chapter] header[class^=point] > em,
.contents section[class^=chapter] header.title > em {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background-size: contain;
  background-position: center center;
  width: 80px;
}
@media only screen and (min-width: 768px) {
  .contents section[class^=chapter] header[class^=point] > em,
.contents section[class^=chapter] header.title > em {
    width: 120px;
  }
}
.contents section[class^=chapter] header {
  text-align: center;
  margin: 60px 0 20px;
}
.contents section[class^=chapter] header span {
  display: inline-block;
}
.contents section[class^=chapter] header em {
  color: #968264;
}
.contents section[class^=chapter] header.point_detail em {
  background: url("/games/prospi/2024-2025/s/images/ebaseball_engine/text_detail.svg") no-repeat;
}
.contents section[class^=chapter] header.point_action em {
  background: url("/games/prospi/2024-2025/s/images/ebaseball_engine/text_action.svg") no-repeat;
}
@media only screen and (min-width: 768px) {
  .contents section[class^=chapter] header.point_action em {
    width: 140px;
  }
}
.contents section[class^=chapter] header.point_studium em {
  width: 100px;
  background: url("/games/prospi/2024-2025/s/images/ebaseball_engine/text_stadium.svg") no-repeat;
}
@media only screen and (min-width: 768px) {
  .contents section[class^=chapter] header.point_studium em {
    width: 140px;
  }
}
.contents section[class^=chapter] header.point_sound em {
  width: 76px;
  background: url("/games/prospi/2024-2025/s/images/ebaseball_engine/text_sound.svg") no-repeat;
}
@media only screen and (min-width: 768px) {
  .contents section[class^=chapter] header.point_sound em {
    width: 93px;
  }
}
.contents section[class^=chapter] header.sample em {
  width: 100px;
  background: url("/games/prospi/2024-2025/s/images/common/sample.svg") no-repeat;
}
@media only screen and (min-width: 768px) {
  .contents section[class^=chapter] header.sample em {
    width: 120px;
  }
}
.contents section[class^=chapter] header.point_gamemode em {
  width: 160px;
  background: url("/games/prospi/2024-2025/s/images/ebaseball_engine/text_gamemode.svg") no-repeat;
}
.contents section[class^=chapter] header.point_myballpark em {
  width: 220px;
  height: 28px;
  background: url("/games/prospi/2024-2025/s/images/ebaseball_engine/text_myballpark.svg?v=2") no-repeat;
}
@media only screen and (min-width: 768px) {
  .contents section[class^=chapter] header.point_myballpark em {
    width: 300px;
    height: 38px;
  }
}
.contents .text-wrap {
  position: relative;
  width: fit-content;
  max-width: 360px;
  margin: 0 auto;
  padding: 6vh 3vw;
  box-sizing: border-box;
  z-index: 11;
}
.contents .text-wrap h2 {
  /*aaa*/
  font-size: 2.5rem;
  font-family: ruika;
  /* "urw-din", sans-serif;*/
  font-weight: 500;
  font-style: normal;
  padding-bottom: 0.5em;
  line-height: 1.2;
}
.contents .text-wrap h2:lang(ko), .contents .text-wrap h2:lang(zh-tw) {
  font-family: ruika;
  /* "urw-din", sans-serif;*/
  font-weight: 900;
  font-style: normal;
}
.contents .text-wrap h2:lang(ko):lang(ko), .contents .text-wrap h2:lang(ko):lang(zh-tw), .contents .text-wrap h2:lang(zh-tw):lang(ko), .contents .text-wrap h2:lang(zh-tw):lang(zh-tw) {
  font-family: source-han-sans-cjk-tc, serif, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, arial, sans-serif;
  font-weight: 900;
  font-style: normal;
}
.contents .text-wrap .subheading {
  /*aaa*/
  font-size: 1.25rem;
  color: #d2aa78;
  line-height: 1.8;
  font-family: a-otf-ud-shin-go-pr6n;
  font-weight: 500;
  font-style: normal;
  padding: 0.8rem 0;
  line-height: 1.5;
}
.contents .text-wrap .subheading span {
  display: inline-block;
}
.contents .text-wrap .top-text {
  position: relative;
  display: block;
}
.contents .text-wrap .top-text::after {
  content: "";
  position: absolute;
  display: block;
  width: 2.8em;
  height: 1px;
  top: 50%;
  left: 4em;
  background-color: #323c41;
}
.contents .text-wrap header {
  display: contents;
  max-width: 580px;
  font-family: ruika;
  /* "urw-din", sans-serif;*/
  font-weight: 500;
  font-style: normal;
}
.contents .text-wrap header span {
  display: inline-block;
  color: #000000;
  background-color: #ffffff;
  padding: 6px 12px;
  box-sizing: border-box;
  /*aaa*/
  font-size: 1rem;
  font-family: a-otf-ud-shin-go-pr6n;
  font-weight: 500;
  font-style: normal;
  font-weight: 800;
}
.contents .text-wrap strong {
  color: #323c41;
  display: inline-block;
}
.contents .text-link {
  position: relative;
  display: inline-block;
  margin: 0 auto;
}
.contents .text-link a {
  color: #d2aa78;
  /*aaa*/
  font-size: 1rem;
}
.contents .text-link a::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  width: 8px;
  height: 8px;
  top: 50%;
  border-top: 2px solid #d2aa78;
  border-right: 2px solid #d2aa78;
  transform: rotate(45deg) translateY(-50%);
  right: -0.5em;
  left: auto;
  transition: all 0.3s;
}
.contents .text-link a:hover::before {
  border-color: #2882f0;
}
.contents .text-link a:hover {
  color: #2882f0;
}
.contents .sub-heading {
  position: relative;
  /*aaa*/
  font-size: 1.5rem;
  padding-bottom: 0.5em;
  z-index: 100;
}
.contents .asset-popup {
  max-width: 320px;
  box-sizing: border-box;
  margin: 3rem auto;
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr;
  grid-template-rows: 2fr;
  justify-items: center;
  grid-template-areas: "a" "b";
}
.contents .asset-popup .text-wrap {
  padding: 0;
  grid-area: a;
  max-width: 360px;
}
.contents .asset-popup .popup-text {
  padding: 0 2vw;
}
.contents .asset-popup a {
  grid-area: b;
}
.contents .asset-popup a .thumbnail {
  position: relative;
  display: inline-block;
  border-radius: 12px;
  max-width: 280px;
  margin: 0 auto;
  transition: all 0.3s;
}
.contents .asset-popup a .thumbnail + .thumbnail {
  margin-top: 1rem;
}
.contents .asset-popup a .thumbnail::before, .contents .asset-popup a .thumbnail::after {
  content: "";
  display: block;
  position: absolute;
}
.contents .asset-popup a .thumbnail::before {
  width: 20px;
  height: 20px;
  bottom: 6px;
  right: 7px;
  background: url("/games/prospi/2024-2025/s/images/common/btn_zoom.png") no-repeat 0 0/100% auto;
  z-index: 1;
}
.contents .asset-popup a .thumbnail img {
  border-radius: 12px;
  border: 1px solid #ffffff;
}
.contents .asset-popup a .thumbnail.new::after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  width: 24px;
  height: 24px;
  top: 6px;
  left: 6px;
  right: auto;
  z-index: 1;
  background-image: url("/games/prospi/2024-2025/s/images/common/icon_new.png");
  background-size: cover;
  transition: all 0.3s;
}
.contents .chapter-text-box {
  margin: 20px 0 45px;
}
.contents .chapter-lead {
  /*aaa*/
  font-size: 1rem;
  line-height: 1.8;
}
.contents .chapter-lead + .chapter-lead {
  padding: 0.8rem 0 0;
}
.contents .point-color {
  color: #d2aa78;
}
.contents .point-color span {
  display: inline-block;
}
.contents .point-color span.color {
  color: #ffffff;
}
.contents .asterisk {
  font-size: 0.75rem;
  vertical-align: top;
}
.contents .note {
  padding: 1rem 0 0;
}
.contents section.chapter0 {
  min-height: fit-content;
  padding: 4% 0;
}
.contents .chapter0 {
  position: relative;
  background-color: #ffffff;
  padding-top: 0;
}
.contents .chapter0 h2 {
  color: #323c41;
  /*aaa*/
  font-size: 2.375rem;
}
.contents .chapter0 h2 span {
  display: inline-block;
}
.contents .chapter0 p.chapter-lead {
  color: #968264;
}
.contents .chapter0 p:first-of-type {
  padding-bottom: 1.5rem;
}
.contents .chapter0 span {
  display: inline-block;
}
.contents .chapter1 {
  position: relative;
  padding-top: 6vh;
  background-color: #000000;
}
.contents .chapter1 .text-wrap {
  padding: 1rem 0;
}
.contents .chapter1 .top-element {
  max-width: 880px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}
.contents .chapter1 .top-element img {
  width: 100%;
}
.contents .chapter1 .top-element .ebaseball-engine_copy {
  max-width: 600px;
  width: 100%;
  margin: 0 auto;
  padding: 0 2rem 2rem;
  box-sizing: border-box;
  text-align: center;
  /*@media only screen and (min-width: $bpTablet) {
    max-width: 880px;
  }*/
}
.contents .chapter1 .top-element .ebaseball-engine_section {
  text-align: left;
}
.contents .chapter1 .top-element .ebaseball-engine_section p {
  padding: 20px 10vw;
  box-sizing: border-box;
  margin: 0 auto;
}
.contents .chapter1 .top-element .ebaseball-engine_section .logo-img {
  display: flex;
  justify-content: center;
  padding: 2rem 0;
  box-sizing: border-box;
  max-width: 420px;
  margin: 0 auto;
}
.contents .chapter1 .top-element .ebaseball-engine_section .logo-img p {
  margin: auto;
  text-align: center;
  padding: 0 1rem;
  width: calc(100% - 1rem)/2;
}
.contents .chapter1 .top-element .ebaseball-engine_section .logo-img p span {
  display: inline-block;
}
.contents .chapter1 .top-element .ebaseball-engine_section .logo-img p img {
  width: 100%;
}
.contents .chapter1 .top-element .ebaseball-engine_section .logo-img p.logo_ebaseball-engine {
  max-width: 180px;
}
.contents .chapter1 .top-element .ebaseball-engine_section .logo-img p.logo_unreal-engine {
  max-width: 154px;
}
.contents .chapter1 .top-element .swiper {
  /*padding: 0 4%;
  box-sizing: border-box;*/
  border-radius: 12px;
}
.contents .chapter1 .top-element .swiper .ss_slide img {
  width: 100%;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.6) inset;
}
.contents .chapter1 .point_action_video {
  display: flex;
  margin: 40px auto;
  flex-direction: column;
  justify-content: center;
  max-width: 880px;
  width: 100%;
  padding: 20px;
}
.contents .chapter1 .point_action_video .video_thumb {
  width: 100%;
  height: auto;
  max-width: 100%;
  margin-bottom: 40px;
}
.contents .chapter1 .point_action_video .video_thumb .thumbnail {
  position: relative;
  position: relative;
  display: inline-block;
  vertical-align: middle;
}
.contents .chapter1 .point_action_video .video_thumb .thumbnail::before, .contents .chapter1 .point_action_video .video_thumb .thumbnail::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  margin: auto;
  content: "";
  vertical-align: middle;
  z-index: 1;
}
.contents .chapter1 .point_action_video .video_thumb .thumbnail::before {
  width: 5rem;
  height: 5rem;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.3);
  border: 2px solid #ffffff;
  transform: translateX(-18px);
  transition: background-color 0.5s ease;
}
.contents .chapter1 .point_action_video .video_thumb .thumbnail::after {
  left: 50%;
  box-sizing: border-box;
  width: 10px;
  height: 10px;
  border: 10px solid transparent;
  border-left: 18px solid #ffffff;
}
.contents .chapter1 .point_action_video .video_thumb .thumbnail:hover::before {
  background: rgba(0, 0, 0, 0.6);
}
.contents .chapter1 .point_action_video .video_thumb .thumbnail img {
  border-radius: 12px;
  border: 2px solid #2882f0;
  width: 100%;
  position: relative;
  display: inline-block;
  vertical-align: middle;
}
.contents .chapter2 {
  position: relative;
  padding-top: 20vh;
  z-index: 200;
  /* ch2用　テキスト背景*/
}
.contents .chapter2 .text-bg {
  background-color: #000000;
  background-image: url("/games/prospi/2024-2025/s/images/common/bg_right.png"), url("/games/prospi/2024-2025/s/images/common/bg_left.png");
  background-repeat: repeat-y, repeat-y;
  background-position: 200% top, -200% top;
  background-size: 100% auto, 100% auto;
  transition: all 1s ease-in-out;
  padding-bottom: 2vh;
}
@media only screen and (min-width: 768px) {
  .contents .chapter2 .text-bg {
    background-position: right top, left top;
    background-size: 35% auto, 35% auto;
  }
}
.contents .chapter2 .text-wrap {
  padding: 3vh 20px;
  box-sizing: border-box;
}
.contents .chapter2 .bg_slide {
  width: 100%;
  text-align: center;
  margin: 0 auto;
}
.contents .chapter2 .bg_slide img {
  width: 100%;
}
.contents .ss-box {
  position: relative;
  z-index: 10;
  margin-bottom: 3vh;
}
.contents .ss-box ul {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: nowrap;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
  margin: 0 auto;
  padding: 0 6vw;
  box-sizing: border-box;
}
.contents .ss-box ul li {
  position: relative;
  padding: 0.5rem 0.5rem 1rem;
  max-width: 280px;
  width: 48%;
}
.contents .ss-box ul li:last-child {
  padding-bottom: 0;
}
.contents .ss-box ul li:last-child span::before {
  bottom: 6px;
  right: 14px;
}
.contents .ss-box ul li .thumbnail {
  display: inline-block;
  /* &:hover {
     filter: brightness(1.2);
   }*/
}
.contents .ss-box ul li .thumbnail.new::after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  width: 24px;
  height: 24px;
  top: calc(0.5rem + 6px);
  left: calc(0.5rem + 6px);
  right: auto;
  z-index: 1;
  background-image: url("/games/prospi/2024-2025/s/images/common/icon_new.png");
  background-size: cover;
  transition: all 0.3s;
}
.contents .ss-box ul li .thumbnail::before {
  content: "";
  display: block;
  position: absolute;
  width: 1.3rem;
  height: 1.3rem;
  bottom: calc(1rem + 6px);
  right: calc(0.5rem + 7px);
  background: url("/games/prospi/2024-2025/s/images/common/btn_zoom.png") no-repeat 0 0/100% auto;
}
.contents .ss-box ul li img {
  width: 100%;
  border: 1px solid #ffffff;
  border-radius: 15px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.6) inset;
}
.contents .ss-box ul.ss-3 {
  max-width: 980px;
  /* li {
     width: calc((100% - (6vw * 2)) / 2);
   }*/
}
@media only screen and (min-width: 768px) {
  .contents .ss-box ul.ss-3 li {
    width: calc((100% - 3rem) / 3);
  }
}
@media only screen and (min-width: 768px) {
  .contents .ss-box ul {
    flex-direction: row;
    max-width: 940px;
  }
  .contents .ss-box ul li {
    width: calc(100% - (8vw * 2) / 4);
  }
}
@media only screen and (min-width: 1400px) {
  .contents .ss-box ul {
    max-width: 1600px;
  }
}
.contents .chapter3 {
  padding-top: 100vh;
  z-index: 200;
}
.contents .chapter3 img {
  width: 100%;
}
.contents .chapter3 .bg_block {
  height: 70vh;
}
.contents .chapter3 .point_action_video {
  position: relative;
  z-index: 10;
}
.contents .chapter4 {
  position: relative;
  min-height: fit-content;
  background-size: contain;
  padding-top: 30vh;
  z-index: 200;
  /*.text-wrap {
    padding: 3vh 20px;
    box-sizing: border-box;
  }*/
}
.contents .chapter4 .mode-list {
  max-width: fit-content;
  padding: 20px;
  box-sizing: border-box;
  background-color: rgba(0, 0, 0, 0.3);
  line-height: 1.8;
  margin: 4vh auto;
}
.contents .chapter4 .mode-list .new {
  position: relative;
  color: #d2aa78;
}
.contents .chapter4 .mode-list .new::before {
  content: "New";
  font-weight: 800;
  text-transform: uppercase;
  position: absolute;
  width: 30px;
  height: 30px;
  line-height: 30px;
  top: -2px;
  left: -2.5rem;
  text-align: center;
  border-radius: 100vh;
  -webkit-border-radius: 100vh;
  box-shadow: 0 0 8px #d2aa78, 0 0 8px #d2aa78;
  background-color: #ffffff;
  /*aaa*/
  font-size: 0.5rem;
  color: #000000;
  -webkit-animation: topScaleanime 0.3s ease-in 1.8s;
  -moz-animation: topScaleanime 0.3s ease-in 1.8s;
  animation: topScaleanime 0.3s ease-in 1.8s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
  opacity: 0;
}
.contents .chapter5 {
  padding: 100vh 0;
  z-index: 200;
}
.contents .chapter5 > section {
  padding-bottom: 3vh;
}
.contents .chapter5 .point_studium_video {
  display: flex;
  justify-content: center;
  margin: 40px auto;
  flex-direction: column;
  max-width: 880px;
  width: 100%;
  height: 100vh;
  padding: 20px;
}
.contents .chapter5 .point_studium_video .video_thumb {
  width: 100%;
  height: auto;
  margin-bottom: 40px;
  text-align: center;
}
.contents .chapter5 .point_studium_video .video_thumb .thumbnail img {
  width: 100%;
}
.contents .chapter5 .sound_sample {
  padding: 2rem 0;
  box-sizing: border-box;
}
.contents .chapter5 .sound_sample .sound_play {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  z-index: 1;
}
.contents .chapter5 .sound_sample .sound_play .sound_title {
  /*aaa*/
  font-size: 1.125rem;
}
.contents .chapter5 .sound_sample .sound_play .sound_title p {
  padding-bottom: 1rem;
}
.contents .chapter5 .sound_sample .sound_play .sound_title img {
  max-width: 280px;
  border-radius: 2vw;
  box-shadow: 0 0 3px #000000;
}
.contents .chapter5 .sound_sample .sound_play dl {
  padding: 1rem;
  box-sizing: border-box;
}
.contents .chapter5 .sound_sample .sound_play dl dt {
  padding: 0.5rem;
}
.contents .chapter5 .text-wrap {
  padding: 3vh 2rem 2vh;
  box-sizing: border-box;
}
.contents .chapter5 .text-wrap > h3 {
  text-align: center;
  /*aaa*/
  font-size: 1.25rem;
  color: #d2aa78;
  line-height: 1.8;
  font-family: a-otf-ud-shin-go-pr6n;
  font-weight: 500;
  font-style: normal;
  padding-bottom: 2vh;
}
.contents .chapter5 .asset-popup {
  margin: 0 auto 3rem;
}
.contents .chapter5 .ss-box {
  margin-bottom: 0;
}
.contents .chapter6 {
  padding-top: 50vh;
  /*調整用
  -------------------*/
  /*----*/
}
.contents .chapter6 .full {
  margin-top: 30vh;
}
.contents .chapter6 .ss-3 {
  padding-top: 3vh;
  box-sizing: border-box;
}
.contents .chapter6 .text-wrap {
  padding: 2vh 7.5vw;
}
@media only screen and (min-width: 980px) {
  .contents .chapter6 .text-wrap .features span {
    display: inline-block;
  }
}
@media only screen and (min-width: 1400px) {
  .contents .chapter6 .text-wrap {
    width: 100%;
    max-width: 980px;
  }
}
.contents .chapter6 .gamemode-myballpark {
  padding-bottom: 100vh;
  box-sizing: border-box;
}
.contents .chapter6 .textlink {
  padding: 0.5rem;
  /*aaa*/
  font-size: 1rem;
}
.contents .chapter6 .textlink a {
  padding: 0.5rem 36px;
  position: relative;
  color: #d2aa78;
  display: block;
  font-weight: 800;
  transition: all 0.3s;
}
.contents .chapter6 .textlink a::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("/games/prospi/2024-2025/s/images/common/icon_play.png") left top no-repeat;
  background-size: cover;
  width: 30px;
  height: 30px;
  top: 5px;
  left: 0;
}
.contents .chapter6 .gamemode_list {
  position: relative;
  z-index: 500;
  padding: 5vh 0 0;
  box-sizing: border-box;
}
.contents .chapter6 .gamemode_list > p {
  padding-bottom: 1rem;
  max-width: 380px;
  width: 100%;
}
.contents .chapter6 .gamemode_list .mode {
  max-width: 380px;
  margin: 0 auto 0.8rem;
  padding-bottom: 0.4rem;
  border-bottom: 1px solid #ffffff;
}
.contents .chapter6 .gamemode_list > ul {
  max-width: 380px;
  margin: 0 auto;
  display: grid;
  grid-auto-flow: column;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(7, 1fr);
  gap: 0.5rem 0;
}
.contents .chapter6 .gamemode_list > ul li {
  position: relative;
  display: inline-block;
  padding-left: 1rem;
}
.contents .chapter6 .gamemode_list > ul li .example {
  display: none;
}
@media only screen and (min-width: 980px) {
  .contents .chapter6 .gamemode_list > ul li .example {
    display: inline-block;
    /*aaa*/
    font-size: 0.75rem;
    vertical-align: top;
    padding-left: 0.2rem;
  }
}
.contents .chapter6 .gamemode_list > ul li.mode-asterisk {
  position: relative;
}
.contents .chapter6 .gamemode_list > ul li.mode-asterisk .example {
  /*aaa*/
  font-size: 0.75rem;
  vertical-align: top;
  padding-left: 0.2rem;
}
.contents .chapter6 .gamemode_list > ul li.mode-asterisk::after {
  position: absolute;
  display: block;
  content: "※";
  /*aaa*/
  font-size: 0.75rem;
  vertical-align: top;
  padding-left: 10px;
  right: -1rem;
  top: 0;
}
@media only screen and (min-width: 980px) {
  .contents .chapter6 .gamemode_list > ul li.mode-asterisk::after {
    display: none;
  }
}
.contents .chapter6 .gamemode_list > ul li a {
  position: relative;
  z-index: 1;
  display: inline-block;
  color: #ffffff;
}
.contents .chapter6 .gamemode_list > ul li::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "・";
}
.contents .chapter6 .gamemode_list .mode-note {
  max-width: 380px;
  margin: 2.5rem auto 0;
}
.contents .preorder {
  position: relative;
  margin: auto;
  text-align: center;
  box-sizing: border-box;
  z-index: 100;
  max-width: 320px;
}
.contents .preorder dl {
  display: flex;
  flex-direction: column;
}
.contents .preorder dl .preorder_text {
  padding-bottom: 1em;
}
.contents .preorder dl .link-btn {
  margin: 0 auto;
  width: 100%;
}
.contents .preorder dl .link-btn li {
  width: 100%;
  min-width: 40%;
  transition: all 0.3s;
  box-sizing: border-box;
  max-height: 50px;
  transform: skewX(-30deg);
  background: url("/games/prospi/2024-2025/s/images/common/btn_base.png") no-repeat 0 0;
  /*@include before() {
    background: url("/games/prospi/2024-2025/s/images/common/btn_base.png") no-repeat 0 0;
    background-size: 100%;
    transition: all 0.3s;
    transform: skewX(30deg);
    clip-path:polygon(12% 0%, 100% 0, 88% 100%, 0% 100%);
  }*/
}
.contents .preorder dl .link-btn li.products {
  /*aaa*/
  font-size: 1rem;
}
.contents .preorder dl .link-btn li.products a {
  font-family: a-otf-ud-shin-go-pr6n;
  font-weight: 500;
  font-style: normal;
  text-transform: uppercase;
}
.contents .preorder dl .link-btn li.products a span {
  display: block;
  text-align: center;
  transform: skewX(30deg);
  width: 320px;
}
.contents .preorder dl .link-btn li.products a:hover {
  color: #ffffff;
}
.contents .preorder dl .link-btn li:hover {
  filter: brightness(120%);
}
.contents .preorder dl .link-btn li a {
  position: relative;
  display: block;
  line-height: 50px;
  height: 50px;
  box-sizing: border-box;
  width: 100%;
  transition: all 0.3s;
}
.contents .preorder dl .link-btn li span {
  display: block;
  text-align: center;
  transform: skewX(30deg);
  /* &::after {
     content: "";
     display: block;
     background-repeat: no-repeat;
     background-size: contain;
     background-position: center center;
     height: 26px;
     max-width: 70%;
     margin-inline: auto;
   }*/
}
.contents .preorder dl .link-btn li.btn-ps5 span::after {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' style='enable-background:new 0 0 391.5 85' viewBox='0 0 391.5 85'%3E%3Cpath fill='%23ffffff' d='M41.2 0C48.8 1.4 60 4.8 65.9 6.8 81.1 12 86.3 18.5 86.3 33.1c0 14.3-8.8 19.7-20 14.3V20.8c0-3.1-.6-6-3.5-6.8-2.2-.7-3.6 1.4-3.6 4.5V85l-18-5.7V0m21.4 83.8 39.2-14.1s5.3-2 7.4-4.7c2.1-2.7 1.2-6.7-7.3-9.3-7.5-2.8-17.1-3.8-24.9-2.9-7.8.8-13.4 2.8-13.4 2.8l-1 .4v10.8L81.8 60c3.3-1.2 8.1-1.4 10.8-.6 2.6.9 2.1 2.5-1.1 3.7L62.6 73.4v10.4zM8.3 72.3c9.3 3.1 18.8 3.7 27.7 2.2l1.8-.3V65l-8.9 3.2c-3.3 1.2-8 1.5-10.7.6-2.6-.9-2.1-2.5 1.1-3.7l18.5-6.6V48L12 57.1s-6.2 2-9.9 4.7c-4 3-2.5 8.1 6.2 10.5m94.8 4.2c-2.5 0-4.3 1.9-4.3 4.3s1.7 4.3 4.3 4.3c2.5 0 4.2-1.9 4.2-4.3.1-2.4-1.6-4.3-4.2-4.3m0 7.9c-2.2 0-3.6-1.6-3.6-3.6s1.4-3.6 3.6-3.6c2.1 0 3.6 1.6 3.6 3.6s-1.4 3.6-3.6 3.6m-1.7-1.2h.9v-2.1h.6c.7 0 .9.2 1 .7.1.3.3 1 .4 1.3h.9c-.1-.5-.3-1-.5-1.5-.2-.6-.4-.8-.7-.9.6-.2.9-.6.9-1.2 0-1-.7-1.3-1.6-1.3h-1.9v5zm.9-4.3h.8c.5 0 .9.1.9.8 0 .6-.4.8-1 .8h-.8v-1.6zM242.2 68c7.6 0 13.7-6.1 13.7-13.7V30.7c0-4.6 3.7-8.3 8.3-8.3h26.6c.2 0 .4-.2.4-.4v-4.7c0-.2-.2-.4-.4-.4h-32.1c-7.6 0-13.7 6.1-13.7 13.7v23.6c0 4.6-3.7 8.3-8.3 8.3h-26.2c-.2 0-.4.2-.4.4v4.7c0 .2.2.4.4.4h31.7zm59.9-31.8c0 4.6 3.7 8.3 8.3 8.3h46.9c5 0 9.2 4.1 9.1 9.1 0 5-4.1 9-9.1 9h-54.8c-.2 0-.4.2-.4.4v4.7c0 .2.2.4.4.4h60.3c8 0 14.5-6.5 14.5-14.5S370.8 39 362.8 39H317c-2.2 0-3.9-1.8-3.9-3.9V22.8c0-.2.2-.4.4-.4h61.6c.2 0 .4-.2.4-.4v-4.7c0-.2-.2-.4-.4-.4h-72.5c-.2 0-.4.2-.4.4-.1 2.9-.1 12-.1 18.9M152.3 39c-7.6 0-13.7 6.1-13.7 13.7v15c0 .2.2.4.4.4h10.2c.2 0 .4-.2.4-.4v-15c0-4.6 3.7-8.3 8.3-8.3H200c7.6 0 13.7-6.1 13.7-13.7S207.6 17 200 17h-61c-.2 0-.4.2-.4.4v4.7c0 .2.2.4.4.4h55.6c4.6 0 8.3 3.7 8.3 8.3 0 4.6-3.7 8.3-8.3 8.3h-42.3zm239.2 24.7c0 2.4-1.7 4.3-4.2 4.3s-4.3-1.9-4.3-4.3 1.7-4.3 4.3-4.3c2.5 0 4.2 1.9 4.2 4.3zm-.7 0c0-2-1.4-3.6-3.6-3.6s-3.6 1.6-3.6 3.6 1.4 3.6 3.6 3.6 3.6-1.6 3.6-3.6zm-1.9.9c.2.5.3 1.1.5 1.5h-.9c-.1-.4-.3-1-.4-1.3-.1-.6-.3-.7-1-.7h-.6v2.1h-.9v-4.9h1.9c.9 0 1.6.3 1.6 1.3 0 .6-.3 1-.9 1.2.3 0 .5.2.7.8zm-.7-2c0-.7-.5-.8-.9-.8h-.8v1.6h.8c.5 0 .9-.2.9-.8z' style='fill:%23fff'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
}
.contents .preorder dl .link-btn li.btn-ps5 a {
  padding: 12px 0;
}
.contents .preorder dl .link-btn li.btn-steam span::after {
  background-image: url("/games/prospi/2024-2025/s/images/common/logo_steam.svg");
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' viewBox='0 0 293.5 88.5'%3E%3Cpath fill='%23ffffff' d='M44.1 0C20.8 0 1.8 17.9 0 40.7l23.7 9.8c2-1.4 4.4-2.2 7-2.2h.7L42 33.1v-.2c0-9.2 7.5-16.7 16.7-16.7s16.7 7.5 16.7 16.7-7.5 16.7-16.7 16.7h-.4l-15 10.7v.6c0 6.9-5.6 12.5-12.5 12.5-6.1 0-11.1-4.3-12.3-10.1l-17-7c5.3 18.6 22.3 32.2 42.6 32.2 24.4 0 44.2-19.8 44.2-44.2C88.3 19.8 68.5 0 44.1 0z'/%3E%3Cpath fill='%23ffffff' d='m27.7 67.1-5.4-2.2c1 2 2.6 3.7 4.8 4.6 4.8 2 10.3-.3 12.3-5.1 1-2.3 1-4.9 0-7.2s-2.8-4.1-5.1-5.1-4.8-.9-6.9-.1l5.6 2.3c3.5 1.5 5.2 5.5 3.7 9-1.4 3.6-5.5 5.3-9 3.8zM69.8 32.8c0-6.1-5-11.1-11.1-11.1s-11.1 5-11.1 11.1S52.6 44 58.7 44s11.1-5 11.1-11.2zm-19.5 0c0-4.6 3.7-8.4 8.4-8.4 4.6 0 8.4 3.7 8.4 8.4 0 4.6-3.7 8.3-8.4 8.3-4.6.1-8.4-3.7-8.4-8.3zM135.6 30.3l-3 5.2c-2.3-1.6-5.4-2.6-8.1-2.6-3.1 0-5 1.3-5 3.6 0 2.8 3.4 3.4 8.4 5.2 5.4 1.9 8.5 4.2 8.5 9.1 0 6.8-5.3 10.6-13 10.6-3.7 0-8.3-1-11.7-3.1l2.2-5.8c2.8 1.5 6.2 2.4 9.2 2.4 4.1 0 6-1.5 6-3.7 0-2.5-2.9-3.3-7.7-4.9-5.4-1.8-9.1-4.2-9.1-9.7 0-6.2 5-9.8 12.1-9.8 4.9.2 8.9 1.8 11.2 3.5zM158.7 33.6v27.3h-7V33.6h-10.1v-6h27.2v6h-10.1zM183.5 33.5V41h13.4v6h-13.4v7.8H199v6h-22.5V27.6H199v6h-15.5zM214.6 54.4l-2.2 6.5h-7.3l12.5-33.3h7l12.8 33.3h-7.6l-2.3-6.5h-12.9zm6.5-18.9-4.5 13.3h9.2l-4.7-13.3zM273.3 40.5 264.2 60h-3.9l-9-19.3V61h-6.7V27.6h6.7l11.2 24.1 10.8-24.1h6.7v33.3h-6.7V40.5zM293.5 31.8c0 2.9-2.1 4.6-4.6 4.6-2.5 0-4.6-1.8-4.6-4.6 0-2.9 2.2-4.6 4.6-4.6 2.4-.1 4.6 1.7 4.6 4.6zm-8.5 0c0 2.4 1.7 3.9 3.8 3.9 2.1 0 3.8-1.5 3.8-3.9s-1.7-3.9-3.8-3.9c-2.1 0-3.8 1.5-3.8 3.9zm3.9-2.4c1.2 0 1.6.6 1.6 1.3 0 .6-.4 1-.8 1.3l1.1 2h-.9l-.9-1.8h-1V34h-.7v-4.6h1.6zm-.8 2.1h.8c.5 0 .8-.3.8-.7 0-.4-.2-.7-.8-.7h-.8v1.4z'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
  height: 30px;
}
.contents .preorder dl .link-btn li.no-link {
  opacity: 0.4;
}
.contents .preorder dl .link-btn li.no-link a {
  pointer-events: none;
}
.contents .preorder dl .link-btn li.no-link:hover {
  filter: none;
}
.contents .product-top {
  position: relative;
  min-height: fit-content;
  padding: 30vh 0 6vh;
  z-index: 200;
}
.contents .product-top::before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: rgba(135, 140, 145, 0.5);
  margin: auto;
}
.contents .product-top .product-inner {
  max-width: 640px;
  margin: 0 auto;
  padding: 0 2rem;
}
.contents .product-top .product-inner h1 img {
  max-width: 90%;
}
.contents .product-top .product-inner h2 {
  margin: 0 auto 15px;
  padding: 0;
  /*aaa*/
  font-size: 1.75rem;
}
.contents .product-top .product-inner .heading {
  width: 100%;
  max-width: 700px;
  margin: 0 auto;
}
.contents .product-top .product-inner .heading > h2 {
  /*aaa*/
  font-size: 2rem;
}
.contents .product-top .product-inner .heading span {
  /*aaa*/
  font-size: 0.875rem;
  display: inline-table;
  padding: 6px;
  color: #000000;
  background-color: #ffffff;
}
.contents .product-top .product-inner .product-detail {
  max-width: 700px;
  margin: 3vh auto 6vh;
}
.contents .product-top .product-inner .product-detail .product-pkg {
  max-width: 280px;
  text-align: center;
  margin: 0 auto;
}
.contents .product-top .product-inner .product-detail .product-pkg img {
  width: 100%;
}
.contents .product-top .product-inner .product-detail .product-data {
  display: flex;
  flex-direction: column;
  padding: 30px 0;
}
.contents .product-top .product-inner .product-detail .product-data .product-name {
  width: 100%;
  /*aaa*/
  font-size: 1.375rem;
  color: #f0f5fa;
}
.contents .product-top .product-inner .product-detail .product-data .product-name {
  /*aaa*/
  font-size: 1.125rem;
  color: #f0f5fa;
  text-align: center;
}
.contents .product-top .product-inner .product-detail .product-data dl {
  display: grid;
  margin: 0 auto;
  /*aaa*/
  font-size: 0.875rem;
  padding: 12px 0;
  grid-template-columns: 7rem 1fr;
  grid-template-rows: 4fr auto;
  gap: 12px;
}
.contents .product-top .product-inner .product-detail .product-data dt {
  box-sizing: border-box;
}
.contents .product-top .product-inner .product-detail .product-data dt span {
  display: inline-block;
}
.contents .product-top .product-inner .product-detail .product-data dd {
  text-align: left;
}
.contents .product-top .product-inner .product-detail .product-data dd.cero img, .contents .product-top .product-inner .product-detail .product-data dd.grac img {
  max-width: 60px;
  border-radius: 6px;
  -webkit-border-radius: 6px;
}
.contents .product-top .product-inner .product-detail .product-data dd.note {
  width: 100%;
}
.contents .product-top .product-inner .product-detail dl {
  margin: 0 auto;
  /*aaa*/
  font-size: 0.875rem;
  padding: 12px 0;
}
.contents .product-top .product-inner .product-detail dl span {
  display: inline-block;
}
.contents .product-top .product-inner .product-detail dt, .contents .product-top .product-inner .product-detail dd {
  box-sizing: border-box;
}
.contents .product-top .product-inner .product-detail dt {
  color: #968264;
  text-align: right;
}
.contents .product-top .product-inner .product-detail dt::after {
  content: " : ";
}
.contents .product-top .product-inner .product-detail dt span {
  display: inline-block;
}
.contents .product-top .product-inner .product-detail dd.note {
  width: 100%;
}
.contents .product-top .product-inner .product-detail dd.cero img {
  max-width: 50px;
}
.contents .product-top .product-inner .banner_area {
  position: relative;
  margin-top: 2rem;
  text-align: center;
  z-index: 100;
}
.contents .product-top .product-inner .banner_area .bottom_banner {
  margin: 0 auto;
  max-width: 980px;
  padding: 2rem 0 1rem;
  box-sizing: border-box;
  transition: all 0.3s;
}
.contents .product-top .product-inner .banner_area .bottom_banner img {
  border: 1px solid rgba(255, 255, 255, 0.3);
  width: 100%;
}
.contents .product-top .product-inner .banner_area .bottom_banner:hover {
  filter: brightness(1.2);
}
.contents .product-top .product-inner .banner_area .text_wrapper .text {
  padding: 0.5rem 0;
}
.contents .product-top .product-inner .banner_area .text_wrapper span {
  /*aaa*/
  font-size: 0.75rem;
  vertical-align: top;
  padding-top: 0;
}
.contents .product-top .product-inner .banner_area .text_wrapper .note {
  /*aaa*/
  font-size: 0.875rem;
}
.contents .product-top .product-info {
  border: 1px solid rgba(255, 255, 255, 0.5);
  padding: 1.5rem;
  box-sizing: border-box;
  display: grid;
  /*aaa*/
  font-size: 0.875rem;
  grid-template-columns: 1fr;
  grid-template-rows: 2fr auto;
  gap: 0.5rem;
  margin: 0 1.5rem;
}
.contents .product-top .product-info .pkg_img img {
  width: 100%;
}
.contents .product-top .product-info .package_label {
  /*aaa*/
  font-size: 0.875rem;
  display: inline-block;
  padding: 6px 12px;
  margin: 1rem 0;
  box-sizing: border-box;
  color: #000000;
  background-color: #ffffff;
  width: 100%;
  text-align: center;
}
.contents .product-top .product-info .package_label > span {
  display: inline-block;
}
.contents .product-top .product-info .product-info_copy {
  /*aaa*/
  font-size: 1.125rem;
  font-family: ruika;
  /* "urw-din", sans-serif;*/
  font-weight: 500;
  font-style: normal;
  padding-bottom: 1.5rem;
}
.contents .product-top .product-info .product-info_copy:lang(ko), .contents .product-top .product-info .product-info_copy:lang(zh-tw) {
  font-family: ruika;
  /* "urw-din", sans-serif;*/
  font-weight: 900;
  font-style: normal;
}
.contents .product-top .product-info .product-info_copy:lang(ko):lang(ko), .contents .product-top .product-info .product-info_copy:lang(ko):lang(zh-tw), .contents .product-top .product-info .product-info_copy:lang(zh-tw):lang(ko), .contents .product-top .product-info .product-info_copy:lang(zh-tw):lang(zh-tw) {
  font-family: source-han-sans-cjk-tc, serif, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, arial, sans-serif;
  font-weight: 900;
  font-style: normal;
}
.contents .product-top .product-info .product-info_copy span {
  display: inline-block;
}
.contents .product-top .product-info .top-preorder {
  /*aaa*/
  font-size: 1rem;
  display: block;
  width: 100%;
  text-align: center;
  max-width: 240px;
  margin: 0 auto;
  transition: all 0.3s;
}
.contents .product-top .product-info .top-preorder span {
  -webkit-transform: skew(30deg);
  transform: skew(30deg);
}
.contents .product-top .product-info .top-preorder a {
  position: relative;
  display: inline-block;
  padding: 1rem 3rem;
  box-sizing: border-box;
  -webkit-transform: skew(-30deg);
  transform: skew(-30deg);
  color: #f0f5fa;
  width: 100%;
  height: fit-content;
  margin: 0 auto;
  transition: all 0.3s;
  background: url("/games/prospi/2024-2025/s/images/common/btn_base.png") no-repeat center center;
}
.contents .product-top .product-info .top-preorder a:hover {
  color: #f0f5fa;
  filter: contrast(130%);
}

.asset-box {
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  position: relative;
  z-index: 20;
}
.asset-box.full {
  width: 100%;
  background-color: #000000;
}
.asset-box.full img {
  aspect-ratio: 16/9;
}
.asset-box .ss-img {
  display: block;
  margin: 0 12px 20px;
  width: 100%;
}
.asset-box img {
  width: 100%;
}
.asset-box .asset-box-text {
  width: 100%;
  padding: 0 12px;
  box-sizing: border-box;
}

.carousel-video {
  position: relative;
  width: 100%;
  box-sizing: border-box;
  /*------------------------------------------------------*/
}
.carousel-video img {
  width: 100%;
}
.carousel-video .swiper-slide {
  transition: 0.3s;
  opacity: 0.6;
}
.carousel-video .swiper-slide:not(.swiper-slide-visible) .slide {
  pointer-events: none;
  opacity: 0;
}
.carousel-video .swiper-slide .swiper-slide img {
  height: auto;
  width: 100%;
}
.carousel-video .swiper-slide.swiper-slide-active {
  opacity: 1;
  z-index: 1;
}
.carousel-video .swiper-button-prev,
.carousel-video .swiper-button-next {
  top: calc((100% - 50px) / 2);
  display: none;
  opacity: 0;
  transition: all 0.3s;
}
.carousel-video .swiper-button-prev::after,
.carousel-video .swiper-button-next::after {
  transition: all 0.3s;
}
.carousel-video .swiper-button-prev:hover:after,
.carousel-video .swiper-button-next:hover:after {
  color: #2882f0;
}
.carousel-video .swiper-pagination {
  position: relative;
  left: 0;
  right: 0;
  margin: 30px auto 0;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  width: 100%;
}
.carousel-video .swiper-pagination > span {
  display: inline-block;
  width: 100%;
  max-width: calc((100% - 12px) / 3);
  height: 6px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  transition: all 0.3s;
  position: relative;
  /* &.videonum_0 {
     &::after {
       display: block;
       content: '';
       position: relative;
       top: -1px;
       height: 6px;
       background-color: rgba($clLink, 0.6);
       //        background-color: rgba($clBase2, 0.6);
       //border: 1px solid rgba($clBase2, 0.6);
       -webkit-transition: all .3s ease;
       transition: all .3s ease;
       left: 0;
     }
   }*/
}
.carousel-video .movie-area-slick-dots {
  display: inline-block;
  width: 100%;
  max-width: calc((100% - 12px) / 3);
  height: 6px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  transition: all 0.3s;
  position: relative;
  /*&:hover {
    background-color: rgba($clBase2, 0.6);
  }*/
  /*#slide-line {
    position: absolute;
    bottom: 0;
    height: 2px;
    background-color: rgba($clBase2, 0.6);
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
  }*/
}
.carousel-video .movie-area-slick-dots.swiper-pagination-bullet-active {
  background-color: #ffffff;
  /* &::after {
          display: block;
          content: '';
          position: relative;
          top: -1px;
          height: 6px;
          background-color: rgba($clLink, 0.6);
  //        background-color: rgba($clBase2, 0.6);
          border: 1px solid rgba($clBase2, 0.6);
          -webkit-transition: all .3s ease;
          transition: all .3s ease;
          left: 0;
        }*/
}
@media only screen and (min-width: 980px) {
  .carousel-video .swiper-button-prev {
    left: 12vw;
  }
  .carousel-video .swiper-button-prev::after {
    color: #ffffff;
    transition: all 0.3s;
  }
  .carousel-video .swiper-button-next {
    right: 12vw;
  }
  .carousel-video .swiper-button-next::after {
    color: #ffffff;
  }
}
@media only screen and (min-width: 1400px) {
  .carousel-video .swiper-button-prev,
.carousel-video .swiper-button-next {
    display: block;
    opacity: 1;
  }
}

@media only screen and (min-width: 768px) {
  .pc {
    display: block;
  }

  .sp {
    display: none;
  }

  .contents {
    /* chapter */
  }
  .contents section[class^=chapter] .chapter-inner {
    margin: 0 auto;
  }
  .contents section[class^=chapter] .logo_20th {
    max-width: 500px;
    width: 60%;
    margin: 2rem auto;
  }
  .contents section[class^=chapter] .logo_20th img {
    width: 100%;
  }
  .contents .chapter0 .chapter-lead span {
    display: inline-block;
  }
  .contents .chapter1 .top-element {
    margin: 0 auto;
  }
  .contents .chapter1 .top-element .ebaseball-engine_section {
    text-align: center;
    padding: 40px 0;
  }
  .contents .chapter1 .top-element .ebaseball-engine_section > p {
    padding: 0;
  }
  .contents .chapter1 .top-element .point_action_video {
    flex-direction: row;
  }
  .contents .chapter1 .top-element .point_action_video .video_thumb {
    max-width: 300px;
    margin-right: 30px;
  }
  .contents .chapter1 .top-element .point_studium_video {
    flex-direction: row;
  }
  .contents .chapter1 .top-element .point_studium_video .video_thumb {
    max-width: 300px;
    margin-right: 30px;
  }
  .contents .chapter1 .point_action_video {
    flex-direction: row;
  }
  .contents .chapter1 .point_action_video .video_thumb {
    max-width: 300px;
    margin-right: 30px;
  }
  .contents .chapter1 .point_studium_video {
    flex-direction: row;
  }
  .contents .chapter1 .point_studium_video .video_thumb {
    max-width: 300px;
    margin-right: 30px;
  }
  .contents .chapter2 {
    height: 100vh;
  }
  .contents .chapter5 .sound_sample .sound_play {
    flex-direction: row;
  }
  .contents .text-wrap {
    max-width: 980px;
    margin: 0 auto;
    padding: 3rem 4rem;
  }
  .contents .text-wrap h2 {
    /*aaa*/
    font-size: 2.875rem;
  }
  .contents .text-wrap h2 .top-text::after {
    width: 4em;
  }
  .contents .text-wrap .chapter-lead span {
    display: inline-block;
  }
  .contents .carousel-video {
    width: 100%;
  }
  .contents .carousel-video img {
    width: 100%;
  }
  .contents .carousel-video .swiper-pagination {
    left: 0;
    right: 0;
    max-width: calc(100% - 34vw);
  }
  .contents .carousel-video .dots {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 20px;
    margin: 0 4px;
    background-color: rgba(255, 255, 255, 0.3);
  }
  .contents .carousel-video .dots.swiper-pagination-bullet-active {
    background-color: #2882f0;
  }
  .contents .asset-popup {
    max-width: 720px;
    gap: 2rem;
    grid-template-columns: 220px 2fr;
    grid-template-areas: "b a";
  }
  .contents .asset-popup .popup-text {
    max-width: 540px;
    width: 100%;
    padding: 0;
    margin: 0;
  }
  .contents .asset-popup .popup-text span {
    display: inline-block;
  }
  .contents .asset-box {
    display: flex;
    flex: 0 0 50%;
    flex-direction: row;
    margin: 0 auto;
    max-width: 980px;
    justify-content: center;
  }
  .contents .asset-box.full {
    max-width: 100%;
  }
  .contents .asset-box.full img {
    width: 100%;
  }
  .contents .product-top .product-inner {
    max-width: 780px;
  }
  .contents .product-top .product-inner h2 {
    /*aaa*/
    font-size: 3rem;
  }
  .contents .product-top .product-inner .product-detail {
    max-width: 700px;
    margin: 6vh auto;
    align-items: start;
    justify-content: space-evenly;
  }
  .contents .product-top .product-inner .product-detail .product-pkg {
    width: 100%;
    max-width: 230px;
    text-align: center;
    margin: 0;
  }
  .contents .product-top .product-inner .product-detail .product-data {
    padding: 0;
  }
  .contents .product-top .product-inner .product-detail .product-data .product-name {
    /*aaa*/
    font-size: 1.125rem;
    color: #f0f5fa;
  }
  .contents .product-top .product-inner .product-detail .product-data dl {
    display: grid;
    margin: 0 auto;
    /*aaa*/
    font-size: 0.875rem;
    padding: 12px 0;
    grid-template-columns: 6rem 1fr;
    grid-template-rows: 4fr auto;
    gap: 12px;
  }
  .contents .product-top .product-inner .product-detail .product-data dl:lang(ko) {
    grid-template-columns: 7rem 1fr;
  }
  .contents .product-top .product-inner .product-detail .product-data dt {
    box-sizing: border-box;
  }
  .contents .product-top .product-inner .product-detail .product-data dt span {
    display: inline-block;
  }
  .contents .product-top .product-inner .product-detail .product-data dd {
    text-align: left;
  }
  .contents .product-top .product-inner .product-detail .product-data dd.cero img {
    max-width: 60px;
  }
  .contents .product-top .product-inner .product-detail .product-data dd.note {
    width: 100%;
  }
  .contents .product-top .product-info {
    grid-template-columns: 290px auto;
    grid-template-rows: 1fr;
    gap: 1.5rem;
    margin: 0 0 2rem 0;
  }
  .contents .product-top .product-info .package_label {
    width: auto;
    margin: 0 0 0.5rem;
    /*aaa*/
    font-size: 0.875rem;
    font-weight: bold;
  }
  .contents .product-top .product-info .product-info_copy {
    /*aaa*/
    font-size: 1.25rem;
    padding-bottom: 0.5rem;
  }
  .contents .product-top .product-info .top-preorder {
    margin: 0;
    padding: 0 1rem;
    box-sizing: border-box;
    /*aaa*/
    font-size: 1rem;
    max-width: 260px;
  }
}
@media only screen and (min-width: 1400px) {
  .contents .product .product-inner h2 {
    /*aaa*/
    font-size: 2.25rem;
  }
  .contents .product .product-inner .online-service-list li {
    width: calc((100% / 4) - (5px * 2 / 4));
  }
  .contents .asset-box {
    display: flex;
    flex: 0 0 50%;
    flex-direction: row;
    margin: 0 auto;
    max-width: 1200px;
  }
  .contents .asset-box .ss-img {
    margin-right: 4%;
    max-width: 660px;
  }
  .contents .asset-box .ss-img img {
    width: 100%;
  }
  .contents .asset-box .asset-box-text {
    width: calc(100% - 50%);
  }
}
.movie-area {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  position: relative;
  background-color: #000000;
}
.movie-area .iframe-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 */
  height: 0;
  overflow: hidden;
  margin-bottom: 1rem;
  border: 1px solid #968264;
}
.movie-area iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  max-width: 800px;
}
.movie-area .mfp-close {
  color: #FFFFFF;
  top: -50px;
  right: 0;
}

/*トレーラー用タブ*/
.video-select {
  position: relative;
  z-index: 10;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background-color: rgba(0, 0, 0, 0.6);
}
.video-select .hide {
  display: none;
}
.video-select .tabs {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
}
.video-select .tabs li {
  position: relative;
  width: calc(100% / 2);
  height: 56px;
  color: #000000;
  border-right: 1px solid rgba(255, 255, 255, 0.3);
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  background-color: rgba(255, 255, 255, 0.3);
  text-align: center;
  transition: all 0.2s ease;
  box-shadow: 0 0 2px black inset;
  display: flex;
  align-items: center;
  justify-content: center;
  /*span {
    position: relative;
    width: 100%;
    display: inline-block;

    &.new {
      @include before() {
        position: absolute;
        width: 20px;
        height: 20px;
        top: 5px;
        left: 5px;
        right: auto;
        z-index: 1;
        background-image: url("/games/prospi/2024-2025/s/images/common/icon_new.png");
        background-size: cover;
        transition: all 0.3s;
      }
    }
  }*/
}
.video-select .tabs li.new::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  width: 20px;
  height: 20px;
  top: 5px;
  left: 5px;
  right: auto;
  z-index: 1;
  background-image: url("/games/prospi/2024-2025/s/images/common/icon_new.png");
  background-size: cover;
  transition: all 0.3s;
}
.video-select .tabs li:last-child {
  margin-right: 0;
  border-right: none;
}
.video-select .tabs li:hover {
  color: #ffffff;
  cursor: pointer;
  background-color: rgba(255, 255, 255, 0.2);
}
.video-select .tabs li.select {
  color: #ffffff;
  border-bottom: none;
  background-color: rgba(255, 255, 255, 0);
}
.video-select .video-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(44%, 2fr));
  gap: 1rem;
  padding: 1rem;
  box-sizing: border-box;
  font-family: a-otf-ud-shin-go-pr6n;
  font-weight: 500;
  font-style: normal;
}
.video-select .video-list li {
  width: 100%;
  text-align: center;
  border: 1px solid rgba(255, 255, 255, 0.3);
  transition: all 0.3s;
  display: flex;
  align-items: center;
}
.video-select .video-list li:nth-child(n+4) {
  padding-top: 0;
}
.video-select .video-list li:empty {
  height: 39px;
  border: none;
}
.video-select .video-list li span {
  padding: 0.5rem;
  box-sizing: border-box;
  width: 100%;
  display: inline-block;
  transition: all 0.3s;
  pointer-events: auto;
  position: relative;
  /*&:hover,
  &.active{
    opacity: 0.75;
    color: $clBase2;
    background-color: rgba($clBase2, 0.3);
  }*/
}
.video-select .video-list li span.new::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  width: 20px;
  height: 20px;
  top: -10px;
  left: -10px;
  right: auto;
  z-index: 1;
  background-image: url("/games/prospi/2024-2025/s/images/common/icon_new.png");
  background-size: cover;
  transition: all 0.3s;
}
.video-select .video-list li.active {
  color: #2882f0;
  border: 1px solid #2882f0;
}
.video-select .video-list li:hover {
  background-color: rgba(255, 255, 255, 0.3);
}
@media only screen and (min-width: 768px) {
  .video-select .video-list {
    grid-template-columns: repeat(auto-fit, minmax(30%, 3fr));
  }
}
.video-select .mfp-close {
  color: #ffffff;
}
