@charset "UTF-8";
/* ------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------ */
/* loading */
/* ------------------------------------------------------------------------------------------ */
.loading {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
  width: 100%;
  height: 100%;
  overflow: hidden;
  transition: opacity 0.5s ease;
}
.loading.is-loaded {
  opacity: 0;
  pointer-events: none;
}

.loading-command {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(4px, 1vw, 12px);
  width: 90vw;
  max-width: 700px;
}
.loading-command img {
  display: block;
  opacity: 0;
  transform: translateY(10px);
  animation: command-show 0.18s forwards;
  max-width: 100%;
  height: auto;
}
.loading-command .command-up,
.loading-command .command-down {
  width: 9%;
}
.loading-command .command-left,
.loading-command .command-right {
  width: 8%;
}
.loading-command .command-b {
  width: 7.5%;
}
.loading-command .command-a {
  width: 9.5%;
}
.loading-command img:nth-child(1) {
  animation-delay: 0s;
}
.loading-command img:nth-child(2) {
  animation-delay: 0.15s;
}
.loading-command img:nth-child(3) {
  animation-delay: 0.3s;
}
.loading-command img:nth-child(4) {
  animation-delay: 0.45s;
}
.loading-command img:nth-child(5) {
  animation-delay: 0.6s;
}
.loading-command img:nth-child(6) {
  animation-delay: 0.75s;
}
.loading-command img:nth-child(7) {
  animation-delay: 0.9s;
}
.loading-command img:nth-child(8) {
  animation-delay: 1.05s;
}
.loading-command img:nth-child(9) {
  animation-delay: 1.2s;
}
.loading-command img:nth-child(10) {
  animation-delay: 1.35s;
}

@keyframes command-show {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.loading-command.is-fadeout img {
  animation: command-fadeout 0.4s ease forwards;
}

@keyframes command-fadeout {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(0);
  }
}
/* ------------------------------------------------------------------------------------------ */
/* font */
/* ------------------------------------------------------------------------------------------ */
body {
  color: #353535;
  font-family: m-plus-1c, sans-serif, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", arial, Meiryo, メイリオ, "游ゴシック", "Yu Gothic UI", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Osaka, "MS PGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.title-font {
  font-family: m-plus-1c, sans-serif;
  font-weight: 900;
  font-style: normal;
}

.konami-font {
  font-family: source-han-sans-cjk-ja, sans-serif;
}

/* ------------------------------------------------------------------------------------------ */
/* contents */
/* ------------------------------------------------------------------------------------------ */
.notice-list > li {
  position: relative;
  padding-left: 1rem;
}
.notice-list > li:before {
  content: "※";
  position: absolute;
  left: 0;
}
.notice-list > li span {
  display: inline-block;
}

.kv-area {
  background-color: #b60014;
  width: 100%;
  text-align: center;
}
.kv-area img {
  width: 100%;
  height: auto;
  max-width: 1000px;
}

.main-inner {
  margin: 0 auto;
  padding: clamp( 0.625rem, -1.161rem + 8.93vw, 3.125rem ) clamp( 0.625rem, 0.625rem + 0vw, 0.625rem ) clamp( 0.625rem, -1.161rem + 8.93vw, 3.125rem ) clamp( 0.625rem, 0.625rem + 0vw, 0.625rem )  ;
  max-width: 1100px;
}

.about-heading {
  font-size: clamp( 1.5rem, 0.786rem + 3.57vw, 2.5rem )  ;
  line-height: 1.2;
  color: #b60014;
  text-align: center;
}

.about-text {
  margin-top: clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem )  ;
  font-size: clamp( 0.875rem, 0.786rem + 0.45vw, 1rem )  ;
  text-align: center;
  line-height: 1.75;
}

.about-summary {
  margin-top: clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem )  ;
  margin-left: auto;
  margin-right: auto;
  padding: clamp( 0.9375rem, 0.268rem + 3.35vw, 1.875rem ) clamp( 0.9375rem, 0.268rem + 3.35vw, 1.875rem ) clamp( 0.9375rem, 0.268rem + 3.35vw, 1.875rem ) clamp( 0.9375rem, 0.268rem + 3.35vw, 1.875rem )  ;
  background-color: #b60014;
  color: #ffffff;
  border-radius: 10px;
  width: 90%;
  max-width: 680px;
}

.about-summary-title {
  font-size: clamp( 1.125rem, 0.679rem + 2.23vw, 1.75rem )  ;
  text-align: center;
}

.about-summary-popupname {
  margin-top: clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem )  ;
  font-size: clamp( 1rem, 0.643rem + 1.79vw, 1.5rem )  ;
  text-align: center;
}

.about-info {
  margin-top: clamp( 0.625rem, 0.179rem + 2.23vw, 1.25rem )  ;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-wrap: wrap;
  max-width: 560px;
}
.about-info > dt {
  position: relative;
  padding-bottom: 0.5rem;
  width: 30%;
}
.about-info > dt:after {
  content: "：";
  right: auto;
  position: absolute;
}
.about-info > dd {
  padding-left: 0.5rem;
  padding-bottom: 1rem;
  width: 100%;
  line-height: 1.4;
}
.about-info > dd a {
  position: relative;
  display: inline-block;
  text-decoration: underline;
  color: #ffffff;
  padding-left: 1.5rem;
}
.about-info > dd a:before {
  content: "▶";
  font-size: 12px;
  position: absolute;
  top: 2px;
  left: 6px;
  color: #ffffff;
}
.about-info > dd a:hover {
  opacity: 0.5;
}
@media screen and (min-width:768px) {
  .about-info dt {
    width: 10%;
  }
  .about-info dt:after {
    right: -0.5rem;
  }
  .about-info dd {
    width: 90%;
    padding-bottom: 0.5rem;
  }
}

.products-area-ttl {
  margin-top: clamp( 1.25rem, -0.089rem + 6.7vw, 3.125rem )  ;
  margin-left: auto;
  margin-right: auto;
  font-size: clamp( 1.875rem, 0.536rem + 6.7vw, 3.75rem )  ;
  color: #b60014;
  text-align: center;
}

.products-area .notice-text {
  margin-top: clamp( 0.9375rem, 0.268rem + 3.35vw, 1.875rem )  ;
  line-height: 1.4;
  text-align: center;
}

.products-area-novelty {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  background: rgba(255, 255, 255, 0.7);
  margin-top: clamp( 2.5rem, 0.714rem + 8.93vw, 5rem )  ;
  margin-left: auto;
  margin-right: auto;
  padding: clamp( 0.625rem, 0.179rem + 2.23vw, 1.25rem ) clamp( 1.25rem, 0.804rem + 2.23vw, 1.875rem ) clamp( 0.625rem, 0.179rem + 2.23vw, 1.25rem ) clamp( 1.25rem, 0.804rem + 2.23vw, 1.875rem )  ;
  border: 2px solid #b60014;
  border-radius: 10px;
  max-width: 825px;
  width: 100%;
}
.products-area-novelty img {
  display: block;
  width: 100%;
  height: auto;
}
.products-area-novelty .notice-list {
  margin-top: 10px;
}
.products-area-novelty .notice-list li {
  padding-top: 0.5rem;
  font-size: 12px;
  line-height: 1.3;
}
.products-area-novelty > div:last-child {
  flex: 1 1 325px;
  min-width: 0;
}

.novelty-text {
  font-size: clamp( 1rem, 0.643rem + 1.79vw, 1.5rem )  ;
  line-height: 1.2;
  color: #b60014;
}

.products-detail {
  margin-top: clamp( 2.5rem, 0.714rem + 8.93vw, 5rem )  ;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}
.products-detail.lineup img {
  width: 100%;
  height: auto;
}

.products-ttl {
  font-size: clamp( 1.25rem, 0.625rem + 3.13vw, 2.125rem )  ;
  color: #b60014;
  text-align: center;
}
.products-ttl:nth-of-type(2) {
  margin-top: clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem )  ;
}

.yugioh .products-img {
  padding: clamp( 0.625rem, -0.268rem + 4.46vw, 1.875rem ) clamp( 0.625rem, -0.268rem + 4.46vw, 1.875rem ) clamp( 0.625rem, -0.268rem + 4.46vw, 1.875rem ) clamp( 0.625rem, -0.268rem + 4.46vw, 1.875rem )  ;
  padding-right: 0;
  padding-left: 0;
  text-align: center;
  font-size: clamp( 1rem, 0.643rem + 1.79vw, 1.5rem )  ;
  line-height: 1.6;
  /*max-width: 600px;*/
  margin: 0 auto;
}

.yugioh-novelty {
  margin: 0 auto;
  padding: clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem ) clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem ) clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem ) clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem )  ;
  border: 2px solid #ed008f;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.7);
  max-width: 900px;
}

.yugioh-novelty-ttl {
  font-size: clamp( 1rem, 0.821rem + 0.89vw, 1.25rem )  ;
  line-height: 1.2;
  color: #ed008f;
  text-align: center;
  letter-spacing: -0.03rem;
}

.yugioh-novelty-img {
  margin-top: clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem )  ;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  gap: 10px;
  max-width: 705px;
}
.yugioh-novelty-img img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 250px;
}
.yugioh-novelty-img .notice-list {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex: 1 1 250px;
}
.yugioh-novelty-img .notice-list li {
  font-size: 14px;
}
.yugioh-novelty-img .notice-list li:nth-of-type(2) {
  padding-top: 1rem;
}

.img-border img {
  border: #eff0f5 1px solid;
}

.about_art_ex_ttl {
  margin-top: clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem )  ;
  font-size: clamp( 1rem, 0.821rem + 0.89vw, 1.25rem )  ;
  line-height: 1.2;
  color: #ed008f;
  text-align: center;
  flex: 1 1 300px;
}

.about_art_ex_text {
  margin-top: clamp( 0.625rem, 0.179rem + 2.23vw, 1.25rem )  ;
  font-size: clamp( 0.875rem, 0.786rem + 0.45vw, 1rem )  ;
  line-height: 1.2;
  color: #ed008f;
  text-align: center;
}
.about_art_ex_text a {
  padding-top: 0.5rem;
  color: #ed008f;
  word-break: break-all;
}
.about_art_ex_text > p {
  padding-top: 0.5rem;
}

.greeting-area {
  margin-top: clamp( 1.875rem, 0.536rem + 6.7vw, 3.75rem )  ;
  padding: clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem ) clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem ) clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem ) clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem )  ;
  background-color: rgba(182, 0, 20, 0.8);
  color: #ffffff;
}

.greeting-area-in {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin: 0 auto;
  width: 100%;
  max-width: 1000px;
}

.greeting-text {
  flex: 1 1 500px;
}
@media screen and (min-width:768px) {
  .greeting-text {
    padding-right: 30px;
  }
}

.greeting-ttl {
  margin-top: clamp( 0.625rem, 0.179rem + 2.23vw, 1.25rem )  ;
  font-size: clamp( 1.25rem, 0.357rem + 4.46vw, 2.5rem )  ;
}
.greeting-ttl + p {
  margin-top: clamp( 0.625rem, 0.179rem + 2.23vw, 1.25rem )  ;
  line-height: 1.75;
}

.greeting-detail {
  margin-top: clamp( 0.625rem, 0.179rem + 2.23vw, 1.25rem )  ;
  padding: clamp( 0.625rem, -0.268rem + 4.46vw, 1.875rem ) clamp( 0.625rem, -0.268rem + 4.46vw, 1.875rem ) clamp( 0.625rem, -0.268rem + 4.46vw, 1.875rem ) clamp( 0.625rem, -0.268rem + 4.46vw, 1.875rem )  ;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  line-height: 1.6;
  border: 2px solid #ffffff;
  border-radius: 10px;
}
.greeting-detail > p:nth-of-type(2) {
  padding-top: 0.5rem;
}
.greeting-detail > p > span {
  display: block;
  padding-left: 1rem;
}

.greeting-img {
  margin: 0 auto;
  width: 100%;
  max-width: 326px;
  height: auto;
}
.greeting-img img {
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
}

main {
  position: relative;
  isolation: isolate;
}

/* 一番下：コマンド */
.kb-background {
  position: absolute;
  inset: 0;
  z-index: -1;
}

/* 真ん中：bg.webp */
main::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -3;
  background: url("/games/store/s/img/parco_shinsaibashi/bg.webp") no-repeat bottom center;
  background-size: 100% auto;
  background-attachment: fixed;
}

/* 一番上：白グラデ */
main::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background: linear-gradient(0deg, rgba(255, 255, 255, 0.8) 0%, rgb(255, 255, 255) 100%);
}

.notice-text {
  font-size: clamp( 0.75rem, 0.616rem + 0.67vw, 0.9375rem )  ;
  line-height: 1.6;
}

.notice-text-area {
  margin: 20px auto 0;
  padding-bottom: clamp( 5rem, 4.107rem + 4.46vw, 6.25rem )  ;
  width: 90%;
  max-width: 1000px;
}
.notice-text-area .notice-list li {
  padding: 1rem 0 0 1rem;
  font-size: clamp( 0.75rem, 0.616rem + 0.67vw, 0.9375rem )  ;
  line-height: 1.3;
}

/*# sourceMappingURL=parco_shinsaibashi.css.map */