@charset "UTF-8";
.btn a.type-b,
.btn span.type-b {
  background-color: #e8e8e8;
}

input[type=text],
input[type=mail],
input[type=tel],
textarea,
select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

input {
  outline: none;
}

input[type=text],
input[type=mail],
input[type=tel],
select {
  line-height: 1;
}

input[type=text],
input[type=mail],
input[type=tel],
textarea,
.dummy-input {
  box-sizing: border-box; 
  margin: 5px;
  padding: 13.5px 10px;
  outline: none;
  border: 1px solid #ccc;
  background-color: #f8f8f8;
}
input[type=text]:focus,
input[type=mail]:focus,
input[type=tel]:focus,
textarea:focus,
.dummy-input:focus {
  border-color: #999; 
  background-color: #fff;
}
input[type=text].error,
input[type=mail].error,
input[type=tel].error,
textarea.error,
.dummy-input.error {
  background-color: #fee8e7;
}
input[type=text] span,
input[type=mail] span,
input[type=tel] span,
textarea span,
.dummy-input span {
  position: absolute;
  display: inline-block;
  padding-left: 10px;
  line-height: 3.2;
}

input[type=text].is-large,
input[type=mail].is-large,
input[type=tel].is-large {
  max-width: 400px; 
  width: 100%;
}
@media only screen and (max-width: 48em) {
  input[type=text].is-large,
  input[type=mail].is-large,
  input[type=tel].is-large {
    margin: 0 !important; 
    max-width: 100%;
    width: 100%;
  }
}

input[type=text].is-middle,
input[type=mail].is-middle,
input[type=tel].is-middle {
  max-width: 200px; 
  width: 100%;
}

input[type=checkbox] +label {
  display: inline-block; 
  margin-right: 15px;
}

.dummy-input {
  position: relative;
  display: inline-block;
  padding: 0;
  min-width: 85px;
}
.dummy-input:after {
  position: absolute;
  top: 0;
  right: 10px;
  bottom: 0;
  display: block;
  margin: auto;
  width: 9px;
  height: 5px;
  background: transparent url("/bridal/kyoto/muromachihouse/common/img/icon_arrow-down-black.png") left top no-repeat;
  background-size: cover; 
  content: "";
}

select {
  padding: 15px 30px 15px 10px;
  width: 100%;
  outline: none;
  border: none;
  opacity: 0;
}

textarea {
  max-width: 400px; 
  width: 100%;
}
@media only screen and (max-width: 48em) {
  textarea {
    margin: auto;
  }
}

.contactform_tags {
  position: relative; 
  margin: auto;
  max-width: 1024px;
  text-align: center;
  font-size: 0;
  font-family: "游ゴシック", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", sans-serif;
}
@media only screen and (max-width: 66.5625em) {
  .contactform_tags {
    margin: 0 2%; 
    width: 96%;
  }
}

.contactform_tag-item {
  display: inline-block ;
  margin-right: auto;
  margin-right: 0.5%;
  margin-left: 0.5%;
  padding: 3% 0;
  width: 32.33333%;
  background-color: #f5f5f5;
  color: #666;
  vertical-align: top;
  text-align: center;
  font-weight: bold;
  font-size: small;
  cursor: pointer;
}
@media only screen and (min-width: 48.0625em) {
  .contactform_tag-item {
    width: 32.33333%;
  }
  .contactform_tag-item:nth-child(n) {
    width: 32.66667% ;
  }
  .contactform_tag-item:nth-child(3n+1) {
    margin-left: 0;
  }
  .contactform_tag-item:nth-child(3n+3) {
    margin-right: 0;
  }
}
.contactform_tag-item.js_is-active {
  background-color: #78d297;
  color: #fff;
}
@media only screen and (max-width: 48em) {
  .contactform_tag-item {
    width: 100%;
    border-bottom: 1px solid #e3e3e3;
  }
}

form.contactform {
  display: none;
}
form.contactform:first-child {
  display: block;
}
form.contactform .btn {
  margin-top: 40px; 
  text-align: center;
}
form.contactform .btn a,
form.contactform .btn span {
  width: 220px;
}
form.contactform >dl {
  font-size: 13px;
  font-size: 1.3rem;
  font-family: "游ゴシック", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", sans-serif;
  line-height: 3;
}
form.contactform >dl.error input[type=text],
form.contactform >dl.error input[type=mail],
form.contactform >dl.error input[type=tel],
form.contactform >dl.error textarea {
  background-color: #fee8e7;
}
form.contactform >dl >dt {
  float: left;
  padding: 2%;
  width: 40%;
  vertical-align: middle;
}
@media only screen and (max-width: 48em) {
  form.contactform >dl >dt {
    float: none;
    width: 100%;
  }
}
form.contactform >dl >dt.js_is-required:after {
  display: inline-block;
  float: right;
  margin: 9px 0; 
  padding: 0 15px;
  background-color: #78d297;
  color: #fff;
  content: "必須";
  vertical-align: middle;
  text-align: center;
  font-weight: bold;
  font-size: 11px;
  font-size: 1.1rem;
  line-height: 2;
}
@media only screen and (max-width: 48em) {
  form.contactform >dl >dt.js_is-required:after {
    float: none;
    margin-left: 15px;
  }
}
form.contactform >dl >dd {
  padding: 2% 2% 2% 40%;
  border-bottom: 1px solid #ccc;
}
@media only screen and (max-width: 48em) {
  form.contactform >dl >dd {
    padding: 0 2% 4% 2%;
  }
}

.contactform_complete {
  margin: auto; 
  margin-bottom: 2%;
  width: 92%;
  text-align: center;
  font-weight: bold;
}

.contactform_address {
  margin: 60px auto 10% auto;
  width: 92%;
  text-align: center;
  border-top: solid 1px #AA8E76;
  padding-top:40px; 
}
.contactform_address h2{
  margin-bottom: 2%;
}

.contactform_error {
  display: block; 
  color: #e30000;
}
.contactform_error:before {
  content: "※";
}