@charset "UTF-8";

#login { height: 100vh; display: flex; justify-content: center; }
#login form { margin: 0 auto; width: 100%; max-width: 500px; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; }
#login img { margin-bottom: 40px; width: 60%; }
#login dl { width: 80%; }
#login dt, #login dd { text-align: left; }
#login dt { margin-bottom: 5px; font-weight: bold; }
#login dd { margin-bottom: 10px; }
#login input[type="email"], #login input[type="password"] { padding: 10px; width: 100%; border: solid 1px #ccc; font-size: 100%; }
#login #button { margin: 20px 0; display: flex; justify-content: center; }
#login #button button { padding: 10px; min-width: 300px; background: #236af6; border: solid 1px #236af6; color: #fff; font-size: 100%; transition: all .3s; }
#login #button button:hover { background: #fff; color: #236af6; }

@media screen and (max-width: 1024px) {
}

@media screen and (max-width: 768px) {
}

/* 後で削除 */
/*#login form img { aspect-ratio: 3/1; }*/