.page-floormap {
  padding-block: 3rem 5.7rem;
}
@media (min-width: 768px) {
  .page-floormap {
    padding-block: 4.5rem 13.6rem;
  }
}

@media (min-width: 768px) {
  .hline01 {
    margin-bottom: 5rem;
  }
}

.hline01__ttl {
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .hline01__ttl {
    font-size: 3.2rem;
  }
}

.p-inner {
  max-width: 106rem;
  width: 100%;
  margin-inline: auto;
  padding-inline: 3rem;
}

.p-head {
  margin-bottom: 3.8rem;
}
@media (min-width: 768px) {
  .p-head {
    max-width: 78.4rem;
    width: 100%;
    margin-inline: auto;
    margin-bottom: 5rem;
  }
}
.p-head__btns {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (min-width: 768px) {
  .p-head__btns {
    gap: 2.55%;
    flex-direction: row;
  }
}

.p-tabs {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1.2rem 0.7rem;
  margin-bottom: 1.4rem;
}
@media (min-width: 768px) {
  .p-tabs {
    gap: 2rem;
    margin-bottom: 2rem;
  }
}
.p-tabs__item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc((100% - 1.4rem) / 3);
  min-height: 5.2rem;
  border-radius: 0.3rem;
  border: 1px solid currentColor;
  color: #1F2446;
  font-size: 2rem;
  font-family: var(--font-num);
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.022em;
}
.p-tabs__item.is-active {
  color: #FFF;
  background-color: var(--color-primary);
}
@media (min-width: 768px) {
  .p-tabs__item {
    flex: 1;
    width: auto;
    min-height: 4rem;
    font-size: 1.6rem;
    cursor: pointer;
  }
}

.p-btn-01 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 4.5rem;
  padding-block: 0.5rem;
  padding-inline: 2rem;
  border: 1px solid var(--color-primary);
  border-radius: 0.3rem;
  line-height: 1.4285714286;
  font-size: 1.4rem;
  font-weight: 500;
}
@media (min-width: 768px) {
  .p-btn-01 {
    gap: 1rem;
    justify-content: center;
    min-height: 4rem;
    padding-inline: 2.2rem;
    line-height: 1.5;
    font-size: 1.4rem;
    transition: 0.3s ease all;
  }
  .p-btn-01:hover {
    background-color: var(--color-primary);
    color: #FFF;
  }
  .p-btn-01:hover::after {
    background-color: #FFF;
  }
}
@media (min-width: 992px) {
  .p-btn-01 {
    font-size: 1.6rem;
  }
}
.p-btn-01::after {
  position: relative;
  top: 0.1rem;
  display: block;
  width: 1.5rem;
  height: 1.4rem;
  background-color: var(--color-primary);
  -webkit-mask: url("../img/floormap/icon_blank.svg") no-repeat center;
  mask: url("../img/floormap/icon_blank.svg") no-repeat center;
  -webkit-mask-size: 1.5rem 1.4rem;
  mask-size: 1.5rem 1.4rem;
  transition: 0.3s ease background-color;
  content: "";
}
@media (min-width: 768px) {
  .p-btn-01.--style-1 {
    width: 43.88%;
  }
}
@media (min-width: 768px) {
  .p-btn-01.--style-2 {
    width: 53.57%;
  }
}

.p-hline {
  margin-bottom: 2rem;
  text-align: center;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.75;
}
@media (min-width: 768px) {
  .p-hline {
    margin-bottom: 3rem;
    font-size: 2.2rem;
    line-height: 1.4545454545;
  }
}

.p-map__content {
  position: relative;
  width: 100%;
  aspect-ratio: 33/40;
  height: auto;
  margin-bottom: 2.3rem;
  border-radius: 0.4rem;
  overflow: hidden;
  background-color: #EDEDED;
}
@media (min-width: 576px) {
  .p-map__content {
    aspect-ratio: 1000/705;
  }
}
@media (min-width: 768px) {
  .p-map__content {
    margin-bottom: 5.8rem;
  }
}
.p-map__floor {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transition: 0.2s opacity ease;
  overflow: hidden;
  display: none;
}
.p-map__floor.is-active {
  display: block;
}
.p-map__viewport {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  touch-action: none;
}
.p-map__viewport svg {
  width: 56rem;
  height: auto;
  margin-inline: 0;
}
@media (min-width: 576px) {
  .p-map__viewport svg {
    width: 100%;
    margin-inline: auto;
  }
}
.p-map__num {
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 5.8rem;
  height: 5.8rem;
  background-color: #1F2446;
  color: #FFF;
  font-size: 2.4rem;
  font-family: var(--font-num);
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.022em;
}
@media (max-width: 767px) {
  .p-map__num {
    display: none;
  }
}
.p-map__control {
  position: absolute;
  right: 1.4rem;
  bottom: 2rem;
  width: 3rem;
  height: 6rem;
  display: flex;
  flex-direction: column;
  border-radius: 0.3rem;
  overflow: hidden;
}
@media (min-width: 768px) {
  .p-map__control {
    right: 3rem;
    bottom: 3rem;
    width: 4.5rem;
    height: 9rem;
    border-radius: 0.4rem;
    cursor: pointer;
  }
}
.p-map__zoom-in {
  width: 100%;
  height: 50%;
  background: #004480 url("../img/floormap/icon_plus.svg") no-repeat center;
  background-size: 1.5rem auto;
}
@media (min-width: 768px) {
  .p-map__zoom-in {
    background-size: 2.2rem auto;
    transition: 0.3s opacity ease;
  }
  .p-map__zoom-in:hover {
    opacity: 0.8;
  }
}
.p-map__zoom-out {
  width: 100%;
  height: 50%;
  background: #3196C9 url("../img/floormap/icon_minus.svg") no-repeat center;
  background-size: 1.5rem auto;
}
@media (min-width: 768px) {
  .p-map__zoom-out {
    background-size: 2.2rem auto;
    transition: 0.3s opacity ease;
  }
  .p-map__zoom-out:hover {
    opacity: 0.8;
  }
}
.p-map .p-info-1 {
  margin-bottom: 1rem;
}
@media (min-width: 768px) {
  .p-map .p-info-1 {
    margin-bottom: 2.3rem;
  }
}
.p-map svg * {
  pointer-events: none;
}
.p-map svg .js-store {
  pointer-events: all;
}
.p-map svg .js-store text,
.p-map svg .js-store tspan {
  pointer-events: none;
}

.p-product-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  margin-bottom: 5.5rem;
  display: none;
}
.p-product-list.is-active {
  display: grid;
}
@media (min-width: 768px) {
  .p-product-list {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 4rem;
    margin-bottom: 6rem;
  }
}

.p-product {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .p-product {
    transition: 0.3s ease opacity;
  }
  .p-product:hover {
    opacity: 0.8;
  }
}
.p-product__image {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 1/1;
  overflow: hidden;
  margin-bottom: 1rem;
  border: 1px solid #e6e6e6;
  background-color: #FFF;
}
@media (min-width: 768px) {
  .p-product__image {
    margin-bottom: 2rem;
  }
}
.p-product__image img {
  display: block;
  -o-object-fit: contain;
  object-fit: contain;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
}
.p-product__floor {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4rem;
  min-height: 2rem;
  margin-bottom: 1rem;
  padding: 0.5rem;
  background-color: #89B6C4;
  line-height: 1;
  font-size: 1.2rem;
  font-weight: 500;
}
@media (min-width: 768px) {
  .p-product__floor {
    min-width: 5.7rem;
    margin-bottom: 1.5rem;
    font-size: 1.6rem;
  }
}
.p-product__floor.--tower-other {
  background-color: #BC3933;
  color: #FFF;
}
.p-product__ttl {
  margin-bottom: 0.5rem;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.4285714286;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
@media (min-width: 768px) {
  .p-product__ttl {
    margin-bottom: 1rem;
    font-size: 1.8rem;
    line-height: 1.5555555556;
  }
}
.p-product__sub {
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1.4166666667;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
@media (min-width: 768px) {
  .p-product__sub {
    font-size: 1.4rem;
    line-height: 1.4285714286;
  }
}

.p-info-1 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 1.3rem;
  margin-bottom: 1.4rem;
}
@media (min-width: 768px) {
  .p-info-1 {
    gap: 1rem;
  }
}
.p-info-1__item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: 1rem;
  line-height: 1.3;
  font-weight: 500;
}
@media (min-width: 768px) {
  .p-info-1__item {
    gap: 1.5rem;
    font-size: 1.6rem;
  }
}
.p-info-1__item::before {
  position: relative;
  display: block;
  width: 1.5rem;
  height: 1.5rem;
  content: "";
}
@media (min-width: 768px) {
  .p-info-1__item::before {
    width: 2rem;
    height: 2rem;
  }
}
.p-info-1__item.item-01::before {
  background-color: #004480;
}
@media (max-width: 767px) {
  .p-info-1__item.item-01 {
    width: 56%;
    padding-right: 0.5rem;
  }
}
.p-info-1__item.item-02::before {
  background-color: #7FB5C3;
}
@media (max-width: 767px) {
  .p-info-1__item.item-02 {
    width: 44%;
  }
}
.p-info-1__item.item-03::before {
  background-color: #3196C9;
}
@media (max-width: 767px) {
  .p-info-1__item.item-03 {
    width: 56%;
    padding-right: 0.5rem;
  }
}
.p-info-1__item.item-04::before {
  background-color: #7AA775;
}
@media (max-width: 767px) {
  .p-info-1__item.item-04 {
    width: 44%;
  }
}

.p-info-2 {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.9rem;
  -moz-column-gap: 1.3rem;
  column-gap: 1.3rem;
  margin-bottom: 6rem;
}
@media (min-width: 768px) {
  .p-info-2 {
    row-gap: 1rem;
    -moz-column-gap: 3rem;
    column-gap: 3rem;
    margin-bottom: 8.5rem;
  }
}
.p-info-2__item {
  position: relative;
  display: flex;
  align-items: center;
  -moz-column-gap: 0.5rem;
  column-gap: 0.5rem;
  font-size: 1rem;
  line-height: 1.3;
  font-weight: 500;
}
@media (min-width: 768px) {
  .p-info-2__item {
    -moz-column-gap: 0.5rem;
    column-gap: 0.5rem;
    font-size: 1.6rem;
  }
}
.p-info-2__item::before {
  position: relative;
  display: block;
  width: 2rem;
  height: 2rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 2rem auto;
  content: "";
}
@media (min-width: 768px) {
  .p-info-2__item::before {
    top: -0.2rem;
    width: 3rem;
    height: 3rem;
    background-size: 3rem auto;
  }
}
.p-info-2__item.item-01::before {
  background-image: url("../img/floormap/icon_01.svg");
}
.p-info-2__item.item-02::before {
  background-image: url("../img/floormap/icon_02.svg");
}
.p-info-2__item.item-03::before {
  background-image: url("../img/floormap/icon_03.svg");
}
.p-info-2__item.item-04::before {
  background-image: url("../img/floormap/icon_04.svg");
}
.p-info-2__item.item-05::before {
  background-image: url("../img/floormap/icon_05.svg");
}
.p-info-2__item.item-06::before {
  background-image: url("../img/floormap/icon_06.svg");
}
.p-info-2__item.item-07::before {
  background-image: url("../img/floormap/icon_07.svg");
}
.p-info-2__item.item-08::before {
  background-image: url("../img/floormap/icon_08.svg");
}
.p-info-2__item.item-09::before {
  background-image: url("../img/floormap/icon_09.svg");
}

.p-tower__image {
  width: 100%;
  margin-inline: auto;
  margin-bottom: 2.8rem;
  aspect-ratio: 330/335;
}
@media (min-width: 768px) {
  .p-tower__image {
    max-width: 93.4rem;
    margin-bottom: 6.5rem;
  }
}
.p-tower__image img {
  display: block;
  width: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

.p-store {
  display: flex;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 45rem;
  margin-inline: auto;
  margin-bottom: 6rem;
  padding: 2.4rem 4rem 2.4rem 2.5rem;
  border: 1px solid #DEDEDE;
  background-color: #FFF;
  opacity: 0;
  pointer-events: none;
}
.p-store.is-active {
  opacity: 1;
}
@media (max-width: 767px) {
  .p-store {
    display: none;
  }
}
.p-store__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 11rem;
  aspect-ratio: 1/1;
  overflow: hidden;
}
.p-store__logo img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}
.p-store__content {
  display: flex;
  flex-direction: column;
  align-items: baseline;
  justify-content: center;
  width: calc(100% - 11rem);
  padding-left: 2.5rem;
}
.p-store__name {
  margin-bottom: 0.6rem;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.4;
  min-width: 0;
}
.p-store__ttl {
  margin-bottom: 1rem;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.5833333333;
  min-width: 0;
}
.p-store__floor {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 5.7rem;
  min-height: 2rem;
  padding: 0.5rem;
  background-color: #89B6C4;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1;
}
.p-store__floor.--tower-other {
  background-color: #BC3933;
  color: #FFF;
}