.maintenance {
  min-width: 320px;
  background: #fff;
  color: #000;
  font-family: "Noto Serif JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", "メイリオ", Meiryo, sans-serif;
}

.maintenance__page {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.maintenance__header {
  display: flex;
  align-items: center;
  min-height: 120px;
  padding: 20px 28px;
  background: #004d9a;
}

.maintenance__header-logo {
  width: min(400px, 62vw);
  line-height: 0;
}

.maintenance__main {
  display: flex;
  flex: 1;
  flex-direction: column;
}

.maintenance__title {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 250px;
  padding: 40px 20px;
  background: #def7ff;
}

.maintenance__title h1 {
  font-weight: 700;
  font-size: clamp(32px, 3vw, 58px);
  line-height: 1.5;
}

.maintenance__message {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  min-height: 380px;
  padding: 60px 20px;
}

.maintenance__message-inner {
  font-size: clamp(18px, 1.5vw, 28px);
  line-height: 1.8;
}

.maintenance__message p {
  margin-bottom: 20px;
}

.maintenance__message p:last-child {
  margin-bottom: 0;
}

.maintenance__footer {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  min-height: 220px;
  padding: 36px 20px 20px;
  background: #def7ff;
}

.maintenance__footer-logo {
  width: min(350px, 70vw);
  margin-bottom: 42px;
  line-height: 0;
}

.maintenance__copyright {
  font-size: 16px;
}

@media (max-width: 768px) {
  .maintenance__page {
    min-height: auto;
  }

  .maintenance__header {
    min-height: 72px;
    padding: 18px 15px;
  }

  .maintenance__header-logo {
    width: min(290px, 78vw);
  }

  .maintenance__title {
    min-height: 0;
    padding: 30px 16px;
  }

  .maintenance__title h1 {
    font-size: 20rem;
  }

  .maintenance__message {
    min-height: 0;
    padding: 40px 24px;
  }

  .maintenance__message-inner {
    font-size: 16rem;
    line-height: 2;
    text-align: center;
  }

  .maintenance__message p {
    margin-bottom: 12px;
  }

  .maintenance__footer {
    min-height: 0;
    padding: 28px 20px 16px;
  }

  .maintenance__footer-logo {
    width: min(300px, 76vw);
    margin-bottom: 24px;
  }

  .maintenance__copyright {
    font-size: 12px;
  }
}