@charset 'UTF-8';
/*--------------------------------------------------------*/
/* Common.css：施設予約システム共通CSS                    */
/*--------------------------------------------------------*/

/* Material iconsを利用する */
.material-icons
{
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* 推奨サイズ */
  display: inline-block;
  width: 1em;
  height: 1em;
  line-height: 1;
  text-transform: none;
 
  /* WebKitブラウザサポート */
  -webkit-font-smoothing: antialiased;
  /* Chrome、Safariサポート */
  text-rendering: optimizeLegibility; 
  /* Firefoxサポート */
  -moz-osx-font-smoothing: grayscale; 
  /* IEサポート */
  font-feature-settings: 'liga';
}

.material-icons.md-14
{
  font-size: 14px;
  color:#666666;
}

/*--------------------------------------------------------*/
/* 配置                                                   */
/*--------------------------------------------------------*/

/* 幅：100% */
.full-width { width:100%; }

/* 高さ：100% */
.full-height { height:100%; }

/* 横位置：左寄せ */
.align-left { text-align:left; }

/* 横位置：中央寄せ */
.align-center { text-align:center; }

/* 横位置：右寄せ */
.align-right { text-align:right; }

/* 縦位置：上寄せ */
.valign-top { vertical-align:top; }

/* 縦位置：中央 */
.valign-middle { vertical-align:middle; }

/* 縦位置：下寄せ */
.valign-bottom { vertical-align:bottom; }

/*--------------------------------------------------------*/
/* 装飾                                                   */
/*--------------------------------------------------------*/

/* 文字色：赤 */
.color-red { color:#FF3333; }

/* 文字色：青 */
.color-blue { color:#2266CC; }

/* 太字 */
.bold { font-weight:bold; }

/* 背景色：灰色 */
.background-gray { background-color:#E6E6E0; }

/* エラーメッセージ */
.errorMessage {	color:#FF3333;  text-align:left;}

/*--------------------------------------------------------*/
/* メディアクエリ対応                                     */
/*--------------------------------------------------------*/

/* ================ PC用の設定 ================ */
@media only screen and (min-width:801px) {
/* メイン領域 */
.mainTable {
    max-width: 1000px;
    margin: auto;
    text-align: center;
}

/* メイン領域1 */
.table1 {
    vertical-align: top;
    clear: both;
    display: block;
    padding: 10px;
}

/* メイン領域2 */
.table2 {
    width: auto;
    text-align: left;
}

/* メイン領域3 */
.table3 {
    width: auto;
    /*margin:0 0 0 220px;*/
}

/* メイン領域4 */
.table4 {
    width: auto;
    margin: 0;
    clear: both;
}

/* ナビゲーションボタン */
.navigationButton {
    width: 130px;
}

nav ul li:nth-of-type(10) input {
    border-radius: 0 4px 4px 0;
    border-right: solid 0px #FFFFFF;
}

/***********************************************************************/
/* 施設パネル列数 */
.facilityPanelColumn {
    float: left;
    padding: 6px;
    box-sizing: border-box;
    display: block;
    width: 25%;
}

/* 施設パネル枠 */
.facilityPanel
{
    width: 100%;
    padding:12px 18px 8px 18px;
    border-radius:2px;
    text-align:left;
    background-color:#E0E0DC;
    display:inline-block;
    box-sizing:border-box;
    position:relative;
}

/* 施設パネル画像 */
.facilityPanelImage {
    width: 100%;
    height: 136px;
    margin: 0 3px 3px 0;
    border: 1px solid #666666;
    display: block;
}

/* 施設パネル施設名背景 */
.facilityNameBack {
    color: #445577;
    position: absolute;
    top: 12px;
    left: 18px;
    width: calc(100% - 36px);
    padding: 3px;
    box-sizing: border-box;
    background: -webkit-linear-gradient(0deg, #226699 0%, #99BBFF 100%);
    background: -moz-linear-gradient(0deg, #226699 0%, #99BBFF 100%);
    background: -o-linear-gradient(0deg, #226699 0%, #99BBFF 100%);
    background: -ms-linear-gradient(0deg, #226699 0%, #99BBFF 100%);
    opacity: 0.6;
}

/* 施設パネル施設名 */
.facilityName {
    color: #FFFFFF;
    position: absolute;
    top: 12px;
    left: 20px;
    width: calc(100% - 36px);
    padding: 3px;
    box-sizing: border-box;
    text-decoration: none;
    font-weight: bold;
}
/***********************************************************************/

a.facilityName:link {
    color: #FFFFFF;
}

a.facilityName:hover {
    color: #EEEEFF;
}

/* データ件数 */
.dataCount {
    margin:1px 8px 1px 0px;
    font-size: 85%;
    display:inline-block;
}

/* 施設パネル連絡先 */
.facilityPanelMessage {
    margin: 0px;
    padding: 0px;
    font-size: 95%;
}

/* 施設パネルお知らせボタン */
.facilityPanelInformationButton {
    position: absolute;
    left: calc(100% - 71px) !important;
    float: left;
}

/* コンテンツエリア */
.contentsArea {
    width: 800px;
    margin: auto;
}

.topPageButtonArea {
    display: inline-block;
}

.facilityPanel .facilityPanelScheduleButton, .facilityPanel .facilityPanelGuideButton {
    width: 40%;
    max-width: 75px;
}

.viewTypeArea select{
    max-width: 100%;
}

.rbFinished{
    margin-left:50px
}

.resultCode {
    margin-left: 138px
}
}

/* ================ スマートフォン用の設定 ================ */
@media only screen and (max-width:800px) 
{
    /* メイン領域 */
    .mainTable
    {
        width:100%;
        margin:auto;
        text-align:center;
    }

    /* メイン領域1 */
    .table1 {
        width: 100%;
        vertical-align: top;
        display: block;
        clear: both;
        padding-top: 5px;
    }

    /* メイン領域2 */
    .table2
    {
        text-align:left;
        width:100%;
        display:block;
    }

    /* メイン領域3 */
    .table3
    {
        width:100%;
        clear:both;
    }

    /* メイン領域4 */
    .table4 {
        width: auto;
        margin: 0;
        clear: both;
    }

    /* ナビゲーションボタン */
    .navigationButton
    {
        width:100px;
    }

    /* 施設パネル列数 */
    .facilityPanelColumn
    {
        float:left;
        width:100%;
        padding:4px;
        box-sizing:border-box;
        display:inline-block;
    }

    /* 施設パネル枠 */
    .facilityPanel 
    {
        width:100%;
        padding:8px 8px 8px 14px;
        border-radius:2px;
        text-align:left;
        background-color:#E0E0DC;
        display:inline-block;
        box-sizing:border-box;
        position:relative;
    }

    /* 施設パネル画像 */
    .facilityPanelImage
    {
        float:left;
        width:112px;
        height:84px;
        margin:0 10px 5px 0;
        display:inline-block;
    }

    /* 施設パネル連絡先 */
    .facilityPanelMessage
    {
        font-size:95%;
        display:block;
    }

    /* 施設パネル施設名 */
    .facilityName
    {
        color:#224488;
        font-weight:bold;
        display:block;
    }

    a.facilityName:link
    {
        color:#224488;
    }
    a.facilityName:hover 
    {
        color:#3366CC;
    }

    /* 施設パネル施設名背景 */
    .facilityNameBack {
        display: none;
    }

    /* データ件数 */
    .dataCount {
        margin:6px 8px 6px 0px;
        font-size: 85%;
        display:inline-block;
    }

    /* 施設パネルエリア */
    .facilityPanelArea {
        margin-left: 0px;
        margin-bottom: 4px;
        width: auto;
        clear: both;
        display:block;
    }

    /* 施設パネル装飾ライン */
    .facilityPanelLine 
    {
        float:left;
        width:5px;
        height:84px;
        margin:0 5px 0 5px;
        background-color:#3377AA;
        display:inline-block;
    }

    /* 施設パネルお知らせボタン */
    .facilityPanelInformationButton {
        margin-right:10px;
        float:right;
    }

    /* コンテンツエリア */
    .contentsArea {
        width: 100%;
        margin: auto;
    }

    .mainTable .calendarArea {
        width: 50%;
    }

    .calendarArea > table {
        width: 100% !important;
        height: 270px !important;
    }

    .calendarArea .btnPrevMonth, .calendarArea .btnNextMonth {
        width: 15%;
        margin-right: 2px;
    }

    .pageNavi .pageNaviLeft {
        float: left;
    }

    .pageNavi .pageNaviRight {
        float: right;
    }

    .addSpace {
        display: block;
    }

    .addSpace::after {
        content: ")";
    }

    .ScheduleFacility {
        padding-left: 0px !important;
    }

    .ScheduleFacility h3 {
        left: 10px;
    }

    .headerRight {
        display: table-footer-group !important;
    }

    .facilityNameBackForSchedule {
        left: 14px !important;
    }

    .btnSelectAllArea {
        display: table;
    }

    .calendarArea > table table tr td:last-child{
       text-align:center;
    }

    .buttonArea {
        padding: 30px 0px !important;
    }

    .cusRow{
        display: block;
    }

    .contentsArea .resultTable {
        display: block;
        overflow-y: auto;
    }
    
}

    /*--------------------------------------------------------*/
    /* HTMLタグ共通                                           */
    /*--------------------------------------------------------*/

    /* <body> */
    body 
{
    width:100%;    
    margin:auto;
    text-align:center;
    background-color:#FFFFFF;
	font-family:'メイリオ','Hiragino Kaku Gothic Pro', Sans-Serif;
}

/* ヘッダー */
header {
    padding-top: 10px;
}

/* フッター */
footer {
    padding-top: 6px;
}
/*20240111　メモ
    ボタン文字色、太字にならないように指定
    inputタグは各ボタンのCSSより適用順が低い（検索ボタンが白文字にならないためinputタグにてフォントカラー指定）
    input[type="submit"]として適用すると最優先となるため今回の修正で一時対応。appearanceの動作は調査中。
*/
input {
    font-size: 100%;
    color: black;
    font-weight: normal;
}

input[type="text"], input[type="password"], input[type="file"], textarea {
    margin: 1px 0px;
    padding: 4px 4px;
    border: 1px solid #999999;
    border-radius: .10rem;
}

input[type="submit"]:disabled {
    color:#CCCCCC
}

select {
    margin: 1px 0px;
    padding: 1px 1px;
    border: 1px solid #999999;
    border-radius: .10rem;
    min-height: 24px;
    font-size: 100%;
}

/* ulタグ */
ul {
    margin: 0;
    padding: 0;
}

/* hrタグ */
hr {
    border-style: solid;
    border-width: 1px;
    border-color: #225588;
}

/* <table><td><td><img> ボーダー非表示 */
table tr td img { border:none 0px #FFFFFF; }

/* pタグ */
p {margin:0;}

/* リンク（未訪問）*/ 
a:link {color: #0066cc;
    margin-left: 4px;
    margin-top: 0px;
}

/* リンク（訪問済）*/
a:visited {color: #0066cc;}

/* リンク（ポイント中）*/
a:hover {color: #0088ff;}

/* h1要素 */
h1 {    
    margin:0;
    font-size:220%;
    font-weight:normal;
    white-space:nowrap;
}

/* h2要素 */
h2 {    
    margin:0;
    font-size:100%;
    font-weight:normal;
    display:inline;
    white-space:nowrap;
}

/* h3要素 */
h3 {    
    margin:0;
    font-size:100%;
    font-weight:normal;
    display:inline;
    white-space:nowrap;
}

/* h4要素 */
h4 {    
    margin:0;
    font-size:100%;
    font-weight:normal;
    display:inline;
    white-space:nowrap;
}

/*--------------------------------------------------------*/
/* マスターページ                                         */
/*--------------------------------------------------------*/

/* マスターヘッダー */
.masterHeader {
    clear:both;
}

/* マスターメインタイトル */
.masterTitle {
	float:left;
	font-size:160%;
	text-decoration:none;
	color:#115599 ! important;
}

/* マスターヘッダーメニュー */
.masterHeaderMenuArea {
    text-align:center;
	font-size:90%;
	padding:0 0 0 20px;
	color:#666666;
}

/* マスターページのログイン情報エリア */
.masterLoginArea {
    float:right;
	font-size:90%;
	color:#226699;
    padding:0 8px 0 8px;
}

.masterHeaderMenuArea a:link, a:visited
{
	color:#666666;
	text-decoration:none;
}

.masterHeaderMenuArea a:hover
{
    color:#000000;
	text-decoration:none;    
}

.masterHeaderMenu {
    font-size:90%;
    white-space:nowrap;
    margin:1px 5px 1px 5px;
}

/* ボタン（標準） */
.masterHeaderButton {
    width:auto;
	min-width:74px;
    min-height:22px;
    border:1px solid #999999;
    border-radius:3px;
    background-color: #F3F3F3;
    text-align:center;
	cursor: pointer;
}

.masterPublicDateTimeMsg{
    text-align:left;
    font-size:16px;
}

/*--------------------------------------------------------*/
/* ナビゲーションバー                                     */
/*--------------------------------------------------------*/

nav 
{
    float:left;
    width:100%;
    margin:2px 0 6px 0;
    padding:0px;
    text-align:left;
    border-radius:4px;
    background: -webkit-linear-gradient(#777777 0%, #444444 50%, #3A3A3A 51%, #555555 100%);
    background: -moz-linear-gradient(#777777 0%, #444444 50%, #3A3A3A 51%, #555555 100%);
    background: -o-linear-gradient(#777777 0%, #444444 50%, #3A3A3A 51%, #555555 100%);
    background: -ms-linear-gradient(#777777 0%, #444444 50%, #3A3A3A 51%, #555555 100%);    
}

nav input
{
	height:28px;
	margin:0px;
    padding:4px;
    font-size:95%;
    color:#FFFFFF;
    border-style:none;
    background: -webkit-linear-gradient(#777777 0%, #444444 50%, #3A3A3A 51%, #555555 100%);
    background: -moz-linear-gradient(#777777 0%, #444444 50%, #3A3A3A 51%, #555555 100%);
    background: -o-linear-gradient(#777777 0%, #444444 50%, #3A3A3A 51%, #555555 100%);
    background: -ms-linear-gradient(#777777 0%, #444444 50%, #3A3A3A 51%, #555555 100%);
    border-right:solid 1px #FFFFFF;
}

nav input:hover
{
    background-color:#017ACD;
    background: -webkit-linear-gradient(#017ACD 0%, #0070BB 100%);
    background: -moz-linear-gradient(#017ACD 0%, #0070BB 100%);
    background: -o-linear-gradient(#017ACD 0%, #0070BB 100%);
    background: -ms-linear-gradient(#017ACD 0%, #0070BB 100%);
    cursor: pointer;
}

nav ul li:nth-of-type(1) input
{
    border-radius: 4px 0 0 4px;
}

nav ul li ul li:nth-of-type(1) input
{
    border-radius: 0;
}

nav ul {
  list-style-type: none;
  width:100%;
}
nav ul li {
  position: relative;
  float: left;
  text-align: center;
}
nav ul li input 
{
  width:100px;
  height:30px;
  display: block;
  text-decoration: none;
}
nav ul li ul {
  list-style: none;
  position: absolute;
}
nav ul li ul li{
  overflow: hidden;
  width: 100%;
  height: 0px;
  color: #fff;
  -moz-transition: .2s;
  -webkit-transition: .2s;
  -o-transition: .2s;
  -ms-transition: .2s;
  transition: .2s;
  z-index: 1;
}
nav ul li ul li input{
  width:100px;
  height:30px;
  background: #3A3A3A;
  color:#FFFFFF;
  text-align: left;
}
nav ul li input:hover > input{
    background-color:#017ACD;
    background: -webkit-linear-gradient(#017ACD 0%, #0070BB 100%);
    background: -moz-linear-gradient(#017ACD 0%, #0070BB 100%);
    background: -o-linear-gradient(#017ACD 0%, #0070BB 100%);
    background: -ms-linear-gradient(#017ACD 0%, #0070BB 100%);  
}

nav ul li:hover ul li{
  overflow: visible;
  height: 30px;
  border-bottom:1px solid #FFFFFF;  
}

.Navigation li input {
     display: block;
     text-decoration: none;
}
/* menu */
.NavigationList {
     clear: both;
     max-height: 0;
     transition: max-height .2s ease-out;
}
/* menu icon */
.Navigation .menu-icon {
     cursor: pointer;
     display: inline-block;
     float: right;
     padding: 20px 20px;
     user-select: none;
}
.Navigation .menu-icon .navicon {
     background: #ddd;
     display: block;
     height: 2px;
     position: relative;
     transition: background .2s ease-out;
     width: 18px;
}
.Navigation .menu-icon .navicon:before, .Navigation .menu-icon .navicon:after {
     background: #ddd;
     content: '';
     display: block;
     height: 100%;
     position: absolute;
     transition: all .2s ease-out;
     width: 100%;
}
.Navigation .menu-icon .navicon:before {
     top: 5px;
}
.Navigation .menu-icon .navicon:after {
     top: -5px;
}
/* menu btn */
.Navigation .menu-btn {
     display: none;
}
.Navigation .menu-btn:checked ~ #ctl00_NavigationList {
     max-height: 100%;
}
.Navigation .menu-btn:checked ~ .menu-icon .navicon {
     background: transparent;
}
.Navigation .menu-btn:checked ~ .menu-icon .navicon:before {
     transform: rotate(-45deg);
}
.Navigation .menu-btn:checked ~ .menu-icon .navicon:after {
     transform: rotate(45deg);
}
.Navigation .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before, .Navigation .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
     top: 0;
}
/* ================ PC用の設定 ================ */
 @media only screen and (min-width: 1001px) {
     .Navigation li {
         float: left;
    }
     .NavigationList {
         clear: none;
         float: right;
         max-height: none;          
    }
    .Navigation .menu-icon {
        display: none;
    }
}

/* ================ スマートフォン用の設定 ================ */
@media only screen and (max-width: 1000px) {
    .NavigationList {
        margin: 0;
        padding: 0;
        list-style: none;
        overflow: hidden;
    }

    ul li ul li input {
        padding-left: 20px;
    }

    .Navigation ul li {
        float: none !important;
    }

        .Navigation ul li input {
            width: 100%;
            text-align: left;
        }

    nav input {
        background: -webkit-linear-gradient(#777777 86%, #444444 108%, #3A3A3A 52%, #555555 100%) !important;
    }

        nav input:hover {
            background-color: #017ACD !important;
            background: -webkit-linear-gradient(#017ACD 0%, #0070BB 100%) !important;
        }

    nav ul li ul {
        list-style: none;
        position: relative !important;
    }
}

    /*--------------------------------------------------------*/
    /* 各種エリア                                             */
    /*--------------------------------------------------------*/

    /* ページヘッダーエリア */
    .headerArea
    {
        width:100%;
        margin:0px;
        vertical-align:middle;
        box-sizing:border-box;
        display:table;
    }

    /* ヘッダー左側 */
    .headerLeft {
        margin:0px;
        font-size:70%;
        text-align:left;
        vertical-align:top;
        display:table-cell;
    }

    /* ヘッダー左側 */
    .headerLeft2 {
        text-align:left;
        display:table-cell;
    }

    /* ヘッダー右側 */
    .headerRight {
        text-align:right;
        display:table-cell;
    }

        /* ヘッダー右側のインプット要素 */
        .headerRight input {
            margin-left:5px;
            height: 26px;
        }

    /* 警告メッセージエリア */
    .validationArea {
        text-align:left;
        padding:4px;
    }

    /* 完了メッセージエリア */
    .endMessageArea
    {
        max-width:700px;
        margin:auto;
        text-align:center;
        padding:130px 0px 130px 0px;
    }

        /* 完了メッセージエリアのP要素 */
        .endMessageArea p
        {
            padding:30px 0 30px 0;
        }

    /* ボタン配置エリア */
    .buttonArea
    {
        max-width:800px;
        padding:30px;
        text-align:center;
        margin-left:auto;
        margin-right:auto;
    }
        .buttonArea input {
            margin:0 10px 10px 10px;
        }

    /* ログインページのログインエリア */
    .loginArea
    {
        margin:120px auto 120px auto;
        max-width:600px;
        background-color:#E0E0DC;
    }

    /* タイトルバー */
    .titleBar {
        text-align:left;
        vertical-align:middle;
        font-weight:bold;
        color:#FFFFFF;
        background-color:#334466;
        padding:3px 3px 5px 5px;
    }

    /* カラーパターン2 */
    .color2 {
        background-color: #be8333 !important;
    }

    .color2 th {
        background-color: #dcc19b !important;
    }

    /* 入力テーブル */
    .inputTable {
        width: 100%;
        position: relative;
        border-collapse: collapse;
        border: 1px solid #AAAAAA;
    }

    /* DIV（コンテナー）*/
    div#container {
        position:relative;
    }

    /* DIV（右寄せ）*/
    div#right {
        position:absolute;
        right:4px;
        top:0px;
    }

    /*--------------------------------------------------------*/
    /* ボタン　　　　                                         */
    /*--------------------------------------------------------*/

    /* ボタン（標準） */
.button {
    width:auto;
    min-width:108px;
    min-height:32px;
    margin:2px 0px;
    border:1px solid #999999;
    border-radius:3px;
    background: -webkit-linear-gradient(#F3F3F3 0%, #DDDDDD 100%);
    background: -moz-linear-gradient(#F3F3F3 0%, #DDDDDD 100%);
    background: -o-linear-gradient(#F3F3F3 0%, #DDDDDD 100%);
    background: -ms-linear-gradient(#F3F3F3 0%, #DDDDDD 100%);
    text-align:center;
    cursor: pointer;
}

        .button:hover {
            background: -webkit-linear-gradient(#E3E3E3 0%, #CCCCCC 100%);
            background: -moz-linear-gradient(#E3E3E3 0%, #CCCCCC 100%);
            background: -o-linear-gradient(#E3E3E3 0%, #CCCCCC 100%);
            background: -ms-linear-gradient(#E3E3E3 0%, #CCCCCC 100%);
        }

        /*.button:disabled {
            -webkit-text-fill-color:#CCCCCC;
        }*/

    /* ボタン（フレキシブル） */
    .button2 {
        min-width:64px;
        min-height:32px;
        margin:2px 0px;
        border:1px solid #999999;
        border-radius:3px;
        background: -webkit-linear-gradient(#F3F3F3 0%, #DDDDDD 100%);
        background: -moz-linear-gradient(#F3F3F3 0%, #DDDDDD 100%);
        background: -o-linear-gradient(#F3F3F3 0%, #DDDDDD 100%);
        background: -ms-linear-gradient(#F3F3F3 0%, #DDDDDD 100%);
        text-align:center;
        cursor: pointer;
    }

        .button2:hover {
            background: -webkit-linear-gradient(#E3E3E3 0%, #CCCCCC 100%);
            background: -moz-linear-gradient(#E3E3E3 0%, #CCCCCC 100%);
            background: -o-linear-gradient(#E3E3E3 0%, #CCCCCC 100%);
            background: -ms-linear-gradient(#E3E3E3 0%, #CCCCCC 100%);
        }

    /* ボタン（ワイド） */
    .buttonWide {
        min-width:160px;
        min-height:32px;
        margin:2px 0px;
        border:1px solid #999999;
        border-radius:3px;
        background: -webkit-linear-gradient(#F3F3F3 0%, #DDDDDD 100%);
        background: -moz-linear-gradient(#F3F3F3 0%, #DDDDDD 100%);
        background: -o-linear-gradient(#F3F3F3 0%, #DDDDDD 100%);
        background: -ms-linear-gradient(#F3F3F3 0%, #DDDDDD 100%);
        text-align:center;
        cursor: pointer;
    }

        .buttonWide:hover {
            background: -webkit-linear-gradient(#E3E3E3 0%, #CCCCCC 100%);
            background: -moz-linear-gradient(#E3E3E3 0%, #CCCCCC 100%);
            background: -o-linear-gradient(#E3E3E3 0%, #CCCCCC 100%);
            background: -ms-linear-gradient(#E3E3E3 0%, #CCCCCC 100%);
        }


    /* ボタン（タブストリップ表示） */
    .buttonTab {
        width:100px;
        height:26px;
        text-align:center;
        color:#FFFFFF;
        background-color:#666666;
        border:1px solid #555555;
        border-bottom-color: #666666;
    }

    /* ボタン（タブストリップ表示／選択中） */
    .buttonTabSelected {
        width:100px;
        height:25px;
        text-align:center;
        color:#000000;
        background-color:#FFFFFF;
        border:1px solid #666666;
        border-bottom-color: #FFFFFF;
    }

    /*--------------------------------------------------------*/
    /* トップページ                                           */
    /*--------------------------------------------------------*/

    /* ログイン入力テキスト */
    .loginInputText
    {
        width:90px;
    }

    /* ログイン名 */
    .loginName
    {
        margin:5px;
        color:#88EE33;
    }

    /* メールアドレス入力テキスト */
    .mailAddressInputText
    {
        width:170px;
        font-size:90%;
    }

    /* トップページボタンエリア */
    .topPageButtonArea
    {
        margin:5px 5px 5px 5px;
        box-sizing:border-box;
    }

    /* トップページボタン１ */
    .topPageButton1
    {
        margin:5px 10px 10px 10px;
        padding:10px;
        width:180px;
        height:50px;
        font-size:120%;
        color:#FFFFFF;
        font-weight:bold;
        border:1px solid #666666;
        border-radius:6px;
        background: -webkit-linear-gradient(#AAAAAA 0%, #999999 50%, #888888 100%);
        background: -moz-linear-gradient(#AAAAAA 0%, #999999 50%, #888888 100%);
        background: -o-linear-gradient(#AAAAAA 0%, #999999 50%, #888888 100%);
        background: -ms-linear-gradient(#AAAAAA 0%, #999999 50%, #888888 100%);
        cursor: pointer;
    }

        /* トップページボタン２ */
    .topPageButton2
    {
        margin:5px 10px 10px 10px;
        padding:10px;
        width:180px;
        height:50px;
        font-size:120%;
        color:#FFFFFF;
        font-weight:bold;
        border:1px solid #CC6622;
        border-radius:6px;
        background: -webkit-linear-gradient(#EE8833 0%, #DD7722 50%, #CC6611 100%);
        background: -moz-linear-gradient(#EE8833 0%, #DD7722 50%, #CC6611 100%);
        background: -o-linear-gradient(#EE8833 0%, #DD7722 50%, #CC6611 100%);
        background: -ms-linear-gradient(#EE8833 0%, #DD7722 50%, #CC6611 100%);
        cursor: pointer;
    }

        /* トップページボタン３ */
    .topPageButton3
    {
        margin:5px 10px 10px 10px;
        padding:10px;
        width:180px;
        height:50px;
        font-size:120%;
        color:#FFFFFF;
        font-weight:bold;
        border:1px solid #997755;
        border-radius:6px;
        background: -webkit-linear-gradient(#dcc19b 0%, #c6924b 50%, #be8333 100%);
        background: -moz-linear-gradient(#dcc19b 0%, #c6924b 50%, #be8333 100%);
        background: -o-linear-gradient(#dcc19b 0%, #c6924b 50%, #be8333 100%);
        background: -ms-linear-gradient(#dcc19b 0%, #c6924b 50%, #be8333 100%);
        cursor: pointer;
    }

    /* バナー */
    .bannerArea
    {
        margin:8px;
    }

    /* インフォメーションエリア */
    .informationArea
    {
        padding:0px;
        float:left;
        width:100%;
        height:auto;
        text-align:left;
        box-sizing:border-box;
    }

    /* インフォメーション */
    .informationList
    {
        float:left;
        width:100%;
        height:auto;
        max-height:200px;
        margin:4px 0 4px 0;
        padding:3px;
        text-align:left;
        border:solid 1px #6699AA;
        box-sizing:border-box;
    }

        /* インフォメーションリンク */
        .informationList a
        {
            margin-left:4px;
        }

    .information {
        background-color:#E0E0DC;
        padding:20px;
        margin:auto;
        min-width:300px;
        max-width:600px;
        text-align:left;
        line-height:150%;
    }

    /*--------------------------------------------------------*/
    /* 施設パネル                                         */
    /*--------------------------------------------------------*/

    /* 施設パネル画像 */
    .facilityPanelImageForSchedule
    {
        float:left;
        width:158px;
        height:108px;
        margin:0 5px 5px 0;
        display:inline-block;
    }

    /* 施設パネル画像 */
    .facilityPanelImageForSchedule 
    {
        float:left;
        width:170px;
        height:120px;
        margin:0 5px 5px 0;
        display:inline-block;
    }

    /* 施設パネル施設名背景 */
    .facilityNameBackForSchedule {
        color: #445577;
        position: absolute;
        top: 12px;
        left: 18px;
        width: 170px;
        padding: 3px;
        box-sizing: border-box;
        background: -webkit-linear-gradient(0deg, #226699 0%, #99BBFF 100%);
        background: -moz-linear-gradient(0deg, #226699 0%, #99BBFF 100%);
        background: -o-linear-gradient(0deg, #226699 0%, #99BBFF 100%);
        background: -ms-linear-gradient(0deg, #226699 0%, #99BBFF 100%);
        opacity: 0.6;
    }

    /* 施設パネルのお知らせボタン */
    .facilityPanelInformationButton
    {
        left:172px;
        top:120px;
        width:40px;
        height:22px;
        font-size:90%;
        font-weight:bold;
        color:#FFFFFF;
        border:2px solid #FFFFFF;
        border-radius:11px;
        background: #223388;
        cursor: pointer;
    }


@media only screen and (min-width: 801px) {
    .facilityPanelInformationNewLabel {
        right: 26px;
        top: 125px;
        width: 10px;
        height: 12px;
        font-size: 10%;
        border: 0px solid;
        border-radius: 50%;
        background: #FF0000;
        cursor: pointer;
        position: absolute;
    }
}
@media only screen and (max-width: 800px) {
    .facilityPanelInformationNewLabel {
        right: 13px;
        top: 33px;
        width: 10px;
        height: 12px;
        font-size: 10%;
        border: 0px solid;
        border-radius: 50%;
        background: #FF0000;
        cursor: pointer;
        position: absolute;
    }
}

    /* 施設パネル施設案内ボタン */
    .facilityPanelGuideButton
    {
        font-size:90%;
        margin:2px 4px 2px 0;
        padding:4px;
        width:75px;
        color:#FFFFFF;
        border-style:none;
        border-radius:4px;
        background: -webkit-linear-gradient(#999999 0%, #666666 50%, #555555 51%, #777777 100%);
        background: -moz-linear-gradient(#999999 0%, #666666 50%, #555555 51%, #777777 100%);
        background: -o-linear-gradient(#999999 0%, #666666 50%, #555555 51%, #777777 100%);
        background: -ms-linear-gradient(#999999 0%, #666666 50%, #555555 51%, #777777 100%);
        cursor: pointer;
    }

    /* 施設パネル空き状況ボタン */
    .facilityPanelScheduleButton
    {
        font-size:90%;
        margin:2px 4px 2px 0;
        padding:4px;
        width:75px;
        color:#FFFFFF;
        border-style:none;
        border-radius:4px;
        background: -webkit-linear-gradient(#4BBB28 0%, #338819 50%, #226611 51%, #44AA22 100%);
        background: -moz-linear-gradient(#4BBB28 0%, #338819 50%, #226611 51%, #44AA22 100%);
        background: -o-linear-gradient(#4BBB28 0%, #338819 50%, #226611 51%, #44AA22 100%);
        background: -ms-linear-gradient(#4BBB28 0%, #338819 50%, #226611 51%, #44AA22 100%);
        cursor: pointer;
    }

    /* 施設パネル予約登録ボタン */
    .facilityPanelReserveButton
    {
        font-size:90%;
        margin:2px 4px 2px 0;
        padding:4px;
        width:75px;
        color:#FFFFFF;
        border-style:none;
        border-radius:4px;
        background: -webkit-linear-gradient(#4BBB28 0%, #338819 50%, #226611 51%, #44AA22 100%);
        background: -moz-linear-gradient(#4BBB28 0%, #338819 50%, #226611 51%, #44AA22 100%);
        background: -o-linear-gradient(#4BBB28 0%, #338819 50%, #226611 51%, #44AA22 100%);
        background: -ms-linear-gradient(#4BBB28 0%, #338819 50%, #226611 51%, #44AA22 100%);
        cursor: pointer;
    }

    /* 施設パネル抽選申込ボタン */
    .facilityPanelLotAppButton
    {
        font-size:90%;
        margin:2px 4px 2px 0;
        padding:4px;
        width:75px;
        color:#FFFFFF;
        border-style:none;
        border-radius:4px;
        background: -webkit-linear-gradient(#2288BB 0%, #2080B0 50%, #104060 51%, #2288BB 100%);
        background: -moz-linear-gradient(#2288BB 0%, #2080B0 50%, #104060 51%, #2288BB 100%);
        background: -o-linear-gradient(#2288BB 0%, #2080B0 50%, #104060 51%, #2288BB 100%);
        background: -ms-linear-gradient(#2288BB 0%, #167088 50%, #114466 51%, #2288BB 100%);
        cursor: pointer;
    }

    /*--------------------------------------------------------*/
    /* フッター                                               */
    /*--------------------------------------------------------*/

    /* お問い合わせ */
    .contactUs {
        font-size:85%;
        color:#005599;
    }

    /* お問い合わせ */
    .policy {
        font-size:80%;
        margin-top:4px;
    }

    /*--------------------------------------------------------*/
    /* 個人利用登録画面CSS                                    */
    /*--------------------------------------------------------*/

    /* 個人利用登録リスト */
    .Freezing {
        position: relative;
        top: expression(this.offsetParent.scrollTop);
        z-index: 10;
    }

    /*--------------------------------------------------------*/
    /* 汎用 CSS                                               */
    /*--------------------------------------------------------*/

    /* 日付テキスト（カレンダー呼び出し有） */
    .inputDate {width:105px;}

    /* IME-MODE（IEのみ） */
    input.ime-mode_off  {IME-MODE: disabled;}

    /* 非表示（音声あり） */
    .clearText {
        text-indent:100%;
        white-space:nowrap;
        overflow:hidden;
        width:1px;
        height:1px;
    }

    .center {text-align:center;}
    .right {text-align:right;}
    .left {text-align:left;}

    .editItemTitle {background-color:#AAAAAA; color:#FFFFFF; text-align:center;}
    .editItem {background-color:#AAAAAA;}
    .insertItemTitle {background-color:#FAFAFA; color:#333333; text-align:center;}
    .insertItem {background-color:#FAFAFA;}

    .detailItem {background-color:#AAAAAA; color:#FFFFFF; text-align:center;}
    .selectedItem {background-color:#aaaaaa; color:#000000;}
    /*--------------------------------------------------------*/
    /* (AdminDataImport)CSS                 */
    /*--------------------------------------------------------*/
    .condition_Import {
        margin-top: 37px;
    }

    .custom-file {
        position: relative;
        display: inline-block;
    }

    .custom-file-input {
        position: relative;
        z-index: 2;
        width: 100%;
        height: calc(2.25rem + 2px);
        margin: 0;
        opacity: 0;
    }

    .custom-file-label {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        z-index: 1;
        height: calc(1rem + 2px);
        padding: .375rem .75rem;
        font-weight: 400;
        line-height: 1.5;
        color: #495057;
        background-color: #fff;
        border: 1px solid #ced4da;
        border-radius: .25rem;
    }
    
    custom-file-label:focus {
        outline-offset: 0px;
    }

    .custom-file-label::after {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 3;
        display: block;
        /*height: 2.25rem;*/
        padding: .375rem .75rem;
        line-height: 1.5;
        color: #495057;
        content: "参照…";
        background-color: #e9ecef;
        border-left: inherit;
        border-radius: 0 .25rem .25rem 0;
    }
 
    .importCSV {
        margin-top: 16px;
    }

    .contentsArea {
        margin-top: 2rem;
    }

    .dataImport {
        margin-top: 30px;
    }

    .tblImport {
        overflow-x: scroll;
        display: block;
        max-height: 600px;
    }

        .tblImport td, .tblImport th {
            /*min-width: 100px;*/
            height: 25px;
        }

        .tblImport tbody {
            overflow-y: scroll;
            overflow-x: hidden;
            /*height: 140px;*/
        }
    .resultList .hdAdmin>td {
        height: 18px !important;
        text-align: center;
        color: #FFFFFF;
        background-color: #6699FF;
    }
    .tblImportAdmin {
        border-collapse: separate;
        border-spacing: 2px;
        border-color: white;
    }
        .tblImportAdmin, .tblImportAdmin th, .tblImportAdmin td {
            border: 2px solid white;
        }
            .tblImportAdmin .tbody {
                height: 25px !important;
            }

    ::-webkit-scrollbar {
        -webkit-appearance: none;
    }

        ::-webkit-scrollbar:vertical {
            width: 12px;
        }

        ::-webkit-scrollbar:horizontal {
            height: 12px;
        }

    ::-webkit-scrollbar-thumb {
        background-color: rgba(183, 183, 183, 0.5);
    }

    .link:visited, .link:link {
        color: #0066cc;
    }

    /*Admin Reserve List*/
    .eventListTable .tb-title td {
        height: 18px !important;
        text-align: center;
        color: #FFFFFF;
        background-color: #4f81bd;
        margin-top: 15px;
        border: 1px solid #000000;
    }

    .eventListTable {
        width: 100%;
        /*background-color: black;*/
        /*border-spacing: 1px;*/
        font-size: 95%;
        border-collapse: collapse;
        table-layout: auto;
        margin-top: 15px;
        border: 1px solid white;
    }

        .eventListTable th {
            height: 18px !important;
            text-align: center;
            color: #FFFFFF;
            background-color: #6699FF;
        }

    .rowEvent td{
        border: 1px solid #000000;
    }

    .eventListTable .previous {
        float: left;
    }

    .eventListTable .next {
        float: right;
    }

    .eventListTable tr td:nth-child(1) {
        width: 15% !important;
    }

    .eventListTable tr td:nth-child(2), .eventListTable tr td:nth-child(4) {
         width: 25%;
    }

    .eventListTable tr td:nth-child(3) {
        width: 35%;
    }

    .eventListTable .viewDate {
        position: relative;
        top: 8px;
    }

    /*Admin Reserve List*/
.addSpace {
    position: relative;
    width: 69%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

    .ScheduleFacilityRow .ScheduleFacilitySpaceDay h4:first-child {
        position: relative !important;
    }

@media only screen and (max-width:640px) {
    .mainTable .calendarArea {
            width: 100%;
        }
    }

.checkboxlist-inline li, .radiobuttonlist-inline li {
    display: inline-flex;
    align-items: center;
    padding-left: 0;
    margin-right: .75rem;
    position: relative;
}

    .checkboxlist-inline li input, .radiobuttonlist-inline li input {
        position: static;
        margin-top: 0;
        margin-right: .3125rem;
        margin-left: 0;
    }

    .checkboxlist-inline li label, .radiobuttonlist-inline li label {
        margin-bottom: 0;
    }

.card {
    text-align: center;
}

.radiobuttonlist-inline {
    float: right;
    margin-top: -5px;
}

.hiddenText {
    visibility: hidden;
}

.lighting_display_none {
    display:none;
}

.equipselectspan{
    display:inline-block;
}

@media only screen and (min-width: 650px){
    .brAttention {display: none; }
}

/* モーダルウィンドウ */
.WhiteSpace {
    white-space: normal;
    word-break: break-word;
}

/* アコーディオンメニュー */
.detail-content { 
    display: none; 
    margin-top: 2px;  
    background-color: #E0E0DC; 
    border-left: 4px solid #3377AA; 
    text-align: left;
    margin-left: 7px;
    margin-right: 7px;
    padding-left: 6px;
}
.detail-content p {
    padding-left: 8px;
    padding-right: 14px;
}

.detail-button {
    cursor: pointer;
    color: #007bff;
}

/* アコーディオンメニューの×ボタン */
.button-container {
    text-align: right; /* ボタンを右寄せ */
    padding-top: 0px;
    padding-bottom: 0px;
    height: 22px;
}

.accordion-close-button { 
    font-size: 24px;
    line-height: 24px;
    text-align: center;
    cursor: pointer;
    padding-top: 0;
    padding-bottom: 0;
}
