/*
 * 2026-11-06 管理画面（mypage・ログイン）の見た目を新しくする。
 * common.css の後に読み、上書きだけする（common.css は公開ページとも共用のため触らない）。
 * 画面ごとの <style>（.ls .card など）が勝つよう、ID は common.css が ID で書いている所だけに使う。
 * 色はメンテナンスのお知らせの画面と揃える（紺 #2f4a6d・地 #f4f6f8）。
 */

:root{
    --mp-navy:#2f4a6d;
    --mp-navy-dark:#233a57;
    --mp-navy-light:#e9eef5;
    --mp-text:#2f3744;
    --mp-sub:#6b7482;
    --mp-line:#dde2e8;
    --mp-bg:#f4f6f8;
    --mp-red:#d6202b;
}

body,html{
    background:var(--mp-bg);
    color:var(--mp-text);
    font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic UI","Meiryo",sans-serif;
    font-size:14px;
    line-height:1.7;
}

a{ color:#1f5aa6; }
a:hover{ color:var(--mp-navy-dark); }

/* ---------- 外枠 ---------- */
#content{
    background:var(--mp-bg);
    min-width:960px;
}

/* ---------- ヘッダー ---------- */
#header_mypage{
    height:auto;
    min-height:72px;
    margin:0;
    padding:16px 24px 6px;
    box-sizing:border-box;
    background:#fff;
    border-bottom:1px solid var(--mp-line);
    display:flex;
    align-items:center;
    gap:16px;
    position:relative;
}
#header_message{
    position:absolute;
    left:24px;
    top:5px;
    padding:0;
    font-size:11px;
    color:var(--mp-sub);
    line-height:1.4;
}
#logo{
    display:flex;
    align-items:center;
}
#logo img{
    width:auto;
    height:44px;
}
#logo .mp-title{
    margin-left:12px;
    padding-left:14px;
    border-left:1px solid var(--mp-line);
    font-size:17px;
    font-weight:600;
    color:var(--mp-navy);
    text-decoration:none;
    letter-spacing:.06em;
    line-height:1;
}
#login_name{
    position:static;
    width:auto;
    height:auto;
    margin-left:auto;
    text-align:right;
    color:var(--mp-sub);
    font-size:13px;
}
#login_btn{
    position:static;
    width:auto;
    height:auto;
    order:2;
}
#login_btn a{
    display:inline-block;
    padding:6px 16px;
    border:1px solid var(--mp-line);
    border-radius:6px;
    background:#fff;
    color:var(--mp-text);
    font-size:13px;
    text-decoration:none;
    white-space:nowrap;
}
#login_btn a:hover{
    background:var(--mp-navy-light);
    border-color:#c5cfdc;
}

/* ---------- メニュー ---------- */
#gloval_nav{
    height:auto;
    margin:0;
    padding:0 16px;
    border:0;
    background:var(--mp-navy);
}
#gloval_nav ul{
    display:flex;
    flex-wrap:wrap;
    margin:0;
    padding:0;
    list-style:none;
}
#gloval_nav li,
#gloval_nav li.mypage_navi{
    float:none;
    width:auto;
    height:auto;
}
#gloval_nav li a,
#gloval_nav li.mypage_navi a{
    display:block;
    width:auto;
    height:auto;
    padding:11px 14px 9px;
    border-bottom:3px solid transparent;
    background:none;
    color:#dfe6f0;
    font-weight:500;
    font-size:13.5px;
    line-height:1.4;
    white-space:nowrap;
}
#gloval_nav li a:hover{
    background:rgba(255,255,255,.08);
    color:#fff;
}
#gloval_nav li a.selected{
    height:auto;
    border-bottom:3px solid #fff;
    color:#fff;
    font-weight:700;
}

/* ---------- 本文 ---------- */
#main{
    margin:20px 24px;
    background:#fff;
    border:1px solid var(--mp-line);
    border-radius:10px;
    box-shadow:0 1px 3px rgba(20,30,50,.05);
}
#main_content_one{
    background:transparent;
    padding:20px 24px 28px;
}

#mypage h2,
#input_form h4{
    margin:0 0 16px;
    padding:2px 0 10px 12px;
    border-bottom:1px solid var(--mp-line);
    border-left:4px solid var(--mp-navy);
    font-size:20px;
    line-height:1.4;
    font-weight:700;
    color:var(--mp-text);
}

h3{ color:var(--mp-text); }

/* ---------- 表 ---------- */
.index_table{
    font-size:14px;
}
.index_table,
#input_form table{
    border-collapse:collapse;
    background:#fff;
    border:1px solid var(--mp-line);
}
.index_table th,
#input_form table th{
    border:1px solid var(--mp-line);
    background:#f0f3f7;
    color:var(--mp-text);
    font-weight:600;
    padding:8px 10px;
    text-align:left;
}
.index_table th a{
    color:var(--mp-navy);
}
.index_table td,
#input_form table td{
    border:1px solid var(--mp-line);
    background:#fff;
    padding:8px 10px;
}
.index_table tr.altrow td{
    background:#fafbfc;
}
/* 横長の一覧の見出し（1 行目が全部 th）は紺にして表の頭と分かるように */
.index_table tr:first-child th[colspan],
.index_table th[colspan]{
    text-align:center;
}

/* ---------- 入力 ---------- */
input[type=text],
input[type=password],
input[type=email],
input[type=tel],
input[type=number],
input[type=search],
input[type=url],
input[type=date],
input[type=time],
input:not([type]),
textarea,
select{
    padding:5px 8px;
    border:1px solid #c6ced8;
    border-radius:5px;
    background:#fff;
    color:var(--mp-text);
    font-family:inherit;
    font-size:14px;
    line-height:1.4;
    box-sizing:border-box;
    max-width:100%;
}
input[type=text]:focus,
input[type=password]:focus,
input[type=email]:focus,
input[type=tel]:focus,
input[type=number]:focus,
input:not([type]):focus,
textarea:focus,
select:focus{
    outline:none;
    border-color:var(--mp-navy);
    box-shadow:0 0 0 3px rgba(47,74,109,.15);
}
input[type=checkbox],
input[type=radio]{
    accent-color:var(--mp-navy);
    vertical-align:middle;
}

/* ---------- ボタン ---------- */
input[type=submit],
input[type=button],
button{
    padding:7px 18px;
    border:1px solid var(--mp-navy);
    border-radius:6px;
    background:var(--mp-navy);
    color:#fff;
    font-family:inherit;
    font-size:14px;
    font-weight:600;
    line-height:1.4;
    cursor:pointer;
}
input[type=submit]:hover,
input[type=button]:hover,
button:hover{
    background:var(--mp-navy-dark);
    border-color:var(--mp-navy-dark);
}
input[type=submit]:disabled,
input[type=button]:disabled,
button:disabled{
    opacity:.5;
    cursor:default;
}

/* ---------- 文字・ページ送り ---------- */
.message{ color:var(--mp-sub); }
.error-message{ color:var(--mp-red); }
.form-error{ background:#fdecec; border-color:var(--mp-red); }

div.paging{
    margin:8px 0 12px;
    color:var(--mp-sub);
}
div.paging span a,
div.paging a{
    display:inline-block;
    padding:2px 8px;
    border:1px solid var(--mp-line);
    border-radius:4px;
    text-decoration:none;
    background:#fff;
}
div.paging span.current{
    display:inline-block;
    padding:2px 8px;
    border-radius:4px;
    background:var(--mp-navy);
    color:#fff;
    font-weight:700;
}

/* ---------- フッター ---------- */
#footer{
    height:auto;
    margin:0 24px;
    padding:8px 0 24px;
    border-top:0;
    color:var(--mp-sub);
    font-size:12px;
}
#footer .navi_link a{
    color:var(--mp-sub);
}
#footer .navi_link a:hover{
    color:var(--mp-navy);
}

/* ---------- ログイン ---------- */
.mp-login-title{
    margin:12px 0 6px;
    font-size:22px;
    font-weight:700;
    color:var(--mp-navy);
    letter-spacing:.06em;
}

/* ---------- 説明文を大きく（2026-11-06 字が小さくて見にくいと言われた） ---------- */
#main_content_one{
    font-size:15px;
}
#main_content_one p,
#main_content_one li,
#main_content_one label{
    font-size:16px;
    line-height:1.8;
}
/* 画面ごとに直接書いてある小さい文字（注意書きなど）も一回り大きく */
#main_content_one [style*="font-size:11px"],
#main_content_one [style*="font-size: 11px"],
#main_content_one [style*="font-size:12px"],
#main_content_one [style*="font-size: 12px"]{
    font-size:14px !important;
}
#main_content_one [style*="font-size:13px"],
#main_content_one [style*="font-size: 13px"]{
    font-size:15px !important;
}