/* ページ固有の生成見出し画像 */
.inner-hero-title {
  flex: 1 1 58%;
  min-width: 0;
}

.page-title-art {
  position: relative;
  display: block;
  width: min(680px, 52vw);
  max-width: 100%;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(126, 232, 255, .32);
  border-radius: 12px;
  background: #07121b;
  box-shadow:
    0 24px 60px rgba(0, 0, 0, .34),
    0 0 36px rgba(126, 232, 255, .08),
    inset 0 0 0 1px rgba(255, 255, 255, .025);
  line-height: 0;
  isolation: isolate;
}

.page-title-art::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  background:
    linear-gradient(105deg, rgba(126, 232, 255, .08), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, .03), transparent 38%, rgba(0, 0, 0, .12));
  content: "";
  pointer-events: none;
}

.page-title-art img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 1;
  object-fit: cover;
  object-position: center;
}

.map-sidebar-head .page-title-art--compact {
  width: 100%;
  margin: 8px 0 0;
  border-radius: 8px;
  line-height: 0;
}

.server-detail-hero .server-page-title-art {
  width: min(760px, 100%);
  margin: 10px 0 0;
  line-height: 0;
}

.inner-hero-grid > p:last-child,
.inner-hero-grid > .daily-hero-copy {
  flex: 1 1 38%;
}

@media (max-width: 960px) {
  .inner-hero-title,
  .inner-hero-grid > p:last-child,
  .inner-hero-grid > .daily-hero-copy {
    width: 100%;
    flex-basis: auto;
  }

  .page-title-art {
    width: min(680px, 100%);
  }
}

@media (max-width: 560px) {
  .page-title-art {
    border-radius: 8px;
    box-shadow:
      0 18px 44px rgba(0, 0, 0, .3),
      0 0 28px rgba(126, 232, 255, .07);
  }
}