﻿html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1400px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

/*:root {
    --font-jp-sans: "M PLUS 2", "Hiragino Kaku Gothic ProN", "Yu Gothic UI","Yu Gothic", Meiryo, system-ui, -apple-system, "Segoe UI","Noto Sans JP", sans-serif;
}*/

body {
    /*margin-bottom: 60px;*/
    background-color: #DCDDDD;
    /*font-family: "Meiryo", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;*/
    font-family: "M PLUS 2";
    font-weight: 400; /* 文章は400 */
}

.main-header {
    background-color: white;
    border-bottom: 1px solid #ccc;
    height: 70px;
}

.nav-link {
    color: #212529;
    font-weight: bold;
    margin-left: 15px;
    text-decoration: none;
    display: flex;
    align-items: center;
    padding-left: 5px !important;
    padding-right: 0px !important;
}

.nav-link .dot {
    display: inline-block;
    width: 12px;
    height: 12px;
    background-color: #b10000;
    border-radius: 50%;
    margin-right: 6px;
}

.list-table-header th {
    background-color: #FFCCCC;
}

.text-in-list {
    width: 100%;
    font-size: 12px !important;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    height: 28px;
    text-align: center;
}

.text-in-list:focus {
    /*border: solid 2px #BF0000 !important;*/
    outline: 0;
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

/* sticky-table: ヘッダー固定 */
.sticky-table thead th {
    position: sticky;
    top: -1px;
    /*background-color: white;*/
    z-index: 10;
    border-top: 0px solid #dee2e6;
    border-bottom: 2px solid #dee2e6;
}

/* スクロール固定スタイル */
.sticky-toolbar {
    position: sticky;
    top: 1px; /* ← ナビバーなどの高さに応じて調整 */
    z-index: 10;
    background-color: #fff;
    border-bottom: 1px solid #ddd;
}

/* ====== 赤い丸ラジオ（custom-radio 専用・最終版） ====== */

/* --- 本体はアクセシブルに隠す --- */
.custom-radio{
  position:absolute !important;
  width:1px !important; height:1px !important;
  margin:-1px !important; padding:0 !important; border:0 !important;
  clip:rect(0 0 0 0) !important; clip-path:inset(50%) !important; overflow:hidden !important;
  -webkit-appearance:none !important; appearance:none !important;
  accent-color:transparent !important; background:none !important; background-image:none !important;
}

/* --- ラベルをスイッチ化（左に丸） --- */
.custom-radio + label,
.custom-radio ~ label{
  position:relative; display:inline-flex; align-items:center;
  padding-left:32px; margin-right:12px; cursor:pointer; white-space:nowrap; line-height:22px;
}

/* 未選択：白地＋赤枠（そのまま） */
.custom-radio + label::before,
.custom-radio ~ label::before{
  content:"";
  position:absolute; left:0; top:50%;
  width:22px; height:22px;
  transform:translateY(-50%);
  border:2px solid #BF0000;   /* 赤い外枠 */
  border-radius:50%;
  background:#fff;            /* ← 未選択は白 */
  box-sizing:border-box;
}

/* ✔（未選択は非表示）― 白いチェックを描く */
.custom-radio + label::after,
.custom-radio ~ label::after{
  content:"";
  position:absolute;
  left:7px; top:48%;                 /* 中心を基準に */
  width:7px;                         /* 短辺（✔の形が細めに見える比率） */
  height:12px;                       /* 長辺 */
  transform:translate(-50%,-58%) rotate(45deg) scale(0);
  transform-origin:center;
  border-right:2px solid #fff;       /* 白いチェック線 */
  border-bottom:2px solid #fff;
  border-top:0; border-left:0;
  opacity:0;
  transition:transform .12s ease-in-out, opacity .12s ease-in-out;
}

/* 選択：円を赤で塗る＋白✔を出す */
.custom-radio:checked + label::before,
.custom-radio:checked ~ label::before{
  background:#BF0000;         /* ← 塗りつぶしを赤に */
  border-color:#BF0000;
}

.custom-radio:checked + label::after,
.custom-radio:checked ~ label::after{
  transform:translateY(-55%) rotate(45deg) scale(1);
  opacity:1;
}
