@charset "utf-8";
/* 管理画面で AdminLTE以外のスタイルが必要な時はここに記述する */
/* ----------------------------------------
共通
---------------------------------------- */
.al-l {
    text-align:left;
}
.al-c {
    text-align:center;
}
.al-r {
    text-align:right;
}

table tr td span{
    display:inline-block;
}

tr.nowrap th,
tr.nowrap td,
th.nowrap,
td.nowrap {
    white-space: nowrap;
}

.half > div {
    width: calc(100% / 2);
}
.one-third > div {
    width: calc(100% / 3);
}
.quarter > div {
    width: calc(100% / 4);
}
.one-fifth > div {
    width: calc(100% / 5);
}
.one-sixth > div {
    width: calc(100% / 6);
}

div.subtext-block {
    color: #009999;
}

div.is-invalid {
    display: block;
    width: 100%;
    margin-top: .25rem;
    color: #dc3545;
}


.btn-cancel {
    font-size: 11px;
    margin-top: 5px;
    width: 100%;
}
.mar-t4 {
    margin-top: 4px;
}
.mar-t20 {
    margin-top: 20px;
}
.mar-b10 {
    margin-bottom: 10px;
}
.mar-b20 {
    margin-bottom: 20px;
}

.pad-b20 {
    padding-bottom: 20px;
}

.m-wid500 {
    max-width: 500px;
}
.m-wid400 {
    max-width: 400px;
}
.m-wid300 {
    max-width: 300px;
}

.wid500 {
    width: 500px;
}
.wid400 {
    width: 400px;
}
.wid300 {
    width: 300px;
}
.wid200 {
    width: 200px;
}

.pad-left {
    padding-left: 1rem;
}

.box.box-solid > .box-header .btn:hover,
.box.box-solid > .box-header a:hover {
    -webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.2) !important;
    box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.2) !important;
}

.btn-social-icon > :first-child {
    font-size: 1.2em !important;
}

div.box-back-link {
    margin-bottom: 10px;
}

div.furigana {
    font-size: 0.9em;
}

div.horizontal-block {
    display: flex;
}
div.horizontal-block div.form-group:not(:last-child) {
    margin-right: 10px;
}
div.ckeditor-view {
    margin: 30px;
    max-width: 600px;
}

.actions {
    white-space: nowrap;
    width: 100px;
    max-width:155px;
}

.table.table-bordered tr th {
    white-space: nowrap;
}

/* ----------------------------------------
ロゴ画像
---------------------------------------- */
.brand-link {
    padding: 5px;
    display:flex;
    justify-content: center;
}
.brand-link img {
    height: 46px;
}

/* ----------------------------------------
ボタン
---------------------------------------- */
.btn-white {
    background-color: #fff;
    border-color: #ddd;
}
.btn-action-icon {
    width: 40px;
    height: 38px;
}

/* ----------------------------------------
ソート
---------------------------------------- */
table.table-bordered thead tr th a.asc:after {
    content: ' ▲';
}

table.table-bordered thead tr th a.desc:after {
    content: ' ▼';
}

div.icheck-primary {
    margin-right: 30px;
}


/* ----------------------------------------
マテリアル一覧
---------------------------------------- */
tr.no-payment,
tr.expired {
    background: #ffcccc !important;
}
tr.update-soon {
    background: #ffcc99 !important;
}

tr.deleted {
    background: #bbbbbb !important;
}

/* ----------------------------------------
マテリアル詳細
---------------------------------------- */
.image-area img {
    width:100%;
    max-width:800px;
}

/* ----------------------------------------
一括変更
---------------------------------------- */
i.fa-question-circle {
    font-size: 1.1rem;
    color: #FFAA55;
}