/* Index
======================================== */
#main{
	position: relative;
	background: url(../img/main.jpg) no-repeat center center;
	background-size: cover;
}

#contents{
}
#contents .section{
	max-width: 700px;
	margin: 100px auto 0 auto;
	overflow: hidden;
}
.section img{
	max-width: 100%;
	height: auto;
}
.contactArea{
  max-width: 700px;
  margin: 0 auto;
  margin-top: 50px;
}
.contactArea table{
  width: 100%;
  border-top: #e6e6e6 solid 1px;
}
.contactArea th,
.contactArea td{
    text-align: left;
    border-bottom: #e6e6e6 solid 1px;
    padding: 30px 5px;
    vertical-align: middle;
}
.contactArea .spVer{
  display: none;
}

.submitArea input[type="submit"],
.submitArea input[type="reset"],
.submitArea input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
.submitArea input[type="submit"]::-webkit-search-decoration,
.submitArea input[type="reset"]::-webkit-search-decoration,
.submitArea input[type="button"]::-webkit-search-decoration {
  display: none;
}
.submitArea input[type="submit"]::focus,
.submitArea input[type="reset"]::focus,
.submitArea input[type="button"]::focus {
  outline-offset: -2px;
}
.contactArea table input[type="reset"],
.contactArea table input[type="submit"],
.contactArea table input[type="button"],
.contactArea table input[type="email"],
.contactArea table input[type="text"],
.contactArea table input[type="number"],
.contactArea table input[type="tel"],
.contactArea table input[type="search"],
.contactArea table input[type="url"],
.contactArea table textarea{
  padding:10px 10px;
  font-size: 16px;
  background:#fff;
  border:1px solid #ddd;
  border-radius: 4px;
  box-sizing:border-box;
  color: #4c3f29;
  -webkit-appearance: none;
}
.contactArea input.short{
    width: 40%;
}
.contactArea input.long,
.contactArea textarea{
    width: 95%;
}
.submitArea{
  text-align: center;
  margin-top: 30px;
}
.submitArea .submit,
.submitArea .back{
  text-align: center;
  display: inline-block;
  padding: 10px 30px;
  text-decoration: none;
  background: #4c3f29;
  color: #FFF;
  border-radius: 4px!important;
  font-size: 15px;
  font-family: "Lato";
	font-weight: 700;
}
.submitArea .back{
  background: #aaa;
}

.requireCheckMesse{
  margin-bottom: 30px;
}
.contactArea th,
.formTable th{
  white-space: nowrap;
  width: 20%;
}
.contactArea td,
.formTable td{
  width: 80%;
}

.thanks{
  text-align: center;
  line-height: 1.8;
}

.requireCheckMesse p+p{
  margin-top: 30px;
}
.requireCheckMesse p{
  border-bottom: #e6e6e6 solid 1px;
  padding: 0 5px 30px 5px;
}

/* Responsive Styles
======================================== */
@media only screen and (max-width:1080px) {
  #contents .section{
    max-width: 90%;
    margin: 50px auto 0 auto;
    overflow: hidden;
  }
  .section img{
    max-width: 100%;
    height: auto;
  }
  .contactArea{
    max-width: 90%;
    margin: 0 auto;
    margin-top: 30px;
  }

}
@media screen and (min-width: 769px) {
}
@media only screen and (max-width: 768px) {
	.contactArea table{
    width: 100%;
    border-top: #e6e6e6 solid 1px;
  }
  .contactArea th,
  .contactArea td{
    display: block;
      text-align: left;
      border-bottom: #e6e6e6 solid 1px;
      padding: 20px 5px;
      vertical-align: middle;
  }
  .contactArea th{
    padding: 20px 5px 0 5px;
    border: none;
  }
  .contactArea td{
    padding: 10px 5px 30px 5px;
  }
  .contactArea input.long,
  .contactArea textarea{
      width: 100%;
  }
}