html {
    background-color: #F9F7F2;
}

.app-body {
    padding: 15px;
    background-color: #F9F7F2;
}

.ui-datatable {
    margin: 15px 0px;
}

.head-title {
    margin-left: 10px;
}

.title-name {
    font-size: 16px;
}

.build-version {
    font-size: 12px;
}

@media (max-width: 1535px) {
    .build-version {
        /* display: none; */
    }
}

@media (max-width: 1406px) {
    .build-version {
        display: unset;
    }
}

@media (max-width: 1190px) {
    .build-version {
        /* display: none; */
    }
}

.pointer {
    cursor: pointer;
}

.panel-group .panel {
    margin-bottom: 5px;
    border-radius: 0px;
}

    .panel-group .panel.no-margin {
        margin-bottom: 0px;
    }

@media (max-height: 900px) {
    .panel-group .panel {
        margin-bottom: 3px;
    }
}

.no-margin {
    margin: 0px;
}

.margin-bottom-5 {
    margin-bottom: 5px;
}

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

.margin-bottom-10 {
    margin-bottom: 10px;
}

.margin-bottom-15 {
    margin-bottom: 15px;
}

.inline-block {
    display: inline-block;
}

.float-right {
    float: right;
}

.float-left {
    float: left;
}

.has-border, fieldset {
    border: 1px solid #aaa;
}

/*Fieldset*/
legend {
    width: auto;
    margin-bottom: 0px;
    font-size: 14px;
    font-weight: bold;
    border-bottom: 0;
    padding-left: 5px;
    padding-right: 5px;
}
/*End Fieldset*/

/*Base Style*/
button, .btn, .form-control, .modal-content, .input-group-addon, body .ui-corner-all, .dropdown-menu,
body .ui-buttonset .ui-button, body .ui-buttonset .ui-button:last-child, body .ui-buttonset .ui-button:first-child {
    border-radius: 0px;
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}
.btn:focus {
    /* buttonタグをクリックすると表示されるボヤっとした枠線を消す */
	outline:0 !important;
}

body .ui-paginator .ui-paginator-pages .ui-paginator-page, legend,
body .ui-paginator .ui-paginator-first, body .ui-paginator .ui-paginator-prev,
body .ui-paginator .ui-paginator-next, body .ui-paginator .ui-paginator-last {
    color: #00a6da;
}

    body .ui-datatable .ui-datatable-data.ui-datatable-hoverable-rows > tr.ui-widget-content:not(.ui-state-highlight):hover,
    body .ui-paginator .ui-paginator-pages .ui-paginator-page:hover, .cal, .switch,
    body .ui-dropdown-panel .ui-dropdown-items .ui-dropdown-item:not(.ui-state-highlight):hover,
    body .ui-datepicker .ui-datepicker-calendar td:not(.ui-state-disabled) a:hover,
    body .ui-selectbutton.ui-buttonset .ui-button:not(.ui-state-disabled):not(.ui-state-active):hover,
    .select-option > div:not(.ui-state-disabled):not(.ui-state-active):hover {
        background-color: #ffe0b3;
    }

        body .ui-datatable .ui-datatable-data tr.ui-datatable-even.ui-state-highlight,
        body .ui-state-active, body .ui-state-highlight,
        body .ui-paginator .ui-paginator-pages .ui-paginator-page:hover.ui-state-active,
        body .ui-datatable thead th.ui-state-active,
        body .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link:hover,
        body .ui-menu .ui-menu-list .ui-menuitem.ui-menuitem-active > .ui-menuitem-link,
        body .ui-dropdown-panel .ui-dropdown-items .ui-dropdown-item.ui-state-highlight,
        body .ui-datepicker table td a.ui-state-active, ul.dropdown-menu > li:hover,
        body .ui-selectbutton.ui-buttonset .ui-button.ui-state-active {
            background-color: #00a6da;
        }
/*End Base Style*/

/*Radio Button, Checkbox*/
body .ui-radiobutton .ui-radiobutton-box, body .ui-chkbox .ui-chkbox-box {
    border: 1px solid #aaa;
}

label.ui-radiobutton-label, label.ui-chkbox-label {
    margin-top: 2px;
    margin-bottom: 4px;
    padding-top: 4px;
    font-weight: 500;
}

.ui-chkbox-label {
    vertical-align: sub;
}
/*Radio Button, Checkbox End*/

/*Dropdown*/
.border .ui-dropdown-panel .ui-dropdown-item {
    border-bottom: 1px solid #ccc;
}
/*Dropdown End*/

/*Table*/
body .ui-datatable .ui-datatable-header {
    border: 1px solid #737373;
    background: #00a6da;
    color: #ffffff;
    font-weight: bold;
}

.tb-report.tb-report-1.ui-datatable {
    margin-top: 0px;
    margin-bottom: 0px;
}

.tb-report.ui-datatable {
    margin-top: 0px;
    margin-bottom: 15px;
}

.tb-report .ui-datatable-emptymessage-row {
    display: none;
}

.tb-no-border.ui-datatable .ui-datatable-tfoot>tr>td {
    border-width: 2px;
    /* padding: 0.375em 0.25em !important; */
}

.tb-no-border.ui-datatable .ui-datatable-thead>tr>th {
    background-color: #595959;
    color: white;
}

.tb-no-border.ui-datatable .ui-datatable-data>tr>td {
    border-width: 0px;
    padding: 0 !important;
    border: 1px solid gray;
}

.tb-no-border.ui-datatable .ui-datatable-data tr.ui-datatable-even {
    background: transparent;
}

.tb-no-border.ui-datatable .ui-datatable-data, .tb-no-border.ui-datatable .ui-datatable-data>tr {
    border: none;
}

.tb-no-header.ui-datatable {
    margin: 0px;
}

body .tb-report.ui-datatable tfoot th.ui-state-default {
    border: 1px solid #c7c7c7;
    background-color: #d7e6ff;
}

body .tb-report.ui-datatable .ui-datatable-data > tr > td,
body .tb-report.ui-datatable .ui-datatable-thead > tr > th {
    padding: 0.375em 0.75em;
}

body .tb-no-header.ui-datatable .ui-datatable-thead > tr > th {
    padding: 0px;
    border: 0px;
}

body .ui-datatable .ui-datatable-data tr td.ui-editable-column input {
    border: 1px solid;
    border-color: #aaa;
    padding: 0.1em 0.5em;
}

.ui-inputtext.ui-state-focus, .ui-inputtext:focus,
body .ui-datatable .ui-datatable-data tr td.ui-editable-column input:focus {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
}
/*End Table*/

/*Modal*/
.modal-header {
    padding: 12px 15px;
    background: #595959;
    border: 0;
}

.modal-report .modal-header {
    padding: 8px 15px;
}

.modal-header, .modal-header span {
    color: white;
}

.modal-body {
    background-color: #F9F7F2;   /* d9d9d9; */
}

.small-modal-body {
    padding: 8px 15px;
}

@media (min-height: 800px) {
    .small-modal-body {
        padding: 15px;
    }
}

.modal-title {
    font-size: 16px;
}

    /* .modal-header > .modal-title {
        font-weight: bold;
    } */

@media (min-width: 768px) {
    .modal-dialog.modal-report {
        width: auto;
        margin: 10px;
    }
    .modal-dialog.modal-kutai-detail, .modal-dialog.modal-step-detail{
        width: auto;
    }
}

@media (min-width: 920px) {
    .modal-dialog.modal-report {
        width: 900px;
        margin: 30px auto;
    }
    .modal-dialog.modal-kutai-detail, .modal-dialog.modal-step-detail{
        width: 400px;
    }
}
/*End Modal*/

/*Calendar*/
.ui-datepicker select.ui-datepicker-month {
    width: 35%;
}

.ui-datepicker select.ui-datepicker-year {
    width: 55%;
}

.ui-column-filter.ui-calendar > input {
    width: 100%;
}

@media (min-width: 1300px) {
    .ui-column-filter.ui-calendar > input {
        padding-right: 35px;
        background-image: url('bg-img/calendar-icon.jpg');
        background-repeat: no-repeat;
        background-position: right;
        background-size: 33px;
    }
}
/*End Calendar*/

/*・ｽI・ｽv・ｽV・ｽ・ｽ・ｽ・ｽ*/
.select-option {
    padding-left: 0px;
    padding-right: 0px;
    margin-bottom: 10px;
}

    .select-option > div {
        padding-top: 10px;
        padding-left: 10px;
        padding-right: 10px;
        display: inline-block;
        position: relative;
    }

    .select-option .ui-button-text {
        padding-top: 0.25em;
        padding-bottom: 0.5em;
        display: block;
    }

body .ui-buttonset.ui-selectbutton .ui-button:last-child {
    border: 1px solid #ccc;
}

    body .ui-buttonset.ui-selectbutton .ui-button:last-child:hover {
        border: 1px solid #00a6da;
    }
/*・ｽI・ｽv・ｽV・ｽ・ｽ・ｽ・ｽ End*/

/*GUI Control*/
.ui-overlaypanel-content {
    padding: 1em 1em;
}
/*GUI Control*/

.position-selection {
    margin-bottom:5px;
    display: -webkit-box;
}

.position-selection > button {
    margin-left: 20px;
    padding:2px 30px 2px 30px;
}

.position-selection > * {
    padding: 0px;
}

.detail-btn {
    padding: 2px 15% 2px 15%;
}

.position-check {
    padding-left: 0px;
}

.length-input > label {
    float:left;
    margin-top:5px;
}

@media (min-width: 920px) {
    .position-check {
        padding-left: 15%;
    }
}

.unit {
    border: 0px;
    background-color: transparent;
}

/*Header*/
.title-div {
    background-color: #F9F7F2;
    /* background-color: #262626; */
    height: 60px;
}

.background-div {
    background-color: #F9F7F2; /* rgb(217, 217, 217); */
}

/* パンくずメニューのスタイル */
.tool-steps-style {
    background-color: black;
    border: solid 1px gray;
    padding: 0px 0px 0px 0px !important;
}

/*Header*/

/*Menu*/
.menu-div {
    overflow-y: auto;
    font-size: 14px;
}

.panel-info>.panel-heading+.panel-collapse>.panel-body{
    border-top-color: transparent;
}

.accordion-info {    
    border-color: transparent;
}

.accordion-info > .show > .panel-body{
    max-height: 570px;
    overflow: auto;
}

@media (max-height: 1000px) {
    .accordion-info > .show > .panel-body {
        max-height: 430px;
    }

    /* .panel-title {
        font-size: 15px;
    }

    .panel-info>.panel-heading {
        padding: 8px 15px;
    } */
}

.panel-heading {
    display: grid;
    display: -ms-grid;
    padding: 0;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .panel-title {
        display: ruby-base;
    }
}

.panel-body {
    padding: 0;
}

.panel {
    border: 0;
}

@media (max-height: 900px) {
    .accordion-info > .show > .panel-body {
        max-height: 300px;
    }
}

@media (max-height: 800px) {
    .accordion-info > .show > .panel-body {
        max-height: 210px;
    }
}

@media (max-height: 690px) {
    .accordion-info > .show > .panel-body {
        max-height: 190px;
    }

    .panel-info>.panel-heading {
        padding: 5px 15px;
    }
}

/* .accordion-info .panel-collapse {    
    border: 1px solid rgb(171, 170, 170);
} */

.panel-collapse {
    background-color: #F9F7F2;   /* d9d9d9; */
}
/*Menu*/

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
}
    
::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0,0,0,.5);
    box-shadow: 0 0 1px rgba(255,255,255,.5);
}

.rDetailButton {
   width: 50%;
   display: inline-block;
   margin-right: 0px;
}

@media (max-width: 1365px) {
   .rDetailButton {
       width: auto;
       margin-right: 20px;
   }
}

.roundBtn {
    height: auto;
    width: auto;
    border-radius: 5px !important;
    margin: 4px 6px;
    background-color: #1a71e8;
    border-color: #1a71e8;
    background-color: #1a71e8 !important;
    /* border-color: #C4C4C4 !important; */
    border: #1a71e8 solid 2px;
    font-size: 14px !important;
    color: #fff;
}
/* 2020/01/08 */
/* 角丸ボタン hover 時の色変更 */
.roundBtn:hover {
    background: #0037ff !important; 
    border:#0037ff;
    color: #fff;
}
.roundBtn:disabled {
    background-image: none;
    background-color: #007bff !important; /* disable時の色 */
    border-color: #007bff !important;
    pointer-events: none;       /* disable時 hover反応させない処理 */
}
.roundBtn:focus {
    /* buttonタグをクリックすると表示されるボヤっとした枠線を消す */
	outline:0 !important;
}

/* 2020/01/14 */
.roundBtn3D {
    height: auto;
    width: auto;
    border-radius: 15px;
    margin: 4px 6px;
    background-color: #EC971F !important;
    border-color: #EC971F !important;
    font-size: 14px !important;
    color: #fff !important;
}
.roundBtn3D:hover {
    background: #f0c127 !important;
    color: #fff !important;
}

.roundDeleteBtn {
    height: auto;
    width: auto;
    border-radius: 5px;
    margin: 4px 6px;
    background-color: #1a71e8;
    border: #1a71e8 solid 2px;
    font-size: 14px !important;
    color: #fff;
}
.roundDeleteBtn:hover {
    background: #0037ff;
    border-color: #0037ff;
    color: #fff;
}
.roundDeleteBtn:focus {
    /* buttonタグをクリックすると表示されるボヤっとした枠線を消す */
	outline:0 !important;
    color: #fff;
}
.roundDeleteBtn:disabled {
    background-image: none;
    background-color: #007bff; /* disable時の色 実際は eaeaea になってほしいけど disableが加味されるので難しい */
    border-color: #007bff;
    pointer-events: none;       /* disable時 hover反応させない処理 */
}

/* 2020/01/20 */
/* OK キャンセル　ボタンの色設定 */
.okBtn {
    height: auto;
    width: auto;
    border-radius: 5px !important;
    margin: 4px 6px;
    background-color: #1a71e8 !important;
    border: #1a71e8 solid 2px;
    font-size: 14px !important;
    color: #fff;
}
.okBtn:hover {
    background: #0037ff  !important;
    border: #0037ff solid 2px;
    color: #fff !important;
}
.okBtn:focus {
    /* buttonタグをクリックすると表示されるボヤっとした枠線を消す */
	outline:0 !important;
    color: #fff !important;
}

/**/
.prj-img {
    border: #f9f7f2 solid 1px;
}

.prj-img:hover {
    border: blue solid 1px;
}

.smallBtn {
    height: 30px;
    width: 70px;
    margin: 10px;
    border-radius: 5px;
}

.mediumBtn {
    height: 30px;
    width: 170px;
    border-radius: 5px;
}

.largeBtn {
    height: 30px;
    width: 190px;
    border-radius: 5px;
    line-height: 15px;
}

.largeBtnNoRadius {
    height: 30px;
    width: 190px;
    line-height: 15px;
}

@media (min-height: 800px) {
    .smallBtn, .mediumBtn, .largeBtn {
        height: 36px;
        line-height: 18px;
    }
}

.preset-color:nth-child(-n+12) .cp-remove-color-button-class{
    display: none !important;
}

.dlBtn {
    background-color: #595959;
    border-color: #595959;
}

.dlBtn:hover {
    background-color: #5682c2;
    border-color: #5682c2;
}

.disable-select {
    -webkit-touch-callout: none; /* iOS Safari */
      -webkit-user-select: none; /* Safari */
       -khtml-user-select: none; /* Konqueror HTML */
         -moz-user-select: none; /* Firefox */
          -ms-user-select: none; /* Internet Explorer/Edge */
              user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.smallText {
    font-size: 15px !important;
}

.ui-dropdown-panel {
    top: 33px !important;
}

#drop-down-list {
    background-color: white;
    position: fixed;
    width: auto;
    min-width: 100px;
    height: auto;
    z-index: 1000;
    border-radius: 15px;
    box-shadow: 5px 5px 5px grey;
    text-align: center;
}

#drop-down-list div {
    padding: 10px;
    cursor: pointer;
}
#drop-down-list div:hover {
    background-color: #FFE699;
}

.s-hidden {
    visibility:hidden;
    padding-right:10px;
}
.select {
    cursor:pointer;
}
.styledSelect {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
}

/* 2020/01/08 added ボタン風の外観を付加 Start 
   保存アイコンの色に合わせてみた
*/
.styledSelect {
    /*display: inline-block;*/
    line-height:25px; 
    display: table-cell;    /* 縦方向の中央揃えのため */
    vertical-align:middle;  /* 縦方向の中央揃えのため */

    padding: 0.05em 0.3em 0.3em 0.5em;  /* 左寄せの時の文字位置調整 */
    text-decoration: none;
    color: #625F5F;
    border: solid 0px #E75409;
    border-radius: 3px;
    transition: .4s;
    /* margin-left: 6px;       /* 左側の隙間を確保 */
    text-align: left;     /* 横方向の中央揃えのため */

    width: 95%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.text-overflow-w100 {
    width: 100px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.text-overflow-w115 {
    width: 115px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/*
.styledSelect:hover {
    background: #E75409;
    color: white;
}
*/

.styledSelect:after {
    content: "";
    
    /* コンボボックス風 三角形 */
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid black;

    display: inline-block;
    
    /* 配置 */
    position: absolute;
    top: 1px;
    bottom: 0;
    right: 0px;  /* 4px */
    height: 0;  /* ←重要 */
    margin: auto;
}

/* 2020/01/08 added ボタン風の外観を付加 End */

.fixed-pos > .options {
    position: fixed;
    margin-left: 140px;
}

.absolute-pos > .options {
    position: absolute;
    margin-left: 50px;
}

.absolute-pos {
    float: right;
}

.select > .options {
    display:none;
    background-color: white;
    width: auto;
    min-width: 100px;
    height: auto;
    z-index: 1001;
    border-radius: 15px;
    box-shadow: 5px 5px 5px grey;
    text-align: center;
    list-style:none;
    padding: 0;
    overflow-y: auto;
    max-height: 400px;
    max-width: 400px;
}

.on-dialog > .select > .options {    
    position: absolute;
    left: 150px;
    min-width: 150px !important;
}

.divide-option > .options > .multi-options {
    text-align: left;
    display: flex;
    > .optItem {
        display: inline-block;
        width: 50%;
        text-align: center;
    }
}

.optItem img {
    width: 150px;
    height: 112px;
}

.optItem p {
    margin: 0;
}

.align-left {
    text-align: left !important
}

.multi-options div {
    padding: 10px;
    cursor: pointer;
}
.multi-options div:hover {
    background-color: #FFE699;
}

.select-custom {
    padding: 0;
    height: auto;
}

.section {
    /* background: white; */
    margin-bottom: 0px;
    border-radius: 7px;
    font-size: 14px;
    padding: 4px 8px 4px 3px;
    min-height: 20px;
    /* border: solid 0.5px #000;     /* 枠線指定 */

    line-height:25px;
    display: table;    /* 縦方向の中央揃えのため table の親としてセット */
    /* vertical-align:middle;  /* 縦方向の中央揃えのため */
}

.section-est {
    /* background: white; */
    margin-bottom: 2px;
    border-radius: 4px;
    font-size: 12px;
    padding: 4px 0px;
    min-height: 20px;
    /* border: solid 0.5px #000;     /* 枠線指定 */

    line-height:25px;
    display: table;    /* 縦方向の中央揃えのため table の親としてセット */
    /* vertical-align:middle;  /* 縦方向の中央揃えのため */
}

.section-est2 {
    /* background: white; */
    margin-bottom: 0px;
    border-radius: 7px;
    font-size: 12px;
    padding: 0px 2px 0px 2px;
    min-height: 20px;
    /* border: solid 0.5px #000;     /* 枠線指定 */

    line-height:25px;
    display: table;    /* 縦方向の中央揃えのため table の親としてセット */
    /* vertical-align:middle;  /* 縦方向の中央揃えのため */
}

.selection {
    background: white;
    margin-bottom: 0px;
    border-radius: 7px;
    font-size: 12px;
    padding: 0px 0px;
    min-height: 25px;
    border: solid 0.5px #000;     /* 枠線指定 */
}

@media (min-height: 800px) {
    .section {
        padding: 8px;
        margin-bottom: 15px;
        min-height: 33px;
    }
}

.detail {
    border-radius: 7px;
    font-size: 14px;
    padding: 0px 10px 0px 0px !important;
    min-height: 25px;
    border: solid 0.5px #D4D4D4;     /* 枠線指定 */
    background: #ffffff;
    left: 5px;  /* 全体を右へずらす */

    /*text-align: right;
    border-left: 1px solid black;*/
}

.smallLabel {
    font-size: 13.7px;
    padding-left: 5px;
    padding-right: 0px;
    /* border-right: 1px solid black; */
    padding: 0;
    margin: 0;
    text-align: left;
    line-height: 1.6;

    display: table-cell;
    line-height: 25px;
    vertical-align: middle;
}

.smallLabel2 {
    font-size: 14px;
    padding-left: 5px;
    padding-right: 0px;
    /* border-right: 1px solid black; */
    padding: 0;
    margin: 0;
    text-align: left;
    line-height: 1.6;

    display: table-cell;
    line-height: 25px;
    vertical-align: middle;
}

.smallLabelOfTextBox {
    line-height: 1.8;
}

.smallInput {
    font-size: 14px;
    padding-left: 7px !important;
    padding-right: 7px !important;
    width: 90px;
    height: 25px;
}

.smallSelect {
    font-size: 12px;
    padding-left: 2px !important;
    padding-right: 2px !important;
}

.small-text-box {
    padding-right: 0px !important;
    padding-left: 0px !important;
}

.smallUnit {
    font-size: 12px !important;
    padding: 6px 0px 0px 12px;
}

.no-padding {
    padding: 0px;
}

.accordion-text-title {
    /* line-height: 4.2; */
    padding-left: 10px;
    font-size: 14px;
    padding-right: 0px;
}

.accordion-text-title span {
    float: left;
    margin-top: 20px;
}

.accordion-img-title {
    padding: 0;
}

.arrangeBtn {
    background-color: #595959;
    border-color: #595959;
    border-radius: 15px;
}

.arrangeBtn:hover {
    background-color: #5682c2;
    border-color: #5682c2;
}

@media (max-width: 850px) {
    .accordion-heading {
        min-width: 215px;
    }
}

.accordion-heading {
    min-width: 230px;
    padding: 0;
    display: flex;
    float: none;
}

.form {
    padding: 5px 6px 8px 6px;
    /* padding: 8px; */
}

/* .collapse {
    transition: all 0.3s ease;
    display: block !important;
    overflow: hidden !important;
    max-height: 0;
}

.collapse.in {
    transition: all 0.6s ease;
    max-height: 500px;
} */

.dlDetailSetting {
    min-width: 120px;
    height: auto;
    position: absolute;
    top: 120px;
    font-family: verdana;
}

.dlDetailSetting > .dl-header {
    text-align: center;
    background-color: #343f4f;
    color: white;
    border-top: 1px solid rgb(136, 136, 136);
    border-left: 1px solid rgb(136, 136, 136);
    border-right: 1px solid rgb(136, 136, 136);
    padding-top: 3px;
    padding-bottom: 3px;
}

.dlDetailSetting > ul {
    margin-top: 0px;
    margin-bottom: 0px;
    list-style: none;
    background-color: rgb(136, 136, 136);
    padding: 1px;
    text-align: center;
}

.dlDetailSetting > ul > li {
    padding: 3px 16px;
    margin-bottom: 1px;
    margin-right: 1px;
    cursor: pointer;
    min-width: 120px;
    background-color: white;
}

.dlDetailSetting > ul > li:hover {
    background-color: rgb(238, 238, 238);
}

.dlPartSetting {
    position: fixed;
    z-index: 1050;
}

.ui-accordion-toggle-icon {
    display: none;
}

.ui-state-active > a {
    background-color: #EEA242 !important;
    border-color: #EEA242 !important;
    color: black !important;
}

/* アコーディオンヘッダー上部隙間設定 */
.ui-accordion-header {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

.ui-accordion-header > a {
    padding: 0 !important;
    text-decoration: none;
}

.ui-accordion-content {
    padding: 0 !important;
    background-color: transparent !important;
}

.nav-tabs>li>a, .nav-tabs>li>a:hover {
    background-color: #595959;
    color: white;
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
    background-color: #EEA242;
    color: white;
}

.nav-tabs {
    background-color: white;
}

.canvas-switch-tab, .canvas-switch-tab-active {
    height: 25px;
    background-color: #f9f7f1;
    position: absolute;
    right: 0;
    line-height: 0.5;
    padding: 10px 0px!important;
    border-radius: 2px;
    cursor: pointer;
    text-align: center;
    bottom: 0;
    border: 1px solid darkgray;

    /* box-shadow: 0 -5px 3px -3px gray;  /* top  0 (-5px - 3px) 3px (-3px) #000000 */
    /* box-shadow: 5px 0 3px -3px gray;   /* right  (5px + 3px) 0 3px (-3px) #000000 */
    /* box-shadow: -5px 0 3px -3px gray; /* left (-5px - 3px) 0 3px (-3px) #000000 */
    box-shadow: 3px -3px 3px -3px gray;  /* 合成 top right 方向のみ */
    /* box-shadow: 3px 0 3px gray;*/ /* これだと全体に影が出るので、下側がはみ出て見えてしまう */

    font-weight: bold;
    /* transition: all .3s ease; */
}

.canvas-switch-tab-active {
    background-color: #ff880f;
    height: 26px;
}

.canvas-switch-tab:hover {
    background-color: #D8D8D8;
}

.ct_0 {
    left: 1px;
    width: 80px;
}

.ct_1 {
    left: 81px;
    width: 80px;
}

.ct_2 {
    left: 161px;
    width: 80px;
}

@media (max-width: 1000px) {
    .canvas-switch-tab, .canvas-switch-tab-active {
        font-size: 12px;
    }

    .ct_0 {
        left: 1px;
        width: 63px;
    }
    
    .ct_1 {
        left: 64px;
        width: 50px;
    }
    
    .ct_2 {
        left: 114px;
        width: 50px;
    }

    .section {
        font-size: 10px;
    }
}

.select-mode-button {
    padding: 7px 0;
    width: 100%;
    margin-top: 0px;
    margin-bottom: 0px;
    border-radius: 5px;
    text-align: center;
}
.select-mode-button:focus {
    /* buttonタグをクリックすると表示されるボヤっとした枠線を消す */
	outline:0 !important;
}

.one-selected-mode {
    background-color: #ff9696 !important;
}

.all-selected-mode {
    background-color: #00b0f0 !important;
}

.none-selected-mode {
    background-color: #ffc000 !important;
}

.cmd-active-btn {
    background-color: #1a71e8 !important;
    border: #1a71e8 solid 2px !important;
    color: #fff !important;
    border-radius: 5px;
}

/* 2020/01/08 */
/* ボタン hover 時の色変更 */
.cmd-active-btn:hover {
    background: #0037ff  !important;
    border:#0037ff solid 2px !important;
    color: #fff !important;
    /* background-color: #286090 !important; */
}
.cmd-active-btn:disabled {
    background-image: none !important;
    background-color: #007bff  !important;  /* disable時の色 */
    border-color: #007bff  !important;
    pointer-events: none !important;       /* disable時 hover反応させない処理 */
}
.cmd-active-btn:focus {
    /* buttonタグをクリックすると表示されるボヤっとした枠線を消す */
	outline:0 !important;
    color: #fff;
}

/* 2020/01/09 */
.cmd-edit-btn {
    background-color: #0037ff !important;
    border-radius: 15px;
}
.cmd-edit-btn:hover {
    background-color: #289053 !important;
}
.cmd-edit-btn:focus {
    /* buttonタグをクリックすると表示されるボヤっとした枠線を消す */
	outline:0 !important;
}

.cmd-inactive-btn {
    background-color: #595959 !important;
    border-color: #595959 !important;
    border-radius: 15px;
}

/* 配置中の表現 */
.cmd-positioning-btn {
    background-color: #0037ff !important;
    border-color: #0037ff !important;
    border-radius: 5px;
    color: white;
}
.cmd-positioning-btn:hover {
    background-color: #0037ff !important;
    border-color: #0037ff !important;
    border-radius: 5px;
}
.cmd-positioning-btn:focus {
    /* buttonタグをクリックすると表示されるボヤっとした枠線を消す */
	outline:0 !important;
}

.disabled-div {    
    z-index: 1000;
    height: 100%;
    position: absolute;
    width: calc(100% + 35px);
    margin: 0 -10px;
    background: black;
    opacity: 0.5;
}

.small-disabled {
    margin-left: -25px;
    margin-top: -8px;
    height: 40px;
}

.keijou-disabled {
    width: 100%;
    margin: -3px 0 0 0;
}

.accordion-slide-img-title img{
    transition: .5s ease;
    height: 59px;
    float: right;
    margin-right: calc(-75%);
}

.accordion-heading:hover .accordion-slide-img-title img, .panel-open .accordion-slide-img-title img{
    transition: .5s ease;
    margin-right: 0px
}

.ui-state-active .accordion-slide-img-title img{
    margin-right: 0px !important;
}

.accordion-heading:hover .accordion-buttons, .panel-open .accordion-buttons{
    visibility: visible;
    opacity: 1;
    transition: opacity .15s ease, visibility .15s ease;
}

.ui-state-active .accordion-buttons{
    visibility: visible !important;
    opacity: 1 !important;
}

.accordion-buttons {
    padding: 0;
    visibility: hidden;
    opacity: 0;
    text-align: right;
    padding-right: 5px;
    transition: opacity .15s ease, visibility .15s ease;
}

/* jquery-ui.min.css の影響が出たので調整 */
.ui-accordion .ui-accordion-header {
    /* display: block;
    cursor: pointer;
    position: relative;
    margin: 2px 0 0 0; */
    padding: 0px !important;
    /* font-size: 100%; */
}

.separator1 {
    border-bottom: 1px solid #D4D4D4;
    margin-bottom: 2px;
    margin-top: 6px;
}

.disabledbutton {
    pointer-events: none;
    opacity: 0.4;
}

/* #steps {
    filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.2));
} */

@media (min-width: 768px) {
    /* .modal-dialog {
      width: 600px;
      margin: 30px auto;
    }
    .modal-content {
      -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
              box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
    } */

    /* ダイアログの幅　文字が一行に表示しきれなくて 少し大きくしたかったので 追記 */
    .modal-sm-ex {
      width: 360px;
    }
  }

  .marginTopPx {
    margin-top: 10px
  }

  /* ラジオボタンの色設定 theme.css にあるのを再定義 */
  body .ui-radiobutton .ui-radiobutton-box.ui-state-focus {
    border-color: #E27F2F !important;
    background-color: #ffffff !important;
    color: #E27F2F !important;
    -webkit-box-shadow: 0 0 0 0.2em #8dcdff;
    -moz-box-shadow: 0 0 0 0.2em #8dcdff;
    box-shadow: 0 0 0 0.2em #8dcdff;
  }
  body .ui-radiobutton .ui-radiobutton-box.ui-state-active {
    border-color: #E27F2F !important;
    background-color: #E27F2F !important;
    color: #ffffff !important;
  }
  body .ui-radiobutton .ui-radiobutton-box.ui-state-active .ui-radiobutton-icon {
    background-color: #ffffff;
  }
  body .ui-radiobutton .ui-radiobutton-box.ui-state-active:not(.ui-state-disabled):hover {
    border-color: #b95e14 !important;
    background-color: #b95e14 !important;
    color: #ffffff !important;
  }
  body .ui-radiobutton .ui-radiobutton-box.ui-state-active.ui-state-focus {
    border-color: #E27F2F !important;
    background-color: #E27F2F !important;
    color: #ffffff !important;
  }

  body .ui-chkbox .ui-chkbox-box.ui-state-focus {
    border-color: #E27F2F !important;
    background-color: #ffffff;
    color: #E27F2F !important;
    -webkit-box-shadow: 0 0 0 0.2em #8dcdff;
    -moz-box-shadow: 0 0 0 0.2em #8dcdff;
    box-shadow: 0 0 0 0.2em #8dcdff;
  }
  body .ui-chkbox .ui-chkbox-box.ui-state-active {
    border-color: #E27F2F !important;
    background-color: #E27F2F !important;
    color: #ffffff;
  }
  body .ui-chkbox .ui-chkbox-box.ui-state-active:not(.ui-state-disabled):hover {
    border-color: #b95e14 !important;
    background-color: #b95e14 !important;
    color: #ffffff;
  }
  body .ui-chkbox .ui-chkbox-box.ui-state-active.ui-state-focus {
    border-color: #E27F2F !important;
    background-color: #E27F2F !important;
    color: #ffffff;
  }
  body .ui-multiselect-panel .ui-multiselect-items .ui-multiselect-item.ui-state-disabled .ui-chkbox-box.ui-state-active:hover {
    border-color: #E27F2F !important;
  }

  .disp-on-canvas {
      position: fixed;
      z-index: 1050;
  }