﻿html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.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%;
}

body {
    margin-bottom: 60px;
}

/* #region 入力欄 */


/* bootstrapのチェックボックスの装飾を上書き */
.form-check-input {
    appearance: auto !important; /* ブラウザ標準の見た目に戻す（チェックボックス／ラジオボタンのデフォルトスタイルを適用） */
    -webkit-appearance: radio !important; /* WebKit系ブラウザ（Chrome, Safariなど）でラジオボタン風の見た目に強制する */
    -moz-appearance: radio !important; /* Firefoxでラジオボタン風の見た目に強制する */
    background: none !important; /* 背景色をリセット（Bootstrapが付けている背景色を消す） */
    border: none !important; /* 枠線をリセット（Bootstrapが付けているボーダーを消す） */
    outline: none !important; /* キーボード操作時のフォーカスリング（青い枠線）を消す */
    box-shadow: none !important; /* Bootstrapが付けているフォーカス時のシャドウ効果を消す */
}

/* no-focusクラスを付けた要素にはbootstrapの青枠を出さない */
.no-focus:focus {
    outline: none !important;
    box-shadow: none !important;
}

/*操作禁止の入力欄に使う*/
.disabled-like {
    opacity: 0.5; /* グレーアウト */
}

    /*操作禁止入力欄ホバー時にカーソルを禁止マークにする*/
    .disabled-like:hover {
        cursor: not-allowed; /*禁止カーソル */
    }

/*グレーボタン*/
.gray-btn {
    background-color: #dedede;
    width: 200px;
}

    .gray-btn:hover {
        background-color: #c0c0c0 !important;
    }

/* 通常入力欄の背景色 */
.normal-bg {
    background-color: #e5f9ff !important;
}

/* 必須入力欄の背景色 */
.required-bg {
    background-color: #ffe8ec !important;
}

/* 入力禁止欄の背景色 */
.form-control:disabled, .form-control[readonly] {
    background-color: #bababa !important;
    opacity: 1;
    cursor: text;
}

/*郵便番号の前半3桁の入力欄*/
.postalCode-first {
    width: 120px;
}

/*郵便番号の後半4桁の入力欄*/
.postalCode-second {
    width: 140px;
}

.a-input-group-btn {
    position: relative;
    font-size: 0;
    white-space: nowrap;
    display: table-cell;
}


/*モーダルアラートエリアのボタン*/
.btn-default {
    color: #333;
    background-color: #dcdcdc;
    border-color: #dcdcdc;
    border: 1px solid #999999;
}

    /*モーダルアラートエリアのボタン*/
    .btn-default:hover {
        color: #333;
        background-color: #dcdcdc;
        border-color: #dcdcdc;
    }

    /*モーダルアラートエリアのボタン*/
    .btn-default.focus, .btn-default:focus {
        color: #333;
        background-color: #dcdcdc;
        border-color: #dcdcdc;
    }

/*パンくずリストのスタイル*/
.breadcrumb {
    font-size: 20px;
    margin-bottom: 20px;
    color: #555;
    margin-left: 10px;
}

    .breadcrumb a {
        text-decoration: none;
        color: #007bff !important;
    }

        /* すべての a の前に矢印を追加（最初の a は除外） */
        .breadcrumb a + a::before,
        .breadcrumb span::before {
            content: " > "; /* 矢印と間隔 */
            color: #999;
            margin: 0 5px; /* 矢印前後の間隔 */
        }

/* 共通ボタンスタイル(メインメニュー用画面遷移ボタン) */
.menu-btn {
    width: 100%;
    max-width: 400px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 15px;
    white-space: normal; /* 長文を折り返し可能に */
    background-color: #dedede;
    color: #000;
}

    /* メニューボタンにホバー装飾 */
    .menu-btn:hover {
        background-color: #c0c0c0 !important;
    }


/* 共通ボタンスタイル(サブメニュー・その他ボタン(保存など)用) */
.sub-menu-btn {
    width: 100%;
    max-width: 400px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 15px;
    white-space: normal; /* 長文を折り返し可能に */
    background-color: #dedede;
    color: #000;
    font-weight: bold;
}

    /* メニューボタンにホバー装飾 */
    .sub-menu-btn:hover {
        background-color: #c0c0c0 !important;
    }

.title-bottomborder {
    border-bottom: 2px solid gray;
}

.label-fixed {
    min-width: 160px;
    max-width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bg-info {
    background-color: #6ff7ae !important;
}

.large-checkbox {
    transform: scale(1.3);
    margin: 3px 2px;
}

.large-radio {
    transform: scale(1.3);
    margin-right: 3px;
}



/* #endregion  */

