/* アプリのカラーテーマを変更 */
.aui-header {
    background: #eeeeee;
    border-bottom: 1px solid #bcbcbc;
    color: #333;
}

    .aui-header .aui-dropdown2-trigger,
    .aui-header a {
        color: #333;
    }

        .aui-header .aui-dropdown2-trigger:not(.aui-dropdown2-trigger-arrowless):after {
            border-top-color: #333;
        }

        .aui-header .aui-dropdown2-trigger.active,
        .aui-header a:focus,
        .aui-header a:hover,
        .aui-header a:active {
            background: #ffffff;
        }

/* 日本語フォント + アイコン用フォント指定 */
body {
    font-family: "Arial", "NotoSansCJKjp", "FontAwesome", "NotoEmoji";
}

/* リストのスタイルをリセット */
ol, ul {
    list-style: none;
}

/* SVGちらつき防止 */
svg {
    backface-visibility: hidden;
    transform: translateZ(0);
}

/* テーブル行の折り返しを禁止 */
table.aui > thead > tr > th,
table.aui > tbody > tr > td {
    white-space: nowrap;
    vertical-align: middle;
}

/* クリック可能 */
.clickable {
    cursor: pointer;
}

tr.clickable:hover {
    background: #e6e6e6;
}

/* プロパティ */
.property {
    display: table;
    border-collapse: collapse;
    width: 100%;
}

    .property caption {
        margin-top: 8px;
    }

    .property .tr {
        display: table-row;
    }

    .property th,
    .property td,
    .property .th,
    .property .td {
        display: table-cell;
        border: 1px solid #ccc;
        font-size: 13px;
        padding: 2px;
        height: 22px;
        vertical-align: middle;
        white-space: nowrap;
    }

    .property th,
    .property .th {
        background: #f5f5f5;
        font-weight: bold;
        text-align: left;
    }

    .property td {
        background: #fff;
    }

        .property td input[type=text],
        .property .td input[type=text],
        .property td input[type=number],
        .property .td input[type=number] {
            border: none;
            margin: 0;
            padding: 0;
            width: 100%;
            height: 100%;
            background-color: #FCFBCC;
        }

    .property select {
        height: 22px;
    }

/* ナビゲーションヘッダのタイトル名のフォントサイズを大きく */
#logo .aui-header-logo-text {
    font-size: 20px;
    padding: 6px 0 6px 0;
}

/* エラーページ */
#error-page {
    position: fixed;
    top: 41px;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: auto;
}

/* aui.min.cssでz-index:2と更新されてしまうのを防ぐ */
#aui-flag-container {
    z-index: 4000;
}


.aui-lozenge {
    background: #ccc;
    border: 1px solid #ccc;
    border-radius: 3px;
    color: #333;
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    line-height: 99%;
    margin: 0;
    padding: 2px 5px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
}

.aui-lozenge-success {
    background-color: #14892c;
    border-color: #14892c;
    color: #fff;
}

.aui-lozenge-error {
    background-color: #d04437;
    border-color: #d04437;
    color: #fff;
}

.aui-lozenge-current {
    background-color: #f6c342;
    border-color: #f6c342;
    color: #594300;
}


/* Leaflet marker color */
.leaflet-marker-color-Red,
.leaflet-marker-color-red {
    background: #CD4020;
    color: white;
}

.leaflet-marker-color-Darkred,
.leaflet-marker-color-darkred {
    background: #983131;
    color: white;
}

.leaflet-marker-color-Orange,
.leaflet-marker-color-orange {
    background: #EB9400;
    color: white;
}

.leaflet-marker-color-Green,
.leaflet-marker-color-green {
    background: #75AF00;
    color: white;
}

.leaflet-marker-color-Darkgreen,
.leaflet-marker-color-darkgreen {
    background: #738300;
    color: white;
}

.leaflet-marker-color-Blue,
.leaflet-marker-color-blue {
    background: #43A8E1;
    color: white;
}

.leaflet-marker-color-Purple,
.leaflet-marker-color-purple {
    background: #C94FBB;
    color: white;
}

.leaflet-marker-color-Darkpurple,
.leaflet-marker-color-darkpurple {
    background: #59376E;
    color: white;
}

.leaflet-marker-color-Cadetblue,
.leaflet-marker-color-cadetblue {
    background: #456879;
    color: white;
}

/* ラベルアイコン */
.leaflet-label-icon {
    text-align: center;
    vertical-align: middle;
}

.leaflet-label-icon-text {
    box-sizing: border-box;
    font-size: 16px;
    font-weight: bold;
    background: #fff;
    border: 2px solid #ccc;
    padding: 4px;
}

/* AUIボタン拡張 */
/* エラーボタン */
.aui-button.aui-button-primary.aui-button-danger {
    background: #d04437;
}

    .aui-button.aui-button-primary.aui-button-danger:hover,
    .aui-button.aui-button-primary.aui-button-danger:focus {
        background: #df4437;
    }

    .aui-button.aui-button-primary.aui-button-danger[disabled],
    .aui-button.aui-button-primary.aui-button-danger[disabled]:hover,
    .aui-button.aui-button-primary.aui-button-danger[disabled]:focus,
    .aui-button.aui-button-primary.aui-button-danger[disabled]:active,
    .aui-button.aui-button-primary.aui-button-danger[aria-disabled="true"],
    .aui-button.aui-button-primary.aui-button-danger[aria-disabled="true"]:hover,
    .aui-button.aui-button-primary.aui-button-danger[aria-disabled="true"]:focus,
    .aui-button.aui-button-primary.aui-button-danger[aria-disabled="true"]:active {
        background: #d0b1ae;
        border-color: transparent;
        box-shadow: none;
        color: #fff;
    }

/* 成功ボタン */
.aui-button.aui-button-primary.aui-button-success {
    background: #14892c;
}

    .aui-button.aui-button-primary.aui-button-success:hover,
    .aui-button.aui-button-primary.aui-button-success:focus {
        background: #14892c;
    }

    .aui-button.aui-button-primary.aui-button-success[disabled],
    .aui-button.aui-button-primary.aui-button-success[disabled]:hover,
    .aui-button.aui-button-primary.aui-button-success[disabled]:focus,
    .aui-button.aui-button-primary.aui-button-success[disabled]:active,
    .aui-button.aui-button-primary.aui-button-success[aria-disabled="true"],
    .aui-button.aui-button-primary.aui-button-success[aria-disabled="true"]:hover,
    .aui-button.aui-button-primary.aui-button-success[aria-disabled="true"]:focus,
    .aui-button.aui-button-primary.aui-button-success[aria-disabled="true"]:active {
        background: #acdcb6;
        border-color: transparent;
        box-shadow: none;
        color: #fff;
    }

/* AUIサイドバーでFontAwesomeアイコンが使えるようにする */
.aui-sidebar[aria-expanded="false"] .aui-nav-item .fa {
    color: #707070;
    margin-left: 20px;
    width: 20px;
    height: 19px;
}

.aui-sidebar[aria-expanded="true"] .aui-nav-item .fa {
    color: #707070;
    padding-top: 4px;
    padding-left: 3px;
    margin-right: 12px;
    width: 20px;
    height: 19px;
    float: left;
}

/* AUIボタンに影をつけて立体感を出す */
.aui-button.aui-button-shadow {
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), inset 0 1px 1px rgba(255, 255, 255, 0.45);
}

/* AUIカラーに合わせたトグルボタンのスタイル */
.switch-candy-aui-blue {
    cursor: pointer;
}

    .switch-candy-aui-blue a {
        background-color: #d04437;
        background-image: none;
    }

    .switch-candy-aui-blue.switch-light input:checked ~ span a {
        background-color: #14892c;
    }

/* input[type=range]を縦方向に変更する */
input[type="range"].custom-range {
    -webkit-appearance: none;
    appearance: none;
    background-color: #c7c7c7;
    height: 2px;
    width: 100%;
    vertical-align: middle;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg);
}

    input[type="range"].custom-range:focus,
    input[type="range"].custom-range:active {
        outline: none;
    }

    input[type="range"].custom-range::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        cursor: pointer;
        position: relative;
        border: none;
        width: 14px;
        height: 14px;
        display: block;
        background-color: #FFA000;
        border-radius: 50%;
        -webkit-border-radius: 50%;
    }