html, body {
    margin: 0px;
    margin-top: 0px;
    height: 100%;
    /*background-color: #e9fded;*/
    background-color:white;
}
body {
    /*height: 90%;*/
}

.ui-datepicker { z-index: 1000 !important; }
/* 日曜日 */
.fc-sun {
    color: red;
    background-color: #fff0f0;
}
/* 土曜日 */
.fc-sat {
    color: blue;
    background-color: #f0f0ff;
}



input[type=number] {text-align: right;box-sizing:border-box}
input[type="text"][readonly]{
    border:0px;
    background-color:transparent;
    margin:1px;
}

/*header,footer
{
    height:0;
}*/
nav {
    background-color: #90b9fd;
    margin: 0 auto;
    /*position: absolute;*/
    position: relative;
    top: 0px;
    padding: 0;
    height: 55px;
    width: 100%;
    display: block;
}

#loginForm {
    /*-webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-box-shadow: 0px 1px 10px #488a9e;
    -moz-box-shadow: 0px 1px 10px #488a9e;
    box-shadow: 0px 1px 10px #488a9e;
    border-radius: 6px;
    border: solid blue 1px;
    background: #fafafa;
    margin: 0 auto;*/
    /*width: 400px;*/
    text-align: center;
    font-size:12pt;
}

#loginForm input[type=button]{
    width:100px;
}

div.page {
    margin: 0;
    padding: 0px;
    text-align: center; 
    height: 0px;
    display:none;
}
div.showpage {
    height: 100%;
    display:block;
}
/*
div.page {
    margin: 0;
    padding: 0px;
    text-align: center; 
    height: 0px;
}

*/
div.content {
    text-align: left; /* 中身を左寄せに戻す */
    width: 250px; /* 幅 */
    height: 125px; /* 高さ */
}


.selected_row{
    background-color: yellow;
    /*background-color: red;*/
}

.outmap-row {
    background-color: transparent;
}

.dialog {
    background-color: #ffd800;
}

.qdialog {
    display: none;
}

div.check-group input {
    display: none;
}

div.check-group label {
    cursor: pointer;
    padding: 2px 7px 2px 7px;
    float: left;
    border: solid 1px black;
    margin-left: -1px;
    background: #ddd;
    font-style: normal;
    font-weight: bolder;
    font-size: 13.33px;
}

div.check-group input:checked + label {
    color: #fff;
    background: #C3C3C3;
}

/*div.sidetable
{
    overflow-y:scroll;
}*/
a.checked {
    color: #fff;
    background: #c3a503;
}

#tabMenu {
    display: none;
    margin: 0;
    padding: 0;
    font-size:10pt;
}

#tabMenu ul {
    margin-left: 10px;
}

#tabMenu li {
    float: left;
    list-style: none;
    border-color: #FFEEDB;
    border-style: ridge;
    background-color: #ffd800;
    width: 57px;
    padding: 3px 10px;
}
#tabMenu li a {
    display: block;
    width: 55px;
    height: 38px;
    line-height: 40px;
    text-align: center;
    border: #ccc 1px solid;
    text-decoration: none;
    color: black;
}


#tabMenu ul.child{
        display: none;
        position: absolute;
        margin-left: -5px;
        padding: 0;
        z-index:10;
        width:57px;
}

#tabMenu ul.child li{
     width:100px;
}
#tabMenu ul.child li a{
    padding: 5px 10px;
    margin-left: -5px;
    margin-right: -5px;
    margin-bottom: -5px;
    display: block;    
    line-height:normal;
    height:auto;
    width:90px;
    text-align: left;
}

#tabBoxes {
    position: absolute;
    top: 55px;
    width: 100%;
    height:90%;
    /*height:100%;*/
    /*min-height: 90%;*/
    margin-bottom: 0px;
    /* border: #ccc 1px solid; */ /* 2014/07/29 del by TAP */
    background-color: #e9fded;
}

#setteiMenu{
    margin-left:auto;
    margin-right:auto;
    width:800px;
}

#setteiMenu li {
    float: left;
    list-style: none;
    padding: 1px;
    border-color: #FFEEDB;
    border-style: ridge;
    background-color: #e9fded;
    width:150px;
}

#setteiMenu li a {
    display: block;
    text-align: center;
    border: #ccc 1px solid;
    text-decoration: none;
    color: black;
}
#setteiMenu li a.checked{
    background-color: rgba(221, 221, 221, 1);
} 
#setteiForm{
    padding-top:10px;
}
/* 2014/07/18 add by TAP */
#tabBoxes00 {
    position: absolute;
    /*top: 55px;*/
    width: 100%;
    /*height:90%;*/
    min-height: 90%;
    margin-bottom: 0px;
    border: #ccc 1px solid;
    background-color: #e9fded;
}

.tab {
    display: none;
    text-align: left; /* 中身を左寄せに戻す */
    /* margin-right: 10px;*/  /*2014/07/29 del by TAP*/
    /* margin-left: 10px; */  /*2014/07/29 del by TAP*/

}

#home {
    background-color: #e9fded;
}

#main {
    /*display: none;*/
    margin-top: 0px;
}

#courseReportPage {
 height:90%;
 padding:10px;
}
#carPage {
    height:90%
}
#coursePage{
    width:100%;
    height:90%
}
#driverPage{
    width:100%;
    height:90%
}

#areaPage{
    width:100%;
    height:100%
}
#setteiPage {
    background-color: #e9fded;
}

#setteiPage input[type="range"]{
    padding:0px;
    vertical-align:middle;
}
.mapTop {
    width: 98%;
    height: 500px;
    display: -ms-flexbox;
}

.mapContainer {
    width: 500px;
    height: 500px;
    float: left;
}

.mapSide {
    width: 100px;
    position: relative;
}

.setteiFormClass {
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    width:600px;
    clear:both;
}

.title-cell {
    float:left;
    text-align: right;
    /*padding-right: 20px;*/
    /*height: 100%;*/
    vertical-align: middle;
    display: block;
    font-size: 16pt;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#logoff-cell {
    text-align: right;
    /*padding-right: 20px;
    height: 100%;*/
    vertical-align: middle;
    display: block;
    font-size: 16pt;
    float:right;
}



.MainTableContainer {
    width: 80%;
    margin: 0 auto;
}

.MainPain {
    /*float: left;*/
    width: 80%;
    margin: 0 auto;
}

.SidePain {
    width: 200px;
    float: right;
    overflow-x:hidden;
}


#DriverTable {
    /* border: 1px solid; */
    min-width: 600px;
    table-layout:fixed;
}


.table-menu {
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: right;
    padding-right: 20px;
    /*height: 100%;*/
    vertical-align: middle;
}

div.table {
    display: table;
    border-collapse: collapse;
    width: 100%;
}

div.bordered-table {
    display: table;
    border-collapse: collapse;
    width: 100%;
    border-style: double;
}

div.table-header {
    width: 100%;
    display: table-header-group;
    background-color: aqua;
}

div.table-data-part {
    overflow-y: scroll;
    overflow-x: hidden;
    display: table-row-group;
}

div.table-row {
    display: table-row;
}

div.table-cell {
    display: table-cell;
    border: 1px solid;
    vertical-align: middle;
    margin: 1px;
    padding: 1px;
    height: auto;
    table-layout: fixed;
}

.noborder-cell {
    display: table-cell;
    vertical-align: middle;
    margin: 1px;
    padding: 1px;
    height: auto;
    table-layout: fixed;
}

.main_table {
    /*display:table;*/
    border: 1px solid;
    border-color: black;
    border-collapse: collapse;
    width: 100%;
}

    .main_table td {
        min-height: 2em;
    }

    .main_table .table-cell {
        min-height: 2em;
    }

.main_table_body {
    width: 100%;
    background-color: beige;
}

.scroll_table_body_container {
    padding: 0 5px 0 0;
    overflow-y: scroll;
    overflow-x: hidden;
}

.scroll_table_header_container {
    padding: 0 18px 0 0;
}

.main_table_heder {
    /*width:100%;*/
    /*overflow-y:scroll;*/
    background-color: aqua;
}

.driver-name-column {
    font-size: 14px; /* by TAP */
    min-width: 100px;
    text-align: left;
    table-layout: fixed;
}

.driver-uid-column {
    /* width: 200px; */
    max-width: 100px;
    min-width: 100px;
    text-align: left;
    font-size: 12px; /* by TAP */
}

.driver-tel-column {
    /* width: 200px; */
    max-width: 100px;
    min-width: 100px;
    text-align: left;
    font-size: 12px; /* by TAP */
}

.driver-mail-column {
    /* width: 200px; */
    max-width: 100px;
    min-width: 100px;
    text-align: left;
    font-size: 12px; /* by TAP */
}
/* .driver-name-column
{
     width:30%;
}
 .driver-uid-column
{
     width:20%;
}
 .driver-tel-column
{
     width:20%;
}
 .driver-mail-column
{
     width:30%;
}*/

.mimamori-name-column {
    min-width: 100px;
    text-align: left;
    /*width: 30%;*/
    font-size: 12px;
}

.mimamori-tel-column {
    min-width: 100px;
    text-align: left;
    /*width: 20%;*/
    font-size: 12px;
}

.car-idx-column {
    width: 50px;
    padding-right: 10px;
}

.car-idx-div {
    float: right;
    margin-right: 10px;
}

.car-name-column {
    width: auto;
}

.car-icon-column {
    width: 100px;
}

.car-driver-column {
    width: 200px;
}

.car-mimamori-column {
    width: 200px;
}

#carsideMenu {
    vertical-align: top;
    height: 100%;
}


#carsideMenu dt {
    display: block;
    width: 200px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    border: #666 1px solid;
    cursor: pointer;
    background-color: navy;
    color: wheat;
}

#carsideMenu dd {
    background: #f2f2f2;
    /*width:200px;
height:50px;
    */
    /*line-height:30px;*/
    text-align: center;
    border: #666 1px solid;
    display: none;
}

dd .table {
    min-height: 50px;
}
.ScrollDataTableContainer table {
    table-layout:fixed;
}

.ScrollDataTableContainer .dataBody {
   margin: 0px 0px 0px 0px;
   padding: 0px;
   overflow-y:scroll;
   overflow-x:hidden;
}

.logon_table_parent {
}

.logon_table {
    /*width: 300px;*/
    /*margin-right: auto;
    margin-left: auto;*/
    display: table;
}

.logon_title_column {
    width: 100px;
}

.logon_input_column {
    width: auto;
}

    .logon_input_column input {
        width: 200px;
    }

table.TopTable {
    padding-right: 10px;
}

.map_search_title_cell {
    background-color: aqua;
}

.map_search_input_cell {
    width: 170px;
}

.log_number_column {
    width: 15px;
    max-width: 15px;
    text-align: right;
    font-size: 12px;
}

.log_time_column {
    width: 35px;
    max-width: 35px;
    font-size: 12px;
}

.log_car_column {
    max-width: 50px;
    width: 50px;
   font-size: 12px;

}

.log_event_column {
    width: 100px;
   font-size: 12px;
}
.extracted_area_new_column {
    width: 7px;
    max-width: 7px;
    text-align: right;
    font-size: 12px;
}

#logMapDialog {
    width: 500px;
    height: 500px;
}

#logMap {
    width: 500px;
    height: 400px;
}

#baseMapDialog {
    width: 500px;
    height: 500px;
}

#baseMap {
    width: 500px;
    height: 400px;
}


#logCsvButton {
    vertical-align: middle;
    margin-bottom: 5px;
}

#trackMapCell {
    padding-top: 10px;
    vertical-align: text-top;
}

input.readonlyInput {
    background-color: lightgray;
}

#terminalTableContainer {
    overflow-y: scroll;
    overflow-x: hidden;
    max-height: 65vh;
    padding-right: 2px;
}

/*thead, tbody {
    float:left;
}
thead tr {
    float:left;
}*/
/* by TAP
#terminalTable{
  font-size:12px;
     max-height:65vh;
}
*/

.invalid-field {
    background-color: red;
}

.drive-status-icon-column {
    width: 50px;
}

#AreaTableContainer {
    overflow-y: scroll;
    overflow-x: hidden;
    max-height: 65vh;
    padding-right: 3px;
}

/*#AreaTable {
    max-height: 65vh;
}*/

.driverDetailTitle {
    width: 300px;
}

#logTablePart {
    min-width: 400px;
}

#logPageMenu {
    height: 30px;
}

#logPageContent {
    width: 100%;
    height:100%;
    position:relative;
}

#logPageTable {
    height: 100%;
    width: 400px;
}

#trackMap {
    position:absolute;
    top:0px;
    left:415px;
}

.logRow {
    page-break-after: auto;
}

#logTableDataPart {
    /*max-height: 67vh;*/
    overflow-y: auto;
    margin: 0px;
}

#MimamoriSetteiPart {
    border: 2px solid gray;
}

    #MimamoriSetteiPart input[type="range"] {
        margin: 0;
        padding: 0;
    }

#logSelectedTarget {
    border: 1px solid black;
    display: inline-block;
    min-width: 100px;
    max-width: 300px;
    min-height: 1em;
    vertical-align: text-top;
    text-align: left;
}

.col-num {
    width: 20px;
    table-layout: fixed;
}

.col-icon {
    width: 30px;
    vertical-align: middle;
    table-layout: fixed;
}

.col-name {
    /* width: 70px; */
    /* max-width:70px; */
    /* width: 70px; */
    /* min-width: 70px; */
    /*max-width: 200px;*/ /* 2014/07/16 chg by TAP */
    font-size: 14px; /* by TAP */
    text-align: left;
    table-layout: fixed;

}

.col-name img {
    vertical-align: baseline;
}

.col-areacode {
    width: 70px;
    max-width: 200px;
    text-align: left;
    font-size: 12px; /* by TAP */
}

.col-date {
    width: 60px;
    text-align: left;
    font-size: 12px; /* by TAP */
    table-layout: fixed;
}

.col-map-header {
    font-size: 10pt;
}

.col-command {
    width: 55px;
    font-size: 12px; /* by TAP */
    table-layout: fixed;
    text-align: center;
}

.areacode-input {
    width: 60px;
}

.col-headder {
    background-color: aqua;
}

.sel-button {
    background-color: aqua;
    width: 200px;
}

.otherl-button {
    background-color: darkgray;
    width: 200px;
}

.drag-target-pain {
    padding-top: 5px;
    min-height: 1cm;
}


/* 20140729 address ruby TAP */
DIV.dataHeader {
   margin: 0px 0px 0px 0px;
   padding: 0px;
   overflow: hidden;
   /*border: 1px solid #000000*/
}
DIV.dataBody {
   margin: 0px 0px 0px 0px;
   padding: 0px;
   overflow:auto;
   /*border: 1px solid #000000*/
}
TABLE.data {
	margin: 0px;
	border-collapse: collapse;
	background-color: white;
	table-layout: fixed;
}

.dataHeader thead tr th { /* thead 'th'のスタイル */
    background-color: #0099cc; /* 背景色 */
    color: #fff; /* 文字色 */
    padding: 5px; /* 3px 0px; */
    table-layout: fixed;
    border: 1px solid #0099cc; /* 外枠 */
    border-spacing: 1px;
    text-align: center;
}
.dataHeader .table-cell { /* thead 'th'のスタイル */
    background-color: #0099cc; /* 背景色 */
    color: #fff; /* 文字色 */
    padding: 5px; /* 3px 0px; */
    table-layout: fixed;
    border: 1px solid #0099cc; /* 外枠 */
    border-spacing: 1px;
    text-align: center;
}


.dataHeader  .table{
    display:table;
	margin: 0px;
	border-collapse: separate;
	background-color: white;
	table-layout: fixed;
    border-spacing:1px;
    width:100%;
}


.dataBody .table{
    display:table;
    border-spacing:1px;
    width:100%;
	margin: 0px;
	border-collapse: separate;
	background-color: white;
	table-layout: fixed;
}

.dataBody td { /* tbody 'td'のスタイル */
    background-color: #dcdcdd;
    color: blue;
    padding: 5px; /* 3px 6px; */
    border: 1px solid #0099cc; /* 外枠 */
    border-spacing: 1px;
    overflow:hidden;
}
.dataBody .table-cell { /* tbody 'td'のスタイル */
    background-color: #dcdcdd;
    color: blue;
    padding: 5px; /* 3px 6px; */
    border: 1px solid #0099cc; /* 外枠 */
    border-spacing: 1px;
    display: table-cell;
    overflow: hidden;
}
.ScrollBodyPart {
    overflow-y:scroll;
    overflow-x:hidden;
}

#areaFromlogSelectedTarget {
    border: 1px solid black;
    display: inline-block;
    min-width: 100px;
    max-width: 300px;
    min-height: 1em;
    vertical-align: text-top;
    text-align: left;
}


/*#selsectAddressSelect
{
  width:250px;
  height:300px;
}
#selsectAddressDialog{
    width:300px;
    height:300px;
}

.selsectAddressOption
{
  width:200px
}*/
/* test by TAP */
html > body #AreaTable { /* スクロール対象のテーブル */
    font-size: 12px;
    background-color: #fff; /* テーブルの背景色 borderの色になる */
    border-collapse: separate; /* 枠線の表示の仕方 */

    table-layout: fixed;
}

#out_Div { /* 全体の枠。ここにヘッダを格納 */
    position: relative; /* 相対位置 */
    padding-top: 18px; /*  #in_Div の開始位置 */
    width: 100%; /* 480px 列幅の合計＋セル間の幅(2px)の合計＋20px 程度 */
    /*max-width: 600px;*/
    border: 1px solid #0099cc; /* 外枠 */
    background-color: #fff; /* 白 */
    height: 75vh;
    /*max-height:80vh;*/
    /* padding-right:2px; */
}

#in_Div { /* tbodyが入っている。ここがスクロール対象*/
    overflow: auto; /* スクロールバー*/
    height: 75vh; /* 133px tbodyを表示する高さ */
}
/* map Page */
#terminalTable { /* スクロール対象のテーブル */
    font-size: 12px;
    /*background-color: #fff;*/ /* テーブルの背景色 borderの色になる */
    border-collapse: separate; /* 枠線の表示の仕方 */
    table-layout: fixed;
    margin: 2px;
}
#terminalTable thead tr { /* ヘッダ 見出し行,位置を #out_Div の左上端に移動 */
    position: absolute; /* 絶対位置 */
    top: 0px; /* 上からの位置 */
    left: 0px; /* 左からの位置 */
    background-color: #fff;

    table-layout: fixed;
}

#terminalTable thead tr th { /* thead 'th'のスタイル */
    background-color: #0099cc; /* 背景色 */
    color: #fff; /* 文字色 */
    padding: 3px; /* 3px 0px; */

    table-layout: fixed;
}
#tableHeader thead tr th { /* thead 'th'のスタイル */
    background-color: #0099cc; /* 背景色 */
    color: #fff; /* 文字色 */
    padding: 3px; /* 3px 0px; */
    table-layout: fixed;
    /*border: 1px solid #0099cc; */
    border-spacing: 1px;
    text-align: center;
}


.terminalTableDataRow td{ 
    background-color: #dcdcdd;
    color: blue;
    padding: 3px; /* 3px 6px; */
    /*border: 1px solid #0099cc;
    border-spacing: 1px;*/
    line-height:1.2;
}
.terminalTableDataRow table {
    border-spacing: 0px;
}
/*.terminalTableDataRow td .col-name > div{
    max-height:62px;
    overflow-y:hidden;
}*/
.terminalTableDataRow > div {
    box-sizing: border-box;
    border: 2px solid green;
}
#terminalTable .delay-marked > div{
    border-color:red;
        /*box-sizing: border-box;
        border: 2px solid red;*/
}
#terminalTable .col-name {
    border-left: 1px solid black;
    border-right: 1px solid black;
}
#terminalTable .title-part {
    width: 180px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
    /*#terminalTable .delay-marked .col-name {
    color:red;
}*/
    /* tbody 'td'のスタイル */
    /*#terminalTable tbody tr td { 
    background-color: #dcdcdd;
    color: blue;
    padding: 3px; 
    border: 1px solid #0099cc;
    border-spacing: 1px;
}*/
    /* area Page */
    #AreaTable thead tr { /* ヘッダ 見出し行,位置を #out_Div の左上端に移動 */
        position: absolute; /* 絶対位置 */
        top: 0px; /* 上からの位置 */
        left: 0px; /* 左からの位置 */
        background-color: #fff;
        table-layout: fixed;
    }

#AreaTable thead tr th { /* thead 'th'のスタイル */
    background-color: #0099cc; /* 背景色 */
    color: #fff; /* 文字色 */
    padding: 3px; /* 3px 0px; */

    table-layout: fixed;
}
#areaPageTableHeader thead tr th { /* thead 'th'のスタイル */
    background-color: #0099cc; /* 背景色 */
    color: #fff; /* 文字色 */
    padding: 3px; /* 3px 0px; */
    table-layout: fixed;
    border: 1px solid #0099cc; /* 外枠 */
    border-spacing: 1px;
    text-align: center;
}

.AreaTableDataRow td { /* tbody 'td'のスタイル */
    background-color: #dcdcdd;
    color: blue;
    padding: 3px; /* 3px 6px; */
    border: 1px solid #0099cc; /* 外枠 */
    border-spacing: 1px;
}

/* driver Page */
#DriverTable thead tr { /* ヘッダ 見出し行,位置を #out_Div の左上端に移動 */
    position: absolute; /* 絶対位置 */
    top: 0px; /* 上からの位置 */
    left: 0px; /* 左からの位置 */
    background-color: #fff;

    table-layout: fixed;
}

#DriverTable thead tr th { /* thead 'th'のスタイル */
    background-color: #0099cc; /* 背景色 */
    color: #fff; /* 文字色 */
    padding: 5px; /* 3px 0px; */

    table-layout: fixed;
}
#driverPageTableHeader {
    min-width: 600px;
}
#driverPageDataHeader thead tr th { /* thead 'th'のスタイル */
    background-color: #0099cc; /* 背景色 */
    color: #fff; /* 文字色 */
    padding: 5px; /* 3px 0px; */
    table-layout: fixed;
    border: 1px solid #0099cc; /* 外枠 */
    border-spacing: 1px;
    text-align: center;
}
.DriverTableDataRow td { /* tbody 'td'のスタイル */
    background-color: #dcdcdd;
    color: blue;
    padding: 5px; /* 3px 6px; */
    border: 1px solid #0099cc; /* 外枠 */
    border-spacing: 1px;
}

.MainTable thead tr { /* ヘッダ 見出し行,位置を #out_Div の左上端に移動 */
    position: absolute; /* 絶対位置 */
    top: 0px; /* 上からの位置 */
    left: 0px; /* 左からの位置 */
    background-color: #fff;

    table-layout: fixed;
}

.MainTable thead tr th { /* thead 'th'のスタイル */
    background-color: #0099cc; /* 背景色 */
    color: #fff; /* 文字色 */
    padding: 5px; /* 3px 0px; */

    table-layout: fixed;
}

#reportPageTop {
  padding:1cm;
}
.report_number_column{
   width:1cm;
}

.report_time_column {
    width: 200px;
    max-width: 200px;
    min-width: 100px;
    font-size: 12px;
}



.coL0 {
    width: 100px;
    font-size: 12px;
}
/* colgroupの列幅指定 */
.coL1 {
    width: 100px;
    font-size: 12px;
}

.coL2 {
    width: 120px;
    font-size: 12px;
}

.selected-cells td{
    background-color:yellow;
}

.selected-row{
    background-color:yellow;
}

.selected-row .table-cell{
    background-color:yellow;
}

.no-selected-row {
    background-color: transparent;
}
/* mailDialog
----------------------------------*/
#mailFormInternal {
    width: 500px;
}
.mailDialogLeft1 {float:left;width:20%;height:40%;padding:0;text-align:right;}
.mailDialogRight1 {float:left;width:80%;height:40%;padding:0;}
.mailDialogLeft2 {float:left;width:20%;height:60%;padding:0;text-align:right;}
.mailDialogRight2 {float:left;width:80%;height:60%;padding:0;}

.course-detail-delay-column {
    width:40px;
}
.course-detail-time-column{
    width:100px;
}

.course-detail-field{
    width:300px;
}
.course-detail-name-column option{
    background-color:white;
}


#courseReportPage [data-qti-databind="CourseName"]{
    display:none;
}
#courseReportPage [data-qti-databind="DateStr"]{
    display:none;
}
#courseReportPage  .CourseReportDriverInfo{
    float:right;
    display:inline-block;
}
#courseReportPage .dataHeader{
    clear:both;
}
.OneCourseReport{
    position:relative;height:100%
}
.OneCourseReport .dataBody{
    overflow-x:hidden;
    /*overflow-y:scroll*/
}

.MultiCourseReport{
    height:auto;
    margin-top:20px;
}
.MultiCourseReport:first-of-type {
    margin-top:0px;
}
#courseReportPage .MultiCourseReport [data-qti-databind="CourseName"]{
    display:inline-block;
}
#courseReportPage .table-menu{
    text-align:left;
}
.CourseReportArea{
    height:90%;
    font-size:12pt;
}
.CourseReportArea .CourseReportDate{
   display:none;   
}

#CourseAreaTableContainer th{
    border-color:black;
}

#CourseAreaTableContainer td{
    border-color:black;
}

div.helpMark {
   display:inline-block;
   background-image:url(../img/ques023.gif);
   background-size:10px 12px;
   width:10px;
   height:12px;
   margin-right:3px;
}
input[type="range"]{
    padding-top:17px;
    padding-bottom:17px;
}

.lookuser-date-column {
    text-align: right;
    width:120px;
    max-width: 120px;
}
.lookuser-defaultappoint-column {
    width: 100px;
    max-width: 100px;
}
.lookuser-uid-column {
    width: 100px;
    max-width: 100px;
}
.lookuser_permission_column {
    width: 40px;
    max-width: 40px;
    text-align:center;
}

/*media all*/
#access {
    background: #efefef;
    -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
    -moz-box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
    box-shadow: 0px 1px 2px rgba(0,0,0,0.4);
    clear: both;
    display: block;
    float: left;
    margin: 0 auto;
    width: 100%;
}
/*media all*/
#access div {
    /*margin: 0 5%;*/
}

/*media all*/
#access ul {
    font-size: 15px;
    list-style: none;
    margin: 0 0 0 0;
    padding-left:0;
}

/*media all*/
#access li {
    float: left;
    position: relative;
}

/*media all*/
#access ul ul {
    -moz-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
    display: none;
    float: left;
    margin: 0;
    position: absolute;
    top: 3.33em;
    left: 0px;
    width: 188px;
    z-index: 99999;
}

#access a {
    color: #373737;
    display: block;
    line-height: 3.333em;
    padding: 0 1.2125em;
    text-decoration: none;
}
/*media all*/
#access li:hover > a, #access a:focus {
    background: #f9f9f9;
    background: -moz-linear-gradient(#bbb, #aaa);
    background: -o-linear-gradient(#bbb, #aaa);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#bbb), to(#aaa));
    background: -webkit-linear-gradient(#bbb, #aaa);
    color: #efefef;
}

/*media all*/
#access ul ul a {
    background: #f9f9f9;
    border-bottom: 1px dotted #ddd;
    color: #444;
    font-size: 13px;
    font-weight: normal;
    height: auto;
    line-height: 1.4em;
    padding: 10px 10px;
    width: 168px;    
}

/*media all*/
#access li:hover > a, #access ul ul :hover > a, #access a:focus {
    background: #bbb;
}
#ClientApplicationsPart{
    text-align:left;
    margin-top:20px;
}

#ClientApplicationsPart>div.ApplicationList{
    display:table;
}
#ClientApplicationsPart>div.ApplicationList>div{
    display:table-row;
    margin-bottom:10px;
}
#ClientApplicationsPart>div.ApplicationList>div>div{
    display:table-cell;
    vertical-align:top;
    /*white-space: nowrap;*/
}
#ClientApplicationsPart div.ApplicationList img{
    width:70px;
    height:70px;
    margin-right:10px;
    /*margin-bottom:10px;*/
}
#ClientApplicationsPart div{
    font-size:9pt;
}
#ClientApplicationsPart div.Title{
    font-size:16pt;
}
#ClientApplicationsPart div.Comment{
    font-size:9pt;
    display:inline-block;
}
#ClientApplicationsPart ul{
    padding-left:5px;
    margin-bottom:0px;
    margin-top:0px;
}

#monitorTypeMenuTable {
    border-spacing: 0px;
    border-width:0px;
    border-collapse:collapse;
}
    #monitorTypeMenuTable tr, td {
        border-spacing: 0px;
        border-width: 0px;
        padding:0px;
    }
    #monitorTypeMenuTable td.paddingCell div {
        width:100%;
        height:1.4em;
        border-bottom:1px solid black;
    }
    #monitorTypeMenuTable td a {
        display: inline-block;
        text-align: center;
        text-decoration: none;
        color: white;
        background-color: darkgreen;
        border: 1px solid black;
        width: 150px;
        border-radius: 5px 5px 0 0;
        height: 1.4em;
    }
   #monitorTypeMenuTable td a.checked {
       border-bottom:none;
      background-color: transparent;
      color: black;
    }

#monitorTypeMenu {
    padding-left: 10px;
    border-bottom: 1px solid;
}
    /*
    #monitorTypeMenu li {
        display: inline;
        list-style: none;
        padding: 1px;
        border: 1px solid gray;
        background-color: #e9fded;
        width: 150px;
        border-radius: 5px 5px 0 0;
    }
        #monitorTypeMenu li a {
            display: inline-block;
            text-align: center;
            text-decoration: none;
            color: white;
            background-color: darkgreen;
        }
#monitorTypeMenu li a.checked {
      background-color: transparent;
      color:black;
}


*/
    #monitorTypeMenu li {
        display: inline;
        list-style: none;
        padding: 0px;
    }
#monitorTypeMenu li.paddingCell div {
    height: 1.4em;
    border-bottom: 1px solid black;
    display:inline-block;
}


#monitorTypeMenu li a {
    display: inline-block;
    text-align: center;
    text-decoration: none;
    color: white;
    background-color: darkgreen;
    border: 1px solid black;
    width: 150px;
    border-radius: 5px 5px 0 0;
    height: 1.4em;
}

    #monitorTypeMenu li a.checked {
        border-bottom: none;
        background-color: transparent;
        color: black;
    }


#MonitorTabsContainer {
   clear:both;
}
#courseMonitorTab .table-menu {
    text-align: left;
    margin-left: 5px;
    margin-bottom:5px;
}
.courseMonitorTablePart table {
    border-spacing:0px;
    font-size:12pt;
}
.courseMonitorTablePart td, th {
    border: 1px #808080 solid;
    padding:1px;
}
.courseMonitorTableHeader {
    height: 28px;
}
.courseMonitorTableHeader table {
        background-color: #0099cc; /* 背景色 */
        height: 100%;
        color: #fff; /* 文字色 */
}
#courseMonitorPageCournerPart th {
    width: 160px;
    min-width: 160px;
    max-width: 160px;
    font-size:10.5pt;
    height:24px;
}
#courseMonitorPageLeftPart table {
    background-color:lightyellow;
}
.course-monitor-yoko-title {
    width: 100px;
    min-width: 100px;
    max-width: 100px;
    white-space: nowrap;
    height: 60px;
}
.course-monitor-yoko-cell {
    width: 87px;
    min-width: 87px;
    max-width: 87px;
    overflow-x: hidden;
    overflow-y: hidden;
    white-space: nowrap;
    height: 60px;
}
.course-monitor-header-cell {
    width: 87px;
    min-width: 87px;
    max-width: 87px;
    text-align: center;
}
.course-monitor-yoko-space-cell {
    width: 30px;
    min-width: 30px;
    max-width: 30px;
    overflow-x: hidden;
    white-space: nowrap;
    height: 60px;
    overflow-y:hidden;
}
 .course-monitor-yoko-space-cell div {
     overflow:hidden;
 }
.course-monitor-header-space-cell {
    width: 30px;
    min-width: 30px;
    max-width: 30px;
}
#CourseMonitorTabUpdateTimePart{
    display:inline-block;
    visibility:hidden;
}
#courseMonitorPageBodyPart .CourseMonitorSpaceCell {
    text-align: center;
    position: relative;
}
#courseMonitorPageBodyPart .CourseMonitorSpaceCell > div{
    position: absolute;
    margin:auto;
    top:0px;
    bottom:0px;
}

#courseMonitorPageBodyPart .CourseMonitorAreaCell {
    position: relative;
}
#courseMonitorPageBodyPart .name, .time, .real {
    /*width: 100%;*/
    height: 20px;
    font-size: 11pt;
}
#courseMonitorPageBodyPart .time, .real {
    width:40px;
    text-align:left;
}
#courseMonitorPageBodyPart .name{
    position:absolute;
    top:1px;
}
#courseMonitorPageBodyPart .time {
    position: absolute;
    top: 21px;
}
#courseMonitorPageBodyPart .real {
    position: absolute;
    top: 40px;
}
#courseMonitorPageBodyPart .arrow {
    position: absolute;
    top: 21px;
    left: 70px;
    height: 39px;
    width: 17px;
}

#courseMonitorPageBodyPart .arrived  {
    background-color: lightgray;
}
#courseMonitorPageBodyPart  .time span {
    border: 2px  transparent solid;
    box-sizing: border-box;
}
#courseMonitorPageBodyPart .real span {
    border: 2px transparent solid;
    box-sizing: border-box;
}
#courseMonitorPageBodyPart .delayed .time span{
    border: 2px red solid;
    box-sizing:border-box;
}
#courseMonitorPageBodyPart .here  {
    background-color: yellow;
}
#courseMonitorPageBodyPart .here.departured  {
    background-color: lightgray;
}
#courseMonitorPageBodyPart .here.departured .arrow {
        background-color: yellow;
}
.CourseMonitorNameCell{
    position:relative;
}
.CourseMonitorNameCell div{
    overflow-y:hidden;
}
.WithDelayMark .status {
    width: 8px;
    height: 0.8em;
}

.WithDelayMark .delayed {
    background-color: red;
}

.WithDelayMark .recovered {
    background-color: blue;
}

#courseMonitorPageLeftPart p {
    margin: 0px;
    font-size: 10pt;
}

#courseMonitorPageLeftPart p.name {
        margin: 0px;
        height: 2.2em;
        line-height: 1.1;
        overflow: hidden;
        white-space: normal;
        font-size: 12pt;
}

#courseMonitorPageLeftPart .status {
    position: absolute;
    top: 38px;
    left: 90px;
}
#CourseMonitorTabHannrei{
    margin-left:20px;
}
#CourseMonitorTabHannrei div{
    display:inline-block;
}

.course-list-dlg-time-column {
    width: 85px;
}

table.SpecificDateGroup {
    border-collapse: separate;
    border-spacing: 10px 0px;
}

//
#announceMenuTable {
    border-spacing: 0px;
    border-width: 0px;
    border-collapse: collapse;
}

#announceMenuTable tr, td {
    border-spacing: 0px;
    border-width: 0px;
    padding: 0px;
}

#announceMenuTable td.paddingCell div {
    width: 100%;
    height: 1.4em;
    border-bottom: 1px solid black;
}

#announceMenuTable td a {
    display: inline-block;
    text-align: center;
    text-decoration: none;
    color: white;
    background-color: darkgreen;
    border: 1px solid black;
    width: 150px;
    border-radius: 5px 5px 0 0;
    height: 1.4em;
}

#announceMenuTable td a.checked {
        border-bottom: none;
        background-color: transparent;
        color: black;
}
.announce-date-column {
    width: 250px;
    max-width: 250px;
}
.announce-group-spec-row:nth-of-type(2) td:first-of-type select{
    display: none;
}
.announce-target-member[data-qti-datarow] {
    margin: 2px;
    padding: 2px;
    border: 1px solid black;
}
#announceGroupDetailDialog [data-qti-datarow] {
    margin: 2px;
    padding: 2px;
    border: 1px solid black;
}
.announceReadStatus {
    margin: 2px;
    padding: 2px;
    border: 2px solid black;
    height:40px;
}
.announceReadStatusWithoutDate {
    margin: 2px;
    padding: 2px;
    border: 2px solid black;
}
#announceTab .table-menu input[type="button"] {
    margin-right:10px;
    padding:2px 8px;
}
.UnReadLookUser {
    border-color: red;
}
#LookUserGroupSelectDialog td {
    border-top: 1px solid black;
}

.announce-date-column .schedule-yet {
    background-color: yellow;
}
.announce-date-column .schedule-error {
    background-color: red;
}
.announce-title-column .announce-title-with-schedule {
    border: 2px solid red;
    background-color:yellow;
    margin-left:auto;
}
#announceTab .DateTime{
    width:110px;
}

.forPrintOnly {
    display: none;
}

.contextmenu {
    display: none;
    position: fixed;
    left: 0px;
    top: 0px;
    width: 200px;
}
    .contextmenu ul {
        margin: 0; /*余白をリセット*/
        padding: 0; /*余白をリセット*/
        list-style-type: none; /*マーカーを削除*/
        border-top: solid 1px #3dbfb8; /*枠線*/
        border-left: solid 1px #3dbfb8; /*枠線*/
        border-right: solid 1px #3dbfb8; /*枠線*/
    }
    .contextmenu li {
        font-size:10pt;
        cursor: pointer;
        padding: 10px 20px; /*余白*/
        border-bottom: solid 1px #3dbfb8; /*枠線・下*/
        background-color: white;
        color:black;
    }
    .contextmenu li:hover {
        background-color:lightgray;
        color:white;
    }
#announceCheckAICorrectDialog span .modified-announce-text {
    background-color: yellow;
}