@charset "UTF-8";
/*==========================================
新メールフォーム - contact1,contact2 -
===========================================*/
.contact1,
.contact2 {
  background-color: #ebe4e0;
    /*--------------
	step2 - 共通
	--------------*/
    /*--------------
	step3 - 共通
	--------------*/
}
.contact1 *,
.contact2 * {
  max-width: 100%;
}
.contact1 button,
.contact2 button {
  font-size: 100%;
}
.contact1#wrapper,
.contact2#wrapper {
  margin: 0;
  padding: 0;
}
.contact1 .hidden,
.contact2 .hidden {
  visibility: hidden !important;
}
@media screen and (max-width: 960px) {
  .contact1 .hidden,
  .contact2 .hidden {
    display: none !important;
  }
}
.contact1 .bNone,
.contact2 .bNone {
  border: none !important;
}
.contact1 .w10,
.contact2 .w10 {
  width: 10em;
}
.contact1 .title,
.contact2 .title {
  text-align: center;
  padding: 2% 0;
  margin: 3% auto;
}
.contact1 #contact,
.contact2 #contact {
  width: 60%;
  margin: 0 auto;
  padding: 10px;
  font-size: 1.4em;
}
@media screen and (max-width: 960px) {
  .contact1 #contact,
  .contact2 #contact {
    width: 100%;
    padding: 10px 2%;
  }
}
.contact1 #contact p,
.contact2 #contact p {
  font-size: 0.85em;
  line-height: 25px;
}
.contact1 #contact select,
.contact2 #contact select {
  font-size: 1em;
  border: none;
  height: 2em;
  background-color: #fff;
  vertical-align: middle;
}
.contact1 h2,
.contact2 h2 {
  font-size: 1.6em;
}
.contact1 p,
.contact2 p {
  width: 800px;
  margin-right: auto;
  margin-left: auto;
  padding: 0.5em 1.2em;
  margin-bottom: 1.2em;
  word-wrap: break-word;
}
@media screen and (max-width: 960px) {
  .contact1 p,
  .contact2 p {
    padding: 20px 2%;
  }
}
.contact1 .tbl-layout,
.contact2 .tbl-layout {
  width: 100%;
  margin: 0 auto;
  border-bottom: none;
  width: 800px;
}
@media screen and (max-width: 960px) {
  .contact1 .tbl-layout,
  .contact2 .tbl-layout {
    width: auto;
  }
}
.contact1 .tbl-layout dt,
.contact2 .tbl-layout dt {
  clear: both;
  float: left;
  display: block;
  width: 240px;
  padding: 20px 0 20px 10px;
  font-weight: bold;
}
@media screen and (max-width: 960px) {
  .contact1 .tbl-layout dt,
  .contact2 .tbl-layout dt {
    float: none;
    width: auto;
    padding: 10px 2%;
  }
}
.contact1 .tbl-layout dd,
.contact2 .tbl-layout dd {
  padding: 20px 20px 10px 240px;
  border-bottom: solid 2px #999;
}
@media screen and (max-width: 960px) {
  .contact1 .tbl-layout dd,
  .contact2 .tbl-layout dd {
    padding: 10px 2% 20px;
    border: none;
    word-wrap: break-word;
  }
}
.contact1 .tbl-layout dd label,
.contact2 .tbl-layout dd label {
  padding: 3% 0;
  display: block;
}
.contact1 .tbl-layout input[type=text],
.contact1 .tbl-layout input[type=email],
.contact1 .tbl-layout textarea.text,
.contact2 .tbl-layout input[type=text],
.contact2 .tbl-layout input[type=email],
.contact2 .tbl-layout textarea.text {
  padding: 2%;
  font-size: 1em;
  vertical-align: middle;
  width: 90%;
  border: none;
  word-wrap: break-word;
}
.contact1 .tbl-layout textarea.textH,
.contact2 .tbl-layout textarea.textH {
  height: 7em;
}
@media screen and (max-width: 960px) {
  .contact1 .tbl-layout textarea.textH,
  .contact2 .tbl-layout textarea.textH {
    height: 4em;
  }
}
@media screen and (max-width: 960px) {
  .contact1 .tbl-layout textarea.text,
  .contact2 .tbl-layout textarea.text {
    height: 8em;
  }
}
.contact1 .link {
    margin-top: 1em;
    text-align: center;
}
.contact2 .link {
  text-align: center;
  width: auto;
  margin: 1em 0;
  padding: 0;
}
@media screen and (max-width: 960px) {
  .contact1 .link,
  .contact2 .link {
    padding: 0 2%;
    margin: 2% 0 4%;
  }
}
.contact1 .link .move_to,
.contact2 .link .move_to {
  color: #039;
  background-color: #fff;
  height: 100%;
  width: 100%;
  max-width: 760px;
  display: block;
  border: 2px solid #ccc;
  padding: 1em;
  margin: 0 auto;
}
@media screen and (max-width: 960px) {
  .contact1 .link .move_to,
  .contact2 .link .move_to {
    padding: 0.7em;
  }
}
.contact1 .sbmt,
.contact2 .sbmt {
  clear: both;
  padding: 10px 15px;
  text-align: center;
}
@media screen and (max-width: 960px) {
  .contact1 .sbmt,
  .contact2 .sbmt {
    padding: 1% 2% 3%;
    width: 85%;
    margin-right: auto;
    margin-left: auto;
  }
}
@media screen and (max-width: 767px) {
  .contact1 .sbmt,
  .contact2 .sbmt {
    padding-top: 0.8em;
    padding-bottom: 1.6em;
    width: 100%;
  }
}
.contact1 .sbmt button,
.contact2 .sbmt button {
  width: 33%;
  padding: 2%;
  margin: 2% auto 3%;
  display: block;
  background-color: #c31920;
  border: none;
  color: #FFF;
  border-radius: 5px;
  font-size: 21px;
  text-align: center;
  cursor: pointer;
}
.contact1 .sbmt button:hover,
.contact2 .sbmt button:hover {
  opacity: 0.8;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
@media screen and (max-width: 960px) {
  .contact1 .sbmt button,
  .contact2 .sbmt button {
    width: 50%;
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .contact1 .sbmt button,
  .contact2 .sbmt button {
    width: 100%;
    padding: 4%;
  }
}
.contact1 .step2 .tbl-layout,
.contact2 .step2 .tbl-layout {
  margin-bottom: 2.5em;
}
.contact1 .step2 .sbmt button,
.contact2 .step2 .sbmt button {
  width: 35%;
  display: inline-block;
}
@media screen and (max-width: 960px) {
  .contact1 .step2 .sbmt button,
  .contact2 .step2 .sbmt button {
    width: 55%;
  }
}
.contact1 .step2 .sbmt .btnBk,
.contact2 .step2 .sbmt .btnBk {
  margin-right: 1%;
  width: 25%;
  color: #333;
  background-color: #fff;
}
@media screen and (max-width: 960px) {
  .contact1 .step2 .sbmt .btnBk,
  .contact2 .step2 .sbmt .btnBk {
    width: 40%;
  }
}
.contact1 .step3 main,
.contact2 .step3 main {
  margin-bottom: 3em;
}

footer {
  padding-top: 0;
}

/*--------------------------
contact1 step2
--------------------------*/
.contact1 .step2 .tbl-layout dt,
.contact1 .step2 .tbl-layout dd {
  padding-top: 20px;
  padding-bottom: 20px;
}
@media screen and (max-width: 960px) {
  .contact1 .step2 .tbl-layout dt,
  .contact1 .step2 .tbl-layout dd {
    padding-top: 10px;
    padding-bottom: 10px;
  }
}
.contact1 .step2 .tbl-layout dd {
  padding-left: 260px;
  border-color: #ccc;
}
@media screen and (max-width: 960px) {
  .contact1 .step2 .tbl-layout dd {
    padding-left: 2%;
    width: 100%;
    margin-bottom: 10px;
  }
}

/*--------------------------
contact1 step3
--------------------------*/
/*==========================================
トップページにあったフォームの代替え - contact2 -
===========================================*/
.contact2 .tbl-layout .a1 {
  border-bottom: solid 2px #999;
  padding: 0;
}
.contact2 .tbl-layout .a1.tourTtl {
  border-bottom: none !important;
  color: #333;
  margin-bottom: 1.5em;
}
.contact2 .tbl-layout .a1.tourTtl .c1 {
  font-size: 1.2em;
  letter-spacing: 1px;
  width: 100%;
  max-width: 100%;
  float: none;
  display: block;
  font-weight: normal;
  color: #0d2d81;
  background-color: rgba(255, 255, 255, 0.4);
  padding: 1% 3%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .contact2 .tbl-layout .a1.tourTtl .c1 {
    font-size: 105%;
  }
}
.contact2 .tbl-layout .a1:after {
  clear: both;
  content: " ";
  visibility: hidden;
  display: block;
}
.contact2 .tbl-layout .a1:last-child {
  margin-bottom: 1em;
}
@media screen and (max-width: 960px) {
  .contact2 .tbl-layout .a1 {
    border: none;
  }
}
.contact2 .tbl-layout .c1 {
  float: left;
  display: block;
  width: 250px;
  padding: 20px;
  font-weight: bold;
  vertical-align: middle;
}
@media screen and (max-width: 1091px) {
  .contact2 .tbl-layout .c1 {
    width: auto;
  }
}
@media screen and (max-width: 960px) {
  .contact2 .tbl-layout .c1 {
    float: none;
    padding: 10px 2%;
  }
}
.contact2 .tbl-layout .c2 {
  padding: 20px;
  width: 60%;
  max-width: 600px;
  display: inline-block;
}
@media screen and (max-width: 1091px) {
  .contact2 .tbl-layout .c2 {
    width: auto;
    padding: 20px 0;
  }
}
@media screen and (max-width: 960px) {
  .contact2 .tbl-layout .c2 {
    padding: 10px 2% 20px;
    word-wrap: break-word;
    width: 100%;
    display: block;
  }
}
.contact2 .tbl-layout .c2 label {
  padding: 3% 0;
  display: block;
}
.contact2 .tbl-layout .desc {
  font-size: 0.9em;
  text-align: right;
  max-width: 96%;
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 960px) {
  .contact2 .tbl-layout .desc {
    text-align: left;
  }
}
.contact2 .tbl-layout .ninzu p {
  text-align: left;
  padding: 0 0 10px;
  margin-bottom: 0;
}
.contact2 .tbl-layout .ninzu p span {
  display: inline-block;
  font-size: 100%;
}
.contact2 .tbl-layout .ninzu p select {
  width: 7em;
}
.contact2 .tbl-layout .yosan select {
  width: 11em;
}
.contact2 .tbl-layout .taizai input {
  width: 2.5em;
  font-size: 1em;
  border: none;
  height: 2em;
  background-color: #fff;
  padding: 0 0.5em;
}
.contact2 .tbl-layout .ckRadio span {
  display: inline-block;
}
.contact2 .tbl-layout .ckRadio label {
  display: inline-block;
  padding: 0;
}
@media screen and (max-width: 960px) {
  .contact2 .tbl-layout .ckRadio label {
    padding: 3% 0;
    display: block;
  }
}
.contact2 .tbl-layout .ckRadio input {
  font-size: 1.12em;
}
@media screen and (max-width: 960px) {
  .contact2 .tbl-layout .email .c2 {
    padding-bottom: 5px;
  }
}
.contact2 .tbl-layout .guide .c2 span,
.contact2 .tbl-layout .categori .c2 span {
  width: 6em;
}
@media screen and (max-width: 767px) {
  .contact2 .tbl-layout .guide .c2 span,
  .contact2 .tbl-layout .categori .c2 span {
    width: 48%;
  }
}
.contact2 .tbl-layout .room .c2 span {
  width: 8em;
}
@media screen and (max-width: 767px) {
  .contact2 .tbl-layout .room .c2 span {
    width: 48%;
  }
}
.contact2 .tbl-layout .sougei .c2 span {
  width: 11em;
}
.contact2 .link {
  margin-bottom: 2em;
}
.contact2 .link button {
  display: block;
  width: 100%;
}

/*--------------------------
contact2 step2
--------------------------*/
.contact2 .step2 .tbl-layout .a1 {
  border-color: #ccc;
}
.contact2 .step2 .tbl-layout .a1.sbmt {
  border: none;
}