@charset "utf-8";
/* map page
 * ========================================================================== */
.mapArea {
  margin: auto;
  width: 90%;
  max-width: 1240px;
}
.mapArea .pageTtl {
  padding: 180px 5% 30px;
  color: #AA8C5B;
  font-size: 100px;
  font-weight: 100;
  text-align: center;
  line-height: 1;
}
.mapArea .btnWrap {
  margin: 100px 0 200px;
  display: flex;
  justify-content: center;
  gap: 40px;
}
.mapArea .c-btn02 {
  --btn-arrow: 36px;
  width: 400px;
  height: 78px;
  margin: 0;
}
.mapArea .c-btn02 > a {
  padding: 0 40px 0 50px;
  border-radius: 78px;
  background: var(--color-gold);
}
.mapArea .c-btn02 > a .c-btn__txt {
  padding-top: 2px;
  font-size: 18px;
  font-weight: 300;
  letter-spacing: 0;
  color: var(--color-white);
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  letter-spacing: 1px;
}
.mapArea .c-btn02 > a .c-arrow::before,
.mapArea .c-btn02 > a .c-arrow::after {
    background: #fff;
}
.mapArea .c-btn02 > a:hover .c-arrow {
  --arrow: 4px;
  left: 45px;
}
.mapArea .btn-pdf {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 400px;
  height: 78px;
}
.mapArea .btn-pdf a {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 0 70px 0 100px;
  width: 100%;
  height: 100%;
  border-radius: 50px;
  background: var(--color-darkgray);
  color: #fff;
  transition: background 0.2s;
}
.mapArea .btn-pdf a .c-btn__txt {
  padding-top: 2px;
  font-size: 18px;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  font-weight: 300;
  letter-spacing: 3px;
}
.mapArea .btn-pdf a::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 40px;
  margin: auto;
  width: 19px;
  height: 17px;
  background: url(../../roomplan/img/ico_pdf.png) no-repeat center / contain;
  content: "";
}
.mapArea .btn-pdf a:hover {
  background: var(--color-lightgray);
}
/* @media
 * ========================================================================== */
@media screen and (max-width: 1024px) {
  .mapArea .btnWrap li {
    width: 50%;
  }
  .mapArea .c-btn02,
  .mapArea .btn-pdf {
    width: 100%;
    height: 70px;
  } 
  .mapArea .c-btn02 > a .c-btn__txt,
  .mapArea .btn-pdf a .c-btn__txt {
    font-size: 16px;
  }
}
@media screen and (max-width: 800px) {
  .mapArea .btnWrap {
    gap: 20px;
  }
  .mapArea .c-btn02 > a .c-btn__txt,
  .mapArea .btn-pdf a .c-btn__txt {
    font-size: 12px;
  }
}
@media screen and (max-width: 619px) {
  .mapArea .pageTtl {
    padding: 120px 5% 20px;
    font-size: 50px;
  }
  .mapArea .btnWrap {
    margin: 50px auto 100px;
    width: 90%;
    display: block;
  }
  .mapArea .btnWrap li {
    margin-bottom: 20px;
    width: 100%;
  }
  .mapArea .c-btn02,
  .mapArea .btn-pdf {
    height: 65px;
  } 
  .mapArea .c-btn02 > a,
  .mapArea .btn-pdf > a {
    padding: 0 40px 0 60px;
  }
  .mapArea .c-btn02 > a .c-btn__txt {
    font-size: 16px;
  }
  .mapArea .btn-pdf a .c-btn__txt {
    font-size: 16px;
  }
  .mapArea .c-btn02 > a:hover .c-arrow {
    left: 38px;
  }
  .mapArea .btn-pdf a::before {
    left: 30px;
  }
}
@media screen and (max-width: 320px) {}


@media print {
  header,
  footer,
  #cv,
  .mapArea .btnWrap {
    display: none;
  }
  .mapArea .pageTtl {
    padding: 100px 0 30px;
    font-size: 60px;
  }
}