#map {
    width:100%;
    height:500px;
}




.sitetitle{font-family: Dela Gothic One, sans-serif; font-weight: 300;font-style: normal;font-size:80%;}

.pagetitle{font-size:150%; font-family: Archivo Black; font-weight: 400; font-style: normal;}
.cp{color:white;padding-top:6px;}

.table th,
.table td{padding:5px;}

.tablecus{
table-layout: fixed;
}

.tablecus th{
 text-align:center;
 }

.tablecus td{
 text-align:center;white-space: nowrap;
 }

.tablecus td:last-child{
 text-align:right;white-space: nowrap;
 }


.mapa{margin-left:-10px;}
.mapb{padding:0px;}

.fsize{float:right;font-size:160%; font-family: Archivo Black; font-weight: 400; font-style: normal;}

.br-sp {
    display: none;
}



.pcon {
    display: block;
}

.box{
 display: flex;
}
@media screen and (max-width: 576px) {
 .box{
  flex-direction: column;

.order1 { order: 1;}
.order2 { order: 2;}
.order3 { order: 3;}
.order4 { order: 4;}
.order5 { order: 5;}
.order6 { order: 6;}
.order7 { order: 7;}


 }
}

.resp{width:100%;}
.resp th{width:45%;text-align:left;padding-right:20px;display: table-cell;}
.resp td{width:55%;text-align:right;display: table-cell;}

@media (max-width: 1000px) {

.resp th {display: block!important;text-align:left;width: 100%;}
.resp td {display: block!important;text-align:right;width: 100%;}

}

.hyohaku2 {padding-left:0px;padding-right:4px;margin-bottom:-10px;}

@media (max-width: 576px) {
.hyohaku {padding-left:0px;padding-right:0px;}
.hyohaku2 {padding-left:0px;padding-right:8px;}

.mapa{margin-left:-50px;margin-right:-50px;}

.fsize{float:right;font-size:140%; font-family: Archivo Black; font-weight: 400; font-style: normal;}

.ssp{margin-top:10px;}




  .heading {
    display: none;
  }


  .ranking {
    background: #eee;
  }

  .uriagetd3 td,
  .uriagetd3 th {
    display: block;
  }


  .uriagetd3 td::before {
    color: #fff;
    content: attr(data-label);
    font-weight: bold;
    padding: 0px 10px;
    display: inline;
    background-color: #007bff;
    margin-right: 10px;
    float: left;
  }

    .br-sp {
        display: block;
    }
    .pcon {
      display: none;
}



}

.tay0{margin-left:-40px;margin-right:-40px;margin-bottom:-54px;margin-top:-10px;}

.tay02{margin-left:-30px;margin-right:-30px;margin-bottom:-20px;margin-top:-10px;}
.tay03{margin-left:30px;margin-right:30px;}

.tay1{margin-left:40px;}
.tay2{margin-left:25px;}

.tay3{margin-right:40px;}
.tay4{margin-right:25px;}

/*タブを並べる設定*/
.tab-simple0 {
    display: flex;
    flex-wrap: wrap;
    gap: 0 10px;
    max-width: 100%;
}
/*タブ見出しの設定*/
.tab-simple0 > label {
    flex: 1 1;
    order: -1;
    opacity: 0.5;
    min-width: 70px;
    padding: .6em 1em;
    background-color: #007bff;
    color: #fff;
    font-size: 1em;
    text-align: center;
    cursor: pointer;
}
/*ホバーされた時*/
.tab-simple0 > label:hover {
    opacity: 0.8;
}
/*表示しない*/
.tab-simple0 input {
    display: none;
}
/*デフォルトでは表示しない*/
.tab-simple0 > div {
    display: none;
    width: 100%;
    padding: 1.5em 1em;
}
/*クリックされた時*/
.tab-simple0 label:has(:checked) {
    opacity: 1;
}
/*クリックされたら表示*/
.tab-simple0 label:has(:checked) + div {
    display: block;
}

/*タブを並べる設定*/
.tab-simple {
    display: flex;
    flex-wrap: wrap;
    gap: 0 10px;
    max-width: 100%;
}
/*タブ見出しの設定*/
.tab-simple > label {
    flex: 1 1;
    order: -1;
    opacity: 0.5;
    min-width: 70px;
    padding: .6em 1em;
    background-color: #007bff;
    color: #fff;
    font-size: 1em;
    text-align: center;
    cursor: pointer;
}
/*ホバーされた時*/
.tab-simple > label:hover {
    opacity: 0.8;
}
/*表示しない*/
.tab-simple input {
    display: none;
}
/*デフォルトでは表示しない*/
.tab-simple > div {
    display: none;
    width: 100%;
    padding: 1.5em 1em;
}
/*クリックされた時*/
.tab-simple label:has(:checked) {
    opacity: 1;
}
/*クリックされたら表示*/
.tab-simple label:has(:checked) + div {
    display: block;
}

/*タブを並べる設定*/
.tab-simple2 {
    display: flex;
    flex-wrap: wrap;
    gap: 0 10px;
    max-width: 100%;
}
/*タブ見出しの設定*/
.tab-simple2 > label {
    flex: 1 1;
    order: -1;
    opacity: 0.5;
    min-width: 30px;
    padding: .6em 1em;
    background-color: #28a745;
    color: #fff;
    font-size: 1em;
    text-align: center;
    cursor: pointer;
}
/*ホバーされた時*/
.tab-simple2 > label:hover {
    opacity: 0.8;
}
/*表示しない*/
.tab-simple2 input {
    display: none;
}
/*デフォルトでは表示しない*/
.tab-simple2 > div {
    display: none;
    width: 100%;
    padding: 1.5em 1em;
}
/*クリックされた時*/
.tab-simple2 label:has(:checked) {
    opacity: 1;
}
/*クリックされたら表示*/
.tab-simple2 label:has(:checked) + div {
    display: block;
}


/*タブを並べる設定*/
.tab-simple22 {
    display: flex;
    flex-wrap: wrap;
    gap: 0 10px;
    max-width: 100%;
}
/*タブ見出しの設定*/
.tab-simple22 > label {
    flex: 1 1;
    order: -1;
    opacity: 0.5;
    min-width: 70px;
    padding: .6em 1em;
    background-color: #28a745;
    color: #fff;
    font-size: 1em;
    text-align: center;
    cursor: pointer;
}
/*ホバーされた時*/
.tab-simple22 > label:hover {
    opacity: 0.8;
}
/*表示しない*/
.tab-simple22 input {
    display: none;
}
/*デフォルトでは表示しない*/
.tab-simple22 > div {
    display: none;
    width: 100%;
    padding: 1.5em 1em;
}
/*クリックされた時*/
.tab-simple22 label:has(:checked) {
    opacity: 1;
}
/*クリックされたら表示*/
.tab-simple22 label:has(:checked) + div {
    display: block;
}


/*タブを並べる設定*/
.tab-simple3 {
    display: flex;
    flex-wrap: wrap;
    gap: 0 10px;
    max-width: 100%;
}
/*タブ見出しの設定*/
.tab-simple3 > label {
    flex: 1 1;
    order: -1;
    opacity: 0.5;
    min-width: 70px;
    padding: .6em 0em;
    background-color: #ffc107;
    color: #fff;
    font-size: 1em;
    text-align: center;
    cursor: pointer;

}
/*ホバーされた時*/
.tab-simple3 > label:hover {
    opacity: 0.8;
}
/*表示しない*/
.tab-simple3 input {
    display: none;
}
/*デフォルトでは表示しない*/
.tab-simple3 > div {
    display: none;
    width: 100%;
    padding: 1.5em 1em;
}
/*クリックされた時*/
.tab-simple3 label:has(:checked) {
    opacity: 1;
}
/*クリックされたら表示*/
.tab-simple3 label:has(:checked) + div {
    display: block;
}




/*タブを並べる設定*/
.tab-simple4 {
    display: flex;
    flex-wrap: wrap;
    gap: 0 10px;
    max-width: 100%;
}
/*タブ見出しの設定*/
.tab-simple4 > label {
    flex: 1 1;
    order: -1;
    opacity: 0.5;
    min-width: 70px;
    padding: .6em 1em;
    background-color: #ffc107;
    color: #fff;
    font-size: 1em;
    text-align: center;
    cursor: pointer;
}
/*ホバーされた時*/
.tab-simple4 > label:hover {
    opacity: 0.8;
}
/*表示しない*/
.tab-simple4 input {
    display: none;
}
/*デフォルトでは表示しない*/
.tab-simple4 > div {
    display: none;
    width: 100%;
    padding: 1.5em 1em;
}
/*クリックされた時*/
.tab-simple4 label:has(:checked) {
    opacity: 1;
}
/*クリックされたら表示*/
.tab-simple4 label:has(:checked) + div {
    display: block;
}

/* CSS ONLY */
.graph-cont{
  width: calc(100% - 40px);
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}
.bar23{
  height: 30px;
  max-width: 800px;
  margin: 0 auto 10px auto;
  line-height: 30px;
  font-size: 16px;
  color: white;
  padding: 0 0 0 10px;
  position: relative;
}

.bar23::before{
  content:'';
  width: 100%;
  position: absolute;
  left: 0;
  height: 30px;
  top: 0;
  z-index: 0;
  background: #ecf0f1;
}
.bar23::after{
  content: '';
  background: #007AFE;
  height: 30px;
  transition: 0.7s;
  display: block;
  width: 100%;
  -webkit-animation: bar-before 1 1.8s;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}

.bar1::after{
  max-width: 85%;
}

.bar2::after{
  max-width: 70%;
}

.bar3::after{
  max-width: 120%;
}
.bar4::after{
  max-width: 20%;
}



@-webkit-keyframes bar-before{
  0%{
    width: 0px;
  }
  100%{
    width: 100%;
  }
}

.how-cont{
  width: calc(100% - 40px);
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}
code {
  padding: 5px;
  background: #ecf0f1;
  display: block;
}
pre{
  padding: 0;
  margin: 0;
}

.uriagetd th{ text-align:center; }
.uriagetd td:nth-of-type(1) { text-align: center;white-space: nowrap; }
.uriagetd td:nth-of-type(2) { text-align: left;white-space: nowrap; }
.uriagetd td:nth-of-type(3) { text-align: center;white-space: nowrap; }
.uriagetd td:nth-of-type(4) { text-align: center;white-space: nowrap; }
.uriagetd td:nth-of-type(5) { text-align: center;white-space: nowrap; }
.uriagetd td:nth-of-type(6) { text-align: right;white-space: nowrap; }
.uriagetd td:nth-of-type(7) { text-align: center;white-space: nowrap; }

.uriagetd3 th{ text-align:center; }
.uriagetd3 td:nth-of-type(1) { text-align: center;white-space: nowrap; }
.uriagetd3 td:nth-of-type(2) { text-align: left;white-space: nowrap; }
.uriagetd3 td:nth-of-type(3) { text-align: left;white-space: nowrap; }
.uriagetd3 td:nth-of-type(4) { text-align: left;white-space: nowrap; }

.unkocarday th{ text-align:center; }
.unkocarday td:nth-of-type(1) { text-align: center; }
.unkocarday td:nth-of-type(2) { text-align: left; }
.unkocarday td:nth-of-type(3) { text-align: center; }
.unkocarday td:nth-of-type(4) { text-align: center; }
.unkocarday td:nth-of-type(5) { text-align: center; }
.unkocarday td:nth-of-type(6) { text-align: right; }

.unkocarday2 th{ text-align:center; }
.unkocarday2 td:nth-of-type(1) { text-align: center; }
.unkocarday2 td:nth-of-type(2) { text-align: left; }
.unkocarday2 td:nth-of-type(3) { text-align: center; }
.unkocarday2 td:nth-of-type(4) { text-align: center; }
.unkocarday2 td:nth-of-type(5) { text-align: center; }
.unkocarday2 td:nth-of-type(6) { text-align: center; }

.unkocarmonth th{ text-align:center; }
.unkocarmonth td:nth-of-type(1) { text-align: right; }
.unkocarmonth td:nth-of-type(2) { text-align: left; }
.unkocarmonth td:nth-of-type(3) { text-align: right; }
.unkocarmonth td:nth-of-type(4) { text-align: right; }
.unkocarmonth td:nth-of-type(5) { text-align: center; }

.lists th{ text-align:center; }
.lists td:nth-of-type(1) { text-align: center; }
.lists td:nth-of-type(2) { text-align: left; }
.lists td:nth-of-type(3) { text-align: right; }
.lists td:nth-of-type(4) { text-align: center; }

.selecttr {background: #fff8dc;}

.exporttd th{ text-align:center; }
.exporttd td:nth-of-type(1) { text-align: center;white-space: nowrap; }
.exporttd td:nth-of-type(2) { text-align: center;white-space: nowrap; }
.exporttd td:nth-of-type(3) { text-align: center;white-space: nowrap; }
.exporttd td:nth-of-type(4) { text-align: center;white-space: nowrap; }


.inputday th{ text-align:center; }
.inputday td{ vertical-align: middle;text-align: center;white-space: nowrap; }


/* 56 */
.j90{
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-image: conic-gradient(#007bff 0deg 201deg, #afeeee 201deg 360deg);
  margin-right:3px;
}

/* 50 */
.j75{
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-image: conic-gradient(#007bff 0deg 180deg, #afeeee 180deg 360deg);
  margin-right:3px;
}

/* 46 */
.j60{
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-image: conic-gradient(#007bff 0deg 165.6deg, #afeeee 165.6deg 360deg);
  margin-right:3px;
}

.soroeru{flex: grow;}