/* ===== 法的ページ・お問い合わせ共通スタイル ===== */
body { background: #f8faff; }

.container { max-width: 760px; margin: 48px auto; padding: 0 24px 80px; }
h1 { font-size: 26px; font-weight: 800; color: #1a1a2e; margin-bottom: 8px; }
h2 { font-size: 16px; font-weight: 700; color: #1a1a2e; margin: 28px 0 10px; }
p, li { font-size: 14px; color: #444; line-height: 1.9; }
ul { padding-left: 20px; margin-top: 6px; }
.updated { font-size: 13px; color: #aaa; margin-bottom: 32px; }
.section { background: white; border-radius: 10px; padding: 24px 28px; margin-bottom: 16px; box-shadow: 0 2px 8px rgba(0,0,0,0.05); }

/* ===== お問い合わせフォーム ===== */
.contact-container { max-width: 600px; margin: 56px auto; padding: 0 24px 80px; }
.subtitle { font-size: 14px; color: #888; margin-bottom: 36px; }
.card { background: white; border-radius: 14px; padding: 36px; box-shadow: 0 2px 12px rgba(0,0,0,0.07); }
label { display: block; font-size: 13px; font-weight: 600; color: #444; margin-bottom: 6px; }
label .req { color: #e74c3c; margin-left: 4px; font-size: 11px; }
input, textarea {
  width: 100%; padding: 10px 14px; border: 1.5px solid #e0e0e0;
  border-radius: 8px; font-size: 14px; font-family: inherit; transition: border 0.2s;
}
input:focus, textarea:focus { outline: none; border-color: #3b82f6; }
textarea { height: 140px; resize: vertical; }
.field { margin-bottom: 20px; }
.btn {
  width: 100%; padding: 13px; border-radius: 8px; border: none;
  background: #3b82f6; color: white; font-size: 15px; font-weight: 700;
  cursor: pointer; transition: background 0.2s;
}
.btn:hover { background: #2563eb; }
.error {
  background: #fef2f2; border: 1px solid #fca5a5; color: #dc2626;
  padding: 12px 16px; border-radius: 8px; font-size: 13px; margin-bottom: 20px;
}
.success { text-align: center; padding: 48px 24px; }
.success .icon { font-size: 56px; margin-bottom: 16px; }
.success h2 { font-size: 22px; font-weight: 800; color: #1a1a2e; margin-bottom: 10px; }
.success p { font-size: 14px; color: #888; margin-bottom: 28px; }
.success a {
  display: inline-block; padding: 12px 32px; background: #3b82f6;
  color: white; border-radius: 8px; text-decoration: none; font-weight: 700; font-size: 14px;
}

/* ===== 特商法テーブル ===== */
.legal-h1 { margin-bottom: 32px; padding-bottom: 16px; border-bottom: 2px solid #e8ecef; }
table { width: 100%; border-collapse: collapse; background: white; border-radius: 10px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
th {
  background: #f0f7ff; color: #555; font-size: 13px; font-weight: 600;
  padding: 14px 20px; text-align: left; width: 200px;
  border-bottom: 1px solid #e8ecef; vertical-align: top;
}
td { padding: 14px 20px; font-size: 14px; color: #333; border-bottom: 1px solid #f0f0f0; line-height: 1.7; }
tr:last-child th, tr:last-child td { border-bottom: none; }

/* ===== 認証ページ共通（登録・パスワードリセット） ===== */
.auth-body {
  background: linear-gradient(135deg, #ebf3ff, #dbeafe);
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
}
.auth-card {
  background: white; border-radius: 14px; padding: 44px 40px;
  width: 100%; max-width: 420px; box-shadow: 0 20px 60px rgba(59,130,246,0.15);
}
.auth-logo { text-align: center; margin-bottom: 32px; }
.auth-logo .brand { font-size: 22px; font-weight: 800; color: #1a1a2e; }
.auth-logo .brand span { color: #3b82f6; }
.auth-logo p { font-size: 13px; color: #888; margin-top: 6px; }
.auth-card label { display: block; font-size: 13px; font-weight: 600; color: #555; margin-bottom: 6px; }
.auth-card input { width: 100%; padding: 12px 14px; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 14px; margin-bottom: 18px; outline: none; transition: border 0.2s; }
.auth-card input:focus { border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59,130,246,0.1); }
.auth-card button { width: 100%; padding: 13px; background: #3b82f6; color: white; border: none; border-radius: 8px; font-size: 15px; font-weight: 700; cursor: pointer; transition: background 0.2s; }
.auth-card button:hover { background: #2563eb; }
.auth-alert-error { background: #fef2f2; border: 1px solid #fecaca; color: #dc2626; padding: 10px 14px; border-radius: 6px; font-size: 13px; margin-bottom: 20px; }
.auth-alert-info { background: #f0f7ff; border: 1px solid #bfdbfe; color: #1d4ed8; padding: 10px 14px; border-radius: 6px; font-size: 13px; margin-bottom: 20px; }
.auth-note { background: #f0f7ff; border-radius: 8px; padding: 12px 14px; font-size: 12px; color: #555; margin-bottom: 20px; line-height: 1.6; }
.auth-link { text-align: center; margin-top: 20px; font-size: 13px; color: #888; }
.auth-link a { color: #3b82f6; text-decoration: none; font-weight: 600; }
.auth-link a:hover { text-decoration: underline; }
.auth-desc { font-size: 14px; color: #666; margin-bottom: 24px; line-height: 1.7; }

/* ===== 管理者ログインページ ===== */
.admin-login-body {
  background: linear-gradient(135deg, #2c3e50, #34495e);
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
}
.admin-login-card {
  background: white; border-radius: 12px; padding: 40px;
  width: 100%; max-width: 400px; box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.admin-login-card .logo { text-align: center; margin-bottom: 32px; }
.admin-login-card .logo h1 { font-size: 20px; color: #2c3e50; margin-top: 8px; }
.admin-login-card .logo p { font-size: 13px; color: #888; }
.admin-login-card label { display: block; font-size: 13px; font-weight: 600; color: #555; margin-bottom: 6px; }
.admin-login-card input { width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: 8px; font-size: 14px; margin-bottom: 20px; outline: none; }
.admin-login-card input:focus { border-color: #2c3e50; }
.admin-login-card button { width: 100%; padding: 13px; background: #2c3e50; color: white; border: none; border-radius: 8px; font-size: 15px; font-weight: 600; cursor: pointer; }
.admin-login-card button:hover { background: #34495e; }
.admin-login-card .back { text-align: center; margin-top: 20px; font-size: 13px; }
.admin-login-card .back a { color: #667eea; text-decoration: none; }

/* ===== ログインページ ===== */

.login-body {
  background: linear-gradient(135deg, #667eea, #764ba2);
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
}
.login-card {
  background: white; border-radius: 12px; padding: 40px;
  width: 100%; max-width: 400px; box-shadow: 0 20px 60px rgba(0,0,0,0.2);
}
.login-logo { text-align: center; margin-bottom: 32px; }
.login-logo h1 { font-size: 20px; color: #2c3e50; margin-top: 8px; }
.login-logo p { font-size: 13px; color: #888; margin-top: 4px; }
.login-card label { display: block; font-size: 13px; font-weight: 600; color: #555; margin-bottom: 6px; }
.login-card input {
  width: 100%; padding: 12px; border: 1px solid #ddd;
  border-radius: 8px; font-size: 14px; margin-bottom: 20px; outline: none;
}
.login-card input:focus { border-color: #667eea; }
.login-card button {
  width: 100%; padding: 13px;
  background: linear-gradient(135deg, #667eea, #764ba2);
  color: white; border: none; border-radius: 8px;
  font-size: 15px; font-weight: 600; cursor: pointer;
}
.login-card button:hover { opacity: 0.9; }
.login-alert {
  background: #fee; border: 1px solid #fcc; color: #c33;
  padding: 10px 14px; border-radius: 6px; font-size: 13px; margin-bottom: 20px;
}

/* ===== レスポンシブ ===== */
@media (max-width: 768px) {
  .container { padding: 0 16px 60px; margin: 24px auto; }
  .contact-container { margin: 24px auto; padding: 0 16px 60px; }
  .card { padding: 24px 20px; }
  .auth-card { padding: 32px 20px; }
  .auth-body, .login-body, .admin-login-body { align-items: flex-start; padding-top: 40px; }
  table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  th { min-width: 100px; }
}