header nav p.contact a span::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background-color: #222;
  margin-top: 5px;
}
header nav p.contact a span::after {
  background-color: #fff;
}

.aboutArea {
  position: relative;
  margin-bottom: 100px;
}
@media screen and (max-width: 960px) {
  .aboutArea {
    margin-bottom: 50px;
  }
}
.aboutArea .photo {
  width: 43%;
  margin-left: max(3vw, 20px);
  padding-top: 50px;
}
.aboutArea .photo img {
  clip-path: polygon(0 40px, 100% 0, 100% 100%, 0 100%);
}
@media screen and (max-width: 960px) {
  .aboutArea .photo {
    width: 46%;
  }
}
@media screen and (max-width: 668px) {
  .aboutArea .photo {
    width: calc(100% - 30px);
    padding-top: 0;
    margin: 0 0 0 auto;
  }
}
.aboutArea > div {
  position: absolute;
  right: 0;
  top: 0;
  width: 90vw;
  background-color: #82C6E7;
  color: #fff;
  z-index: -1;
}
@media screen and (max-width: 668px) {
  .aboutArea > div {
    width: calc(100% - 30px);
    margin-top: -50px;
    position: relative;
  }
}
.aboutArea > div > div {
  width: 50%;
  margin: 0 20px 0 auto;
  padding: 6.5vw 0;
}
@media screen and (max-width: 668px) {
  .aboutArea > div > div {
    width: 100%;
    margin: 0;
    padding: 70px 30px 30px;
  }
}
.aboutArea > div > div .text {
  font-size: 2.5rem;
  margin-bottom: 30px;
}
@media screen and (max-width: 1200px) {
  .aboutArea > div > div .text {
    font-size: clamp(14px, 2.0833333333vw, 100px);
  }
}
@media screen and (max-width: 960px) {
  .aboutArea > div > div .text {
    margin-bottom: 20px;
  }
}
.aboutArea > div > div .tel a {
  font-size: 4rem;
  line-height: 120%;
}
@media screen and (max-width: 1200px) {
  .aboutArea > div > div .tel a {
    font-size: clamp(14px, 3.3333333333vw, 100px);
  }
}
@media screen and (max-width: 668px) {
  .aboutArea > div > div .tel a {
    font-size: calc(4rem * 0.75);
  }
}
@media screen and (max-width: 800px) {
  .aboutArea > div > div .tel small {
    display: block;
  }
}

.detailArea {
  max-width: 1660px;
  margin: 0 auto;
}
@media screen and (max-width: 1720px) {
  .detailArea {
    max-width: 100%;
    margin-left: 30px;
    margin-right: 30px;
  }
}
@media screen and (max-width: 668px) and (orientation: portrait) {
  .detailArea {
    max-width: 100%;
    margin-left: 20px;
    margin-right: 20px;
  }
}
.detailArea h3 {
  font-size: 3rem;
  line-height: 120%;
  margin-bottom: 50px;
}
@media screen and (max-width: 1200px) {
  .detailArea h3 {
    font-size: clamp(14px, 2.5vw, 100px);
  }
}
@media screen and (max-width: 668px) {
  .detailArea h3 {
    font-size: calc(3rem * 0.75);
  }
}
@media screen and (max-width: 668px) {
  .detailArea h3 {
    margin-bottom: 30px;
  }
}
.detailArea .box {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.detailArea .box > section {
  width: calc(50% - 30px);
}
@media screen and (max-width: 668px) {
  .detailArea .box > section {
    width: 100%;
  }
  .detailArea .box > section:first-child {
    margin-bottom: 30px;
  }
}
.detailArea .box > section > div {
  border-left: 2px solid #222;
  margin-bottom: 30px;
  padding: 10px 0 10px 25px;
}
@media screen and (max-width: 668px) {
  .detailArea .box > section > div {
    margin-bottom: 10px;
    padding: 5px 0 5px 20px;
  }
}
.detailArea .box > section > div h4 {
  font-size: 2rem;
  line-height: 120%;
  margin-bottom: 20px;
}
@media screen and (max-width: 1200px) {
  .detailArea .box > section > div h4 {
    font-size: clamp(14px, 1.6666666667vw, 100px);
  }
}
@media screen and (max-width: 668px) {
  .detailArea .box > section > div h4 {
    font-size: calc(2rem * 0.75);
  }
}
.detailArea .box > section > div address {
  font-style: normal;
}
.detailArea .box > section iframe {
  width: 100%;
  height: 500px;
  border: 0;
}
@media screen and (max-width: 668px) {
  .detailArea .box > section iframe {
    height: 300px;
  }
}/*# sourceMappingURL=index.css.map */