@charset "utf-8";
html, body {
    height: 100%;
}

#wrapper {
    width: 1000px;
    min-height: calc(100vh - 61px); /* footerの高さを引く */
    margin: 0 auto;

    /* ポイント1 */
    /* IE10 Consumer Preview */
    background-image: -ms-linear-gradient(bottom, #FFFFFF 80%, #E8F1F9 100%);
    /* Mozilla Firefox */
    background-image: -moz-linear-gradient(bottom, #FFFFFF 80%, #E8F1F9 100%);
    /* Opera */
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #E8F1F9 100%);
    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(9, #FFFFFF), color-stop(1, #E8F1F9));
    /* Webkit (Chrome 11+) */
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 90%, #E8F1F9 100%);
    /* W3C Markup, IE10 Release Preview */
    background-image: linear-gradient(to bottom, #E8F1F9, #FFFFFF 115px);
    color: #333333;
}

#content {
    margin: 0 auto 10px;
}

/*----- ヘッダー -----*/
.Header {
    display: flex;
    height: 70px;
    padding: 5px 10px 0 10px;
    overflow: hidden;
}

.Header__logo {
    width: 540px;
    height: 70px;
    margin-right: auto;
    background-image: url(../images/rogo2.png);
    background-repeat: no-repeat;
}

.hide-text {
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

.Header__disp {
    flex: 0 0 auto;
    min-width: 230px;
    max-width: 280px;
    height: 44px;
    padding: 5px;
    margin-top: 5px;
    overflow: hidden;
    border: 1px solid #ccc;
    border-right: 1px solid #f5f5f5;
    border-bottom: 1px solid #f5f5f5;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background: #f5f5f5;
    font-weight: bold;
    color: #666666;
}

.Header__logoff {
    flex: 0 0 auto;
    margin-top: 10px;
    margin-left: 10px;
}

.logoff_btn {
    width: 60px;
    padding: 5px;
    border: 1px solid #DDD;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    background: -moz-linear-gradient(top, #20688A, #3F96B8 50%, #00679A 50%, #0081B4);
    background: -webkit-gradient(linear, left top, left bottom, from(#20688A), color-stop(0.5, #3F96B8), color-stop(0.5, #00679A), to(#0081B4));
    background: linear-gradient(180deg, #20688A, #3F96B8 50%, #00679A 50%, #0081B4);
    -ms-filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#3F96B8', endColorstr='#20688A'); /* IE 8以上用 */
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#3F96B8', endColorstr='#20688A'); /*underIE7*/
    font-size: 0.8em;
    font-weight: bold;
    color: #FFFFFF;
    behavior: url("../js/PIE.htc");
}

.logoff_btn:hover {
    box-shadow: 1px 1px 11px rgba(0, 0, 0, 0.27);
    -moz-box-shadow: 1px 1px 11px rgba(0, 0, 0, 0.27);
    -webkit-box-shadow: 1px 1px 11px rgba(0, 0, 0, 0.27);
    color: #FFFF99;
}

/*画面タイトル*/
div#title {
    color: #FFFFFF;
    background-color: #5785B8;
    margin-top: 10px;
    margin-bottom: 10px;
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 1em;
    padding-left: 10px;
}

/*集計画面*/
div#title_s {
    height: 40px;
    width: 1000px;
    padding-top: 5px;
    padding-left: 10px;
    padding-bottom: 5px;
}


table#unko01 {
    margin: 0;
    width: 850px;
    border-collapse: collapse;
    border: 1px solid #CCCCCC;
}

/* メンテナンス用 */
table#mainte {
    border-collapse: collapse;
    margin: 0;
    border: 1px solid #CCCCCC;
}

table#mainte th {
    /* IE10 Consumer Preview */
    background-image: -ms-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Mozilla Firefox */
    background-image: -moz-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Opera */
    background-image: -o-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #5785B8), color-stop(1, #003399));
    /* Webkit (Chrome 11+) */
    background-image: -webkit-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* W3C Markup, IE10 Release Preview */
    background-image: linear-gradient(to top, #5785B8 0%, #003399 100%);
    font-family: Arial, Helvetica, sans-serif;
    white-space: nowrap;
    color: #FFFFFF;
    text-align: center;
    font-size: 13px;
    font-weight: normal;

    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#5785B8', endColorstr='#003399'); /*underIE9*/
    height: 25px;
    border: 1px solid #CCCCCC;
}

table#mainte td {
    height: 25px;
    padding: 0 4px 0 4px;
    border: 1px solid #CCCCCC;
    font-size: 0.9em;
    color: #333333;
}

table#mainte thead th {
    padding: 2px 4px;
}

table#mainte tbody {
    float: left; /*この設定によりoverflowが有効となる*/
    overflow-x: hidden;
    overflow-y: auto;
    color: #000000;
    height: 400px;
}

table#mainte tbody td.t01 {
    text-align: center;
}

table#mainte tbody td.t02 {
    text-align: left;
}

table#mainte tbody td.t03 {
    text-align: right;
}

table#mainte tbody td.t04 {
    border-bottom: 1px solid #6495ed;
    text-align: left;
}

table#mainte tbody td.t05 {
    border-bottom: 1px solid #6495ed;
    text-align: right;
}

table#mainte input {
    text-align: left;
    font-size: 12px;
}

/*----- BEGIN: テーブル デザイン01（枠線を分離する）-----*/
.table01 {
    border-collapse: separate;
    border: 1px solid #CCCCCC;
}

.table01 th,
.table01 td {
    /*padding: 0 2px 0 2px; !* top, bottom padding different than 0 is handled poorly by FF with HTML5 doctype *!*/
    min-width: 20px;
    height: 25px;
    border-right: 1px solid #CCC;
    border-bottom: 1px solid #CCC;
}

.table01 th {
    /* IE10 Consumer Preview */
    background-image: -ms-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Mozilla Firefox */
    background-image: -moz-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Opera */
    background-image: -o-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #5785B8), color-stop(1, #003399));
    /* Webkit (Chrome 11+) */
    background-image: -webkit-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* W3C Markup, IE10 Release Preview */
    background-image: linear-gradient(to top, #5785B8 0%, #003399 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#5785B8', endColorstr='#003399'); /*underIE9*/
    color: #FFFFFF;
    font-weight: normal;
    white-space: nowrap;
}

/*----- END: テーブル デザイン01 -----*/

/*----- BEGIN: テーブル デザイン02（枠線をまとめる）-----*/
.table02 {
    border-collapse: collapse;
    border: 1px solid #CCCCCC;
}

.table02 th,
.table02 td {
    min-width: 20px;
    height: 25px;
    border-right: 1px solid #CCC;
    border-bottom: 1px solid #CCC;
}

.table02 th {
    /* IE10 Consumer Preview */
    background-image: -ms-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Mozilla Firefox */
    background-image: -moz-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Opera */
    background-image: -o-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #5785B8), color-stop(1, #003399));
    /* Webkit (Chrome 11+) */
    background-image: -webkit-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* W3C Markup, IE10 Release Preview */
    background-image: linear-gradient(to top, #5785B8 0%, #003399 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#5785B8', endColorstr='#003399'); /*underIE9*/
    color: #FFFFFF;
    font-weight: normal;
    white-space: nowrap;
}

/*----- END: テーブル デザイン02 -----*/

/*----- BEGIN: 予約人数カレンダー -----*/
table#monthly {
    border-collapse: collapse;
    border: 1px solid #CCCCCC;
}

table#monthly thead {
    float: left; /*この設定によりoverflowが有効となる*/
}

table#monthly tbody {
    float: left; /*この設定によりoverflowが有効となる*/
    width: 220px;
    height: 500px;
    overflow-x: hidden;
    overflow-y: scroll;
}

table#monthly th {
    height: 30px;
    border: 1px solid #CCCCCC;
    /* IE10 Consumer Preview */
    background-image: -ms-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Mozilla Firefox */
    background-image: -moz-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Opera */
    background-image: -o-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #5785B8), color-stop(1, #003399));
    /* Webkit (Chrome 11+) */
    background-image: -webkit-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* W3C Markup, IE10 Release Preview */
    background-image: linear-gradient(to top, #5785B8 0%, #003399 100%);
    white-space: nowrap;
    font-weight: normal;
    text-align: center;
    color: #FFFFFF;
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#5785B8', endColorstr='#003399'); /*underIE9*/
}

table#monthly td {
    height: 30px;
    border: 1px solid #CCCCCC;
    font-size: 0.9em;
    font-weight: bold;
    text-align: center;
    color: #333333;
}

table#monthly .col1 {
    width: 65px;
}

table#monthly .col2 {
    width: 60px;
}

table#monthly .col3 {
    width: 65px;
}

table#monthly td.col1 {
    vertical-align: top;
    color: #333333;
}

.monthly_table_cell,
.monthly_table_cell a {
    background-color: #FFFFFF;
    color: #000099;
}

.monthly_table_cell.up,
.monthly_table_cell.up a {
    background-color: #95c3f8;
    color: #000099;
}

.monthly_table_cell.yoyaku_count1,
.monthly_table_cell.yoyaku_count1 a {
    background-color: #FFFFCC;
    color: #000000;
}

.monthly_table_cell.yoyaku_count2,
.monthly_table_cell.yoyaku_count2 a {
    background-color: #FF9900;
    color: #000000;
}

.monthly_table_cell.yoyaku_count3,
.monthly_table_cell.yoyaku_count3 a {
    background-color: #FFCCCC;
    color: #000000;
}

.monthly_table_cell.yoyaku_count4,
.monthly_table_cell.yoyaku_count4 a {
    background-color: #FF0033;
    color: #ffffff;
}

.monthly_table_cell.is_next {
    border-top: 2px solid #F784AC !important;
}

/*----- END: 予約人数テーブル -----*/

.label_nengappi {
    font-family: メイリオ, Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    font-size: 1.2em;
    font-weight: bold;
    color: #000099;
    vertical-align: middle;
}

td.txt01 {
    width: 110px;
    color: #000099;
}

td.txt01 span {
    /* IE10 Consumer Preview */
    background-image: -ms-linear-gradient(bottom, #FFFFAD 0%, #EDC602 100%);
    /* Mozilla Firefox */
    background-image: -moz-linear-gradient(bottom, #FFFFAD 0%, #EDC602 100%);
    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #FFFFAD), color-stop(1, #EDC602));
    /* W3C Markup, IE10 Release Preview */
    background-image: linear-gradient(to top, #FFFFAD 0%, #EDC602 100%);
    border: 1px solid #DDD;
    padding-top: 3px;
    padding-right: 10px;
    padding-bottom: 3px;
    padding-left: 10px;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.20);
    -moz-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.20);
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.20);
}

td.txt01 span a {
    color: #666666;
}

td.txt01 span a:hover {
    color: #000099;
    background-color: #FFFFCC;
}

/*----- BEGIN: バス路線セレクトボックス -----*/
.busline-select {
    padding: 10px;
}

.busline-select select {
    height: 30px;
    max-width: 570px;
    font-family: メイリオ, Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    font-size: 1.2em;
    font-weight: bold;
    color: #000099;
}

/*----- END: バス路線セレクトボックス -----*/

div#buslist {
    width: 100%;
    float: left;
    margin-right: 10px;
    margin-left: 10px;
}

div#buslist2 {
    width: 100%;
    float: left;
    margin-top: 0px;
    padding: 0px;
    margin-right: 10px;
    margin-left: 10px;
    background-color: red;
}

div.buslist_name {
    display: block;
    width: 800px;
    min-width: 300px;
    float: left;
}

/*ログイン画面入力エリア*/
#area_log {
    width: 330px;
    margin: 100px auto 0px auto;
    padding: 10px 10px 20px 10px;
    -moz-border-radius: 14px;
    -webkit-border-radius: 14px;
    border-radius: 14px;
    /*IE 7 AND 8 DO NOT SUPPORT BORDER RADIUS*/
    -moz-box-shadow: 0px 0px 6px #8f8f8f;
    -webkit-box-shadow: 0px 0px 6px #8f8f8f;
    box-shadow: 0px 0px 6px #8f8f8f;
    /*IE 7 AND 8 DO NOT SUPPORT BLUR PROPERTY OF SHADOWS*/
    background-color: #FFFFFF;
    behavior: url("../js/PIE.htc");
}

#area_log th {
    width: 90px;
    height: 50px;
    font-weight: normal;
}

#area_log .alert {
    margin-bottom: 10px;
    text-align: center;
    color: red;
}

.text-alert {
    color: red;
}

.text-notice {
    color: darkgreen;
}

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

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

.area_news {
    width: 350px;
    margin: 20px auto;
}

.area_news .news.view_date {
    width: 100px;
    vertical-align: top;
}

.area_news .news.comment {
    /*padding-left: 10px;*/
}

input[type="text"].login_id,
input[type="password"].password,
input[type="text"].lyt00 {
    height: 18px;
    line-height: 1em;
    font-size: 1em;
}

p.title_s {
    font-size: 20px;
    font-weight: bold;
    padding-top: 10px;
    margin-bottom: 2px;
}

select.lyt00 {
    height: 25px;
    line-height: 1.2em;
    font-size: 1em;
}

input[type="text"]:focus,
textarea:focus,
input[type="text"]:hover,
textarea:hover {
    box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
    -moz-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
    -webkit-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
}

input[type="password"]:focus,
textarea:focus,
input[type="password"]:hover,
textarea:hover {
    box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
    -moz-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
    -webkit-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
}

input[type="text"].bin {
    margin-left: 10px;
}

div.btn01 {
    width: 120px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    padding-right: 0;
    padding-left: 0;
    text-align: center;
    font-size: 16px;
    height: 50px;
    margin-right: auto;
    margin-left: auto;
    line-height: 50px;
    background-image: url(../images/btn_login.png);
    background-repeat: no-repeat;
}

div.btn01 a {
    display: block;
    color: #FFFFFF;
    text-indent: -9999px;
}

div.btn01 a:hover {
    display: block;
    height: 50px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    color: #A4E9F0;
    background-image: url(../images/btn_login_hover.png);
    background-repeat: no-repeat;
    box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
    -moz-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
    -webkit-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
}

.btn_output {
    background-color: transparent;
    border: none;
}

.badge {
    display: inline-block;
    max-width: 100px;
    height: 20px;
    padding: 0 5px;
    overflow: hidden;
    border: solid 1px #6c757d;
    border-radius: 10px;
    font-size: 0.8em;
    text-align: center;
    font-weight: 500;
    color: #ffffff;
    background-color: #6c757d;
}

/*---- フッター -----*/
footer {
    clear: both;
    height: 50px;
    max-width: 1000px;
    margin: 10px auto 0;
    border-top: 1px solid #cccccc;
}

footer p {
    margin: 0 auto;
    line-height: 50px;
    text-align: center;
    font-size: 12px;
    color: #999999;
    text-shadow: 1px 1px 3px #cccccc;
}

.top_img {
    min-height: calc(100vh - 61px - 175px); /* ヘッダーとフッターの高さを引く */
    background: url(../images/top.png) center bottom no-repeat;
}

/*共通*/
.border_wrap {
    border: 4px solid #E8E8E8;
}

.border_wrap4 {
    border: 1px solid #ccc;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    /* IE以外なら丸角も！ */
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background: #f5f5f5;
    color: #000099;
}

div.border_wrap2 {
    float: left;
    margin-left: 10px;
}

div.border_wrap3 {
    float: left;
    margin-left: 5px;
    margin-bottom: 0;
    border: 4px solid #E8E8E8;
}

input.date01 {
    height: 25px;
    width: 160px;
    font-size: 1.5em;
    line-height: 1.3em;
    font-weight: bold;
/ / background: #f5f5f5;
    /* IE以外なら丸角も！ */
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: #000099;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 5px;
}

input.date02 {
    text-align: right;
    font-size: 1.5em;
    font-weight: bold;
}

input.txt01 {
    text-align: left;
    font-size: 0.8em;
}

p.date02 {
    font-size: 1.5em;
    font-weight: bold;
}

select.list01 {
    height: 30px;
    max-width: 570px;
    font-family: メイリオ, Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    font-size: 1.2em;
    font-weight: bold;
    color: #000099;
}

select.list02 {
    font-family: メイリオ, Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    height: 25px;
    min-width: 120px;
    font-size: 14px;
}


/*---------- BEGIN: バス路線タブ ----------*/
.busline-tab-area {
    width: 100%;
    /*height: 38px;*/
    /*padding: 17px 0 0 0;*/
    margin: 0 0 10px 0;
    border-bottom: solid 2px #F784AC;
}

.busline-tab-flex {
    width: 850px;
    min-height: 55px;
    display: flex;
    justify-content: left;
    align-content: end;
    flex-wrap: wrap;
    column-gap: 2px;
}

.busline-tab {
    width: 195px;
    height: 30px;
    margin-top: 6px;
    background-color: #FFD3E3;
    overflow: hidden;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
}

.busline-tab.is-active {
    height: 35px;
    margin-top: 1px;
    background-color: #F784AC;
}

.busline-tab a {
    display: block;
    padding-top: 5px;
    font-size: 1rem;
    font-weight: bold;
    color: #FFFFFF;
    text-decoration: none;
    width: 100%;
    height: 100%;
    text-align: center;
}

.busline-tab.is-active a {
    padding-top: 8px;
}

/*----- END: バス路線タブ -----*/

#showoverlay {
    margin: 25px;
}

#modalbox {
    display: none;
    position: absolute;
    z-index: 1000;
    width: 400px;
    padding: 20px;
    background: #fff;
    border: 5px solid #eee;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}

#overlay {
    opacity: 0;
    filter: alpha(opacity=0);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 900;
    width: 100%;
    height: 100%;
    background: #000;
}

#close {
    line-height: 1;
    font-size: 14px;
    position: absolute;
    top: 10px;
    right: 10px;
    color: red;
    text-decoration: none;
}

p.msg {
    margin: 20px 0 20px 150px;
    padding: 10px;
    border: 1px solid #CD0A0A;
    background-color: #FEF1EC;
    text-align: center;
    color: #CD0A0A;
}

.list_box_position {
    width: 500px;
    margin: 0 auto;
    padding: 0;
    overflow-y: scroll; /* スクロール表示 */
    overflow-x: hidden;
    height: 280px;
}

.cal_line {
    height: 50px;
    width: 195px;
    border-bottom: 1px solid red;
    background-color: red;
}

.ui-datepicker-trigger {
    margin-left: 10px;
}

/*----- モーダルウインドウ -----*/
#lean_overlay {
    position: fixed;
    z-index: 100;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: #000;
    display: none;
}

#car_modal,
#crew_modal,
.modal {
    background: none repeat scroll 0 0 #FFFFFF;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.7);
    display: none;
    padding: 30px;
    height: 380px;
}

.list-item:hover {
    background-color: #CCCCCC;
    cursor: pointer;
}

.modal_close {
    /*margin: 10px 0 0 90px;*/
    margin: 10px auto;
    display: block;
    width: 100px;
    /*height: 20px;*/
    border: 1px solid #999;
    background-color: #0C419A;
    padding: 5px;
    font-size: 14px;
    /* IE10 Consumer Preview */
    background-image: -ms-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Mozilla Firefox */
    background-image: -moz-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Opera */
    background-image: -o-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #5785B8), color-stop(1, #003399));
    /* Webkit (Chrome 11+) */
    background-image: -webkit-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* W3C Markup, IE10 Release Preview */
    background-image: linear-gradient(to top, #5785B8 0%, #003399 100%);
    color: #FFFFFF;
    text-align: center;
    font-weight: normal;
    white-space: nowrap;
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#5785B8', endColorstr='#003399'); /*underIE9*/
}

.modal_btn_area {
    margin: 10px auto;
    text-align: center;
}

.modal_btn {
    width: 100px;
    border: 1px solid #999;
    background-color: #0C419A;
    padding: 5px;
    font-size: 14px;
    /* IE10 Consumer Preview */
    background-image: -ms-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Mozilla Firefox */
    background-image: -moz-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Opera */
    background-image: -o-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #5785B8), color-stop(1, #003399));
    /* Webkit (Chrome 11+) */
    background-image: -webkit-linear-gradient(bottom, #5785B8 0%, #003399 100%);
    /* W3C Markup, IE10 Release Preview */
    background-image: linear-gradient(to top, #5785B8 0%, #003399 100%);
    color: #FFFFFF;
    text-align: center;
    font-weight: normal;
    white-space: nowrap;
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#5785B8', endColorstr='#003399'); /*underIE9*/
}

.paging_area {
    /*margin-top: 5px;*/
    /*margin-left: 10px;*/
    /*clear: both;*/
    /*padding: 10px;*/
    /*width: 1005px;*/
    text-align: center;
    font-size: 15px;
}

a.paging {
    color: #0000de;
    text-decoration: underline;
}

table.busstop {
    border-collapse: collapse;
    margin: 5px 0;
    border: none;
    width: 200px;
}

table.busstop td {
    font-size: 12px;
    margin: 0;
    padding: 0;
    border: none;
}

.close_button {
    /*background-image: url(../images/close.png);*/
    background-repeat: no-repeat;
    position: fixed;
    width: 100%;
    height: 100%;
    /*                            z-index:200;*/
    top: 10px;
    left: 830px;
    text-indent: -9999px;
}

img.ui-datepicker-trigger {
    cursor: pointer;
    /*margin-left: 5px!important;*/
}

.btn:hover {
    box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
    -moz-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
    -webkit-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
    cursor: pointer;
}

.free_btn {
    display: table-cell;
    width: 90px;
    height: 32px;
    background: url(../images/btn_output_b.png) no-repeat;
    vertical-align: middle;
    text-align: center;
    font-size: 11px;
    color: #000099;
}

/*===== 共通要素 =====*/
/*----- ナビブロック -----*/
.Navi {
    margin: 5px 0 2px 0;
}

.Navi__tab {
    display: flex;
    margin: 0;
}

.Navi__tab li {
    width: 130px;
    margin: 6px 2px 0 0;
    padding: 0 5px;
    height: 34px;
    line-height: 38px;
    background-color: #a6b9d9;
    color: #ffffff;
    font-size: 1em;
    font-weight: bold;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    -webkit-border-top-left-radius: 8px;
    -webkit-border-top-right-radius: 8px;
    -moz-border-radius-topleft: 8px;
    -moz-border-radius-topright: 8px;
    overflow: hidden;
    text-align: center;
    list-style: none;
}

.Navi__tab li.active {
    height: 40px;
    margin: 0 2px 0 0;
    line-height: 50px;
    font-size: 1.2em;
    background: linear-gradient(180deg, #0A51A1, #4F7AB6);
}

.Navi__tab li:hover {
    height: 40px;
    margin: 0 2px 0 0;
    line-height: 50px;
}

.Navi__tab a {
    display: block;
    width: 100%;
    color: #FFFFFF;
}

.Navi__border {
    width: 100%;
    height: 15px;
    background: linear-gradient(180deg, #4F7AB6, #FFFFFF);
}

/*----- メンテナンスナビブロック -----*/
.MaintenanceNavi {
    margin-top: 5px;
    margin-bottom: 10px;
}

.MaintenanceNavi__button {
    display: flex;
    flex-wrap: wrap;
}

.MaintenanceNavi__button a {
    display: block;
    width: 100px;
    height: 35px;
    line-height: 35px;
    font-size: 0.9em;
    font-weight: bold;
    text-align: center;
    color: #000000;
    overflow: hidden;
    background-image: url(../images/btn_01.png);
    background-repeat: no-repeat;
}

.MaintenanceNavi__button li.active a {
    font-size: 1.0em;
    color: #000099;
    background-image: url(../images/btn_01_a.png);
}

.MaintenanceNavi__button a:hover {
    background-image: url(../images/btn_01_a.png);
    box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
    -moz-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
    -webkit-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
}

.MaintenanceNavi__border {
}

/*----- 分析ナビブロック -----*/
.BunsekiNavi {
    margin-top: 5px;
    margin-bottom: 10px;
}

.BunsekiNavi__button {
    display: flex;
    flex-wrap: wrap;
}

.BunsekiNavi__button a {
    display: block;
    width: 140px;
    height: 40px;
    line-height: 40px;
    font-size: 0.9em;
    font-weight: bold;
    text-align: center;
    color: #000000;
    overflow: hidden;
    background-image: url(../images/btn_02.png);
    background-repeat: no-repeat;
}

.BunsekiNavi__button li.active a {
    font-size: 1.0em;
    color: #000099;
    background-image: url(../images/btn_02_a.png);
}

.BunsekiNavi__button a:hover {
    background-image: url(../images/btn_02_a.png);
    box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
    -moz-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
    -webkit-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
}

.BunsekiNavi__border {
    color: #003399;
}

/*===== 予約ページ・期間予約ページ =====*/
/*----- 予約情報ページ レイアウト（2コラム） -----*/
.YoyakuContent {
    display: flex;
}

.YoyakuContent__left {
    width: 230px;
    height: 600px;
    margin-right: 10px;
}

.YoyakuContent__right {
    width: 760px;
}

/*----- 予約月ボタンブロック -----*/
.YoyakuMonth {
    height: 30px;
    margin-bottom: 10px;
}

.label_month {
    padding: 3px 5px 3px 5px;
    line-height: 1.3em;
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
}

/*----- 予約メニューブロック -----*/
.YoyakuMenu {
    display: flex;
    justify-content: space-between;
    margin: 10px 0;
}

.label_date {
    font-size: 1.5em;
    font-weight: bold;
    text-shadow: 1px 1px 3px #fff;
    color: #000099;
}

.label_service {
    padding: 5px 10px 1px 10px;
    font-size: 1.4em;
    font-weight: bold;
}

/*----- 新規予約ブロック -----*/
.YoyakuNew {
    margin-bottom: 10px;
}

.YoyakuNew__disable_msg {
    position: relative;
    top: -120px;
    width: 600px;
    margin: 0 auto;
    padding: 20px;
    border: 2px solid #CD0A0A;
    background-color: #FEF1EC;
    text-align: center;
    color: #CD0A0A;
}

.YoyakuTable {
    table-layout: fixed;
}

.YoyakuTable th {
    font-size: 0.9em;
}

.YoyakuTable td,
.YoyakuTable input {
    font-size: 1.0em;
}

.YoyakuTable td > * {
    /*display: inline-block;*/
    vertical-align: middle;
}

.YoyakuTable__yoyaku_id {
    width: 30px;
}

.YoyakuTable__tel {
    width: 170px;
}

.YoyakuTable__member_name {
    width: 170px;
}

.YoyakuTable__on_busstop_pid,
.YoyakuTable__off_busstop_pid {
    width: 25px;
}

.YoyakuTable__on_busstop_name,
.YoyakuTable__off_busstop_name {
    display: inline-block;
    width: 145px;
}

.YoyakuTable__on_busstop_time {
    width: 60px;
}

.YoyakuTable__transit_pid {
    width: 25px;
}

.YoyakuTable__transit_name {
    display: inline-block;
    width: 235px;
}

.YoyakuTable__transit_time {
    width: 60px;
}

.YoyakuTable__bikou {
    width: 470px;
}

/*----- 乗車場所モーダル -----*/
.MemberModal,
.OnBusstopModal,
.OffBusstopModal,
.TransitModal,
.DateChangeModal {
    height: auto;
}

.MemberModal__table {
    margin: 10px 0;
    width: 423px;
}

.MemberModal__table td,
.MemberModal__table th {
    padding: 1px 5px;
}

.MemberModal__member_pid {
    width: 40px;
}

.MemberModal__tel {
    width: 150px;
}

.MemberModal__member_name {
    width: 180px;
}

.fixed_header thead,
.fixed_header tbody {
    float: left;
}

.row-item--select {
    font-weight: bold;
    background-color: #bfe4ff;
    color: #005aff;
}

.OnBusstopModal__list,
.OffBusstopModal__list {
    margin: 10px 0;
    padding: 5px;
    columns: 4;
    column-rule: 1px solid #666;
    border: 1px solid #666;
}

.OnBusstopModal__table,
.OffBusstopModal__table {
    border: 1px solid #CCC;
}

.OnBusstopModal__table td + td,
.OffBusstopModal__table td + td {
    border-left: 1px solid #CCC;
}

.list-item {
    padding: 1px 5px;
    border: 2px solid rgba(0, 0, 0, 0);
    border-radius: 5px;
    letter-spacing: 0.01em; /* boldに切り替えたとき幅が変わらないようにするため */
}

.list-item--select {
    /*border: 2px solid #ffcabf;*/
    border-color: #bfe4ff !important;
    font-weight: bold;
    letter-spacing: normal;
    /*color: #FF0033;*/
    color: #005aff;
}

.list-item--select_g {
    border-color: #d8f255 !important;
    font-weight: bold;
    color: #03af7a;
}

.list-item--select_r {
    border-color: #ffcabf !important;
    font-weight: bold;
    color: #ff0700;
}

/*=========== 経路設定ページ ============*/
/*----- 経路設定ブロック -----*/
.MoveRouteResult {
    margin: 20px 0 10px 0;
}

.MoveRouteResult__table .border-top-thick td {
    border-top: 3px double #CCCCCC;
}

/*=========== 運行表ページ ==========*/
/*----- 運行表メニューブロック -----*/
.MoveListMenu {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
    width: 860px;
}

/*----- 運行表コンテンツブロック -----*/
.MoveListTables {
    width: 860px;
}

.MoveListTables__title {
    display: flex;
    justify-content: space-between;
}

.MoveListTables__title1,
.MoveListTables__title2 {
    font-size: 16px;
    font-weight: bold;
    color: #330099;
}

/*----- 運行表テーブルブロック -----*/
.MoveListTable {
    margin-bottom: 10px;
}

.MoveListTable__title {
    display: flex;
}

.MoveListTable__title_bin {
    width: 200px;
}

.MoveListTable__title_car {
    width: 200px;
}

.MoveListTable__title_crew {
}

.MoveListTable__table {
}

.MoveListTable__table th {
    height: 25px;
    font-size: 0.9em;
    font-weight: bold;
    white-space: nowrap;
}

.MoveListTable__table td {
    height: 30px;
    padding: 1px 5px;
    font-size: 0.9em;
    /*text-align: left;*/
    color: #666666;
}

.MoveListTable__on_busstop_pid,
.MoveListTable__off_busstop_pid {
    width: 20px
}

.MoveListTable__on_busstop_name,
.MoveListTable__off_busstop_name {
    width: 140px;
}

.MoveListTable__on_busstop_time {
    width: 56px;
}


.MoveListTable__member_name {
    width: 113px
}

.MoveListTable__tel {
    width: 95px
}

.MoveListTable__bikou {
    width: 185px
}

.MoveListTable__mail {
    width: 80px
}

@media print {
    .MoveListTables {
        width: 170mm;
    }

    .MoveListTables__title1,
    .MoveListTables__title2 {
        font-size: 7pt;
    }

    .MoveListTable {
        display: flex;
        border: none;
        width: 165mm;
        /*align-items: center;*/
    }

    .MoveListTable__title {
        width: 25mm;
        display: block;
        border: 1px solid #ccc;
    }

    .MoveListTable__title.print--margin {
        margin-top: 5.2mm;
        /*border-top: 5.2mm solid #ccc;*/
    }

    .MoveListTable__title1 {
        height: 10mm;
        font-size: 7pt;
        font-weight: bold;
    }

    .MoveListTable__table {
        width: 140mm;
    }

    .MoveListTable__title {
        font-size: 6pt;
    }

    .MoveListTable__table th,
    .MoveListTable__table td {
        min-height: auto;
        height: 5mm;
        padding: 0 0.5mm;
        font-size: 6pt;
    }

    .MoveListTable__on_busstop_pid,
    .MoveListTable__off_busstop_pid {
        width: 5mm;
        /*width: 4%;*/
    }

    .MoveListTable__on_busstop_name,
    .MoveListTable__off_busstop_name {
        width: 25mm;
        /*width: 15%;*/
    }

    .MoveListTable__on_busstop_time {
        width: 10mm;
        /*width: 8%;*/
    }

    .MoveListTable__member_name {
        width: 25mm;
        /*width: 15%;*/
    }

    .MoveListTable__tel {
        width: 25mm;
        /*width: 15%;*/
    }

    .MoveListTable__bikou {
        width: 45mm;
        /*width: 20%;*/
    }

    .MoveListTable__mail {
        display: none;
    }

    .MoveListTable .suburb_icon {
        height: 4mm;
    }
}

/*===== 予約一覧ページ =====*/
/*----- 予約情報ページ レイアウト（2コラム） -----*/
.YoyakuInfoContent {
    display: flex;
}

.YoyakuInfoContent__left {
    width: 200px;
    height: 600px;
    margin-right: 10px;
}

.YoyakuInfoContent__right {
    width: 750px;
}

/*----- 予約一覧メニューブロック -----*/
.YoyakuInfoMenu {
    display: flex;
    justify-content: space-between;
    width: 946px;
    margin-bottom: 10px;
}

/*----- 予約一覧テーブルブロック -----*/
.YoyakuInfoTable {

}

.YoyakuInfoTable__table {
    font-size: 0.8em;
}

.YoyakuInfoTable__table td {
    padding: 1px 5px;
}

/*===== 乗務記録ページ =====*/
/*----- 乗務記録メニューブロック -----*/
.MoveLogMenu {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.MoveLogNew {
    margin-bottom: 10px;
}

/*----- 乗務記録テーブル -----*/
.MoveLogTable {
}

.MoveLogTable__table {
    width: 100%;
    font-size: 0.8em;
}

.MoveLogTable__table td {
    padding: 1px 5px;
}

.unit {
    margin: 0 2px;
    color: #222;
}

.MoveLogModal {
    width: 600px;
    min-height: 500px;
    padding: 20px;
}

.MoveLogModal hr {
    width: 560px;
    color: #eeeeee;
}

/*===== メンテナンスページ =====*/
/*----- 利用者ブロック -----*/
.MaintenanceMemberTool {
    display: flex;
    justify-content: space-between;
    margin: 10px;
    height: 30px;
    font-size: 0.8em;
}

/*===== 分析ページ =====*/
/*----- 分析結果ブロック -----*/
.BunsekiResult {
    padding: 5px 10px;
}

.BunsekiResult__menu {
    margin: 5px 0;
    height: 40px;
}

.BunsekiResult__export {
    margin: 5px 0 10px;
}

.BunsekiResult__title {

}

.BunsekiResult__title h2 {

}

.BunsekiResult__title h3 {
    margin-bottom: 2px;
    padding-top: 10px;
    font-size: 20px;
    font-weight: bold;
}

.BunsekiResult__title .subtitle {
    font-weight: bold;
}

.BunsekiResult__table {

}

.BunsekiResult__table th {
    padding: 2px 5px;
    font-size: 13px;
}

.BunsekiResult__table td {
    padding: 2px 5px;
    font-size: 15px;
}

/*----- 個別利用実績 -----*/
.Bunseki2ResultTable {
    width: 1400px;
}

.Bunseki2ResultTable th {
    height: 20px;
    padding: 2px 5px;
    font-size: 10px;
}

.Bunseki2ResultTable td {
    padding: 2px 5px;
    font-size: 10px;
}

.Bunseki2ResultTable tr:nth-child(10n+8),
.Bunseki2ResultTable tr:nth-child(10n+9),
.Bunseki2ResultTable tr:nth-child(10n+10),
.Bunseki2ResultTable tr:nth-child(10n+11),
.Bunseki2ResultTable tr:nth-child(10n+12) {
    background-color: #EEEEEE;
}

.Bunseki2ResultTable tr:nth-child(5n+3) td {
    border-top: 2px solid #AAAAAA !important;
}

@media print {
    .Bunseki2ResultTable {
        width: 260mm;
    }

    .Bunseki2ResultTable th,
    .Bunseki2ResultTable td {
        min-width: auto;
        height: 3mm;
        padding: 0 0.3mm 0 0.3mm;
        font-size: 5pt;
    }
}

/*::::: 印刷用スタイル :::::*/
@media print {
    html, body {
        height: auto;
    }

    #wrapper {
        width: auto;
        min-height: auto;
    }

    /* 改ページ */
    .print--page {
        page-break-after: always;
    }

    /* 印刷しない */
    .print--hide {
        display: none;
    }
}

/*::::: 出力ボタンスタイル :::::*/
.BunsekiExport {
    /* 相対配置 */
    position: relative;
    margin: 5px 10px;

}

.BunsekiExport > .youshiki4 {
    /* 絶対配置 */
    position: absolute;
    top: 8px;
    left: 10px;
    font-size: 0.7em;
}

.BunsekiExport > .youshiki_kyoku1 {
    /* 絶対配置 */
    position: absolute;
    top: 8px;
    left: 10px;
    font-size: 0.7em;
}


.BunsekiExport > .youshiki_kyoku2 {
    /* 絶対配置 */
    position: absolute;
    top: 8px;
    left: 105px;
    font-size: 0.7em;
}

.BunsekiExport > .youshiki_kyoku3 {
    /* 絶対配置 */
    position: absolute;
    top: 8px;
    left: 200px;
    font-size: 0.7em;
}

.BunsekiExport > .youshiki_shi_getu1 {
    /* 絶対配置 */
    position: absolute;
    top: 8px;
    left: 10px;
    font-size: 0.7em;
}

.BunsekiExport > .youshiki_shi_getu2 {
    /* 絶対配置 */
    position: absolute;
    top: 8px;
    left: 105px;
    font-size: 0.7em;
}

.BunsekiExport > .youshiki_shi_getu3 {
    /* 絶対配置 */
    position: absolute;
    top: 8px;
    left: 200px;
    font-size: 0.7em;
}

.BunsekiExport > .youshiki_daily_report {
    /* 絶対配置 */
    position: absolute;
    top: 8px;
    left: 10px;
    font-size: 0.8em;
}