main {
  margin: auto;
  max-width: 900px;
  padding: 0 27px;
  box-sizing: border-box;
}

main .grid {
  display: grid;
  gap: 36px;
  grid-template-columns: repeat(auto-fit, minmax(234px, 1fr));
}

main .caption {
  margin: 12px 0 0;
  font-size: 1.4rem;
  line-height: 1.2;
  color: #606060;
}

main .txt {
  margin: 108px 0;
  font-family: "Noto Serif JP", serif;
  font-size: 1.8rem;
  line-height: 2;
  letter-spacing: 0.012rem;
}

main .txt b {
  font-size: 3.6rem;
  font-weight: 500;
}

#head {
  display: grid;
  grid-template-columns: 3fr 2fr;
  overflow: hidden;
  padding: 27px;
  background: #C97171;
}

#head img {
  width: 100%;
  max-height: 360px;
}

#head .ttl {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Times New Roman', Times, serif;
  font-size: 5.4rem;
  color: #fff;
  padding: 27px;
}

.mb {
  margin-bottom: 45px;
}

@media screen and (max-width: 700px) {
  #head .ttl {
    font-size: 3.6rem;
  }

  main .txt {
    margin: 54px 0;
  }

}