header:not(.top) .mainimg {
  background-image: url(../images/mainimg.jpg);
}

#contents .mainArea {
  background: url(../images/bg_sp.svg) no-repeat 55% top;
  background-size: auto 100%;
}
@media screen and (max-width: 960px) {
  #contents .mainArea {
    background-position: right top 50px;
    background-size: 40% auto;
  }
}
@media screen and (max-width: 668px) and (orientation: portrait) {
  #contents .mainArea {
    background-position: right top 130px;
    background-size: 80% auto;
  }
}
#contents .jisseki {
  margin-top: 120px;
  margin-bottom: 120px;
}
@media screen and (max-width: 960px) {
  #contents .jisseki {
    margin-top: 70px;
    margin-bottom: 70px;
  }
}
@media screen and (max-width: 668px) {
  #contents .jisseki {
    margin-top: 20px;
    margin-bottom: 20px;
  }
}
#contents .jisseki h3 {
  margin-bottom: 120px;
}
@media screen and (max-width: 960px) {
  #contents .jisseki h3 {
    margin-bottom: 70px;
  }
}
@media screen and (max-width: 668px) {
  #contents .jisseki h3 {
    margin-bottom: 20px;
  }
}
#contents .jisseki > div {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
#contents .jisseki > div .photo {
  width: 38%;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 960px) {
  #contents .jisseki > div .photo {
    width: 100%;
  }
}
#contents .jisseki > div .photo li {
  width: calc(33.3333333333% - 6px);
  margin-bottom: 15px;
}
#contents .jisseki > div .photo li:not(:nth-child(3n+1)) {
  margin-left: 9px;
}
@media screen and (max-width: 668px) {
  #contents .jisseki > div .photo li {
    width: calc(33.3333333333% - 6px);
    margin-bottom: 9px;
  }
  #contents .jisseki > div .photo li:not(:nth-child(3n+1)) {
    margin-left: 9px;
  }
}
#contents .jisseki > div .basic {
  width: 55%;
}
@media screen and (max-width: 960px) {
  #contents .jisseki > div .basic {
    width: 100%;
  }
}/*# sourceMappingURL=index.css.map */