/* 調整用スタイル */

a {
  text-decoration: none;
}

ul,
li {
  list-style: none;
}

body{
  color: #a1b9c9;
}

main {
  background-color: #ddb9b9;
  height: 1000px;
  display: flex;
  /*margin-top: 70px;*/
}

.main {
  padding-top: 70px;
  margin: auto;
}

.main__content {
  text-align: center;
  position: relative; /* 中央揃えに影響なし */
  margin-top: 30px;
}

/*メインロゴのでかさとか*/
.main__title-image {
  max-width: 60%; /* 画像の最大幅を画面幅の80%に */
  height: auto;   /* アスペクト比を維持 */
  margin: 0 40px; /* ロゴ自体の左右に余白を追加 */
}


/* ログインフォームのスタイル */
.login-form {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.login-form__field {
  margin-bottom: 15px;
  width: 100%;
  max-width: 300px; /* 最大幅を設定 */
}

.login-form__field label {
  font-size: 14px;
  color: #191970;
  display: block;
  margin-bottom: 5px;
}

.login-form__field input {
  width: 100%;
  padding: 10px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.login-form__submit {
  padding: 10px 20px;
  font-size: 16px;
  background-color: #191970;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  margin-top: 10px;
}

.login-form__submit:hover {
  background-color: #000080;
}

.open{
  color: #63636e;
  font-weight: 200;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
}

.sinkimoji{
  margin-top: 20px;
}