@charset "UTF-8";

.comHead {
    max-width: 100%;
}

.header_title {
    width:        99%;
    table-layout: fixed;
    font-weight:  bold;
    margin:       auto;
}

.header_tbl {
    width:           100%;
    border-collapse: collapse;
}

.header_sysName {
    width:   286px;
    padding: 0%;
}

.banner_normal{
    background-color:   #a85a5a;
    color:              white;
}

.banner_degeneration{
    background-color:   yellow;
    color:              black;
}

.banner_superDegeneration{
    background-color:   orange;
    color:              black;
}

.header_disasterSel {
}

.header_loginUser {
    min-width:        350px;
    text-align:       center;
}

.header_logOutBtnCell {
    text-align:       right;
}

.header_logOutBtn {
    padding:       3px 10px;
    background:    linear-gradient(to bottom, #ffffff, #999999);
    border-radius: 7px;
    border:        2px solid #639EDF;
}

.header_dispNumCell {
    text-align:       center;
    background-color: white;
}

.header_disasterChgBtn {
    padding:       3px 10px;
    background:    linear-gradient(to bottom, #ffffff, #999999);
    border-radius: 7px;
    border:        2px solid #639EDF;
}

.header_telopTextbox {
    color:            red;
    background-color: white;
}

.tabMenu {
    width:      99%;
    background: #8ba5fd;
    color:      black;
    margin:     0px auto !important;
    padding:    2px 0px;
    display:    block !important;
}

.tabMenu_item {
    display: inline-block;
}

/***
IE10ではtabMenu_item下にbodyタグを生成し
その中に"false"という文字列が設定されている。
それが画面上に表示されてしまうため、
tabMenu_item下のdivタグを非表示とする事で対応する。
***/
.tabMenu_item div {
    visibility: hidden;
}

.tabMenu_link {
    color:           black;
    font-weight:     bold;
    padding-left:    3px;
    padding-right:   3px;
    text-decoration: none;
}

.tabMenu_link:hover {
    color:          #FF0065;
    background:     white;
    padding-top:    2px;
    padding-bottom: 2px;
    padding-left:   3px;
    padding-right:  3px;
    border-radius:  3px;
}

.tabMenu_selected {
    color:           #FF0065;
    background:      white;
    padding-top:     2px;
    padding-bottom:  2px;
    padding-left:    3px;
    padding-right:   3px;
    text-decoration: none;
    border-radius:   3px;
}

/* 災害名セレクトボックスのデザイン */
span.customSelect {
    padding:               5px 7px;
    -moz-border-radius:    5px;
    -webkit-border-radius: 5px;
    border-radius:         5px 5px;
}

span.customSelectInner {
    width:      350px !important;
    background: url(../../images/saigai_select.gif) no-repeat center right;
}

/* 災害名セレクトボックスのデザイン */
span.customSelect.changed {
    background-color: #F0DEA4;
}

/* 災害名変更モーダル関連 */
.hed_disChgHeaderItem {
    text-align: right;
}

.hed_disChgBody {
    padding:  5px 10px;
    height:   330px;
}

.hed_distbl {
    overflow: auto;
    height:   300px;
}

.hed_disChgBody table {
    width:           100%;
    border-collapse: collapse;
    border-top:      2px solid dimgray;
}

.hed_disChgBody td {
    border-left:   1px solid dimgray;
    border-right:  1px solid dimgray;
    border-bottom: 1px solid dimgray;
    padding:       3px 0px;
}

.hed_disChgBody th {
    border-left:      1px solid dimgray;
    border-right:     1px solid dimgray;
    border-bottom:    1px solid dimgray;
    padding:          3px 0px;
    background-color: darkgray;
}

.hed_disChgNowDisTxt {
    width: 15%;
}

.hed_disChgHeadNo {
    width: 5%;
}

.hed_disChgHeadDisName {
    width: 35%;
}

.hed_disChgHeadKind {
    width: 10%;
}

.hed_disChgHeadRepo {
    width: 10%;
}

.hed_disChgHeadOcc {
    width: 15%;
}

.hed_disChgHeadEntry {
    width: 15%;
}

.hed_disChgDataNo {
    text-align: center;
}

.hed_disChgFooterItem {
    text-align: center;
}

/*
marqueeアニメーションの設定
ブラウザごとに時間間隔等を指定する必要がある。
開始位置・終了位置は表示領域の幅やテキストの長さにより調整する必要がある。
*/

.marquee{
    -webkit-animation-name: marqueeAnimation;
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration:10s; /* webkitブラウザの時間間隔の設定 */
    -webkit-animation-iteration-count: infinite;

    -moz-animation-name: marqueeAnimation;
    -moz-animation-timing-function: linear;
    -moz-animation-duration:10s;    /* Firefoxの時間間隔の設定 */
    -moz-animation-iteration-count: infinite;

    -ms-animation-name: marqueeAnimation;
    -ms-animation-timing-function: linear;
    -ms-animation-duration:10s;     /* IEの時間間隔の設定 */
    -ms-animation-iteration-count: infinite;
  
    -o-animation-name: marqueeAnimation;
    -o-animation-timing-function: linear;
    -o-animation-duration:10s;      /* Operaの時間間隔の設定 */
    -o-animation-iteration-count: infinite;
  
    animation-name: marqueeAnimation;
    animation-timing-function: linear;
    animation-duration:10s;         /* 時間間隔の設定 */
    animation-iteration-count: infinite;
  
    margin: 0;
    padding: 0;
    overflow: hidden;
    display: block;
    white-space: nowrap;
}

@-webkit-keyframes marqueeAnimation{
    0%{
        text-indent: 200px;     /* webkitブラウザの開始位置の設定 */
}
    100%{
        text-indent: -340px;    /* 終了位置の設定 */
    }
}
@-ms-keyframes marqueeAnimation{
    0%{
        text-indent: 200px;     /* IEの開始位置の設定 */
}
    100%{
        text-indent: -340px;    /* 終了位置の設定 */
    }
}
@-moz-keyframes marqueeAnimation{
    0%{
        text-indent: 200px;     /* Firefoxの開始位置の設定 */
}
    100%{
        text-indent: -340px;    /* 終了位置の設定 */
    }
}
@-o-keyframes marqueeAnimation{
    0%{
        text-indent: 200px;     /* Operaの開始位置の設定 */
}
    100%{
        text-indent: -340px;    /* 終了位置の設定 */
    }
}
@keyframes marqueeAnimation{
    0%{
        text-indent: 200px;     /* 開始位置の設定 */
}
    100%{
        text-indent: -340px;    /* 終了位置の設定 */
    }
}

/* marqueeの設定ここまで */

.div_degenerationTelop{
    overflow: hidden;
    float: left;
    margin-left: -100px;
    width:200px;
    background-color: indigo;
    color: white;
}

#lineStateHelp {
    background: white;
    width: 400px;
    /*border: 1px solid #999999;*/
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    visibility: hidden;
    position: absolute;
    z-index: 999999999;
}

#lineStateHelp .content-group {
    margin-bottom: 30px;
}

#lineStateHelp h1 {
    font-size: 16px;
    padding: 3px;
    margin-bottom: 3px;
}

#lineStateHelp .normalLine {
    color: white;
    background-color: #a85a5a;
}

#lineStateHelp .normalDegeneracy {
    color: black;
    background-color: yellow;
}

#lineStateHelp .superDegeneracy {
    color: black;
    background-color: orange;
}

#lineStateHelp p {
    margin-top: 0;
    margin-left: 1em;
}