@charset(utf-8);

/*全体のスタイルをリセット*/
*{
margin:0;
padding:0;
font-family:"ＭＳ　ゴシック","メイリオ","ＭＳ　明朝";
}

/*全体のスタイル設定*/
body{
width:100%;
background-color:#ffffdd;
}#container{
margin:0 1%;
}

/*ロゴのレイアウト*/
.logo_space{
text-align:center;
}.logo_space img{
border:5px ridge #aa6633;
margin:0 auto;
width:95%;
}

/*備考欄のレイアウト*/
p{
width:80%;
color:#ffffff;
text-shadow:1px 1px 0px #000;
background:linear-gradient(-30deg,#9cf,#06f 50%,#9cf);
margin:0px auto;
padding:5px;
text-align:center;
border:1px solid #000;
font-family:"ＭＳ　明朝";
}

/*テーブル全体のスタイル設定*/
table{
margin:10px auto;
border-collapse:collapse;
}table tr{
border-style:solid;
border-width:1px;
border-color:#000;
box-sizing:border-box;
}table tr th,table tr td{
border-style:solid;
border-width:0.1px;
border-color:rgba(0,50,100,0.3);
box-sizing:border-box;
}tbody tr:nth-child(even) td{
background-color:#fff;
}

/*キャプションの設定*/
table caption{
}table caption h2{
color:#ee0000;
font-size:100%;
letter-spacing:.5em;
}

/*テーブルヘッダーのスタイル設定*/
th{
background-color:#0066ff;
color:#ffffff;
}th.title_name{
text-align:center;
}

/*ソート機能のスタイル設定*/
th button{
width:20px;
height:15px;
font-size:10px;
background-color:#06f;
color:#cef;
border:solid 1px #cef;
border-radius:3px;
box-shadow:1px 1px 1px #000;
}th button:hover{
cursor:pointer;
}

/*テーブルデータのスタイル設定*/
tr{
display:flex;
flex-flow:row wrap;
}
td{
background-color:#cceeff;
}
.number{
text-align:center;
width:25%;
display:block;
}.tyotatu_number{
text-align:center;
width:75%;
display:block;
}.title_name{
text-align:left;
width:100%;
display:block;
}.nyusatu{
text-align:center;
width:50%;
display:block;
}.nouki{
text-align:center;
width:50%;
display:block;
}
tbody tr td{
padding:2px 10px;
}

/*ハイパーリンクのスタイル設定*/
a{
color:#0000cc;
letter-spacing:0.1em;
text-decoration:none;
}a:hover{
color:#ff0000;
text-decoration:underline;
}a:visited{
color:#990066;
}


/*参考欄のレイアウト*/
.text_left{
text-align:left;
}
.line_height a{
text-align:left;
line-height:20px;
}
#sample tr{
display:table-row;
}
#sample td{
padding:2px;
}
#sample{
border:1px solid #036;
width:98%;
}
#sample tr:first-child td:first-child{
background-color:#06f;
color:#fff;
text-align:center;
}
#sample .red{
color:#f00;
}
#sample td.ippanjoko a{
display:inline-block;
width:90px;
}

/*再エネ比率のレイアウト*/
span.elec{
color:#000;
padding-left:30px;
}span.elec span.elecPer{
color:#f00;
display:inline-block;
width:35px;
text-align:center;
}

/*再度公告のレイアウト*/
span.again{
color:#f00;
font-size:15px;
padding-left:30px;
animation-duration:1s;
animation-name:again-keyframe;
animation-iteration-count:infinite;
}

/*再度公告のキーフレーム*/
@keyframes again-keyframe{
33%{color:#ff0;}
66%{color:#f00;}
}

/*変更のレイアウト*/
span.change{
color:#f00;
font-size:15px;
padding-left:30px;
}

/*アナウンスのレイアウト*/
div.anc{
width:80%;
margin:10px auto;
padding:5px;
background-color:#fff;
border:5px solid #f00;
}div.anc p{
background:none;
color:#000;
border:none;
padding:0;
text-shadow:none;
}div.anc p.anime{
color:#f00;
font-size:25px;
margin:10px auto 20px;
letter-spacing:0.5em;
animation-duration:1s;
animation-name:anc-keyframe;
animation-iteration-count:infinite;
}div.anc p span.red{
color:#f00;
}div.anc p span.big30{
font-size:18px;
font-weight:bold;
font-family:"ＭＳ 明朝";
}

/*アナウンスのキーフレーム*/
@keyframes anc-keyframe{
0%{opacity:1;}
50%{opacity:0;}
}

/*スライドエリアのレイアウト*/
#slideArea{
position:fixed;
z-index:10;
top:-132px;
width:100%;
box-sizing:border-box;
transition:top 1s;
}#slideArea.down{
top:0;
}
#slideArea ul{
background-color:#06f;
}
#slideArea ul li{
width:300px;
margin:auto;
padding:5px;
text-align:center;
border-width:1px 0px;
border-style:solid;
border-color:#06f;
background-color:rgba(255,255,255,1);
list-style-type:none;
}
#slideArea ul li:hover{
background-color:#cef;
}
#slideArea ul li a{
color:#06f;
line-height:2em;
text-shadow:0 0 3px #999;
text-decoration:none;
}
#slideArea ul li:hover a{
color:#f00;
}
#slideArea p{
width:100px;
padding:5px 0;
margin:0 0 0 75%;
color:#06f;
background:#fff;
font-size:100%;
text-align:center;
letter-spacing:0em;
text-shadow:0 0 3px #999;
border-top:none;
border-right:5px solid #06f;
border-left:5px solid #06f;
border-bottom:5px solid #06f;
border-radius:0 0 10px 10px;
opacity:0.5;
cursor:pointer;
}
#slideArea p:hover{
background-color:#cef;
opacity:1;
}