@charaset "utf-8";
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 100;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 200;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 300;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 400;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 100;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 200;
}

html {
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;
}
@media all and (-ms-high-contrast: none)  {
  html {
    font-family: Verdana, Meiryo, sans-serif;
  }
}
@media all and (-ms-high-contrast: active) {
  html {
    font-family: Verdana, Meiryo, sans-serif;
  }
}

/*全体*/
.cf:after{
content:"";
display:block;
clear:both;
}
/*ヘッダ*/
#header{
width:100%;
backgound:#fff;
box-shadow:0 1px 3px #ccc;
position:relative;
z-index:1000;
}
#header .box{
width:1100px;
margin:0 auto;
padding:10px 20px;
}

h1{
float:left;
line-height: 35px;
color:#0090D6;
font-weight: bold;
font-size: 21px;
}
h1 img{
  margin-right:5px;
  vertical-align: middle;
}
/*スイッチメニュー*/
#switch{
float:left;
}
#switch li{
float:left;
margin-top:8px;
}

#switch a{
display:block;
border:1px solid #fff;
padding:10px 40px;
text-decoration:none;
}

#switch span{
display:block;
border:1px solid #fff;
color:#fff;
padding:10px 40px;
}

.rireki a{
border-radius:6px 0 0 6px;
background:#eee;
color:#000;
}
.rireki span{
border-radius:6px 0 0 6px;
background:#0054a1;
}
.genkyo a{
border-radius:0 6px 6px 0;
background:#eee;
color:#000;
}
.genkyo span{
border-radius:0 6px 6px 0;
background:#0090D6;
}

.rireki a:hover{
background:#0054a1;
color:#fff;
}

.genkyo a:hover{
background:#0090D6;
color:#fff;
}

/*コンテナ*/
#container{
padding-top:15px;
padding-bottom:15px;
background:#f3f3f3;
width:100%;
}
/*タブメニュー*/
#tabmenu{
width:1110px;
margin:0 auto;
}
.tabmenu_rireki{
border-bottom:5px solid #4590ec;
box-shadow:1px 1px 3px #ccc;
position:relative;
z-index:1000;
}

.tabmenu_genkyo{
border-bottom:5px solid #0090D6;
box-shadow:1px 1px 3px #ccc;
position:relative;
z-index:1000;
}

#tabmenu li{
float:left;
width:183px;
border-right:2px solid #f3f3f3;
}

#tabmenu li:last-child{
float:left;
width:185px;
border-right:none;
}

#tabmenu span,
#tabmenu a{
display:block;
padding:10px 0;
text-align:center;
text-decoration:none;
}

.tabmenu_rireki span{
background:#4590ec;
color:#fff;
}
.tabmenu_rireki a{
background:#d9d9d9;
color:#000;
}
.tabmenu_rireki a:hover{
background:#4590ec;
color:#fff;
}

.tabmenu_genkyo span{
background:#0090D6;
color:#fff;
}
.tabmenu_genkyo a{
background:#d9d9d9;
color:#000;
}
.tabmenu_genkyo a:hover{
background:#0090D6;
color:#fff;
}
/*コンテンツ*/
#content{
background:#fff;
width:1060px;
margin:0 auto;
padding:25px;
box-shadow:1px 1px 3px #ccc;
position:relative;
z-index:1000;
}

.settei input[type="text"]{
border:1px solid #999;
padding:9px 10px;
border-radius:4px;
font-size:13px;
}

.settei input[type="button"]{
border:1px solid #999;
border-radius:4px;
cursor:pointer;
font-size:13px;
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #efefef 100%);
background: -webkit-linear-gradient(top, #ffffff 0%,#efefef 100%);
background: linear-gradient(to bottom, #ffffff 0%,#efefef 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 );
}

.settei input[type="button"]:hover{
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #f7f7f7 100%);
background: -webkit-linear-gradient(top, #ffffff 0%,#f7f7f7 100%);
background: linear-gradient(to bottom, #ffffff 0%,#f7f7f7 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f7f7f7',GradientType=0 );
color:#999;
}
#datepicker{
margin:0 5px;
}
.prev,.next{
padding:7px 12px 6px;
}
.csv{
margin:0 0 0 50px;
padding:7px 30px 6px;
color:#41a6af;
}
.csv:hover{
color:#79cfd7!important;
}
/*警報ボタン*/
.alarm{
margin:0 0 0 30px;
width:100px;
display:inline-block;
text-align:center;
}
.alarm a{
width:100%;
display:block;
text-decoration:none;
padding:11px 30px 10px;
color:#40bc3a;
border:1px solid #999;
border-radius:4px;
cursor:pointer;
font-size:13px;
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #efefef 100%);
background: -webkit-linear-gradient(top, #ffffff 0%,#efefef 100%);
background: linear-gradient(to bottom, #ffffff 0%,#efefef 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 );
}

.alarm a:hover{
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #f7f7f7 100%);
background: -webkit-linear-gradient(top, #ffffff 0%,#f7f7f7 100%);
background: linear-gradient(to bottom, #ffffff 0%,#f7f7f7 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f7f7f7',GradientType=0 );
color:#80e07b;
}

/**/
.enzan,.zoom,.reset,.collect{
padding:7px 30px 6px;
margin:0 0 20px;
border:1px solid #999;
border-radius:4px;
cursor:pointer;
font-size:13px;
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #efefef 100%);
background: -webkit-linear-gradient(top, #ffffff 0%,#efefef 100%);
background: linear-gradient(to bottom, #ffffff 0%,#efefef 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 );
}

/*開始終了時刻スタイル*/
.starttime p,.endtime p{
margin:10px 0 0 0;
}
.starttime,.endtime,
.starttime p,.endtime p,
.starttime select,
.endtime select{
	float:left;
}
.starttime select:hover,
.endtime select:hover{
cursor:pointer;
}
.select1,.select2,.select3,.select4{width:50px;float:left;}
.select1 select,
.select2 select,
.select3 select,
.select4 select{
	width: 100%;
	padding: 10px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #999;
	background: #eee;
	background: url(img/arrow01.png) right 50% no-repeat, -webkit-linear-gradient(top, #fff 0%,#efefef 100%);
	background: url(img/arrow01.png) right 50% no-repeat, linear-gradient(to bottom, #fff 0%,#efefef 100%);
	background-size: 20px, 100%;
}
.select1{margin:0 5px;}
.select2{margin:0 5px;}
.select3{margin:0 5px;}
.select4{margin:0 5px;}
.endtime{margin-right:20px;}

/*警報プルダウン*/
.alarmt h2,
.alarmt div,
.alarmt select{
	float:left;
}
.alarmt h2{
margin:7px 0 22px 0;
}
.alarmt div{
width:80px;
margin-left:20px;
}
.alarmt select:hover{
cursor:pointer;
}
.alarmt select{
	width: 100%;
	padding: 10px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #999;
	background: #eee;
	background: url(img/arrow01.png) right 50% no-repeat, -webkit-linear-gradient(top, #fff 0%,#efefef 100%);
	background: url(img/arrow01.png) right 50% no-repeat, linear-gradient(to bottom, #fff 0%,#efefef 100%);
	background-size: 20px, 100%;
}

/**/


h2{
font-size:21px;
border-left:6px solid #696969;
padding:3px 0 3px 10px;
color:#696969;
margin:25px 0 20px;
}

.datatime{
text-align:right;
font-size:13px;
margin:-20px 0 5px;
}

.content_rireki table,
.content_genkyo table,
.content_alarm table{
width:100%;
margin-bottom:20px;
}

.content_rireki table th{
color:#fff;
background:#4590ec;
border:1px solid #005ac9;
padding:10px 0;
font-weight:bold;
}

.content_rireki table td{
border:1px solid #005ac9;
padding:10px 0;
text-align:center;
}

.content_genkyo table th{
color:#fff;
background:#0090D6;
border:1px solid #0032d6;
padding:10px 0;
font-weight:bold;
}

.content_genkyo table td{
border:1px solid #0032d6;
padding:10px 0;
text-align:center;
width:10px;
}

.content_alarm{
width:1060px;
margin:0 auto;
padding:25px;
}
/*警報テーブル*/
.content_alarm table th{
color:#fff;
background:#2cb932;
border:1px solid #0c8f12;
padding:10px 0;
font-weight:bold;
}
.content_alarm table td{
border:1px solid #0c8f12;
padding:10px 0;
text-align:center;
width:263px;
}
/**/

.graph{
border:1px solid #999;
background:#ccc;
width:1058px;
}
/*チャート
.windgraphbox{
position:relative;
height:300px;
}
.windgraphbox .graph1{
float:none;
position:absolute;
top:0;
left:-120px;
}

.windgraphbox .graph2{
float:none;
position:absolute;
top:0;
right:0;
}
*/
.windgraphbox{
display: flex;
}

.graph1{
float:left;
}
#myChart{
}
.graph2{
float:right;
}
.content_rireki table .enzankomoku{
background:#84fed5;
}
.content_genkyo table .enzankomoku{
background:#ffe476;
}
/*フッタ*/
#footer{
text-align:center;
font-size:12px;
padding:10px 0;
width:100%;
background:#fff;
box-shadow:0 -1px 3px #ccc;
position:relative;
z-index:1000;
}

/*ログイン画面*/
#loginbox{
background:#fff;
width:260px;
margin:150px auto;
padding:15px 25px 25px;
box-shadow:1px 1px 3px #ccc;
position:relative;
z-index:1000;
}
.login-page{
text-align:center;
}
.login-page h2{
border-left:none!important;
font-weight:bold;
}
.login-page p{
margin:20px 0;
}
.login-page input[type="text"],
.login-page input[type="password"]{
border:1px solid #999;
padding:9px 10px;
border-radius:4px;
font-size:13px;
width:200px;
}

.login-page input[type="submit"]{
border:1px solid #999;
border-radius:4px;
cursor:pointer;
font-size:13px;
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #efefef 100%);
background: -webkit-linear-gradient(top, #ffffff 0%,#efefef 100%);
background: linear-gradient(to bottom, #ffffff 0%,#efefef 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 );
padding:10px 70px;
width:220px;
}

.login-page input[type="submit"]:hover{
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #f7f7f7 100%);
background: -webkit-linear-gradient(top, #ffffff 0%,#f7f7f7 100%);
background: linear-gradient(to bottom, #ffffff 0%,#f7f7f7 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f7f7f7',GradientType=0 );
color:#999;
}

.login-page .message{
color:#ff0000;
}