@charset "UTF-8";
/**
 * 【神奈川県河川】グラフCSS
 * ------
 * 更新履歴
 * [00] 新規作成
 * [01] 2021.02.21 K.Fujimaki	水位超過色変更、高潮超過色用css追加
 * ====2024年度リプレース
 * [A-01] 2024.12.30 K.Fujimaki	コメントの修正（潮位・高潮→海岸水位）
 *								海岸水位の超過レベル変更（高潮特別警戒はレベル4ではなく8）
 */
/*=======================
	グラフ
  =======================*/
ul.graphArea{
	position:relative;
	top:0;
	left:0;
	display:inline-block;
	width: 100%;
	min-height: 550px;
}
ul.graphArea li{
	display:block;
	position:relative;
	top:0;
	left:0;
	height:auto;
	width:100%;
}
/*=======================
	グラフ横:一覧表
  =======================*/
/* 諸元表 */
.obsInfoTbl{
	width: 580px;
	margin-top:5px;
	margin-bottom: 10px;
}
.obsInfoTbl.stage{
	width: 600px;
}
/* グラフ横の表 */
.timelineTbl.graph{
	position:absolute;
	top:0;
	right:0;
	display:inline-block;
	width: 190px;
}
.timelineTbl.graph.stage{
	width: 168px;
}
/*グラフタイトル*/
.timelineTbl.graph caption{
	font-size: 14px;
	text-indent:10px;
	letter-spacing: 1px;
	line-height:18px;
	background: url("../images/common/mark_h3.png") no-repeat left center;
	text-align: left;
	margin-top: 5px;
}
/*データ項目欄*/
.timelineTbl.graph th.itemName{
	padding: 10px;
}
/*=======================
	グラフ横:定数凡例BOX
  =======================*/
.explainBox.graph-sideList{
	position: absolute;
	left : 505px;
	top: 0;
	width: 100px;
	border-top:none;
	margin: 0;
	margin-top:10px;
}
.explainBox.graph-sideList dl{
	margin: 0;
}
.explainBox.graph-sideList dl dt{
	border-top:1px solid #6D7D88;
	padding-top: 5px;
	width:100%;
	height:auto;
	box-sizing: border-box;
	padding-left: 24px;
	text-indent: -24px;
}
.explainBox.graph-sideList dl dd{
	text-align: right;
	margin: 5px 0 3px 0;
	width:100%;
}
/* 単位 */
.explainBox.graph-sideList  dl dd span.unit{
	margin: 0 3px;
}

/*=======================
	グラフ上凡例
  =======================*/
dl.graphLegend {
	width: 580px;
	position: relative;
	top:0;
	left: 0;
}
dl.graphLegend dt,
dl.graphLegend dd{
	font-size:11px;
	float: left;
	line-height: 14px;
}
dl.graphLegend.right-item {
	position: absolute;
}
dl.graphLegend.right-item dt,
dl.graphLegend.right-item dd{
	float: right;
}
/*=======================
	グラフ凡例の画像
  =======================*/
/*------------------ グラフ上の項目(単位)の凡例 */
/** COLOR **
 紫 pur: 8131ac
 赤 red: e91e00
 橙 org: fa9f00
 黄 yel: ffd200
 青  blu: 1172ee
 水色 lbl: 71d7ea
 寒青 sbl: 0e83b7
 緑     grn: 009933
 黄緑 ygr: 72D436
ターコイズ tur: 20B2AA

 雨量棒graph-blue: 4092bc
 雨量棒graph-green: a5df52
*/
dl dt span[class^="ex-graph"]{
	display:inline-block;
	margin: 3px 3px 0 3px;
	width:14px;
	height:8px;
	vertical-align:text-top;
	background-repeat: no-repeat;
	background-position: center center;
}
/* 10/60分雨量 ----- block */
dl dt span.ex-graph-rainfall{
	background-color: #4092bc;
	background-image: url(../images/symbol/ex_barGraph.png);
}
/* 累加雨量 */
dl dt span.ex-graph-rainSum{
	background-color: #000;
	background-image: url(../images/symbol/ex_lineGraph.png);
}
/* 河川水位 */
dl dt span.ex-graph-stage{
	background-color:#0E83B7;
	background-image: url(../images/symbol/ex_lineGraph.png);
}
/* 定数:はん濫危険 */
dl dt span.ex-graph-stageLv4{
	background-color:#A902A9;/*[01]*/
	background-image: url(../images/symbol/ex_dotLine.png);
}
/* 定数:避難判断 */
dl dt span.ex-graph-stageLv3{
	background-color:#D70F0F;/*[01]*/
	background-image: url(../images/symbol/ex_dotLine.png);
}
/* 定数:はん濫注意 */
dl dt span.ex-graph-stageLv2{
	background-color:#ECD802;/*[01]*/
	background-image: url(../images/symbol/ex_dotLine.png);
}
/* 定数:水防団待機 */
dl dt span.ex-graph-stageLv1{
	background-color:#0BDCE3;/*[01]*/
	background-image: url(../images/symbol/ex_dotLine.png);
}
/* [01]定数:海岸水位特別警戒 */
dl dt span.ex-graph-coastLv8{/*[A-01]レベル4から8に変更*/
	background-color:#0C000C;
	background-image: url(../images/symbol/ex_dotLine.png);
}