@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&display=swap");

.noto-serif-jp {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-style: normal;
}

.fw-200 {
  font-weight: 200 !important;
}
.fw-300 {
  font-weight: 300 !important;
}
.fw-400 {
  font-weight: 400 !important;
}
.fw-500 {
  font-weight: 500 !important;
}
.fw-600 {
  font-weight: 600 !important;
}
.fw-700 {
  font-weight: 700 !important;
}
.fw-800 {
  font-weight: 800 !important;
}
.fw-900 {
  font-weight: 900 !important;
}

.bg-faf8f5 {
  background: #faf8f5 !important;
}

.bg-dbd3be {
  background: #dbd3be;
}

.max-w-980px {
  max-width: 980px !important;
}
.max-w-1128px {
  max-width: 1128px !important;
}

.mx-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}

.dh-container {
  position: relative;
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.design-house-l {
  display: none;
}

.dh-slider-container {
  padding-bottom: 40px;
  padding-left: 5%;
  padding-right: 5%;
}

.sp-text-14px {
  font-size: 12px;
}

.by-10px-553415 {
  border-top: 10px solid #553415 !important;
  border-bottom: 10px solid #553415 !important;
}

.dh-ttl {
  background: url("../imgs/dh-ttl.png") no-repeat center center / 90%;
  padding-left: 5%;
  padding-right: 5%;
  height: 54px;
  display: flex;
  justify-content: center;
  font-size: 22px;
  font-weight: bold;
}
.dh-main-txt {
  font-size: 16px;
  text-align: center;
  letter-spacing: 1px;
  padding-bottom: 30px;
  padding-left: 5%;
  padding-right: 5%;
}
.dh-ldk-txt {
  font-size: 14px;
  text-align: center;
  padding-bottom: 20px;
}
.dh-items {
  display: flex;
  flex-direction: column;
  padding-left: 5%;
  padding-right: 5%;
  width: 100%;
  gap: 10px;
  padding-bottom: 20px;
}
.dh-item {
  width: 100%;
  height: 45px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
}

.dh-menseki {
  text-align: center;
  font-size: 18px;
  padding-bottom: 40px;
}

.dh-madori {
  background: #ffffff;
  padding-top: 40px;
  padding-bottom: 40px;
  text-align: center;
  padding-left: 5%;
  padding-right: 5%;
}
#design-house {
  padding-top: 100px;
  margin-top: -100px;
}
@media (min-width: 768px) {
  .text-16px {
    font-size: 16px;
  }
  .dh-container {
    position: relative;
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }

  .design-house-l {
    display: none;
  }

  .dh-slider-container {
    padding-top: 90px;
    padding-bottom: 40px;
  }

  .by-10px-553415 {
    border-top: 10px solid #553415 !important;
    border-bottom: 10px solid #553415 !important;
  }

  .dh-ttl {
    background: url("../imgs/dh-ttl.png") no-repeat center center / 90%;
    width: 100%;
    height: 54px;
    display: flex;
    justify-content: center;
    font-size: 34px;
    font-weight: bold;
    letter-spacing: 5px;
    padding-left: 5%;
    padding-right: 5%;
  }
  .dh-main-txt {
    font-size: 24px;
    text-align: center;
    letter-spacing: 3px;
    padding-bottom: 40px;
  }
  .dh-ldk-txt {
    font-size: 20px;
    text-align: center;
    padding-bottom: 20px;
  }
  .dh-items {
    display: flex;
    flex-direction: row;
    width: 100%;
    gap: 10px;
    padding-bottom: 20px;
    padding-left: 0;
    padding-right: 0;
  }
  .dh-item {
    width: 320px;
    height: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
  }

  .dh-menseki {
    text-align: center;
    font-size: 18px;
    padding-bottom: 40px;
  }

  .dh-madori {
    background: #ffffff;
    padding-top: 40px;
    padding-bottom: 40px;
    text-align: center;
  }
}
@media (min-width: 1200px) {
  .dh-container {
    position: relative;
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }

  .design-house-l {
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
  }

  .dh-slider-container {
    padding-top: 90px;
    padding-bottom: 40px;
  }

  .by-10px-553415 {
    border-top: 10px solid #553415 !important;
    border-bottom: 10px solid #553415 !important;
  }

  .dh-ttl {
    background: url("../imgs/dh-ttl.png") no-repeat center center / cover;
    height: 54px;
    display: flex;
    justify-content: center;
    font-size: 34px;
    font-weight: bold;
    letter-spacing: 5px;
  }
  .dh-main-txt {
    font-size: 24px;
    text-align: center;
    letter-spacing: 3px;
    padding-bottom: 40px;
  }
  .dh-ldk-txt {
    font-size: 20px;
    text-align: center;
    padding-bottom: 20px;
  }
  .dh-items {
    display: flex;
    width: 100%;
    gap: 10px;
    padding-bottom: 20px;
  }
  .dh-item {
    width: 320px;
    height: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
  }

  .dh-menseki {
    text-align: center;
    font-size: 18px;
    padding-bottom: 40px;
  }

  .dh-madori {
    background: #ffffff;
    padding-top: 40px;
    padding-bottom: 40px;
    text-align: center;
  }
}