
/* ===================================
 enter
=================================== */
* {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
}

body {
  margin: 0;

  color: #8b6b80;

  font-family:
    "MS PGothic",
    "Meiryo",
    sans-serif;

  background-color: #f7d7e5;
  background-image:
    url("images2010/pinkcheck.png");
  background-repeat: repeat;
  background-position: top left;
}

.entrance-page {
  min-height: 100vh;

  display: flex;
  justify-content: center;
  align-items: flex-start;

  padding: 60px 20px 80px;
}

.entrance-panel {
  position: relative;

  width: 540px;
  min-height: 720px;

  padding:
    100px
    55px
    45px;

  text-align: center;

  background-color: rgba(255, 252, 254, 0.96);
  background-image:
    repeating-linear-gradient(
      90deg,
      rgba(245, 214, 228, 0.32) 0,
      rgba(245, 214, 228, 0.32) 8px,
      transparent 8px,
      transparent 18px
    );

  border: 1px solid #e6a7c1;

  box-shadow:
    0 0 0 7px #fff,
    0 0 0 9px #e9b4ca,
    0 8px 25px rgba(144, 85, 116, 0.25);
}

.entrance-panel::before {
  content: "";

  position: absolute;
  top: 18px;
  left: 50%;

  width: 240px;
  height: 70px;

  transform: translateX(-50%);

  background:
    url("images2010/entrance-ribbon.png")
    center / contain
    no-repeat;
}

.entrance-decoration {
  margin-bottom: 12px;

  color: #d78dab;

  font-size: 13px;
  letter-spacing: 8px;
}

.entrance-small {
  margin: 0 0 6px;

  color: #c88aa6;

  font-family: Georgia, serif;
  font-size: 12px;
  font-style: italic;
}

.entrance-title {
  margin: 0;

  color: #d990ae;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: 43px;
  font-style: italic;
  font-weight: normal;

  text-shadow:
    2px 2px 0 #ffffff,
    3px 3px 0 #f3cadb;
}

.entrance-description {
  margin: 18px 0 24px;

  font-size: 12px;
  line-height: 1.9;
}

.enter-button {
    display: inline-block;

    margin: 20px 0;

    text-decoration: none;
}

.enter-button img {
    display: block;

    width: 356px;
    height: 70px;

    max-width: 100%;

    transition: transform .2s ease;
}

.enter-button:hover img {
    transform: translateY(-2px);
}

.enter-button:active img {
    transform: translateY(1px);
}

.entrance-message {
  margin: 12px 0 0;

  color: #b28c9e;

  font-size: 10px;
}

.entrance-divider {
  margin: 28px 0 20px;

  color: #db91ae;

  font-size: 11px;
  letter-spacing: 4px;
}

.entrance-notice {
  padding: 10px 14px;

  background: rgba(255, 255, 255, 0.72);

  border-top: 1px dotted #d8a6bc;
  border-bottom: 1px dotted #d8a6bc;

  font-size: 10px;
  line-height: 1.7;
}

.entrance-notice p {
  margin: 3px 0;
}

.entrance-notice p::before {
  content: "♕ ";

  color: #df91af;
}

.entrance-banners {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px;

  margin-top: 22px;
}

.entrance-banners img {
  display: block;

  width: 88px;
  height: 31px;
}

.entrance-copyright {
  margin: 25px 0 0;

  color: #b78b9e;

  font-size: 9px;
  line-height: 1.7;
}

@media (max-width: 650px) {
  body {
    min-width: 600px;
  }

  .entrance-page {
    padding-top: 35px;
  }
}

.banner-wall a {
  display: block;
  width: auto;
  height: auto;
  line-height: 0;
}

.banner-wall img {
  display: block;
  width: auto;
  height: auto;
  max-height: 31px;
  border: 0;
}

