.pre-inc main {
  overflow: hidden;
}
.pre-inc main #main {
  position: relative;
}
.pre-inc main #main::before {
  position: absolute;
  content: "";
  background-image: url(../img/design/kazari05.webp);
  background-size: contain;
  background-repeat: no-repeat;
  top: 0;
  left: 0;
  display: block;
  width: 30%;
  max-width: 449px;
  height: auto;
  aspect-ratio: 1/2;
  z-index: 1;
}
.pre-inc main #main::after {
  position: absolute;
  content: "";
  background-image: url(../img/design/kazari05.webp);
  background-size: contain;
  background-repeat: no-repeat;
  bottom: 20%;
  right: 0;
  display: block;
  width: 30%;
  max-width: 449px;
  height: auto;
  aspect-ratio: 1/2;
  z-index: 1;
  transform: rotate(-180deg);
}
.pre-inc main #main .main-area {
  position: relative;
  background: url(../img/design/bg01.webp) center center/contain repeat, #796863;
}
.pre-inc main #main .main-area .block {
  width: 100%;
  max-width: 1280px;
  margin: auto;
  padding: 5rem 0;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .pre-inc main #main .main-area .block {
    padding: 3rem 0;
  }
}
.pre-inc main #main .main-area .block h1 {
  font-size: min(9vw, 64px);
  color: #fff;
  margin: 0 auto 1em;
}
@media screen and (max-width: 768px) {
  .pre-inc main #main .main-area .block h1 {
    width: 100%;
    display: flex;
    justify-content: center;
    grid-column-start: 1;
    grid-row-start: 1;
    padding-left: 1rem;
  }
}
.pre-inc main #main .main-area .block p {
  font-size: min(3.6vw, 18px);
  color: #fff;
  line-height: 2.6;
  grid-column-start: 2;
  width: 100%;
  padding-bottom: 2em;
}
@media screen and (max-width: 768px) {
  .pre-inc main #main .main-area .block p {
    width: calc(100% - 8em);
    grid-column-start: 1;
    grid-row-start: 2;
    line-height: 2.2;
    padding-bottom: 0;
    margin: auto;
    z-index: 10;
    padding-left: 1rem;
  }
}
.pre-inc main #main .main-area .block p .p-note {
  display: block;
  font-size: min(2.4svw, 12px);
  line-height: 2;
  padding: 2rem 0 0;
}
.pre-inc main #main .main-area .cap {
  position: absolute;
  bottom: 0;
  right: 0;
  font-size: min(2.4vw, 12px);
  padding: 1em;
  color: #fff;
  /*text-shadow: 0 0 10px rgba(0,0,0,0.7),0 0 10px rgba(0,0,0,0.7),0 0 10px rgba(0,0,0,0.7);*/
}
.pre-inc main #main .title-area {
  background: rgb(192, 162, 99);
  background: linear-gradient(90deg, rgb(192, 162, 99) 0%, rgb(233, 215, 179) 50%, rgb(224, 203, 161) 60%, rgb(201, 174, 117) 90%, rgb(192, 162, 99) 100%);
}
.pre-inc main #main .title-area h2 {
  text-align: center;
  font-size: 42px;
  font-weight: normal;
  padding: 1.5em 0 min(1vw, 1.5rem);
}
@media screen and (max-width: 768px) {
  .pre-inc main #main .title-area h2 {
    font-size: 6vw;
    padding: 1em 0 min(1vw, 1rem);
  }
}
.pre-inc main #main .title-area .text-box {
  text-align: center;
  padding-bottom: 4.5em;
}
@media screen and (max-width: 768px) {
  .pre-inc main #main .title-area .text-box {
    padding-bottom: 2.5em;
  }
}
.pre-inc main #main .title-area .text-box p {
  font-size: min(5.2vw, 36px);
  line-height: 1.6;
}
.pre-inc main #contents .sec01,
.pre-inc main #contents .sec02 {
  padding: 100px 0;
  position: relative;
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec01,
  .pre-inc main #contents .sec02 {
    padding: 30px 0;
  }
}
.pre-inc main #contents .sec01 h2,
.pre-inc main #contents .sec02 h2 {
  font-size: 64px;
  text-align: center;
  color: #E0D0AC;
  margin: 0 0 1em;
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec01 h2,
  .pre-inc main #contents .sec02 h2 {
    font-size: 6vw;
  }
}
.pre-inc main #contents .sec01 h3,
.pre-inc main #contents .sec02 h3 {
  text-align: center;
  font-size: 40px;
  color: #E0D0AC;
  margin: 0 auto 1em;
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec01 h3,
  .pre-inc main #contents .sec02 h3 {
    font-size: 5vw;
  }
}
.pre-inc main #contents .sec01 .txt,
.pre-inc main #contents .sec02 .txt {
  text-align: center;
  font-size: min(3.6vw, 18px);
  margin: 0 0 min(5vw, 5em);
  padding: 0 2rem;
  color: #fff;
  line-height: 2.6;
}
.pre-inc main #contents .sec01 .inner,
.pre-inc main #contents .sec02 .inner {
  position: relative;
  max-width: 1280px;
  width: 95%;
  margin: 0 auto;
}
.pre-inc main #contents .sec01 .inner .kazari06,
.pre-inc main #contents .sec02 .inner .kazari06 {
  max-width: 399px;
  width: 30%;
  position: absolute;
  top: -20vh;
  right: -8vw;
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec01 .inner .kazari06,
  .pre-inc main #contents .sec02 .inner .kazari06 {
    top: -10vh;
  }
}
.pre-inc main #contents .sec01 .inner .kazari03,
.pre-inc main #contents .sec02 .inner .kazari03 {
  max-width: 399px;
  width: 30%;
  position: absolute;
  top: -8%;
  left: -5%;
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec01 .inner .kazari03,
  .pre-inc main #contents .sec02 .inner .kazari03 {
    top: -5%;
    right: -15%;
  }
}
.pre-inc main #contents .sec01 .inner .kazari07,
.pre-inc main #contents .sec02 .inner .kazari07 {
  max-width: 420px;
  width: 35%;
  position: absolute;
  bottom: -6%;
  left: -7%;
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec01 .inner .kazari07,
  .pre-inc main #contents .sec02 .inner .kazari07 {
    bottom: -3%;
    left: -6%;
    width: 40%;
  }
}
.pre-inc main #contents .sec01 figure,
.pre-inc main #contents .sec02 figure {
  position: relative;
}
.pre-inc main #contents .sec01 figure img,
.pre-inc main #contents .sec02 figure img {
  position: relative;
}
.pre-inc main #contents .sec01 figure figcaption,
.pre-inc main #contents .sec02 figure figcaption {
  position: absolute;
  font-size: min(2.4vw, 12px);
  color: #fff;
  bottom: 0.5em;
  right: 0.5em;
}
.pre-inc main #contents .sec01 {
  background: url(../img/location/bg01.webp) repeat-y 0 0;
  background-size: 100%;
}
.pre-inc main #contents .sec01 .container {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  padding: min(6vw, 6rem) 0 4rem;
  margin: auto;
}
.pre-inc main #contents .sec01 .container .cnt {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(1, 1fr);
  gap: 1rem;
  min-width: calc(55% - 1rem);
  width: calc((980px - 100%) * 1000);
  max-width: 100%;
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec01 .container .cnt {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(1, 1fr);
    padding: 0 1rem;
  }
}
.pre-inc main #contents .sec01 .container .cnt p {
  font-size: min(4.2vw, 24px);
  color: #E0D0AC;
  padding: 2rem 0 0;
}
.pre-inc main #contents .sec01 .container .cnt p span {
  font-size: min(5.5vw, 40px);
  display: block;
  border-bottom: solid #E0D0AC 1px;
  padding-bottom: 0.5em;
  margin-bottom: 0.5em;
}
.pre-inc main #contents .sec01 .container .cnt p:nth-of-type(2) {
  font-size: min(3.6vw, 18px);
  color: #fff;
  line-height: 1.8;
  grid-column: span 2/span 2;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec01 .container .cnt p:nth-of-type(2) {
    grid-column: span 2/span 2;
    grid-row-start: 3;
  }
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec01 .container .cnt p {
    grid-column: span 2/span 2;
  }
}
.pre-inc main #contents .sec01 .container .cnt img {
  margin: auto;
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec01 .container .cnt img {
    grid-column: span 2/span 2;
    grid-row-start: 2;
  }
}
.pre-inc main #contents .sec01 .container figure {
  min-width: calc(45% - 1rem);
  width: calc((980px - 100%) * 1000);
  max-width: 100%;
  height: 100%;
}
.pre-inc main #contents .sec02 {
  background: url(../img/location/bg02.webp) repeat-y 0 0;
  background-size: 100%;
  padding-bottom: 0;
}
.pre-inc main #contents .sec02 .inner {
  padding-bottom: min(6vw, 6rem);
}
.pre-inc main #contents .sec02 .title-p {
  font-size: min(3.6vw, 18px);
  text-align: center;
  line-height: 2.6;
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec02 .title-p {
    text-align: left;
    padding: 0 1rem;
  }
}
.pre-inc main #contents .sec02 .container2 {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  padding: min(5vw, 5rem) 0 min(1vw, 1rem);
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec02 .container2 {
    gap: 0;
  }
}
.pre-inc main #contents .sec02 .container2 figure {
  min-width: calc(60% - 1rem);
  width: calc((980px - 100%) * 1000);
  max-width: 100%;
  height: 100%;
}
.pre-inc main #contents .sec02 .container2 figure figcaption {
  color: #393939;
}
.pre-inc main #contents .sec02 .container2 .cnt2 {
  min-width: calc(40% - 3rem);
  width: calc((980px - 100%) * 1000);
  max-width: 100%;
  padding: 1rem;
}
.pre-inc main #contents .sec02 .container2 .cnt2 dl {
  padding: 1rem 0;
}
.pre-inc main #contents .sec02 .container2 .cnt2 dl dt {
  font-size: min(3.9vw, 21px);
  color: #7B6534;
  padding-bottom: 0.5rem;
  border-bottom: solid #7B6534 1px;
  margin-bottom: 1rem;
}
.pre-inc main #contents .sec02 .container2 .cnt2 dl dt::before {
  content: "";
  background: #7B6534;
  color: #fff;
  padding: 0.2em 0.65em;
  margin-right: 1em;
}
.pre-inc main #contents .sec02 .container2 .cnt2 dl dt sub {
  font-size: min(2.4svw, 12px);
}
.pre-inc main #contents .sec02 .container2 .cnt2 dl dd {
  font-size: min(3.2vw, 16px);
  line-height: 1.8;
}
.pre-inc main #contents .sec02 .container2 .cnt2 .a dt::before {
  content: "A";
}
.pre-inc main #contents .sec02 .container2 .cnt2 .b dt::before {
  content: "B";
}
.pre-inc main #contents .sec02 .container2 .cnt2 .c dt::before {
  content: "C";
}
.pre-inc main #contents .sec02 .container2 .cnt2 .d dt::before {
  content: "D";
}
.pre-inc main #contents .sec02 .container2 .cnt2 .e dt::before {
  padding: 0.2em 1em;
}
.pre-inc main #contents .sec02 .note {
  padding: 0 1rem min(5vw, 5rem);
}
.pre-inc main #contents .sec02 .note li {
  font-size: 10px;
  letter-spacing: 1px;
  line-height: 165%;
}
.pre-inc main #contents .sec02 .box {
  padding: 10px;
  max-width: 1280px;
  margin: 0 auto;
  background: #D1D1D1;
}
.pre-inc main #contents .sec02 .box .in {
  border: 1px solid #7B6534;
  padding: min(5vw, 5em);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 4rem;
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec02 .box .in {
    gap: 2rem;
  }
}
.pre-inc main #contents .sec02 .box .in dl {
  min-width: calc(60% - 2rem);
  width: calc((780px - 100%) * 1000);
  max-width: 100%;
}
.pre-inc main #contents .sec02 .box .in dl dt {
  margin: 0 0 2rem;
}
.pre-inc main #contents .sec02 .box .in dl dt p {
  font-size: min(5.5vw, 40px);
  color: #7B6534;
}
.pre-inc main #contents .sec02 .box .in dl dt p span {
  font-size: min(3.6vw, 18px);
  padding-left: 1em;
}
.pre-inc main #contents .sec02 .box .in dl dt p:nth-of-type(2) {
  font-size: min(3.9vw, 21px);
  color: #312A28;
}
.pre-inc main #contents .sec02 .box .in dl dd {
  font-size: min(3.2vw, 16px);
  line-height: 2;
}
.pre-inc main #contents .sec02 .box .in figure {
  min-width: calc(40% - 2rem);
  width: calc((780px - 100%) * 1000);
  max-width: 100%;
}
.pre-inc main #contents .sec02 .block-box {
  padding: min(6vw, 6rem) 0 min(8vw, 8rem);
}
@media screen and (max-width: 768px) {
  .pre-inc main #contents .sec02 .block-box {
    padding: min(6vw, 6rem) 1rem min(8vw, 8rem);
  }
}
.pre-inc main #contents .sec02 .block-box p {
  font-size: min(5.5vw, 40px);
  color: #7b6534;
  border-bottom: solid #7B6534 1px;
  padding-bottom: 0.2em;
  margin-bottom: 0.5em;
}
.pre-inc main #contents .sec02 .block-box p:nth-of-type(2) {
  font-size: min(3.2vw, 16px);
  line-height: 2;
  color: #312A28;
  border-bottom: none;
}
.pre-inc main #contents .sec02 .space {
  display: block;
  background: #312a28;
  height: 50px;
}
.pre-inc {
  /* add 20250604 */
}
.pre-inc main #main .main-area .block h1 {
  margin-bottom: 25px;
  line-height: 130%;
}
.pre-inc main #main .main-area .block p {
  padding-bottom: 1em;
}
.pre-inc main #main .main-area .block p .p-note {
  padding-top: 1em;
}
.pre-inc .intro {
  padding-top: 80px;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  flex-wrap: wrap;
  padding-bottom: 50px;
}
.pre-inc main #main .main-area .block {
  padding-bottom: 20px;
  text-align: left;
}
.pre-inc .introimage {
  width: 46.875%;
}
.pre-inc .introtext {
  width: 49.21875%;
}
.pre-inc .introimg figure {
  position: relative;
}
.pre-inc .introimg figure figcaption {
  font-size: 13px;
  color: #fff;
  text-shadow: 0px 0px 0.15em rgba(0, 0, 0, 0.7), 0px 0px 0.15em rgba(0, 0, 0, 0.7), 0px 0px 0.15em rgba(0, 0, 0, 0.7), 0px 0px 0.15em rgba(0, 0, 0, 0.7), 0px 0px 0.15em rgba(0, 0, 0, 0.7), 0px 0px 0.15em rgba(0, 0, 0, 0.7), 0px 0px 0.15em rgba(0, 0, 0, 0.7);
  text-align: right;
  position: absolute;
  left: 0.7em;
  bottom: 0.7em;
  z-index: 1;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
  .pre-inc main #main::after, .pre-inc main #main::before {
    display: none;
  }
  .pre-inc main #main .intro .introtext {
    position: relative;
  }
  .pre-inc main #main .intro .introtext::before {
    position: absolute;
    content: "";
    background-image: url(../img/design/kazari05.webp);
    background-size: contain;
    background-repeat: no-repeat;
    top: 0;
    left: 0;
    display: block;
    width: 30%;
    max-width: 449px;
    height: auto;
    aspect-ratio: 1/2;
    z-index: 1;
  }
  .pre-inc main #main .intro .introtext::after {
    position: absolute;
    content: "";
    background-image: url(../img/design/kazari05.webp);
    background-size: contain;
    background-repeat: no-repeat;
    bottom: -15%;
    right: 0;
    display: block;
    width: 30%;
    max-width: 449px;
    height: auto;
    aspect-ratio: 1/2;
    z-index: 1;
    transform: rotate(-180deg);
  }
  .pre-inc .intro {
    padding: 0 0 40px;
  }
  .pre-inc .introimage, .pre-inc .introtext {
    width: 100%;
  }
  .pre-inc main #main .main-area .block {
    text-align: center;
  }
}

/*# sourceMappingURL=design.css.map */