@charset "utf-8";
/* CSS Document */

/*--メインタイトル--------*/



th{
width:17em;
background-color:#c1e8e8;
}
tr td:nth-of-type(1){
max-width:31em;
}
.shikoku th{
width:17em;
background-color:#ffe2de;
}


@media only screen and (max-width: 930px) {
.w80_wrap {
border:solid 1px #ccc;
padding:5px;
width:aout;
overflow:auto;
overflow-x:scroll;
}

.w80_wrap::before {
	content: "→横スクロールします";
	color: #7fb7da;
	font-size: 129%;
}
.w80_wrap table{
width:930px;
}
}






/*-----以下、見た目のあいらい-------------------------------------------------------*/
.filter{
max-width :　100%;
margin:2em auto 0;
display: flex;
align-items:stretch;
}

.filter li{
margin:10px 1%;
width:10%;
}
.filter.hederoffice	li{
width:20%;
}

.filter li span{
background:#00a8a9;
text-align:center;
padding:5px;
color:#fff;
display:block;
}


.filter li a:nth-of-type(2){
font-size:0.8em;
}
.filter.hederoffice li span{
font-size:0.8em;
}


.filter li.shikoku span{background:#d35344;}

.filter li span:hover{
background: #d7f0f0;
color:#008486;
}
.filter li.shikoku span:hover{
background: #ecb6b0;
color:#fff;
}

@media print, screen and (max-width:1000px) {

.filter{
width : 94%;
display: flex;
flex-wrap: wrap;
}
.filter li{
width:23%;
margin:10px 1%;
}

.filter li.hederoffice{
width:46%;
margin:10px 1%;
}
}



@media only screen and (max-width: 559px) {

.filter li{
width:31.3%;
margin:10px 1%;
}
.filter.hederoffice ,
.filter li a:nth-of-type(2){
display:none;
}

.tab_wrap{
overflow-x:scroll;
}
.tab_wrap:before {
	content: "→横にスクロールします";
	color: #7fb7da;
}

.tbl_nomal{
width:800px;
}
.tbl_nomal tr th{
width:9em;
}
}