@charset "UTF-8";

@media screen and (max-width: 768px) {
  .container {
    overflow-x: hidden;
  }
}

/* header
---------------------------------------------- */
.site-theme-black .contentMenu__bg {
  background: url(../imgs/img_kv.jpg) center/cover no-repeat;
}

@media screen and (max-width: 768px) {
  .site-theme-black .contentMenu__bg {
    background-image: url(../imgs/img_kv_sp.jpg);
  }
}


/* address
---------------------------------------------- */
.address {
  padding-top: 120px;
}

/* addressMap */
.addressMap {
  display: grid;
  grid-template-columns: calc(650 / 1400 * 100%) calc(600 / 1400 * 100%);
  column-gap: calc(150 / 1400 * 100%);
  margin-top: 100px;
}
.addressMap__copy {
  color: #fff;
}
.addressMap__copy + .addressMapBox__img {
  margin-top: 50px;
}

.addressMapBox01 {
  margin-top: -15%;
}
.addressMapBox01__img {
  width: calc(420 / 600 * 100%);
}
.addressMapBox01__img:first-child {
  margin-left: auto;
  margin-bottom: -18%;
  z-index: 1;
}

/* history */
.history {
  margin-top: clamp(60px, 2.23rem + 6.47vw, 160px);
}
.historyImg {
  max-width: 660px;
  margin-top: 100px;
  margin-inline: auto;
}
.historyWrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px calc(100 / 1200 * 100%);
  max-width: 1200px;
  color: #fff;
  margin-top: 100px;
  margin-inline: auto;
}
.historyBox__title {
  background-color: #948049;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.8;
  padding: 1em;
  text-align: center;
  position: relative;
  z-index: 0;
}
.historyBox__title::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, rgba(35, 24, 21, 0.4) 0%, rgba(255, 255, 255, 0) 49.98%, rgba(35, 24, 21, 0.4) 100%);
  z-index: 0;
}
.historyBox__title .em {
  display: block;
  font-size: 150%;
  line-height: 1.5;
}
.historyBox__title .text {
  position: relative;
  z-index: 2;
}
.historyBox__title .lineText {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5em;
}
.historyBox__title .lineText::before,
.historyBox__title .lineText::after {
  content: '';
  display: block;
  width: 1.2em;
  height: 1px;
  background-color: #fff;
}
.historyBox__text {
  margin-block: 2em 2.5em;
  text-align: center;
}
.historyBox__img:nth-child(1) {
  width: calc(340 / 550 * 100%);
}
.historyBox__img:nth-child(2) {
  width: calc(260 / 550 * 100%);
  margin-top: -20%;
  margin-left: auto;
}
* + .historyBox__name {
  margin-top: 1em;
}

@media screen and (max-width: 1200px) {
  .addressMapBox01 {
    margin-top: 0;
  }
}

@media screen and (min-width: 769px) {
  .address .sectionBox__img {
    width: calc(920 / 1400 * 100%);
  }

  .addressMapBox01 {
    grid-area: 1/2/2/3;
  }
  .addressMapBox02 {
    grid-area: 1/1/3/2;
  }
  .addressMapBox03 {
    align-self: flex-end;
  }
}

@media screen and (max-width: 768px) {
  .address {
    padding-top: 80px;
  }
  .address .sectionBox {
    width: 100%;
  }

  /* addressMap */
  .addressMap {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .addressMapBox01 {
    width: calc(320 / 375 * 100%);
    margin-inline: auto;
  }
  .addressMapBox01__img {
    width: 100%;
  }
  .addressMapBox01__img:first-child {
    margin-left: 0;
    margin-bottom: 0;
  }
  .addressMapBox01__img:last-child {
  }
  .addressMapBox01__img .p-caption {
    text-align: left;
  }

  .addressMapBox02 {
    width: calc(320 / 375 * 100%);
    margin-top: 50px;
    margin-inline: auto;
  }
  .addressMap__copy {
    text-align: center;
  }

  .addressMapBox03 {
    margin-top: 80px;
  }

  /* history */
  .historyImg {
    margin-top: 20px;
  }
  .historyWrap {
    grid-template-columns: 1fr;
    margin-top: 60px;
  }
  .historyBox__title {
    font-size: 12px;
  }
  .historyBox__text {
    margin-top: 1.5em;
  }
  * + .historyBox__name {
    margin-top: 0.5em;
  }
  .pageNote .small {
    font-size: 10px;
  }
}

/* environment
---------------------------------------------- */
.environment {
  padding-top: 120px;
}

/* envLocation */
.envLocation {
  max-width: 1300px;
  margin-top: 160px;
  display: grid;
  /* grid-template-columns: calc(560 / 1400 * 100%) calc(800 / 1400 * 100%); */
  grid-template-columns: calc(700 / 1300 * 100%) calc(500 / 1300 * 100%);
  column-gap: calc(100 / 1300 * 100%);
}
.envMapBody {
  color: #fff;
}
* + .envMapBody {
  margin-top: 25px;
}
.envLocation__name {
  line-height: 1.5;
  letter-spacing: 0.1em;
}
.envLocation__name .small {
  font-size: 50%;
  letter-spacing: 0.1em;
}
.envLocation__name .small--block {
  display: block;
}
.envLocation__text {
  letter-spacing: .1em;
  margin-top: 1em;
  text-align: justify;
}

.envLocationBox {
  /* grid-area: 1/2/2/3; */
  /* display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(40 / 800 * 100%); */
}

.envLocationColumn + .envLocationColumn,
.envLocationItem + .envLocationItem {
  border-top: 1px solid rgb(255 255 255 / .5);
  margin-top: 50px;
  padding-top: 50px;
}

/* rare */
.rare {
  margin-top: clamp(60px, 2.23rem + 6.47vw, 160px);
}

.rareItem {
  display: flex;
  align-items: center;
  gap: 20px calc(80 / 1000 * 100%);
  max-width: 1000px;
  margin-top: 80px;
  margin-inline: auto;
}
.rareItem + .rareItem {
  margin-top: 40px;
}

.rareItemHead {
  flex: 1;
}

.rareImg {
  width: calc(460 / 1000 * 100%);
}

.rareBox {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px calc(80 / 1000 * 100%);
  max-width: 1000px;
  margin-top: 100px;
  margin-inline: auto;
}

.rareImg:nth-child(2) .p-caption {
  top: 82.7%;
  bottom: auto;
  padding: 0;
}

@media screen and (min-width: 769px) {
  .environment .sectionBox__img {
    width: calc(1020 / 1400 * 100%);
  }

  .envMap__img {
    position: sticky;
    top: min(7vh, 100px);
  }

  .rareItem--reverse {
    flex-direction: row-reverse;
  }
  .rareItemHead .contentsBox__copy,
  .rareItemHead .contentsBox__text {
    text-align: left;
  }
}

@media screen and (max-width: 768px) {
  .environment {
    padding-top: 80px;
  }
  .envBox__img {
    width: 100%;
    margin-bottom: 80px;
  }

  /* envLocation */
  .envLocation {
    grid-template-columns: 1fr;
    row-gap: 40px;
    width: 100%;
    margin-top: 70px;
  }
  .envMap .envMapBody {
    width: calc(340 / 375 * 100%);
    margin-top: 30px;
    margin-inline: auto;
  }
  .envLocation__text {
    margin-top: 10px;
  }

  .envLocationBox {
    grid-area: revert;
    grid-template-columns: 1fr;
    width: calc(340 / 375 * 100%);
    row-gap: 40px;
    margin-inline: auto;
  }
  .envLocation__name .small--block {
    display: inline-block;
  }
  .envMapBody:not(.envLocationItem--noImg .envMapBody) {
    margin-top: 30px;
  }

  .rareItem {
    flex-direction: column;
    max-width: 400px;
    margin-top: 25px;
  }
  .rareItem + .rareItem {
    margin-top: 30px;
  }
  .rareItemHead .contentsBox__copy {
    margin-top: 0;
  }
  .rareImg {
    width: 100%;
  }

  .rareBox {
    grid-template-columns: 1fr;
    margin-top: 40px;
  }
}

/* plateau
---------------------------------------------- */
.plateau {
  padding-block: 120px 100px;
}

.plateau__img {
  margin-top: 100px;
  margin-inline: auto;
}

@media screen and (min-width: 769px) {
  .plateau .sectionBox__img {
    width: calc(900 / 1400 * 100%);
  }
}

@media screen and (max-width: 768px) {
  .plateau {
    padding-block: 70px 30px;
  }
  .plateau .sectionBox {
    row-gap: 50px;
    width: calc(340 / 375 * 100%);
  }

  .plateau__img {
    margin-top: 40px;
  }
}