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

@media screen and (max-width: 768px) {
  .gallerySect {
    margin-top: calc(70 / 390 * 100vw);
  }
}

.gallerySect__cont {
  margin-left: calc(50% - 50vw);
  width: 100vw;
}

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

@media screen and (max-width: 768px) {
  .gallerySect__cont {
    margin-top: calc(40 / 390 * 100vw);
  }
}

.introSect__head .headingCombi .heading--default {
  display: none;
}

.introSect__head .headingCombi .txt {
  margin-top: 0;
}

@media screen and (min-width: 768px) {
  .introSect__head .headingCombi .txt {
    font-size: 16px;
  }
}

@media screen and (max-width: 768px) {
  .introSect__head .headingCombi .txt {
    font-size: calc(14 / 390 * 100vw);
    text-align: center;
  }
}

.introSect__cont {
  margin: 0 auto;
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

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

@media screen and (max-width: 768px) {
  .introSect__cont {
    margin-top: calc(60 / 390 * 100vw);
    padding: 0 calc(20 / 390 * 100vw);
  }
}

.mapSect {
  position: relative;
  z-index: 1;
}

@media screen and (min-width: 768px) {
  .mapSect {
    margin-top: 120px;
    padding: 0 100px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect {
    margin-top: calc(70 / 390 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .mapSect__head .headingCombi .heading--default + .txt {
    font-size: calc(16 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .mapSect__cont {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 33px;
    margin-top: 80px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect__cont {
    margin-top: calc(40 / 390 * 100vw);
  }
}

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

.mapSect__data {
  letter-spacing: .05em;
}

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

@media screen and (max-width: 768px) {
  .mapSect__data {
    margin-top: calc(40 / 390 * 100vw);
    padding: 0 calc(20 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .mapSect__item + .mapSect__item {
    margin-top: 60px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect__item + .mapSect__item {
    margin-top: calc(30 / 390 * 100vw);
  }
}

.mapSect__item--exit .mapSect__ttl:before {
  border-radius: 50%;
}

.mapSect__item--exit .mapSect__ttl + .mapSect__txt {
  border-top: 1px solid #000000;
}

@media screen and (min-width: 768px) {
  .mapSect__item--exit .mapSect__ttl + .mapSect__txt {
    margin-top: 12px;
    padding-top: 12px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect__item--exit .mapSect__ttl + .mapSect__txt {
    margin-top: calc(12 / 390 * 100vw);
    padding-top: calc(12 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .mapSect__item--exit .mapSect__ttl + .mapSect__txt .large {
    font-size: 18px;
    padding-top: 4px;
  }
}

.mapSect__ttl {
  color: #736e35;
  position: relative;
}

@media screen and (min-width: 768px) {
  .mapSect__ttl {
    font-size: 16px;
    padding-left: 20px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect__ttl {
    font-size: calc(14 / 390 * 100vw);
    padding-left: calc(18 / 390 * 100vw);
  }
}

.mapSect__ttl:before {
  aspect-ratio: 1/1;
  background-color: #736e35;
  content: '';
  left: 0;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

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

@media screen and (max-width: 768px) {
  .mapSect__ttl:before {
    width: calc(14 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .mapSect__ttl + .mapSect__txt {
    margin-top: 12px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect__ttl + .mapSect__txt {
    margin-top: calc(6 / 390 * 100vw);
  }
}

.mapSect__txt {
  line-height: 1.8;
}

@media screen and (min-width: 768px) {
  .mapSect__txt {
    font-size: 14px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect__txt {
    font-size: calc(12 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .mapSect__txt .middle {
    font-size: 12px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect__txt .middle {
    font-size: calc(12 / 390 * 100vw);
  }
}

.mapSect__txt .large {
  line-height: 1.2;
}

@media screen and (min-width: 768px) {
  .mapSect__txt .large {
    font-size: 14px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect__txt .large {
    font-size: calc(16 / 390 * 100vw);
  }
}

.mapSect__txt + .caption {
  font-family: YakuHanJP, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: 10px;
}

@media screen and (min-width: 768px) {
  .mapSect__txt + .caption {
    margin-top: 10px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect__txt + .caption {
    margin-top: calc(8 / 390 * 100vw);
  }
}

.mapSect__bottom {
  margin: 0 auto;
}

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

@media screen and (max-width: 768px) {
  .mapSect__bottom {
    margin-top: calc(40 / 390 * 100vw);
  }
}

.mapSect__bottom .generalBtn--map {
  margin: 0 auto;
}

@media screen and (max-width: 768px) {
  .mapSect__bottom .generalBtn--map {
    width: calc(240 / 390 * 100vw);
  }
}

.mapSect__bottom .generalBtn--map .generalBtn__inner {
  letter-spacing: .05em;
}

@media screen and (min-width: 768px) {
  .mapSect__bottom .generalBtn--map .generalBtn__inner {
    margin-left: -5px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect__bottom .generalBtn--map .generalBtn__inner {
    margin-left: calc(-10 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .mapSect__bottom .generalBtn--map + .reserveBnr {
    margin-top: 120px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect__bottom .generalBtn--map + .reserveBnr {
    margin-top: calc(60 / 390 * 100vw);
    padding: 0 calc(20 / 390 * 100vw);
  }
}

.reserveBnr {
  margin: 0 auto;
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.reserveBnr__ttl, .reserveBnr__btn {
  left: 50%;
  position: absolute;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.reserveBnr__ttl {
  color: #ffffff;
  font-family: "Cinzel", serif;
}

@media screen and (min-width: 768px) {
  .reserveBnr__ttl {
    font-size: 20px;
    top: 60px;
  }
}

@media screen and (max-width: 768px) {
  .reserveBnr__ttl {
    font-size: calc(16 / 390 * 100vw);
    line-height: 1.4;
    text-align: center;
    top: calc(28 / 390 * 100vw);
    width: 100%;
  }
}

@media screen and (min-width: 768px) {
  .reserveBnr__btn {
    top: 110px;
  }
  .reserveBnr__btn .generalBtn {
    height: 60px;
    padding: 4px;
    width: 320px;
  }
}

@media screen and (max-width: 768px) {
  .reserveBnr__btn {
    top: calc(114 / 390 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .reserveBnr__btn .generalBtn--reserve {
    width: calc(240 / 390 * 100vw);
  }
}

.reserveBnr__btn .generalBtn--reserve .generalBtn__inner {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0;
  width: 100%;
}

@media screen and (max-width: 768px) {
  .reserveBnr__btn .generalBtn--reserve .generalBtn__inner {
    font-size: calc(16 / 390 * 100vw);
    letter-spacing: .1em;
  }
}

.reserveNotice {
  background-color: #f5f5f5;
  border: 4px solid #a91d1d;
}

@media screen and (min-width: 768px) {
  .reserveNotice {
    margin: 0 auto;
    max-width: 600px;
    padding: 40px 30px;
  }
}

@media screen and (max-width: 768px) {
  .reserveNotice {
    padding: 40px 20px;
    width: 100%;
  }
}

.reserveNotice__ttl {
  color: #a91d1d;
  font-size: 20px;
  font-weight: 600;
  text-align: center;
}

.reserveNotice__txt {
  color: #333333;
  font-size: 14px;
  margin-top: 27px;
}

@media screen and (min-width: 768px) {
  .reserveNotice__txt {
    text-align: center;
  }
}

@media screen and (max-width: 768px) {
  .reserveNotice__txt {
    text-align: left;
  }
}

.reserveTtl {
  font-family: "Noto Serif JP", serif;
  letter-spacing: .1em;
  margin: 0 auto;
  position: relative;
  text-align: center;
  width: 100%;
  z-index: 1;
}

@media screen and (min-width: 768px) {
  .reserveTtl {
    font-size: 32px;
  }
}

@media screen and (max-width: 768px) {
  .reserveTtl {
    font-size: calc(24 / 390 * 100vw);
  }
}

.reserveTtl .photo {
  margin: 0 auto;
}

@media screen and (min-width: 768px) {
  .reserveTtl .photo {
    padding-bottom: 24px;
  }
}

@media screen and (max-width: 768px) {
  .reserveTtl .photo {
    padding-bottom: calc(24 / 390 * 100vw);
    width: calc(160 / 390 * 100vw);
  }
}

.container {
  position: relative;
}

.container:before {
  background: url("../../common/imgs/bg-layer-01@2.jpg") no-repeat center top;
  content: '';
  height: 100%;
  position: absolute;
  width: 100vw;
  z-index: 0;
}

@media screen and (min-width: 768px) {
  .container .wrap {
    width: 1200px;
  }
}

@media screen and (min-width: 768px) {
  .reserveArea {
    padding: 120px 0;
  }
}

@media screen and (max-width: 768px) {
  .reserveArea {
    padding: 80px 0;
  }
}

.reserve-notice {
  position: relative;
  z-index: 1;
}

@media screen and (min-width: 768px) {
  .reserve-notice {
    margin-top: 120px;
  }
}

@media screen and (max-width: 768px) {
  .reserve-notice {
    margin-top: 80px;
  }
}

.reserve-reserve {
  background-color: rgba(255, 255, 255, 0.8);
  position: relative;
  z-index: 1;
}

@media screen and (min-width: 768px) {
  .reserve-reserve {
    margin-top: 80px;
    padding: 80px 0;
  }
}

@media screen and (max-width: 768px) {
  .reserve-reserve {
    margin-top: calc(80 / 390 * 100vw);
    padding: calc(60 / 390 * 100vw) 0;
  }
}
