div.required > label:after{
    content: '＊';
    color: #ff0000;
    font-size: 80%
}

.main-header > form,
.main-header > ul.ml-auto  {
    display:none
}

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

.ele-c {
    display: flex;
    justify-content: center;
}

/* 強めのアラート表示 */
.strong-alert {
    color: #ff0000;
    font-size: 1.1rem;
    font-weight:bolder;
}
.normal-alert{
    color: #ff0000;
}

.btn-outline-info {
    background-color: rgba(23, 162, 184, 0.09);
    box-shadow: 0 0 1px rgb(0 0 0 / 13%), 0 1px 3px rgb(0 0 0 / 20%);
}
@media (min-width: 1200px) {
    .layout-navbar-fixed .wrapper .content-wrapper.logon {
        margin-top: 97px;
    }
}

@media (min-width: 999.98px) {
    .footer-nav ul li:nth-child(n+2):before {
        content: "｜";
        padding-left:20px;
        padding-right:20px;
    }
    .footer-nav ul {
        text-align:center;
        display: flex;
    }
}

@media (max-width: 1199px) {
    .navbar-expand-md .navbar-collapse {
        flex-basis: 100%;
    }
    .navbar-expand-md .navbar-nav {
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .navbar-expand-md .navbar-nav.logoff {
        -ms-flex-direction: row !important;
        flex-direction: row !important;
    }
}
@media (max-width: 1199px) {
    .collapse:not(.show) {
        display: none !important;
    }
    .navbar-expand-md .navbar-toggler {
        display: unset;
    }
}

.bg-order-detail {
    background-color:#E3EFFF;
}

@media (max-width: 767.98px) {
    div.dataTables_wrapper div.dataTables_paginate ul.pagination {
        justify-content: center !important;
    }
    span.br::before {
        content: "\A" ;
        white-space: pre ;
    }
}

/* はてなアイコン */
#main-content i.fa-question-circle {
    font-size:1.1rem;
    color: #FFAA55;
}



/* ----------------------------------------
ヘッダー
---------------------------------------- */
.footer-nav ul {
    padding:0;
    margin:0 0 10px;
}

.main-footer {
    background-color:#2f2e34;
    color: #fff;
    text-align:center;
    font-size: 0.9rem;
}
.main-footer a {
    color: #fff;
}
.main-footer a:hover, a:active {
    color: #bbb;
}
.footer-nav {
    display: flex;
    justify-content: center;
    align-items: center;
}

.footer-nav ul li {
    justify-content:center;
    list-style: none;
}
@media (max-width: 999.98px) {
    .footer-nav ul li {
        display:inline-block;
        padding:0 10px
    }
    .navbar-no-expand .nav-link{
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
}

.sitename strong span {
    display: inline-block;
}


/* ----------------------------------------
AdminLTE override
---------------------------------------- */
.navbar-danger {
    background-color: #e20014;
}
div.logo {
    text-align: center;
}
.navbar-brand {
    padding-top:0;
    padding-bottom:0;
    height:40px;
}
@media (max-width: 767.98px) {
    .main-header > .container {
        display:block;
    }
}
@media (max-width:  400px) {
    .navbar-brand {
        width: calc(100vw - 210px);
        max-width: 140px;
        min-width: 120px;
    }
}

/* ----------------------------------------
ヘッダー
---------------------------------------- */
.navbar-light .navbar-nav .nav-link,
.brand-text {
    color: #ffffff;
}
.breadcrumb-item+.breadcrumb-item::before {
    content: ">";
}

/* ----------------------------------------
進行ナビゲーション
---------------------------------------- */
div.process-navi {
    text-align:center;
    font-size:1.1rem;
}
div.process-navi span.item {
    padding:10px 0;
    color: #888;
    font-weight:bolder;
}
div.process-navi span.item.active {
    color: #000;
}
div.process-navi span.item:not(:first-child):before {
    content: '→';
    padding:10px 20px;
    color: #888;
}
@media (max-width: 767.98px) {
    /* div.process-navi {
        text-align:left;
        font-size:0.9rem;
    }
    div.process-navi span.item {
        display:block;
        padding:5px;
    }
    div.process-navi span.item:not(:first-child):before {
        padding:5px 5px;
        color: #888;
    } */
    div.process-navi {
        display:none;
    }
}

/* ----------------------------------------
フォーム共通
---------------------------------------- */

.input-description {
    background: #f6f6f6;
    padding:10px;
    margin-bottom:10px;
    border-radius:5px;
}
.subtext {
    font-size:0.9rem;
    color: #1EB1A9;
    padding: 2px 5px;
    display: inline-block;
}
.description {
    color: #1EB1A9;
}

.form-group .form-group {
    margin-bottom: 0px;
}

[class*=icheck-]>input:first-child:disabled+input[type=hidden]+label,
[class*=icheck-]>input:first-child:disabled+label {
    opacity: .35;
}
[class*=icheck-]>input:first-child:disabled+input[type=hidden]+label::before,
[class*=icheck-]>input:first-child:disabled+label::before {
    opacity: .7;
}


/* ----------------------------------------
ラジオボタン横並び
---------------------------------------- */
div.form-group.radio div.input-wrapper {
    display:flex;
}
@media (max-width: 767.98px) {
    div.form-group.radio div.input-wrapper {
        display: block;
    }
}
div.form-group.radio div.input-wrapper > div.radio {
    margin-right:20px;
}

div.horizontal-input {
    display:flex;
}
div.horizontal-input div.form-group {
    margin-right: 20px;
}
@media (max-width: 767.98px) {
    div.horizontal-input {
        display:block;
    }
}

/* ----------------------------------------
画像ファイル選択・プレビュー
---------------------------------------- */
.custom-file-label::after {
    content: 'ファイル選択'
}
div#preview {
    margin:10px auto;
    max-width: 500px;
}
div#preview img {
    width:100%;
}


/* ----------------------------------------
ホーム
---------------------------------------- */
.material-row {
    align-items:center;
    font-weight: bolder;
}

.material-row img {
    width: 70px;
}
.btn-material-edit {
    margin-left:20px;
    color:#ffffff;
}
.alert-message {
    background:rgba(226,0,20,0.2);
    padding:15px;
    border:1px solid rgba(226,0,20,0.3);
}
.warning-message {
    background:#FFD771;
    padding:15px;
    border:1px solid #E68A00;
}

.material-row .info-box-text {
    display:flex;
    align-items: center;
    white-space: unset !important;
}
div.no-payment,
div.expired {
    background: #ffcccc !important;
}
div.update-soon {
    background: #ffcc99 !important;
}

div.material-add {
    display:flex;
    justify-content: center;
    align-items: center;
    font-size: 1.3rem;
}
div.material-row:hover,
div.material-add:hover {
    background-color: #43CAC3 !important;
    transition: 0.6s ;
}
#member-home div.info-box {
    margin-bottom: 10px;
    background: #f3f6fa;
}
#member-home span.info-box-side {
    background: #fff;
    border: 1px solid #ddd;
    padding: 2px;
    /* display: flex; */
}

.info-box .info-box-content {
    display:block;
    width:100%;
}
@media (min-width: 767.98px) {
    .info-box .info-box-text {
        width:50%;
        float:left;
    }
}
@media (max-width: 767.98px) {
    .info-box .info-box-text {
        display:block;
    }
    .info-box .info-box-text:first-child {
        margin-bottom:10px;
    }
}


/* ----------------------------------------
新規マテリアル追加
---------------------------------------- */
span.clicked-plan {
    display:none;
}
.card-a {
    background: #E99835;
    color: #ffffff;
}
.card-b {
    background: #2092BF;
    color: #ffffff;
}
.confirm-upload-image img {
    width:100%;
}
div.warehouse-address {
    background-color: #C9E7F2;
    border-radius: 10px;
    padding:15px;
}
div.warehouse-address span.subtxt {
    display: inline-block;
    font-weight: bolder;
    margin-bottom:10px;
}
div.warehouse-label{
    white-space: nowrap;
}
@media (min-width: 767.98px) {
    div.warehouse-label{
        padding-right: 10px;
        width: 90px;
        text-align:right;
    }
}

div.thanks-message span.main-txt {
    font-size: 1.2rem;
    font-weight: bold;
}
div.thanks-message span.notice,
div.required-discription  {
    color: #ff0000;
}

#preview div.sample-label{
    position:absolute;
    top:15px;
    right:20px;
    font-weight:bolder;
}

/* ----------------------------------------
マテリアル発送
---------------------------------------- */
div#show-form {
    display:block;
    text-align:center;
    font-size:1.3rem;
    cursor:pointer;
}
label.row-destination {
    border:1px solid #aaa;
    border-radius: 5px;
    text-align:left !important;
    display:block !important;
}
label.row-destination.active {
    background: #43CAC3;
}
/* ----------------------------------------
配送便選択
---------------------------------------- */
.one-way,
.round-trip {
    background: #f3f6fa;
    text-align: center;
}
.one-way.active {
    background: #FFBC40;
}
.round-trip.active {
    background: #FF9C40;
}
.inactive {
    color: #bbbbbb;
}
span.ticket-title {
    font-size:2.2rem;
    display:inline-block;
    padding:10px 0;
}
span.sub-title, span.price {
    font-weight: 500;
    display:inline-block;
    padding-bottom:10px;
    min-width: 150px;
}
.btn-group-toggle > .small-box {
    display:inline-block;
    margin-bottom:5px !important;
}
.small-box p{
    font-weight:500;
}
.small-box p span{
    display:inline-block;
    width:35%;
}
@media (min-width: 767.98px) {
    .small-box {
        margin: 5px;
    }
}
@media (max-width: 767.98px) {
    span.sub-title, span.price {
        font-size: 0.8rem;
        min-width: 110px;
    }
}

/* ----------------------------------------
チューンナップ　マテリアル選択
---------------------------------------- */
#material-select label.info-box {
    margin-bottom: 10px;
    background: #f3f6fa;
}
#material-select span.info-box-side {
    width: 67px;
    height: 67px;
    background: #fff;
    border: 1px solid #ddd;
    padding: 2px;
    display: flex;
}
#material-select span.info-box-side img {
    margin:auto auto;
    width: 100%;
}
#material-select label.info-box.active {
    background: #43CAC3;
}
#material-select span.info-box-content {
    text-align: left;
}
#material-select span.info-box-text {
    white-space:unset;
}


/* ----------------------------------------
チューンナップ　コース選択
---------------------------------------- */
div.course-box img {
    width: 100%;;
}
div.course-box{
    padding:8px;
    background:#ccc;
    margin-bottom:10px;
}
div.course-box.active{
    background:#43CAC3;
}

#tuneup-course-select span.info-box-side img {
    width: 250px;
}
#tuneup-course-select label.info-box.active {
    background: #43CAC3;
}
#tuneup-course-select div.info-box-content {
    text-align: left;
    padding: 10px 20px;
    font-weight:normal;
}

#tuneup-course-select div.info-box-content div {
    white-space:unset;
    margin-bottom:10px;
}

@media (max-width: 767.98px) {
    #tuneup-course-select div.info-box-side img {
        width: 150px;
    }
    #tuneup-course-select label.info-box {
        display:block;
    }
}

/* ----------------------------------------
チューンナップ　詳細設定
---------------------------------------- */
span.add-price {
    color: #ff0000;
}



/* ----------------------------------------
チューンナップ　確認画面
---------------------------------------- */
span.detail-label {
    display:inline-block;
    font-weight: bolder;
    width:200px;
}
span.detail-sub-label {
    display:inline-block;
    font-weight: bolder;
    padding-right: 20px;
}
span.detail-value{
    display:inline-block;
    padding-right: 20px;
}
@media (max-width: 767.98px) {
    #tuneup-confirm span.detail-label,
    #tuneup-confirm span.detail-value{
        display:block;
    }
}

/* ----------------------------------------
確認画面
---------------------------------------- */
table.amount-confirm {
    table-layout: fixed;
}
table.amount-confirm tr th {
    white-space: nowrap;
}
table.amount-confirm thead tr th {
    text-align: center;
    background: #e0e0e0;
}
table.amount-confirm tr td.number {
    text-align: center;
    min-width: 10%;
}
table.price-list tr td.amount,
table.amount-confirm tr td.amount {
    text-align: right;
    min-width: 20%;
    white-space: nowrap;
}
table.amount-confirm tfoot tr td {
    background: #f3f3f3;
}
table.amount-confirm tfoot tr td.item {
    text-align: center;
    font-weight:bolder;
}
table.amount-confirm tfoot tr td.total {
    color: #E53C3A;
    font-weight:bolder;
}

/* ----------------------------------------
flashメッセージ
---------------------------------------- */
div.message.success {
    background:#68D0CB;
    margin:10px 0;
    padding:5px 10px;
    border-radius:3px;
    color:#000;
}

div.message.error {
    background:#e00;
    margin:10px 0;
    padding:5px 10px;
    border-radius:3px;
    color:#fff;
}

.table-sm {
    min-width:300px !important;
}

/* ----------------------------------------
オーダー履歴
---------------------------------------- */
.table-striped tbody tr:last-child td {
    border-bottom: 1px solid #dee2e6;
}
