/* ====================================================================
   maylow / account CSS  自己完結版
   マイアカウント・会員ログイン
==================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500&display=swap');

body {
  background: #EFEBE3;
  color: #1A1512;
  font-family: 'Jost', 'Hiragino Sans', 'Noto Sans JP', sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}

a {
  color: #1A1512;
  text-decoration: none;
}

/* コンテナ */
.l-main,
.u-container {
  max-width: 720px;
  margin: 0 auto;
  padding: 48px 24px 80px;
}
@media (max-width: 767px) {
  .l-main,
  .u-container { padding: 28px 16px 50px; }
}

/* ヘッダー（maylow ロゴ） */
.l-header,
.header {
  padding: 40px 0 20px;
  text-align: center;
  background: #EFEBE3;
}
.l-header a,
.header a {
  color: #1A1512 !important;
  font-family: 'Jost', sans-serif;
  font-size: 36px;
  letter-spacing: 0.02em;
  font-weight: 400;
  text-decoration: none !important;
}

/* ショップへ戻るボタン */
.c-button {
  background: transparent;
  border: 0.5px solid #1A1512;
  border-radius: 0;
  padding: 10px 24px;
  font-size: 11px;
  letter-spacing: 0.25em;
  font-weight: 500;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: all .2s ease;
  font-family: 'Jost', sans-serif;
}
.c-button,
.c-button:link,
.c-button:visited {
  color: #1A1512 !important;
}
.c-button:hover,
.c-button:active {
  background: #1A1512 !important;
  color: #EFEBE3 !important;
  border-color: #1A1512;
}

/* タイトル */
.c-ttl-main,
h1, h2.c-ttl-main {
  font-family: 'Jost', 'Hiragino Sans', sans-serif;
  font-size: 28px;
  font-weight: 400;
  letter-spacing: 0.04em;
  color: #1A1512;
  text-align: center;
  margin: 20px 0 32px;
  padding-bottom: 16px;
  border-bottom: 0.5px solid rgba(26, 21, 18, 0.12);
}
@media (max-width: 767px) {
  .c-ttl-main { font-size: 22px; }
}

/* サブ見出し */
.c-ttl-second {
  font-family: 'Jost', sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #1A1512;
  margin: 32px 0 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid #1A1512;
}

/* 説明ボックス */
.c-notice,
.notice,
.info-box {
  background: #E5DFD3 !important;
  border: 0 !important;
  padding: 20px 24px !important;
  margin: 0 0 32px !important;
  font-size: 13px;
  line-height: 1.8;
  color: #3A2E20;
  border-radius: 0 !important;
}

/* 入力欄 */
.c-input--text,
input[type="email"],
input[type="password"] {
  border: 0.5px solid #8A7F73 !important;
  border-radius: 0 !important;
  background: #FFFFFF;
  padding: 10px 12px;
  font-size: 14px;
  color: #1A1512;
  font-family: inherit;
  width: 100%;
  box-sizing: border-box;
}
.c-input--text:focus,
input[type="email"]:focus,
input[type="password"]:focus {
  border-color: #1A1512 !important;
  outline: none;
  box-shadow: none;
}

/* ラベル */
th, dt, label {
  color: #3A2E20;
  font-size: 13px;
  letter-spacing: 0.05em;
  font-weight: 400;
}

/* プライマリボタン（ログイン・保存など） */
.c-button--primary {
  background: #B84A30 !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 14px 48px;
  font-size: 12px;
  letter-spacing: 0.3em;
  font-weight: 500;
  text-transform: uppercase;
  font-family: 'Jost', sans-serif;
  cursor: pointer;
  transition: background .2s ease;
}
.c-button--primary,
.c-button--primary:link,
.c-button--primary:visited {
  color: #EFEBE3 !important;
}
.c-button--primary:hover,
.c-button--primary:active {
  background: #9E3E28 !important;
  color: #EFEBE3 !important;
}

/* dangerボタン（退会・削除など） */
.c-button--danger {
  background: transparent !important;
  border: 0.5px solid #8A7F73 !important;
  border-radius: 0 !important;
  padding: 10px 24px;
  font-size: 11px;
  letter-spacing: 0.25em;
  font-weight: 500;
  text-transform: uppercase;
  font-family: 'Jost', sans-serif;
}
.c-button--danger,
.c-button--danger:link,
.c-button--danger:visited {
  color: #8A7F73 !important;
}
.c-button--danger:hover {
  background: #8A7F73 !important;
  color: #EFEBE3 !important;
}

/* マイアカウント特有：メニューリスト */
.c-account-menu,
.account-menu,
.c-menu-list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 0.5px solid rgba(26, 21, 18, 0.12);
}
.c-account-menu li,
.account-menu li,
.c-menu-list li {
  border-bottom: 0.5px solid rgba(26, 21, 18, 0.12);
}
.c-account-menu a,
.account-menu a,
.c-menu-list a {
  display: block;
  padding: 16px 8px;
  color: #1A1512 !important;
  font-size: 13px;
  letter-spacing: 0.1em;
  transition: background .15s ease, padding-left .15s ease;
}
.c-account-menu a:hover,
.account-menu a:hover,
.c-menu-list a:hover {
  background: #E5DFD3;
  padding-left: 16px;
}

/* 「パスワードを忘れた」などの小さいリンク */
.c-link-small,
.c-link--text,
.small-link {
  font-size: 11px;
  letter-spacing: 0.1em;
  color: #8A7F73 !important;
  border-bottom: 0.5px solid #8A7F73;
  padding-bottom: 1px;
}
.c-link-small:hover,
.c-link--text:hover,
.small-link:hover {
  color: #B84A30 !important;
  border-bottom-color: #B84A30;
}

/* ログインフォームのラッパ */
.c-login-form,
.login-form {
  max-width: 480px;
  margin: 0 auto;
}

/* 新規会員登録エリア（ログインとセットで出る場合） */
.c-account-section {
  padding: 24px;
  background: #E5DFD3;
  margin: 24px 0;
  text-align: center;
}
.c-account-section p {
  margin: 0 0 16px;
  font-size: 13px;
  color: #3A2E20;
  line-height: 1.8;
}

/* エラーメッセージ */
.c-error,
.error,
.alert-error {
  background: transparent;
  border-left: 2px solid #B84A30;
  color: #B84A30;
  padding: 12px 16px;
  margin: 0 0 24px;
  font-size: 13px;
  line-height: 1.7;
}

/* 完了メッセージ */
.c-complete,
.complete,
.success {
  background: #E5DFD3;
  padding: 24px;
  margin: 0 0 24px;
  font-size: 14px;
  line-height: 1.8;
  color: #1A1512;
}

/* ボタンエリア */
.c-button-wrap,
.btn-area {
  text-align: center;
  margin-top: 32px;
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

/* フッター */
.l-footer,
.footer {
  background: #1A1512;
  color: #8A7F73;
  padding: 28px 16px;
  text-align: center;
  font-size: 11px;
  letter-spacing: 0.15em;
  margin-top: 60px;
}
.l-footer a,
.footer a {
  color: #D6CEC0;
}