.currentMapSect__head .pageTtl {
  gap: 12px;
}

@media screen and (min-width: 768px) {
  .currentMapSect__head .pageTtl {
    padding-bottom: 80px;
  }
}

@media screen and (max-width: 768px) {
  .currentMapSect__head .pageTtl {
    padding-bottom: 40px;
  }
}

.currentMapSect__head .pageTtl .en {
  font-weight: 400;
}

@media screen and (min-width: 768px) {
  .currentMapSect__head .pageTtl .en {
    font-size: 40px;
  }
}

@media screen and (max-width: 768px) {
  .currentMapSect__head .pageTtl .en {
    font-size: 32px;
  }
}

@media screen and (min-width: 768px) {
  .currentMapSect__cont {
    margin: 0 auto;
    width: 998px;
  }
}

@media screen and (max-width: 768px) {
  .currentMapSect__cont {
    margin: 0 -32px;
  }
}

@media screen and (min-width: 768px) {
  .currentMapSect__cont + .currentMapSect__bottom {
    margin-top: 80px;
  }
}

@media screen and (max-width: 768px) {
  .currentMapSect__cont + .currentMapSect__bottom {
    margin-top: 40px;
  }
}

.currentMapSect__bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.mapTab {
  margin: 0 auto;
}

@media screen and (min-width: 768px) {
  .mapTab {
    width: 998px;
  }
}

.mapTab__head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media screen and (min-width: 768px) {
  .mapTab__head {
    gap: 16px;
  }
}

.mapTab__btn {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #f4f3ef;
  border: 1px solid #ccc9c2;
  color: #7d6628;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-family: "Zen Kaku Gothic New", sans-serif;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  letter-spacing: .05em;
  position: relative;
  -webkit-transition: background .3s ease, color .3s ease;
  transition: background .3s ease, color .3s ease;
}

@media screen and (min-width: 768px) {
  .mapTab__btn {
    height: 64px;
    width: 322px;
  }
}

@media screen and (max-width: 768px) {
  .mapTab__btn {
    font-size: 12px;
    height: 64px;
    text-align: center;
    width: calc(1/ 2 * 100vw);
  }
}

.mapTab__btn:before {
  background: #0d0d0c;
  bottom: -8px;
  -webkit-clip-path: inset(0 100% 0 0);
          clip-path: inset(0 100% 0 0);
  content: '';
  height: 3px;
  left: 0;
  position: absolute;
  -webkit-transition: background .3s ease, -webkit-clip-path .5s ease;
  transition: background .3s ease, -webkit-clip-path .5s ease;
  transition: background .3s ease, clip-path .5s ease;
  transition: background .3s ease, clip-path .5s ease, -webkit-clip-path .5s ease;
  width: 100%;
}

.mapTab__btn:hover, .mapTab__btn.is-active {
  background: #0d0d0c;
  color: #ffffff;
  -webkit-transition: background .3s ease, color .3s ease;
  transition: background .3s ease, color .3s ease;
}

.mapTab__btn:hover:before, .mapTab__btn.is-active:before {
  -webkit-clip-path: inset(0 0 0 0);
          clip-path: inset(0 0 0 0);
}

.mapTab__btn.is-active {
  pointer-events: none;
}

@media screen and (min-width: 768px) {
  .mapTab__cont {
    margin-top: 28px;
  }
}

@media screen and (max-width: 768px) {
  .mapTab__cont {
    margin-top: 16px;
  }
}

.mapTab__item {
  display: none;
}

.mapTab__item.is-active {
  display: block;
}

.mapTab__item .zoomFigure__btn {
  background: #262521;
}

.mapTab__item .zoomFigure__btn .btnSVG path {
  fill: #ffffff;
}

@media screen and (min-width: 768px) {
  .map-current {
    padding-bottom: 180px;
  }
}

@media screen and (max-width: 768px) {
  .map-current {
    padding-bottom: 120px;
  }
}