@charset "utf-8";

/* 背景 */
body.login { display:flex; flex-flow:column nowrap; justify-content:center; align-items:center; min-height:100vh; background:rgba(0,0,0,0.2); position:relative; }
body.login:after { content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:url(../img/top/img_top_mainview_01.webp) center top/cover no-repeat; opacity:0.1; z-index:-1; }


/* ログインエリア */
#login { width:400px; max-width:90%; }


/* ロゴ */
.login h1 { margin-bottom:20px; }
.login h1 a { display:block; width:100px; height:100px; border-radius:50%; margin: 0 auto; }


/* ボックス */
.login form { background:#fff; border:none; border-radius:16px; box-shadow:0 15px 40px rgba(0,0,0,.15); padding:30px; }


/* ラベル */
.login label { font-size:14px; color:#555; font-weight:700; }


/* 入力欄 */
.login input[type="text"],
.login input[type="password"] { background:#f8fbff; border:2px solid #d9e8f7; border-radius:8px; font-size:16px; padding:10px 14px; }
.login input[type="text"]:focus,
.login input[type="password"]:focus { border-color:#005bac; box-shadow: 0 0 0 3px rgba(0,91,172,.15); }


/* ボタン */
.wp-core-ui .button-primary { width:100%; height:48px; background:#005bac; border:none; border-radius:8px; font-size:15px; font-weight:700; text-shadow:none; box-shadow:none; transition: .3s; }
.wp-core-ui .button-primary:hover { background:#00448a; transform:translateY(-1px); }


/* リンク */
.login #nav,
.login #backtoblog { text-align:center; }
.login #nav a,
.login #backtoblog a { color:rgba(255,255,255,.9); }
.login #nav a:hover,
.login #backtoblog a:hover { color:#fff; }