@charset "UTF-8";
*, *::before, *::after { box-sizing: border-box; }

.toroku { background: #f0f0f0; padding-bottom: 30px; }

/* ヘッダー */
.header-area {
background: #fff;
border-bottom: 3px solid #B02139;
padding: 10px 20px 20px;
}
.header {
display: flex;
align-items: center;
justify-content: space-between;
max-width: 750px;
margin: 0 auto;
}

/* トップリンク */
.toplink {
max-width: 750px;
margin: 6px auto 0;
padding: 0 10px;
text-align: right;
}
.toplink a { font-size: 12px; color: #1a1a2e; text-decoration: none; }
.toplink a:hover { 
  text-decoration: underline;
  color: #B02139;
}
/* ページタイトル */
.page-banner {
background: #f0f0f0;
max-width: 750px;
margin: 8px auto;
text-align: center;
padding: 2px 10px 16px;
}
.page-banner h1 {
font-size: 26px;
font-weight: 750;
color: #1a1a2e;
letter-spacing: 3px;
margin-bottom: 10px;
}
.ssl-notice { font-size: 14px; color: #333; }

/* メインコンテンツ */
.torokuMain { max-width: 750px; margin: 0 auto; padding: 0 10px; }

/* ご案内ボックス */
.info-box {
border: 1px solid #ccc;
border-left: 4px solid #B02139;
border-radius: 4px;
background: #fff;
padding: 12px 16px;
margin-bottom: 12px;
}
.info-box table td {
font-size: 14px;
color: #222;
line-height: 1.6;
padding: 2px 0;
vertical-align: top;
}
.info-box table td:first-child {
white-space: nowrap;
font-weight: 600;
padding-right: 8px;
}
.info-box a { color: #B02139; }

/* 必須バッジ */
.badge-hissu {
display: inline-block;
background: #B02139;
color: #fff;
font-size: 11px;
font-weight: 700;
padding: 1px 7px;
border-radius: 2px;
vertical-align: middle;
margin-left: 4px;
}
.req-notice {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 14px;
font-size: 14px;
color: #222;
}

/* エラー */
.error-box { margin-bottom: 10px; font-size: 14px; }
.text-error { color: #ff0000 !important; }

/* セクション */
.formSection { background: #fff; border: 1px solid #ccc; margin-bottom: 16px; }
.formSection__header {
background: #1a1a2e;
color: #fff;
padding: 10px 16px;
display: flex;
align-items: center;
gap: 10px;
}
.formSection__num {
background: #B02139;
color: #fff;
font-size: 13px;
font-weight: 700;
width: 24px;
height: 24px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.formSection__title { font-size: 16px; font-weight: 600; letter-spacing: 2px; }

/* フォーム行 */
.formRow {
display: flex;
align-items: flex-start;
padding: 10px 16px;
border-bottom: 1px solid #e8e8e8;
gap: 16px;
}
.formRow:last-child { border-bottom: none; }
.formRow--gray { background: #fafafa; }
.formRow__label {
min-width: 190px;
font-size: 14px;
color: #222;
display: flex;
align-items: flex-start;
flex-wrap: wrap;
gap: 4px;
padding-top: 4px;
flex-shrink: 0;
line-height: 1.5;
}
.formRow__inputs {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
/* インプット */
.formRow__inputs input[type="text"],
.formRow__inputs input[type="password"] {
border: 1px solid #ccc;
padding: 6px 10px;
font-size: 14px;
color: #555;
outline: none;
font-family: inherit;
}
.formRow__inputs input[type="text"]:focus,
.formRow__inputs input[type="password"]:focus { border-color: #B02139; }
.formRow__inputs input[type="text"]::placeholder,
.formRow__inputs input[type="password"]::placeholder { color: #aaa; }
.input-sm   { width: 150px; }
.input-full { width: 100%; max-width: 400px; }

/* 氏名グループ */
.name-group { display: flex; gap: 16px; }
.name-field { display: flex; flex-direction: column; gap: 3px; }
.name-field__lbl { font-size: 11px; color: #555; }

/* ヒント */
.hint { font-size: 14px; color: #666; margin-top: 4px; }

/* セレクト */
.formRow__inputs select {
border: 1px solid #ccc;
padding: 6px 32px 6px 10px;
font-size: 14px;
color: #555;
background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23555'/%3E%3C/svg%3E") no-repeat right 10px center;
-webkit-appearance: none;
appearance: none;
outline: none;
max-width: 360px;
width: 100%;
font-family: inherit;
cursor: pointer;
}

.formRow__inputs input[type="text"],
.formRow__inputs input[type="password"],
.formRow__inputs select {
  width: 100%;
}

/* ラジオ */
.formRow__inputs input[type="radio"] { accent-color: #B02139; }

/* ボタン */
.btn-back, .btn-reset { width:120px; padding:12px; font-size:15px; background:#fff; border:1px solid #ccc; cursor:pointer; }
.btn-back:hover, .btn-reset:hover { background:#f0f0f0; }
.btn-submit { width:120px; padding:12px; font-size:15px; background:#B02139; color:#fff; border:none; cursor:pointer; font-weight:700; }
.btn-submit:hover { background:#8f1a2e; }

/* フッター */
.footerUser {
display: flex;
justify-content: space-between;
align-items: center;
}

/* モバイル対応 */
@media (max-width: 600px) {
  .formRow {
    flex-direction: column;
    gap: 6px;
  }
  .formRow__label {
    min-width: unset;
    width: 100%;
  }
  .formRow__inputs {
    width: 100%;
  }
  .formRow__inputs input[type="text"],
  .formRow__inputs input[type="password"],
  .formRow__inputs select {
    width: 100%;
  }
}
.inline-values {
  display: flex;
  align-items: center;
  gap: 6px;
}