/* media query */
#contents .mainimg {
  background-image: url(../images/mainimg.jpg);
}

#contents .firstCopy {
  padding: 120px 30px;
}

@media screen and (max-width: 1100px) {
  #contents .firstCopy {
    padding: 70px 30px;
  }
}

@media screen and (max-width: 740px) and (orientation: portrait) {
  #contents .firstCopy {
    padding: 50px 20px;
    text-align: left;
  }
}

#contents .firstCopy > p {
  text-align: center;
  line-height: 400%;
}

#contents .firstCopy > p:not(:last-child) {
  margin-bottom: 20px;
}

@media screen and (max-width: 1100px) {
  #contents .firstCopy > p {
    line-height: 300%;
  }
}

@media screen and (max-width: 740px) and (orientation: portrait) {
  #contents .firstCopy > p {
    text-align: left;
    line-height: 200%;
  }
}

#contents .aboutArea {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-bottom: 150px;
}

@media screen and (max-width: 960px) {
  #contents .aboutArea {
    margin-bottom: 50px;
  }
}

@media screen and (max-width: 740px) and (orientation: portrait) {
  #contents .aboutArea {
    display: block;
  }
}

#contents .aboutArea > p {
  width: calc(50% - 30px);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media screen and (max-width: 1100px) {
  #contents .aboutArea > p {
    width: 50%;
  }
}

@media screen and (max-width: 740px) and (orientation: portrait) {
  #contents .aboutArea > p {
    width: 100%;
    height: 300px;
  }
}

#contents .aboutArea > div {
  width: calc(50% - 30px);
  padding-right: 30px;
}

@media screen and (max-width: 740px) and (orientation: portrait) {
  #contents .aboutArea > div {
    width: 100%;
    padding: 30px 25px 0;
  }
}

#contents .aboutArea > div > table {
  border-collapse: collapse;
}

#contents .aboutArea > div > table th {
  white-space: nowrap;
}

#contents .aboutArea > div > table th,
#contents .aboutArea > div > table td {
  border: 1px solid #ccc;
  text-align: left;
  padding: 12px 30px;
  font-size: 0.9em;
  line-height: 150%;
}

@media screen and (max-width: 960px) {
  #contents .aboutArea > div > table th,
  #contents .aboutArea > div > table td {
    padding: 10px 12px;
  }
}

#contents .aboutArea > div > table th a,
#contents .aboutArea > div > table td a {
  text-decoration: underline;
}

#contents .photoWide {
  width: 100%;
  height: 0;
  padding-top: 31%;
  background: url(../images/photo_wide.jpg) no-repeat right center/cover;
}

@media screen and (max-width: 740px) and (orientation: portrait) {
  #contents .photoWide {
    padding-top: 60%;
  }
}

#contents .mapArea {
  padding: 100px;
}

@media all and (max-width: 1400px) {
  #contents .mapArea {
    padding: 100px 50px;
  }
}

@media screen and (max-width: 1100px) {
  #contents .mapArea {
    padding: 50px 30px;
  }
}

#contents .mapArea iframe {
  width: 100%;
  height: 600px;
}

@media screen and (max-width: 1100px) {
  #contents .mapArea iframe {
    height: 400px;
  }
}
/*# sourceMappingURL=index.css.map */