@charset "UTF-8";
#container.subpage .subpage_top .inner img {
  -o-object-position: center 60%;
     object-position: center 60%;
}

/*svg地図設定-----------------------------------------------*/
.result .result-map div #tokyo_map {
  width: 100%;
  display: block;
  margin: 0 auto;
  max-width: 757px;
  max-height: 720px;
}

.result .result-map div #chiba_map {
  width: 100%;
  display: block;
  margin: 0 auto;
  max-width: 530px;
  max-height: 790px;
}

.result .result-map .tokyo-map .tokyo_area1, .result .result-map .chiba-map .chiba_area1 {
  fill: #e0eed7;
  stroke: #221815;
  stroke-linejoin: round;
  stroke-width: 5.88px;
  transition: all 0.5s;
}

.result .result-map .tokyo-map #tokyo_map > a.grayzone, .result .result-map .chiba-map #chiba_map > a.grayzone {
  /* pointer-events: none; */
  cursor: default;
}

.result .result-map .tokyo-map #tokyo_map > a:hover .tokyo_area1, .result .result-map .chiba-map #chiba_map > a:hover .chiba_area1 {
  fill: #91E597;
}

.result .result-map .tokyo-map #tokyo_map > a.grayzone:hover .tokyo_area1, .result .result-map .chiba-map #chiba_map > a.grayzone:hover .chiba_area1 {
  fill: #aaa;
}

/*地図ボタン設定-----------------------------------------------*/
.result .result-map div svg > a text {
  font-size: 30px;
  font-weight: bold;
  opacity: 0;
  transition: all 0.5s;
}

.result .result-map div svg > a rect {
  transition: all 0.5s;
  width: 110px;
  height: 55px;
  fill: rgba(255, 255, 255, 0.5);
  stroke: #666;
  stroke-width: 4;
  rx: 20px;
  ry: 20px;
  opacity: 0;
}

.result .result-map div svg > a:hover text, .result .result-map div svg > a:hover rect {
  opacity: 1;
}

/* on状態 */
.result .result-map .tokyo-map #tokyo_map > a.active .tokyo_area1, .result .result-map .chiba-map #chiba_map > a.active .chiba_area1 {
  fill: #91E597;
}

.result .result-map div svg > a.active text, .result .result-map div svg > a.active rect {
  opacity: 1;
}

/* off状態 */
.result .result-map .tokyo-map #tokyo_map > a.notactive .tokyo_area1, .result .result-map .chiba-map #chiba_map > a.notactive .chiba_area1 {
  fill: #aaa;
  cursor: default;
}

.result .result-map div svg > a.notactive text, .result .result-map div svg > a.notactive rect {
  opacity: 1;
}

/*東京-------------------------------------------------*/
/*中央区*/
.result .result-map div svg #tokyo_chuo > text {
  transform: translate(56.4%, 52%);
  font-size: 28px;
}

.result .result-map div svg #tokyo_chuo > rect {
  transform: translate(56%, 49%);
  width: 92px;
}

/*荒川区*/
.result .result-map div svg #arakawa > text {
  transform: translate(58.3%, 28.6%);
  font-size: 28px;
}

.result .result-map div svg #arakawa > rect {
  transform: translate(57.8%, 26%);
  width: 97px;
  height: 44px;
}

/*豊島区*/
.result .result-map div svg #toshima > text {
  transform: translate(39%, 30%);
}

.result .result-map div svg #toshima > rect {
  transform: translate(38.6%, 27.2%);
  width: 105px;
  height: 55px;
}

/*渋谷区*/
.result .result-map div svg #shibuya > text {
  transform: translate(33.5%, 50%);
}

.result .result-map div svg #shibuya > rect {
  transform: translate(32.9%, 47%);
  width: 110px;
  height: 55px;
}

/*目黒区*/
.result .result-map div svg #meguro > text {
  transform: translate(35%, 62.6%);
}

.result .result-map div svg #meguro > rect {
  transform: translate(34.5%, 59.8%);
}

/*大田区*/
.result .result-map div svg #oota > text {
  transform: translate(38%, 82%);
}

.result .result-map div svg #oota > rect {
  transform: translate(37.5%, 79%);
}

/*品川区*/
.result .result-map div svg #shinagawa > text {
  transform: translate(45%, 72%);
}

.result .result-map div svg #shinagawa > rect {
  transform: translate(44.5%, 69.2%);
}

/*世田谷区*/
.result .result-map div svg #setagaya > text {
  transform: translate(15%, 62%);
}

.result .result-map div svg #setagaya > rect {
  transform: translate(14.3%, 59%);
  width: 140px;
}

/*杉並区*/
.result .result-map div svg #suginami > text {
  transform: translate(13%, 42%);
}

.result .result-map div svg #suginami > rect {
  transform: translate(12.3%, 39%);
}

/*練馬区*/
.result .result-map div svg #nerima > text {
  transform: translate(8%, 25%);
}

.result .result-map div svg #nerima > rect {
  transform: translate(7.3%, 22%);
}

/*板橋区*/
.result .result-map div svg #itabashi > text {
  transform: translate(33.3%, 22%);
}

.result .result-map div svg #itabashi > rect {
  transform: translate(32.7%, 19%);
}

/*北区*/
.result .result-map div svg #kitaku > text {
  transform: translate(46%, 22%);
}

.result .result-map div svg #kitaku > rect {
  transform: translate(44.5%, 19%);
  width: 105px;
}

/*足立区*/
.result .result-map div svg #adachi > text {
  transform: translate(62.4%, 15%);
}

.result .result-map div svg #adachi > rect {
  transform: translate(61.7%, 12.1%);
}

/*文京区*/
.result .result-map div svg #bunkyo > text {
  transform: translate(48%, 35%);
}

.result .result-map div svg #bunkyo > rect {
  transform: translate(47.4%, 32%);
}

/*中野区*/
.result .result-map div svg #nakano > text {
  transform: translate(24.7%, 35%);
}

.result .result-map div svg #nakano > rect {
  transform: translate(24%, 32%);
}

/*新宿区*/
.result .result-map div svg #shinjuku > text {
  transform: translate(39%, 41%);
}

.result .result-map div svg #shinjuku > rect {
  transform: translate(38.5%, 38.1%);
}

/*千代田区*/
.result .result-map div svg #chiyoda > text {
  transform: translate(49%, 46.2%);
  font-size: 25px;
}

.result .result-map div svg #chiyoda > rect {
  transform: translate(48.7%, 43.2%);
  width: 112px;
}

/*台東区*/
.result .result-map div svg #taito > text {
  transform: translate(59.2%, 36%);
}

.result .result-map div svg #taito > rect {
  transform: translate(58.5%, 33.2%);
}

/*江東区*/
.result .result-map div svg #koutou > text {
  transform: translate(68.5%, 52%);
}

.result .result-map div svg #koutou > rect {
  transform: translate(67.8%, 49.2%);
}

/*墨田区*/
.result .result-map div svg #sumida > text {
  transform: translate(68.7%, 36.6%);
}

.result .result-map div svg #sumida > rect {
  transform: translate(67.9%, 33.7%);
}

/*葛飾区*/
.result .result-map div svg #katsushika > text {
  transform: translate(78%, 26%);
}

.result .result-map div svg #katsushika > rect {
  transform: translate(77.5%, 23.1%);
}

/*江戸川区*/
.result .result-map div svg #edogawa > text {
  transform: translate(83%, 42%);
}

.result .result-map div svg #edogawa > rect {
  transform: translate(82%, 39.1%);
  width: 150px;
}

/*港区*/
.result .result-map div svg #minato text {
  transform: translate(48%, 57%);
}

.result .result-map div svg #minato rect {
  transform: translate(46.4%, 54%);
}

/*千葉----------------------------------------*/
/*花見川区*/
.result .result-map div svg #hanamigawa > text {
  transform: translate(67%, 66%);
}

.result .result-map div svg #hanamigawa > rect {
  transform: translate(65%, 63.3%);
  width: 150px;
}

/*柏市*/
.result .result-map div svg #kashiwa > text {
  transform: translate(40%, 27%);
}

.result .result-map div svg #kashiwa > rect {
  transform: translate(37.3%, 24.2%);
}

/*松戸市*/
.result .result-map div svg #matsudo > text {
  transform: translate(14%, 38%);
}

.result .result-map div svg #matsudo > rect {
  transform: translate(13%, 35.3%);
}

/*鎌ヶ谷市*/
.result .result-map div svg #kamagaya > text {
  transform: translate(35%, 44%);
  font-size: 25px;
}

.result .result-map div svg #kamagaya > rect {
  transform: translate(34.6%, 41.1%);
}

/*市川市*/
.result .result-map div svg #ichikawa > text {
  transform: translate(15%, 53%);
}

.result .result-map div svg #ichikawa > rect {
  transform: translate(13.8%, 50.2%);
}

/*浦安市*/
.result .result-map div svg #urayasu > text {
  transform: translate(6%, 75%);
}

.result .result-map div svg #urayasu > rect {
  transform: translate(5%, 72.1%);
}

/*船橋市*/
.result .result-map div svg #funabashi > text {
  transform: translate(41%, 55%);
}

.result .result-map div svg #funabashi > rect {
  transform: translate(40%, 52.5%);
}

/*美浜区*/
.result .result-map div svg #mihama > text {
  transform: translate(62%, 79%);
  font-size: 28px;
}

.result .result-map div svg #mihama > rect {
  transform: translate(61.1%, 76.4%);
  width: 100px;
}

/*習志野市*/
.result .result-map div svg #narashino > text {
  transform: translate(43.8%, 64.7%);
  font-size: 24px;
}

.result .result-map div svg #narashino > rect {
  transform: translate(43%, 62%);
  width: 111px;
}

/*稲毛区*/
.result .result-map div svg #inage > text {
  transform: translate(72%, 75%);
}

.result .result-map div svg #inage > rect {
  transform: translate(70.7%, 72.2%);
}

/*中央区*/
.result .result-map div svg #chuo > text {
  transform: translate(83%, 90%);
}

.result .result-map div svg #chuo > rect {
  transform: translate(82.2%, 87.3%);
}

/* ----------------------------------------------
　PC設定
------------------------------------------------*/
@media all and (min-width: 769px) {
  #contents .about .catch_row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: baseline;
    margin-bottom: var(--m40);
  }
  #contents .about .catch_row .emp {
    font-size: var(--s36_48);
    color: var(--red04);
    font-weight: 500;
  }
  #contents .about .catch_row .txt {
    font-size: var(--s22_40);
    font-weight: 300;
  }
  #contents .about .num_area {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    grid-gap: 1rem var(--m80);
    margin-bottom: var(--m40);
  }
  #contents .about .num_area .num_row {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #contents .about .num_area .num_row dt {
    font-size: var(--s18_32);
    color: #fff;
    padding: 0.15em 1em;
  }
  #contents .about .num_area .num_row dd {
    display: flex;
    align-items: baseline;
    font-size: var(--s22_40);
    font-weight: 300;
  }
  #contents .about .num_area .num_row dd .num {
    font-size: var(--m60);
    font-weight: 500;
  }
  #contents .about .num_area .num_row.results dt {
    background-color: var(--red04);
  }
  #contents .about .num_area .num_row.years dt {
    background-color: var(--green01);
  }
  #contents .about .text_area {
    margin-bottom: var(--m80);
    background-color: var(--brown01);
    padding: var(--s14_42) 4.5%;
  }
  #contents .about .text_area .tit {
    font-size: var(--s18_28);
    text-align: center;
    color: var(--brown04);
    padding-bottom: 0.5em;
    margin-bottom: 0.75em;
    border-bottom: 1px solid var(--brown04);
  }
  #contents .about .text_area .br {
    font-size: var(--s14_16);
    line-height: 1.75;
  }
  #contents .about .under_bar {
    font-size: var(--s22_40);
    font-weight: 500;
    text-align: center;
    position: relative;
    margin-bottom: var(--m80);
  }
  #contents .about .under_bar::before {
    content: "";
    display: inline-block;
    width: var(--m50);
    height: 5px;
    background-color: var(--brown04);
    position: absolute;
    bottom: -0.75rem;
    left: 50%;
    transform: translateX(-50%);
  }
  #contents .about .types_area {
    margin-bottom: var(--m100);
  }
  #contents .about .types_area .illust {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
  }
  #contents .about .types_area .illust .image {
    width: 25%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #contents .about .types_area .illust .image .inner {
    margin-bottom: 1rem;
    width: 140px;
    height: 150px;
    display: flex;
    align-items: flex-end;
  }
  #contents .about .types_area .illust .image figcaption .br {
    font-size: var(--s14_16);
    color: #fff;
    background-color: var(--green01);
    padding: 0.25em 1em;
    border-radius: 5px;
    text-align: center;
    margin-bottom: 0.25em;
  }
  #contents .about .types_area .illust .image figcaption span:not(.br) {
    font-size: var(--s14_18);
    text-align: center;
    display: block;
  }
  #contents .about .help_area {
    margin-bottom: var(--m100);
  }
  #contents .about .help_area .image_area {
    max-width: 950px;
    margin: 0 auto;
  }
  #contents .tilte_bar {
    font-size: var(--s20_32);
    color: #fff;
    font-weight: 500;
    text-align: center;
    background-color: var(--brown03);
    padding: 0.15em 1em;
    margin-bottom: var(--m50);
  }
  #contents .greeting {
    margin-bottom: var(--m50);
  }
  #contents .greeting .catch {
    font-size: var(--s20_32);
    color: var(--brown04);
    font-weight: 500;
    text-align: center;
    padding-bottom: 0.5em;
    margin-bottom: 1em;
    border-bottom: 1px solid var(--brown04);
  }
  #contents .greeting .sub_catch {
    font-size: var(--s16_24);
    color: var(--brown04);
    font-weight: 500;
    text-align: center;
    margin-bottom: var(--m50);
  }
  #contents .greeting .greeting_flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
  }
  #contents .greeting .greeting_flex .text_area {
    width: 71%;
  }
  #contents .greeting .greeting_flex .text_area .br {
    font-size: var(--s14_16);
    line-height: 2;
  }
  #contents .greeting .greeting_flex .img_area {
    width: 27%;
  }
  #contents .greeting .greeting_flex .img_area figcaption {
    display: flex;
    align-items: baseline;
    justify-content: center;
    grid-gap: 1rem;
    margin-top: 0.5rem;
    font-size: var(--s14_18);
  }
  #contents .greeting .greeting_flex .img_area figcaption .emp {
    font-size: var(--s20_28);
  }
  #contents .result {
    margin-bottom: var(--m150);
  }
  #contents .result .map_title {
    font-size: var(--s18_24);
    color: #fff;
    background-color: var(--brown02);
    border-radius: 10px;
    text-align: center;
    padding: 0.25em 2em;
    max-width: -moz-fit-content;
    max-width: fit-content;
    margin-left: 3%;
    margin-bottom: var(--m20);
  }
  #contents .result .tokyo-map {
    margin-bottom: var(--m30);
  }
  #contents .button_area {
    margin-bottom: var(--m90);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    grid-gap: var(--s16_24) var(--m50);
  }
  #contents .button_area .button {
    min-width: 330px;
  }
  #contents .button_area .button a img {
    position: absolute;
    top: 50%;
    left: 1rem;
    transform: translateY(-50%);
  }
  #contents .detail .result .tilte_bar {
    display: none;
  }
  #contents .detail_title {
    font-size: var(--s22_40);
    margin-bottom: 1em;
    text-align: center;
  }
  #contents .table_area {
    margin-bottom: var(--m50);
  }
  #contents .table_area table {
    border-collapse: collapse;
    width: 100%;
    white-space: nowrap;
  }
  #contents .table_area table td, #contents .table_area table th {
    border: 1px solid var(--gray04);
    padding: 0.5em 1em;
  }
  #contents .table_area table th {
    background-color: var(--brown03);
    color: #fff;
    font-weight: 500;
    font-size: 16px;
    text-align: center;
  }
  #contents .table_area table td {
    font-size: var(--s14_16);
  }
}
/* ----------------------------------------------
　PAD以下設定
------------------------------------------------*/
@media all and (max-width: 768px) {
  #contents .about .catch_row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: baseline;
    margin-bottom: var(--m40);
  }
  #contents .about .catch_row .emp {
    font-size: var(--s36_48);
    color: var(--red04);
    font-weight: 500;
  }
  #contents .about .catch_row .txt {
    font-size: var(--s22_40);
    font-weight: 300;
  }
  #contents .about .num_area {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    grid-gap: 1rem var(--m80);
    margin-bottom: var(--m40);
  }
  #contents .about .num_area .num_row {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #contents .about .num_area .num_row dt {
    font-size: var(--s18_32);
    color: #fff;
    padding: 0.15em 1em;
  }
  #contents .about .num_area .num_row dd {
    display: flex;
    align-items: baseline;
    font-size: var(--s22_40);
    font-weight: 300;
  }
  #contents .about .num_area .num_row dd .num {
    font-size: var(--m60);
    font-weight: 500;
  }
  #contents .about .num_area .num_row.results dt {
    background-color: var(--red04);
  }
  #contents .about .num_area .num_row.years dt {
    background-color: var(--green01);
  }
  #contents .about .text_area {
    margin-bottom: var(--m80);
    background-color: var(--brown01);
    padding: var(--s14_42) 4.5%;
  }
  #contents .about .text_area .tit {
    font-size: var(--s18_28);
    text-align: center;
    color: var(--brown04);
    padding-bottom: 0.5em;
    margin-bottom: 0.75em;
    border-bottom: 1px solid var(--brown04);
  }
  #contents .about .text_area .br {
    font-size: var(--s14_16);
    line-height: 1.75;
  }
  #contents .about .under_bar {
    font-size: var(--s22_40);
    font-weight: 500;
    text-align: center;
    position: relative;
    margin-bottom: var(--m80);
  }
  #contents .about .under_bar::before {
    content: "";
    display: inline-block;
    width: var(--m50);
    height: 5px;
    background-color: var(--brown04);
    position: absolute;
    bottom: -0.75rem;
    left: 50%;
    transform: translateX(-50%);
  }
  #contents .about .types_area {
    margin-bottom: var(--m100);
  }
  #contents .about .types_area .illust {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    grid-gap: 1rem 0;
  }
  #contents .about .types_area .illust .image {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #contents .about .types_area .illust .image .inner {
    margin-bottom: 1rem;
    width: 140px;
    height: 150px;
    display: flex;
    align-items: flex-end;
  }
  #contents .about .types_area .illust .image figcaption .br {
    font-size: var(--s14_16);
    color: #fff;
    background-color: var(--green01);
    padding: 0.25em 1em;
    border-radius: 5px;
    text-align: center;
    margin-bottom: 0.25em;
  }
  #contents .about .types_area .illust .image figcaption span:not(.br) {
    font-size: var(--s14_18);
    text-align: center;
    display: block;
  }
  #contents .about .help_area {
    margin-bottom: var(--m100);
  }
  #contents .about .help_area .image_area {
    max-width: 950px;
    margin: 0 auto;
  }
  #contents .tilte_bar {
    font-size: var(--s20_32);
    color: #fff;
    font-weight: 500;
    text-align: center;
    background-color: var(--brown03);
    padding: 0.15em 1em;
    margin-bottom: var(--m50);
  }
  #contents .greeting {
    margin-bottom: var(--m50);
  }
  #contents .greeting .catch {
    font-size: var(--s20_32);
    color: var(--brown04);
    font-weight: 500;
    text-align: center;
    padding-bottom: 0.5em;
    margin-bottom: 1em;
    border-bottom: 1px solid var(--brown04);
  }
  #contents .greeting .sub_catch {
    font-size: var(--s16_24);
    color: var(--brown04);
    font-weight: 500;
    text-align: center;
    margin-bottom: var(--m50);
  }
  #contents .greeting .greeting_flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    grid-gap: 1rem;
  }
  #contents .greeting .greeting_flex .text_area {
    width: 100%;
  }
  #contents .greeting .greeting_flex .text_area .br {
    font-size: var(--s14_16);
    line-height: 2;
  }
  #contents .greeting .greeting_flex .img_area {
    width: 100%;
    max-width: 300px;
  }
  #contents .greeting .greeting_flex .img_area figcaption {
    display: flex;
    align-items: baseline;
    justify-content: center;
    grid-gap: 1rem;
    margin-top: 0.5rem;
    font-size: var(--s14_18);
  }
  #contents .greeting .greeting_flex .img_area figcaption .emp {
    font-size: var(--s20_28);
  }
  #contents .result {
    margin-bottom: var(--m150);
  }
  #contents .result .sp_title {
    font-size: var(--s18_24);
    color: #fff;
    background-color: var(--brown02);
    border-radius: 10px;
    text-align: center;
    padding: 0.25em 2em;
    max-width: -moz-fit-content;
    max-width: fit-content;
    margin-bottom: var(--m20);
  }
  #contents .result .pad_under .results_div {
    background: rgba(255, 255, 255, 0.5);
  }
  #contents .result .pad_under .results_div.tokyo_results {
    margin-bottom: var(--s24_32);
  }
  #contents .result .pad_under .results_div > div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    text-align: center;
    grid-gap: var(--s8_16) 2%;
  }
  #contents .result .pad_under .results_div > div > p {
    width: 32%;
  }
  #contents .result .pad_under .results_div > div > p > a {
    display: block;
    padding: 0.5em 0.5em;
    border-radius: 5px;
    border: 1px var(--brown04) solid;
    background-color: var(--brown01);
    text-align: center;
  }
  #contents .result .pad_under .results_div > div > p > a.active {
    background-color: var(--green01);
  }
  #contents .result .pad_under .results_div > div > p > a.notactive {
    background-color: var(--gray04);
  }
  #contents .button_area {
    margin-bottom: var(--m90);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    grid-gap: var(--s16_24) var(--m50);
  }
  #contents .button_area .button {
    min-width: 330px;
  }
  #contents .button_area .button a img {
    position: absolute;
    top: 50%;
    left: 1rem;
    transform: translateY(-50%);
  }
  #contents .detail .result .tilte_bar {
    display: none;
  }
  #contents .detail_title {
    font-size: var(--s22_40);
    margin-bottom: 1em;
    text-align: center;
  }
  #contents .table_area {
    margin-bottom: var(--m50);
  }
  #contents .table_area table {
    border-collapse: collapse;
    width: 100%;
    white-space: nowrap;
  }
  #contents .table_area table td, #contents .table_area table th {
    border: 1px solid var(--gray04);
    padding: 0.5em 1em;
  }
  #contents .table_area table th {
    background-color: var(--brown03);
    color: #fff;
    font-weight: 500;
    font-size: 16px;
    text-align: center;
  }
  #contents .table_area table td {
    font-size: var(--s14_16);
  }
  }