/*
Theme Name: 株式会社OFFICE KAJIYANO
Theme URI: http://office-kajiyano.jp
Author: 株式会社OFFICE KAJIYANO
Author URI: http://office-kajiyano.jp
Description: 株式会社OFFICE KAJIYANO公式サイトテーマ
Version: 1.0
*/

/*CONTACT___*/
.only_pc {
  display: block;
}
.only_sp {
  display: none;
}

.wrapper {
  z-index: 0;
  position: relative;
  padding: 13.3vw ​ 0;
  background-color: rgba(242, 234, 216, 0.14);
}

.section_tit {
  text-align: center;
}
.section_tit h1 {
  font-size: 2.5vw;
  letter-spacing: 0.3vw;
  margin: 0;
  color: #49270a;
}
.section_tit p {
  font-size: 1vw;
  letter-spacing: 0.12vw;
  color: #49270a;
  margin-top: 0;
}

.fade-in {
  opacity: 0;
  transform: translate(0, 50px);
  transition-duration: 500ms;
  transition-property: opacity, transform;
}
.scroll-in {
  opacity: 1;
  transform: translate(0, 0);
}

.btn_action {
  position: relative;
  border: 2px solid #49270a;
  width: 16.125vw;
  height: 4.75vw;
  margin: 5vw auto 0 auto;
}
button {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
}
.btn_push {
  position: absolute;
  display: inline-block;
  width: 16.125vw;
  height: 4.75vw;
  background-color: #f0e8d9;
  font-size: 1.125vw;
  font-weight: 500;
  color: #49270a;
  border: 2px solid #49270a;
  top: -0.8vw;
  left: -0.7vw;
}
.btn_push p {
  line-height: 4vw;
  margin: 0;
}
.btn_push img {
  width: 2.188vw;
}
.btn_push:hover {
  background-color: #49270a;
  color: #f3efe0;
}
.arrow_box {
  position: absolute;
  display: inline-block;
  right: 1.5vw;
  top: 2vw;
}
.arrow_box .btn_active {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
.sns_box {
  position: absolute;
  display: inline-block;
  left: 2vw;
  top: 1.5vw;
}
.sns_box .btn_active {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}

.btn_push:hover .btn_active {
  opacity: 1;
}
.btn_push:active {
  transform: translate(0.55vw, 0.7vw);
  border-bottom: none;
}

.btn_nomal {
  display: block;
  width: 29.188vw;
  height: 4.938vw;
  position: relative;
  margin: 5vw auto 3vw;
  background-color: #49270a;
  color: #fef6f0;
}
.btn_nomal .btn_arrow {
  width: 2.309vw;
  position: absolute;
  top: 44%;
  right: 7%;
}
.btn_nomal:hover {
  background-color: #f1b789;
  color: #49270a;
}
.arrow_box_nomal {
  display: inline-block;
}
.arrow_box_nomal .btn_active {
  position: absolute;
  opacity: 0;
}
.btn_nomal:hover .btn_active {
  opacity: 1;
}

.text {
  text-align: center;
  font-size: 1.375vw;
  font-weight: 700;
}

.marker-animation.active {
  background-position: -100% 1.1vw;
}
.marker-animation {
  background-image: -webkit-linear-gradient(
    left,
    transparent 50%,
    rgb(241, 183, 137) 50%
  );
  background-image: -moz-linear-gradient(
    left,
    transparent 50%,
    rgb(241, 183, 137) 50%
  );
  background-image: -ms-linear-gradient(
    left,
    transparent 50%,
    rgb(241, 183, 137) 50%
  );
  background-image: -o-linear-gradient(
    left,
    transparent 50%,
    rgb(241, 183, 137) 50%
  );
  background-image: linear-gradient(
    left,
    transparent 50%,
    rgb(241, 183, 137) 50%
  );
  background-repeat: repeat-x;
  background-size: 200% 0.9vw;
  background-position: 0 1.1vw;
  transition: all 2s ease;
  display: inline;
}

#contact {
  overflow: hidden;
  background-size: inherit;
}
#contact .contact_btns {
  background-color: #f3efe0;
  padding: 4vw 22.6vw;
  margin-top: 4vw;
}
#contact .contact_btns .contact_title {
  height: 7.688vw;
  padding: 0 0.8vw;
}
#contact .contact_btns .contact_title .contact_title_img {
  width: 7.563vw;
  float: left;
}
#contact .contact_btns .contact_title .contact_title_text {
  text-align: left;
  display: inline-block;
  width: 80%;
  float: right;
}
#contact .contact_btns .contact_title .contact_title_text p {
  font-size: 1.563vw;
  font-weight: 700;
  letter-spacing: 0.17vw;
  line-height: 5;
  vertical-align: text-bottom;
}
#contact .contact_btns .contact_title .contact_title_text .text_25px {
  font-size: 1.563vw;
}
#contact .contact_accordion_online,
#contact .contact_accordion_another {
  padding: 0;
  margin: 0;
  list-style: none;
}
#contact .accordion_item:first-of-type {
  margin-bottom: 1.639vw;
}
#contact .accordion_title {
  width: 100%;
  box-sizing: border-box;
  height: 4.923vw;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background-color: #f1b789;
  border: solid 3px #49270a;
}
#contact .accordion_title:hover {
  opacity: 0.8;
}
#contact .accordion_title .accordion_arrow {
  width: 1vw;
  position: absolute;
  top: 50%;
  right: 3.2vw;
  transform: translateY(-50%);
}
#contact .accordion_title p {
  margin: 0;
  font-size: 1.25vw;
  line-height: 4.923vw;
  text-align: center;
  color: #49270a;
  font-weight: 500;
}
#contact .accordion_content {
  position: relative;
  width: 100%;
  box-sizing: border-box;
  padding: 2vw;
  border: solid 3px #49270a;
  border-top: none;
}
#contact .accordion_content .accordion_content_tit {
  font-size: 1.563vw;
  font-weight: 700;
  margin-bottom: 0;
}
#contact .accordion_content .step_box .step_no {
  font-size: 1.563vw;
  color: #f1b789;
  margin: 0;
  font-weight: 700;
}
#contact .accordion_content .step_box .step_no .number {
  font-size: 2.5vw;
}
#contact .accordion_content .step_box .step_tit {
  font-size: 1.563vw;
  line-height: 1;
  font-weight: 700;
  margin: 0;
}
#contact .accordion_content .step_box .step_text {
  margin: 1vw 0;
}

#contact .online_icon {
  width: 13.022vw;
}
#contact .online_box {
  background: #f3efe0;
  padding: 3% 5%;
  margin-top: 4vw;
}
#contact hr {
  border: solid 1px #49270a;
  margin: 0.5vw 0px;
}
#contact .btn_action {
  width: 28.688vw;
  height: 5.563vw;
  margin: 3vw auto;
}
#contact .btn_push {
  width: 28.688vw;
  height: 5.563vw;
  text-align: center;
  background-color: #f1b789;
  border: 2px solid #49270a;
  color: #49270a;
}
#contact .btn_push img {
  width: 2.592vw;
}
#contact .btn_push:hover {
  background-color: #49270a;
  color: #f3efe0;
}

#contact .contact_form {
  padding: 7vw 22.6vw 1vw;
  position: relative;
}
#contact #contact_form {
  position: absolute;
  top: 18vw;
}
#contact .contact_form .accordion_title {
  background-color: #f3efe0;
}
#contact .contact_form .form_content {
  margin: 4vw 0;
}
#contact .contact_form {
  width: 100%;
}
#contact .contact_form {
  width: 100%;
  display: block;
  text-align: left;
}
#contact .contact_form label {
  margin: 1.5vw 0 0.4vw;
  display: block;
  font-weight: bold;
  font-size: 1.375vw;
}
#contact .contact_form .wpcf7-form-control-wrap {
  width: 100%;
  display: block;
}

#contact .contact_form .form_select p {
  margin: 0;
}

#contact .contact_form .wpcf7-form-control-wrap select,
#contact .contact_form .wpcf7-form-control-wrap input {
  width: 100%;
  height: 3.125vw;
  min-height: 40px;
  padding: 0.6vw;
}
#contact .contact_form .wpcf7-form-control-wrap textarea {
  width: 100%;
  height: 15.625vw;
  padding: 0.6vw;
}
#contact .contact_form .wpcf7-form-control-wrap select,
#contact .contact_form .wpcf7-form-control-wrap input,
#contact .contact_form .wpcf7-form-control-wrap textarea {
  color: #49270a;
  border: solid 2px #49270a;
  border-radius: 4px;
}

#contact .contact_form .wpcf7-form-control-wrap select {
  width: 100%;
  padding: 0.6vw;
  color: #49270a;
  border: solid 2px #49270a;
  border-radius: 4px;
}
input::placeholder {
  color: rgba(73, 39, 10, 0.5);
}
input::-ms-input-placeholder {
  color: rgba(73, 39, 10, 0.5);
} /* Edge */

#contact .contact_form button p {
  margin: 0;
}
.wpcf7-submit {
  width: 29.188vw;
  height: 4.938vw;
  font-size: 1.125vw;
  background-color: unset;
  border: none;
  border-radius: 0;
  color: #fef6f0;
}
.btn_nomal:hover .wpcf7-submit {
  color: #49270a;
}
#contact .btn_nomal {
  margin: 6vw auto 5.5vw;
}

.totop {
  display: block;
  margin: 4.5vw auto 0vw;
  width: 3.763vw;
}

@media all and (max-width: 750px) {
  .only_pc {
    display: none !important;
  }
  .only_sp {
    display: block !important;
  }

  .wrapper {
    padding: 25vw 0 10vw;
  }
  .section_tit {
    margin-bottom: 10vw;
  }
  .section_tit h1 {
    font-size: 8vw !important;
    letter-spacing: 0.96vw !important;
  }
  .section_tit p {
    font-size: 3.2vw !important;
    letter-spacing: 0.384vw !important;
  }

  .btn_action {
    width: 49.6vw;
    height: 14.533vw;
    margin: 15vw auto 0 auto;
    border: 1px solid #49270a;
  }
  .btn_push {
    width: 49.6vw;
    height: 14.533vw;
    font-size: 1.125vw;
    top: -2.4vw;
    left: -2.3vw;
    border: 1px solid #49270a;
  }
  .btn_push img {
    width: 6.8vw;
  }
  .arrow_box {
    right: 3.5vw;
    top: 5.3vw;
  }
  .sns_box {
    left: 6.3vw;
    top: 4.1vw;
  }

  .btn_push:active {
    transform: translate(1.9vw, 1.9vw);
  }

  .btn_nomal {
    width: 100%;
    box-sizing: border-box;
    height: 14.533vw;
  }
  .btn_nomal .btn_arrow {
    width: 6.8vw;
    top: 44%;
    right: 7%;
  }

  .text {
    font-size: 3.733vw;
  }

  .marker-animation.active {
    background-position: -100% 3.8vw;
  }
  .marker-animation {
    background-size: 200% 3.5vw;
    background-position: 0 1.8vw;
  }

  #contact .contact_btns {
    padding: 10vw 6.4vw;
    margin-top: 0;
  }
  #contact .contact_btns .contact_title {
    height: 16.4vw;
    display: inline-flex;
    padding: 0 0 0 1.8vw;
  }
  #contact .contact_btns .contact_title .contact_title_img {
    width: 16.133vw;
    margin-right: 2vw;
  }
  #contact .contact_btns .contact_title .contact_title_text {
    width: 80%;
  }
  #contact .contact_btns .contact_title .contact_title_text .text_25px {
    font-size: 4.267vw !important;
  }
  #contact .contact_btns .contact_title .contact_title_text p {
    line-height: 1.5;
    font-size: 4.267vw;
  }
  #contact .accordion_title {
    height: 14.533vw;
  }
  #contact .accordion_title p {
    font-size: 3.6vw;
  }
  #contact .accordion_title .accordion_arrow {
    width: 4.221vw;
    right: 5vw;
  }
  #contact .accordion_item:first-of-type {
    margin-bottom: 3vw;
  }
  #contact .accordion_content {
    padding: 1vw 4vw 7vw;
  }
  #contact #message .accordion_content {
    padding: 4vw;
  }
  #contact .accordion_content .accordion_content_tit {
    font-size: 5.333vw !important;
  }
  #contact .accordion_content .step_box {
    margin: 3vw 0;
  }
  #contact .accordion_content .step_box .step_no {
    font-size: 5.333vw !important;
  }
  #contact .accordion_content .step_box .step_no .number {
    font-size: 8vw !important;
  }
  #contact .accordion_content .btn_nomal {
    width: 77.067vw;
    height: 14.533vw;
    margin: 8vw 0 4vw;
  }
  #contact .accordion_content .btn_action {
    width: 74.933vw;
    height: 14.533vw;
    margin: 11vw auto 7vw auto;
  }
  #contact .accordion_content .btn_push {
    width: 74.933vw;
    height: 14.533vw;
  }
  #contact .accordion_content .btn_push img {
    width: 6.8vw;
  }

  #contact .contact_form {
    padding: 10vw 6.4vw 0vw;
  }
  #contact #contact_form {
    top: 35vw;
  }
  #contact .contact_form .form_content {
    margin: 10vw 0px 0;
  }
  #contact .contact_form label {
    font-size: 4.267vw !important;
    margin: 3vw 0 0.8vw;
  }
  #contact .contact_form .wpcf7-form-control-wrap select,
  #contact .contact_form .wpcf7-form-control-wrap input {
    height: 10.133vw;
    min-height: 38px;
    padding: 2vw;
  }
  #contact .contact_form .wpcf7-form-control-wrap textarea {
    height: 41.333vw;
    padding: 2vw;
  }
  #contact .contact_form .form_content .btn_nomal {
    margin: 15vw auto 0;
  }
  .wpcf7-submit {
    width: 100%;
    height: 14.533vw;
    font-size: 3.733vw;
  }

  .totop {
    margin: 14vw auto 3vw auto;
    width: 12vw;
  }
  .totop img {
    width: 11vw;
  }
}
/*___CONTACT*/


@media (min-width: 768px) {
  .u-sp {
    display: none;
  }
}