@charset "utf-8";
.sttl {
  font-size: clamp(18px, 3.28vw, 21px);
  font-weight: 600;
  text-align: center;
  color: #fff;
  max-width: 479px;
  /* min-width: 262px; */
  margin: 0 auto;
  padding: 4px 15px;
  background: #00baa6;
  border-radius: 999.999px;
}

.sttl span {
  display: inline-block;
}
.heading2__ja {
  font-size: clamp(22px, 4.53vw, 29px);
}
.subContents__left {
  padding-bottom: 38px;
}
#jinzai {
  padding-top: 90px;
}
#jinzai .bk-ttl__heading {
  margin-bottom: 20px;
}
/* =================
map_menublk
==================== */
#map_menublk {
  padding: 112px 0 70px;
}
#map_menublk .map_menulist_sp {
  display: flex;
  flex-wrap: wrap;
}
#map_menublk .map_menulist_sp li {
  width: calc(100% / 3);
}
#map_menublk .map_menulist_sp li a {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 48px;
  padding: 5px;
}

#sorachi {
  background-color: #abdebb;
}
#ishikari {
  background-color: #d4eb9c;
}
#shiribeshi {
  background-color: #f8e39b;
}
#iburi {
  background-color: #f5f6a8;
}
#hidaka {
  background-color: #c1e9b2;
}
#oshima {
  background-color: #ffc1b1;
}
#hiyama {
  background-color: #fcd6bd;
}
#kamikawa {
  background-color: #ffbed7;
}
#rumoi {
  background-color: #ffd3ed;
}
#souya {
  background-color: #e6bbd7;
}
#okhotsk {
  background-color: #c3c9dc;
}
#tokachi {
  background-color: #beece5;
}
#kushiro {
  background-color: #aed9db;
}
#nemuro {
  background-color: #abc9ed;
}
.cls-1 {
  fill: #c1e9b2;
}

.cls-1,
.cls-2,
.cls-3,
.cls-4,
.cls-5,
.cls-6,
.cls-7,
.cls-8,
.cls-9,
.cls-10,
.cls-11,
.cls-12,
.cls-13,
.cls-14,
.cls-15,
.cls-16 {
  stroke-width: 0px;
}

.cls-2 {
  fill: #fcd6bd;
}

.cls-3 {
  fill: #f5f6a8;
}

.cls-4 {
  fill: #4d4d4d;
}

.cls-5 {
  fill: #c3c9dc;
}

.cls-6 {
  fill: #ffd3ed;
}

.cls-7 {
  fill: #222;
}

.cls-8 {
  fill: #abc9ed;
}

.cls-9 {
  fill: #e6bbd7;
}

.cls-10 {
  fill: #abdebb;
}

.cls-11 {
  fill: #aed9db;
}

.cls-12 {
  fill: #d4eb9c;
}

.cls-13 {
  fill: #ffbed7;
}

.cls-14 {
  fill: #ffc1b1;
}

.cls-15 {
  fill: #beece5;
}

.cls-16 {
  fill: #f8e39b;
}
.nolink {
  pointer-events: none;
}
.nolink:hover {
  opacity: 1;
}
.map_sp {
  display: none;
}
/* =================
area_blk
==================== */
#area_blk .areaList {
  width: 92%;
  margin: 0 auto;
  padding-top: 18px;
}
/* -------------
areaList__item
---------------- */
#area_blk .areaList__item {
  display: flex;
  justify-content: space-between;
  padding: 22px 0;
}
#area_blk .areaList__item:not(:last-child) {
  position: relative;
}
#area_blk .areaList__item:not(:last-child):after {
  content: "";
  width: 100%;
  height: 2px;
  display: block;
  background: linear-gradient(to left, #fff 0%, #fff 63%, #e6e6e6 60%, #e6e6e6 100%) repeat-x left bottom;
  background-size: 6px 2px;
  position: absolute;
  bottom: 0;
}
/* area_contents */
.area_contents {
  width: 240px;
}
.area_contents .area_name {
  font-size: 19px;
  font-weight: 600;
  line-height: 1.49;
}
.area_contents dl dt {
  font-size: 16px;
  font-weight: 600;
}
.area_contents dl dd {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.69;
  text-indent: -1em;
  padding-left: 1em;
}

.area_contents dl dd:before {
  content: "●";
  display: inline;
}
.area_contents dl dd a {
  display: inline;
  text-decoration: underline;
  word-break: break-all;
}

/* area_contact */
.area_contact {
  width: calc(98% - 240px);
  max-width: 377px;
}
.area_contact * {
  font-weight: 400;
}
.area_contact .area_contact_ttl {
  font-size: 11px;
  line-height: 1.84;
  color: #fff;
  display: inline-block;
  padding: 0 10px;
  margin-bottom: 10px;
  border-radius: 999.999px;
}
.area_contact .area_contact_sttl:before {
  content: "◎";
  display: inline;
}
.area_contact dl > div {
  display: flex;
}
.area_contact dl > .contact_tel,
.area_contact dl > .contact_fax {
  display: inline-flex;
}
.area_contact dl > .contact_tel {
  padding-right: 0.5em;
}

.area_contact dl dt {
  width: 3.5em;
}
.area_contact dl dt.wide {
  width: 4.7em;
}
.area_contact dl dt:after {
  content: "：";
}
.area_contact dl dd {
  line-height: 1.56;
  width: calc(100% - 3em);
}
.area_contact dl dd span {
  display: inline-block;
}
.area_contact dl dd .postcode {
  padding-right: 1em;
}
.area_contact dl:not(:last-child) {
  margin-bottom: 10px;
}
.cl_1,
#sorachi_list .area_contents dl dd:before {
  color: #31cdbb;
}
.cl_2,
#ishikari_list .area_contents dl dd:before {
  color: #6cd685;
}
.cl_3,
#shiribeshi_list .area_contents dl dd:before {
  color: #ff882f;
}
.cl_4,
#iburi_list .area_contact .area_contact_sttl:before,
#iburi_list .area_contents dl dd:before {
  color: #ecb760;
}
.cl_5,
#hidaka_list .area_contents dl dd:before {
  color: #54d3a5;
}
.cl_6,
#oshima_list .area_contents dl dd:before {
  color: #ff7284;
}
.cl_7,
#hiyama_list .area_contents dl dd:before {
  color: #f583ae;
}
.cl_8,
#kamikawa_list .area_contents dl dd:before {
  color: #c86d88;
}
.cl_9,
#rumoi_list .area_contents dl dd:before {
  color: #ff8aa1;
}
.cl_10,
#souya_list .area_contents dl dd:before {
  color: #da73bc;
}
.cl_11,
#okhotsk_list .area_contents dl dd:before {
  color: #239ec9;
}
.cl_12,
#tokachi_list .area_contents dl dd:before {
  color: #439855;
}
.cl_13,
#kushiro_list .area_contents dl dd:before {
  color: #697b5f;
}
.cl_14,
#nemuro_list .area_contents dl dd:before {
  color: #028ba3;
}

.bgcl_1 {
  background-color: #31cdbb;
}
.bgcl_2 {
  background-color: #6cd685;
}
.bgcl_3 {
  background-color: #ff882f;
}
.bgcl_4 {
  background-color: #ecb760;
}
.bgcl_5 {
  background-color: #54d3a5;
}
.bgcl_6 {
  background-color: #ff7284;
}
.bgcl_7 {
  background-color: #f583ae;
}
.bgcl_8 {
  background-color: #c86d88;
}
.bgcl_9 {
  background-color: #ff8aa1;
}
.bgcl_10 {
  background-color: #da73bc;
}
.bgcl_11 {
  background-color: #239ec9;
}
.bgcl_12 {
  background-color: #439855;
}
.bgcl_13 {
  background-color: #697b5f;
}
.bgcl_14 {
  background-color: #028ba3;
}

@media screen and (max-width: 1440px) {
}

@media screen and (max-width: 768px) {
  .map_pc {
    display: none;
  }
  .map_sp {
    display: block;
  }
  #map_menublk {
    padding: 9% 0;
  }
  #map_menublk .map_blk {
    padding-bottom: 4%;
  }
  #area_blk .areaList__item {
    flex-direction: column;
  }
  .area_contents {
    width: 100%;
    margin-bottom: 20px;
  }
  .area_contact {
    width: 100%;
  }
}
@media screen and (max-width: 650px) {
}
@media screen and (max-width: 640px) {
  .subContents__left {
    padding: 2.5%;
  }
}

@media screen and (max-width: 540px) {
}
@media screen and (max-width: 420px) {
}
@media screen and (max-width: 375px) {
}
