
/* 管理側 CSS */


@charset "utf-8";


/* ------------------------------------------------ */
/* 基本・汎用
/* ------------------------------------------------ */

    html, body {
        height:      100%;
        color:       #333333;
        font-family: Meiryo, "MS PGothic", arial, sans-serif;
    }

    html {
        font-size: 14px;
    }

    body {
        font-size: 1rem;
        padding-top: 51px;
        /* フォント（モノスペース） *
        font-family: Consolas, 'Courier New', Courier, Monaco, monospace;
        /**/
        /* フォント（プロポーショナル） */
        font-family: Verdana, Helvetica, Arial, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
        /**/
        /* フォントのエイリアスを調整 */
        -webkit-font-smoothing:  antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    table {
        width: 100%;
    }

    h1 { font-size: 2.00rem; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1.50rem; }
    h4 { font-size: 1.25rem; }

    hr {
        margin:       12px 0;
        border-color: #999999;
        border-width: 1px 0 0 0;
    }

    hr.solid  { border-style: solid;  }
    hr.dotted { border-style: dotted; }
    hr.double { border-style: double; }
    hr.dashed { border-style: dashed; }

    input[type="number"] {
        text-align: right;
    }

    /* センテンス（改行不可） */
    .sentence {
        display:     inline-block;
        white-space: nowrap;
    }

    /* トランケート（切り詰め） */
    .truncate {
        position: relative;
    }

    .truncate>p,
    .truncate>div {
        position:      absolute;
        width:         100%;
        padding-right: 16px;
        white-space:   nowrap;
        overflow:      hidden;
        text-overflow: ellipsis;
    }

    /* 非表示 */
    .hidden {
        display: none;
    }

    /* エラー文言 */
    .error {
        color: #FF0000;
    }


/* ------------------------------------------------ */
/* ラッパ
/* ------------------------------------------------ */

    #wrapper {
        position:   relative;
        width:      100%;
        height:     100%;
        -webkit-font-smoothing: subpixel-antialiased;
    }


/* ------------------------------------------------ */
/* フィルタ
/* ------------------------------------------------ */

    #filter {
        display:    none;
        position:   fixed;
        top:        0;
        left:       0;
        z-index:    9999;
        width:      100%;
        height:     100%;
        background: rgba(0, 0, 0, 0.5);
    }


/* ------------------------------------------------ */
/* ヘッダ
/* ------------------------------------------------ */

    #header {
    }

    /* ナビゲーションバー */
    .navbar {
        min-height:    32px;
        margin-bottom: 20px;
    }

    .navbar.navbar-fixed-top {
        border-width: 1px;
    }

    .navbar-nav>li>a {
        margin-top:     9px;
        margin-bottom:  9px;
        padding-top:    6px;
        padding-bottom: 6px;
        font-size:      13px;
        line-height:    20px;
    }

    .navbar-brand {
        float:       left;
        padding:     6px 15px;
        font-size:   13px;
        line-height: 20px;
    }

    .navbar-brand img {
        height: 100%;
    }

    .navbar-toggle {
        padding: 9px 5px;
        border:  none;
    }

    .navbar-inverse {
        background-color: #23282D;
        border-color:     #23282D;
    }

    .navbar-inverse .navbar-brand>a {
        color: #EEEEEE;
    }

    .navbar-inverse .navbar-nav>li>a {
        color: #EEEEEE;
    }

    .navbar-text {
        text-align: right;
    }

    .navbar-text #who_is {
        display: inline-block;
        padding: 0 16px;
    }


/* ------------------------------------------------ */
/* フッタ
/* ------------------------------------------------ */

    #footer {
        height:           50px;
        padding:          15px;
        border:           1px solid transparent;
        border-width:     1px 0 0;
        border-color:     #E7E7E7;
        background-color: #F8F8F8;
    }


/* ------------------------------------------------ */
/* コンテンツ
/* ------------------------------------------------ */

    #contents {
        max-width:        1040px;
        margin:           auto;
        margin-top:       20px;
        padding:          0 20px 80px 20px;
        background-color: #FFFFFF;
    }

    #contents .login {
        max-width:      400px;
        margin:         auto;
        padding-bottom: 20px;
    }

    .paragraph {
        margin-top:    15px;
        margin-bottom: 30px;
        padding-left:  10px;
        border:        solid 1px #333333;
        border-width:  0 0 1px 8px;
        font-size:     1.5rem;
        font-weight:   bold;
    }

    .paragraph.sub {
        margin-top:    30px;
        margin-bottom: 15px;
        border-width:  0 0 1px 0;
        font-size:     1.25rem;
    }

    .paragraph button {
        margin-top:     -6px;
        padding-top:    3px;
        padding-bottom: 3px;
    }

    /* フォーム */
    .form-horizontal .control-label {
        padding-bottom:   7px;
        border-right:     solid 15px #FFFFFF;
        border-left:      solid 15px #FFFFFF;
        background-color: #67C4C1;
    }

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

    .help-block {
        margin-top:    4px;
        margin-bottom: 4px;
    }

    .uneditable {
        width:            100%;
        min-height:       34px;
        padding:          7px 13px;
        font-size:        1rem;
        line-height:      1.42857143;
        color:            #555555;
        background-image: none;
        /**
        border-radius:      4px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        box-shadow:         inset 0 1px 1px rgba(0,0,0,.075);
        -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
        -o-transition:      border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        transition:         border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        /**/
    }

    .uneditable dl.dl-horizontal {
        margin-bottom: 0;
    }

    .uneditable dt {
        width:      80px !important;
        padding:    2px  !important;
        text-align: left !important;
    }

    .uneditable dd {
        margin-left: 80px !important;
        padding:     2px  !important;
    }

    .radio label,
    .checkbox label {
        min-width: 90px;
    }

    :placeholder-shown {
        color: #000000 !important;
    }

    /* Google Chrome, Safari, Opera 15+, Android, iOS */
    ::-webkit-input-placeholder {
        color: #AAAAAA !important;
    }

    /* Firefox 18- */
    :-moz-placeholder {
        color: #AAAAAA; opacity: 1 !important;
    }

    /* Firefox 19+ */
    ::-moz-placeholder {
        color: #AAAAAA; opacity: 1 !important;
    }

    /* IE 10+ */
    :-ms-input-placeholder {
        color: #AAAAAA !important;
    }

    .search-form {
        margin:                20px 0;
        padding:               10px 20px;
        border:                1px #CCCCCC solid;
        -webkit-border-radius: 4px;
        -moz-border-radius:    4px;
        border-radius:         4px;
    }

    .search-form .btn-wrap {
        margin: 15px 0 0 0;
    }

    .list>thead>tr>th,
    .list>tbody>tr>th,
    .list>tfoot>tr>th,
    .list>thead>tr>td,
    .list>tbody>tr>td,
    .list>tfoot>tr>td {
        vertical-align: middle;
    }

    /* ボタン */
    .btn-wrap {
        margin:     20px auto;
        text-align: center;
    }

    .btn-wrap .btn-group .btn {
        min-width: 150px;
    }

    .btn-wrap .btn-group .btn.sub {
        min-width: 150px;
    }

    .btn-wrap-sub {
        margin-top:    -10px;
        margin-bottom: 14px;
        padding:       0 12px;
    }

    .btn-wrap-sub .btn {
        min-width:     80px;
        margin-bottom: 6px;
    }

    .btn-suitable {
        min-width: 150px;
        margin:    10px
    }

    /* パンくず */
    .breadcrumb {
        margin-bottom: 15px;
    }

    .breadcrumb>li+li:before {
        content: "\003e";
        color:   #333333;
    }

    /* ページャ */
    .pager-scope {
        padding: 6px 12px;
    }

    .pager-link {
        text-align: center;
    }

    .pager-link * {
        font-size: 1.05rem;
    }

    .pager-link a,
    .pager-link b {
        display:          inline-block;
        min-width:        28px;
        height:           28px;
        margin:           0 4px;
        padding:          4px;
        border:           solid 1px #CCCCCC;
        border-radius:    2px;
        background-color: #FFFFFF;
        line-height:      1.2;
        text-align:       center;
    }

    /* CSSモーションエフェクト */
    .mt-fadein {
    }

    .mt-fadein-up {
        transform: translate(0, 15px);
    }

    .mt-fadein-left {
        transform: translate(-30px, 0);
    }

    .mt-fadein-right {
        transform: translate(30px, 0);
    }

    [class*="mt-fadein"] {
        opacity: 0.0;
        /*
        transition-property:        all;
        transition-duration:        0.6s;
        transition-delay:           0.6s;
        transition-timing-function: ease;
        */
        transition:         all 0.6s 0.4s ease;
        -webkit-transition: all 0.6s 0.4s ease;
        -moz-transition:    all 0.6s 0.4s ease;
        -ms-transition:     all 0.6s 0.4s ease;
        -o-transition:      all 0.6s 0.4s ease;
    }

    .delay {
        transition:         all 0.6s 0.8s ease;
        -webkit-transition: all 0.6s 0.8s ease;
        -moz-transition:    all 0.6s 0.8s ease;
        -ms-transition:     all 0.6s 0.8s ease;
        -o-transition:      all 0.6s 0.8s ease;
    }

    .run {
        opacity:   1.0             !important;
        transform: translate(0, 0) !important;
    }

    /* このページのトップに戻る */
    #back2PageTop {
        position:         fixed;
        right:            calc(50% - 40px);
        bottom:           0px;
        z-index:          9999;
        width:            80px;
        height:           40px;
        padding-top:      4px;
        background-color: rgba(127, 127, 127, 0.5);
        font-size:        1.5rem;
        text-align:       center;
        line-height:      0;
        cursor:           pointer;

        -webkit-border-radius: 40px 40px 0 0;
        -moz-border-radius:    40px 40px 0 0;
        border-radius:         40px 40px 0 0;

        opacity:            0.0;
        transition:         all 0.3s 0.0s ease;
        -webkit-transition: all 0.3s 0.0s ease;
        -moz-transition:    all 0.3s 0.0s ease;
        -ms-transition:     all 0.3s 0.0s ease;
        -o-transition:      all 0.3s 0.0s ease;
        transform:          translate(0, 15px);
    }

    #back2PageTop:hover {
        background-color: rgba(160, 160, 160, 1);
    }

    #back2PageTop span {
        font-size: 0.75rem;
    }


/* ------------------------------------------------ */
/* レスポンシブ対応
/* ------------------------------------------------ */

    /* 横幅 767px以下 */
    @media screen and (max-width: 767px) {
        .table-responsive {
            border: none;
        }

        .navbar-nav>li>a {
            margin-top:    0;
            margin-bottom: 0;
        }

        #contents {
            margin-top:     0;
            margin-left:    0;
            padding:        15px;
            padding-bottom: 60px;
        }

        #footer {
            margin-left: 0;
        }
    }

    /* スマートフォン-L（横幅 ～425pxまで） */
    @media screen and (max-width: 425px) {
        .form-horizontal .control-label {
            width: 100%;
            margin-top:    15px;
            padding-top:   7px;
            padding-right: 7px;
            padding-left:  7px;
        }
    }

    /* スマートフォン-M（横幅 ～375pxまで） */
    @media screen and (max-width: 375px) {
    }

    /* スマートフォン-S（横幅 ～320pxまで） */
    @media screen and (max-width: 320px) {
        #contents {
            padding-bottom: 40px;
        }
    }


/* ------------------------------------------------ */
/* ステータス
/* ------------------------------------------------ */

    .status {
        display:               inline-block;
        min-width:             120px;
        margin:                auto;
        padding:               1px;
        -webkit-border-radius: 18px;
        -moz-border-radius:    18px;
        border-radius:         18px;
        text-align:            center;
    }

    .status.cold {
        background-color: #99BBCC;
    }

    .status.fine {
        background-color: #CCDD88;
    }

    .status.warm {
        background-color: #FFDD99;
    }

    .status.heat {
        background-color: #FFBB99;
    }


/* ------------------------------------------------ */
/* カレンダー
/* ------------------------------------------------ */

    .calendar-month {
        background-color: #67C4C1;
    }

    .calendar-month td {
        padding:    5px 15px;
        text-align: center;
    }

    .calendar-month .year-month {
        font-size:   20px;
        font-weight: bold;
    }

    .calendar-day {
        margin-bottom: 20px;
    }

    .calendar-day th,
    .calendar-day td {
        padding:    4px;
        font-size:  16px;
        text-align: center;
    }

    .calendar-day td {
        width:          14.28%;
        height:         76px;
        border:         1px solid #8BB5C0;
        vertical-align: top;
    }

    .calendar-day td.today {
        background-color: #FFFFBB;
    }

    .calendar-day td.selected {
        background-color: #FFFFAA;
    }

    .calendar-day td.overflowed {
        background-color: #DDDDDD;
        color:            #999999;
    }

    .sat {
        color: #1E90FF;
    }

    .sun {
        color: #FF69B4;
    }

    .holi {
        color:     #FF6666;
        font-size: 13px;
    }

    .calendar-day input[type="checkbox"] {
        margin: 4px 4px 0 4px;
    }

    .calendar-day div.day {
        padding:     0 4px 4px 0;
        font-size:   16px;
        text-align:  left;
    }

    .calendar-day div.dish-list {
        max-width:     120px;
        margin:        auto;
        margin-top:    6px;
        font-size:     10px;
    }

    .calendar-day div.dish-list div {
        white-space:   nowrap;
        overflow:      hidden;
        text-overflow: ellipsis;
    }

    .calendar-day .btn-warning {
        color: #5A3D1B;
    }

    .calendar-day .btn-warning:hover, .calendar-day .btn-warning:focus,
    .calendar-day .btn-warning:active, .calendar-day .btn-warning:active:focus, .calendar-day .btn-warning:active:hover, .calendar-day .btn-warning:active.focus,
    .calendar-day .btn-warning.active, .calendar-day .btn-warning.active:focus, .calendar-day .btn-warning.active:hover, .calendar-day .btn-warning.active.focus,
    .open > .dropdown-toggle.btn-warning,
    .open > .dropdown-toggle.btn-warning:hover,
    .open > .dropdown-toggle.btn-warning:focus,
    .open > .dropdown-toggle.btn-warning.focus,
    .calendar-day .btn-warning.disabled:hover, .calendar-day .btn-warning[disabled]:hover, fieldset[disabled] .calendar-day .btn-warning:hover,
    .calendar-day .btn-warning.disabled:focus, .calendar-day .btn-warning[disabled]:focus, fieldset[disabled] .calendar-day .btn-warning:focus,
    .calendar-day .btn-warning.disabled.focus, .calendar-day .btn-warning[disabled].focus, fieldset[disabled] .calendar-day .btn-warning.focus {
        color: #5A3D1B;
    }


/* ------------------------------------------------ */
/* お弁当入力フォーム
/* ------------------------------------------------ */

    #scheduleRegisterModal .modal-content {
        /*background-color: #FEECCA;*/
    }

    #scheduleRegisterModal .modal-content.edit {
        /*background-color: #FFFFAA;*/
    }

    #scheduleRegisterModal .modal-body {
        padding: 15px 30px;
    }

    #scheduleRegisterModal dt {
        margin-top: 10px;
    }

    #scheduleRegisterModal .selected-dish-name {
        margin: 4px 8px;
    }
