@charset "UTF-8";

/* Scss Document */

/*******************************************************************/

/*******************************************************************/

.contact_box {

  background-color: #F7F8F8;

  padding: 200px 60px; }



/*max-width:1280px*/

@media (max-width: 1024px) {

  .contact_box {

    padding: 100px 0 200px; } }

/*max-width:1024px*/

@media (max-width: 768px) {

  .contact_box {

    padding: 50px 0 150px; } }

/*max-width:768px*/

@media (max-width: 480px) {

  .contact_box {

    padding: 50px 0 100px; } }

/*max-width:480px*/

/**************************************************************/

.tell_box {

  background-color: #fff;

  padding: 90px 0;

  border: 1px solid #C3C6CD;

  width: calc(100% - 40px);

  margin: 0 auto 50px;

  max-width: 1000px;

  color: #384158; }

  .tell_box h2 {

    font: 2.6rem/1.0em 'Noto Serif JP', serif;

    font-weight: 500;

    text-align: center;

    margin: 0 auto 35px;

    letter-spacing: 0.1em; }

  .tell_box a {

    letter-spacing: 0.1em;

    color: #384158;

    font: 4.2rem/1.0em 'Noto Serif JP', serif;

    font-weight: 500;

    text-align: center;

    display: block;

    width: fit-content;

    margin: 0 auto; }



/*max-width:1280px*/

/*max-width:1024px*/

@media (max-width: 768px) {

  .tell_box {

    padding: 50px 0;

    margin: 0 auto 30px; }

    .tell_box h2 {

      font: 2.0rem/1.0em 'Noto Serif JP', serif;

      font-weight: 500;

      margin: 0 auto 20px; }

    .tell_box a {

      font: 3.5rem/1.0em 'Noto Serif JP', serif;

      font-weight: 500; } }

/*max-width:768px*/

@media (max-width: 480px) {

  .tell_box {

    border: 1px solid #C3C6CD;

    width: calc(100% - 20px);

    max-width: 320px;

    padding: 50px 0;

    margin: 0 auto 30px; }

    .tell_box h2 {

      font: 1.7rem/1.0em 'Noto Serif JP', serif;

      font-weight: 500;

      margin: 0 auto 20px; }

    .tell_box a {

      font: 2.6rem/1.0em 'Noto Serif JP', serif;

      font-weight: 500; } }

/*max-width:480px*/

/**************************************************************/

.mail_box {

  color: #384158;

  max-width: 1000px;

  background-color: #fff;

  padding: 90px 0;

  border: 1px solid #C3C6CD;

  width: calc(100% - 40px);

  margin: 0 auto; }

  .mail_box.comp {

    margin: 0 auto 50px; }

    .mail_box.comp p {

      margin: 50px auto 0; }

  .mail_box h2 {

    font: 2.6rem/1.0em 'Noto Serif JP', serif;

    font-weight: 500;

    text-align: center;

    margin: 0 auto 50px;

    letter-spacing: 0.1em; }

  .mail_box .head {

    letter-spacing: 0.1em;

    font: 2.0rem/1.8em 'Noto Serif JP', serif;

    font-weight: 500;

    text-align: center;

    margin: 0 auto 30px; }

    .mail_box .head br {

      display: none; }

  .mail_box .txt {

    font: 1.6rem/2.2em 'Noto Sans JP', sans-serif;

    font-weight: 400;

    margin: 0 auto 80px;

    text-align: center; }

  .mail_box .privacy {

    font: 1.6rem/2.0em 'Noto Serif JP', serif;

    font-weight: 500;

    text-align: center;

    margin: 0 auto 70px; }

    .mail_box .privacy a {

      color: #287FC4;

      text-decoration: underline; }

      .mail_box .privacy a:hover {

        color: #fff; }

    .mail_box .privacy br {

      display: none; }

  .mail_box table {

    margin: 0 auto 70px;

    width: calc(100% - 40px);

    max-width: 800px;

    border-top: 1px solid #ccc; }

  .mail_box tr {

    border-bottom: 1px solid #ccc; }

  .mail_box th {

    width: 240px;

    font: 1.6rem/1.0em 'Noto Serif JP', serif;

    font-weight: 500;

    padding: 20px 0; }

  .mail_box .need {

    display: inline-block;

    color: #fff;

    background-color: #C20018;

    font: 1.2rem/1.0em 'Noto Sans JP', sans-serif;

    font-weight: 400;

    padding: 3px 5px 4px;

    margin: 0 0 0 10px; }

  .mail_box .sub {

    display: block;

    margin: 5px 0 0;

    padding: 0 0 0 14px;

    font: 1.4rem/1.6em 'Noto Serif JP', serif;

    font-weight: 400;

    position: relative; }

    .mail_box .sub:before {

      display: block;

      position: absolute;

      content: "※";

      left: 0; }

  .mail_box td {

    font: 1.6rem/1.0em 'Noto Serif JP', serif;

    font-weight: 500;

    padding: 20px 0;

    width: calc(100% - 240px); }

    .mail_box td p {

      font: 1.6rem/1.0em 'Noto Serif JP', serif;

      font-weight: 500;

      margin: 0 0 10px; }

  .mail_box .mb20 {

    margin-bottom: 20px !important; }

  .mail_box .ml-5 {

    margin-left: -5px !important; }



/*max-width:1280px*/

/*max-width:1024px*/

@media (max-width: 768px) {

  .mail_box {

    padding: 50px 10px; }

    .mail_box h2 {

      font: 2.0rem/1.0em 'Noto Serif JP', serif;

      font-weight: 500;

      text-align: center;

      margin: 0 auto 50px; }

    .mail_box .head {

      font: 1.8rem/1.8em 'Noto Serif JP', serif;

      font-weight: 500;

      text-align: center;

      margin: 0 auto 30px; }

      .mail_box .head br {

        display: block; }

    .mail_box .txt {

      font: 1.6rem/2.2em 'Noto Sans JP', sans-serif;

      font-weight: 400;

      margin: 0 auto 50px;

      text-align: left;

      max-width: 480px;

      padding: 0 20px;

      text-align: justify;

      text-justify: inter-ideograph; }

    .mail_box .privacy {

      font: 1.6rem/2.0em 'Noto Serif JP', serif;

      font-weight: 500;

      text-align: center;

      margin: 0 auto 40px; }

      .mail_box .privacy br {

        display: block; }

    .mail_box table {

      margin: 0 auto 40px;

      width: calc(100% - 20px);

      max-width: 800px; }

    .mail_box tr {

      border-bottom: 1px solid #ccc;

      display: block;

      width: 100%; }

    .mail_box th {

      display: block;

      width: 100%;

      font: 1.6rem/1.0em 'Noto Serif JP', serif;

      font-weight: 500;

      padding: 15px 0;

      background-color: #efefef; }

    .mail_box .sub br {

      display: none; }

    .mail_box td {

      padding: 20px 0 35px;

      display: block;

      width: 100%; }

      .mail_box td p {

        font: 1.5rem/1.0em 'Noto Serif JP', serif;

        font-weight: 500;

        margin: 0 0 10px; } }

/*max-width:768px*/

@media (max-width: 480px) {

  .mail_box {

    border: 1px solid #C3C6CD;

    width: calc(100% - 20px);

    padding: 50px 10px;

    max-width: 320px; }

    .mail_box h2 {

      font: 1.7rem/1.0em 'Noto Serif JP', serif;

      font-weight: 500;

      text-align: center;

      margin: 0 auto 20px; }

    .mail_box .head {

      font: 1.5rem/1.8em 'Noto Serif JP', serif;

      font-weight: 500;

      margin: 0 auto 20px;

      letter-spacing: 0; }

    .mail_box .txt {

      font: 1.4rem/1.8em 'Noto Sans JP', sans-serif;

      font-weight: 400;

      padding: 0 10px; }

    .mail_box .privacy {

      font: 1.5rem/2.0em 'Noto Serif JP', serif;

      font-weight: 500;

      text-align: center;

      margin: 0 auto 40px; }

      .mail_box .privacy br {

        display: block; }

    .mail_box th {

      font: 1.5rem/1.0em 'Noto Serif JP', serif;

      font-weight: 500;

      background-color: #fff !important; } }

/*max-width:480px*/

/**************************************************************/

/**************************************************************/

input[type="text"],

input[type="email"] {

  width: 100%;

  padding: 10px;

  font: 1.6rem/1.8em 'Noto Sans JP', sans-serif;

  font-weight: 400;

  border: none;

  outline: none;

  background-color: #F7F8F8; }



input[type="button"],

input[type="submit"] {

  background-color: #384158;

  text-align: center;

  max-width: 400px;

  width: calc(100% - 20px);

  text-align: center;

  color: #fff;

  font: 1.8rem/68px 'Noto Serif JP', serif;

  font-weight: 700;

  margin: 0 auto;

  display: block;

  border: 2px solid #384158; }

  input[type="button"]:hover,

  input[type="submit"]:hover {

    color: #384158;

    background-color: #fff;

    cursor: pointer; }



textarea {

  width: 100%;

  padding: 10px;

  font: 1.6rem/1.8em 'Noto Sans JP', sans-serif;

  font-weight: 400;

  border: none;

  outline: none;

  background-color: #F7F8F8;

  height: 180px; }

  textarea.h250 {

    height: 250px; }



/*max-width:1280px*/

/*max-width:1024px*/

/*max-width:768px*/

@media (max-width: 480px) {

  textarea {

    width: 100%;

    padding: 10px;

    font: 1.6rem/1.8em 'Noto Sans JP', sans-serif;

    font-weight: 400;

    border: none;

    outline: none;

    background-color: #F7F8F8;

    height: 150px; }

    textarea.h250 {

      height: 180px; }



  input[type="button"],

  input[type="submit"] {

    max-width: 400px;

    width: calc(100% - 40px);

    font: 1.6rem/58px 'Noto Serif JP', serif;

    font-weight: 700; } }

/*max-width:480px*/

/**************************************************************/

/**************************************************************/

input[type="radio"],

input[type="checkbox"] {

  display: none; }



.mwform-radio-field-text {

  margin-right: 20px;

  position: relative;

  padding: 0 0 0 25px; }



.mwform-radio-field {

  display: block;

  margin-bottom: 10px;

  width: 100% !important; }



td .mwform-radio-field:nth-child(1) {

  display: block;

  margin-top: 10px; }



.mw_wp_form .horizontal-item + .horizontal-item {

  margin: 0 0 10px !important; }



.mwform-checkbox-field,

.mwform-radio-field {

  max-width: 100%;

  width: 100%;

  display: block;

  margin: 10px 0 0; }

  .mwform-checkbox-field label,

  .mwform-radio-field label {

    font: 16px/1.6em 'Noto Serif JP', serif;

    font-weight: 500;

    width: 100%; }

    .mwform-checkbox-field label:hover,

    .mwform-radio-field label:hover {

      cursor: pointer; }



.mwform-checkbox-field-text {

  margin-right: 20px;

  position: relative;

  padding: 0 0 0 40px; }

  .mwform-checkbox-field-text a {

    text-decoration: underline; }



.mwform-radio-field-text:after,

.mwform-radio-field-text:before,

.mwform-checkbox-field-text:after,

.mwform-checkbox-field-text:before {

  position: absolute;

  content: "";

  display: block;

  top: 13px; }



.mwform-radio-field-text:after {

  left: 0px;

  margin-top: -10px;

  width: 16px;

  height: 16px;

  border: 1px solid #ebebeb;

  background-color: #ebebeb;

  border-radius: 50%; }



.mwform-radio-field-text:before {

  left: 3px;

  margin-top: -7px;

  width: 12px;

  height: 12px;

  background: #C20018;

  border-radius: 50%;

  opacity: 0;

  z-index: 1; }



.mwform-checkbox-field-text:after {

  left: 0;

  margin-top: -14px;

  width: 25px;

  height: 25px;

  border: 1px solid #000;

  background-color: #fff; }



.mwform-checkbox-field-text:before {

  content: '';

  display: block;

  position: absolute;

  top: 0px;

  left: 0;

  width: 25px;

  height: 8px;

  border-left: 6px solid #6B61A9;

  border-bottom: 6px solid #6B61A9;

  transform: rotate(-45deg);

  opacity: 0;

  z-index: 1; }



input[type=radio]:checked + .mwform-radio-field-text:before,

input[type=checkbox]:checked + .mwform-checkbox-field-text:before {

  opacity: 1; }



.mwform-radio-field-text:hover:after {

  border-color: #C20018; }



.mwform-checkbox-field-text:hover:after {

  border-color: #C20018; }



/**************************************************************/

/**************************************************************/

.modal-wrapper {

  z-index: 99999;

  position: fixed;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  padding: 40px 10px;

  text-align: center; }



/*ラベルホバー時*/

.modal-button:hover {

  color: #FFFFFF;

  background-color: #4f96f6;

  transition: .6s; }



.modal-wrapper:not(:target) {

  opacity: 0;

  visibility: hidden;

  transition: opacity .3s, visibility .3s; }



.modal-wrapper:target {

  opacity: 1;

  visibility: visible;

  transition: opacity .4s, visibility .4s; }



.modal-wrapper::after {

  display: inline-block;

  height: 100%;

  margin-left: -.05em;

  vertical-align: middle;

  content: ""; }



.modal-wrapper .modal-window {

  box-sizing: border-box;

  display: inline-block;

  z-index: 20;

  position: relative;

  width: calc(100% - 40px);

  max-width: 840px;

  height: calc(100% - 40px);

  padding: 40px;

  border-radius: 2px;

  background: #fff;

  box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);

  vertical-align: middle;

  overflow-y: scroll; }



.modal-wrapper .modal-window .modal-content {

  color: #384158; }

  .modal-wrapper .modal-window .modal-content h2 {

    font: 2.8rem/1.0em 'Noto Serif JP', serif;

    font-weight: 500;

    margin: 0;

    padding: 60px 0 100px;

    letter-spacing: 0.1em; }

    .modal-wrapper .modal-window .modal-content h2 small {

      font: 1.6rem/1.0em 'Noto Serif JP', serif;

      font-weight: 500;

      display: block;

      margin: 0 auto 30px; }

  .modal-wrapper .modal-window .modal-content dl {

    border-top: #C3C6CD 1px solid;

    text-align: left;

    padding: 40px 0; }

  .modal-wrapper .modal-window .modal-content dt {

    font: 1.8rem/2.0em 'Noto Serif JP', serif;

    font-weight: 500;

    margin: 0 0 5px; }

  .modal-wrapper .modal-window .modal-content dd {

    font: 1.6rem/2.0em 'Noto Serif JP', serif;

    font-weight: 400;

    margin: 0 0 30px; }

    .modal-wrapper .modal-window .modal-content dd:last-of-type {

      margin: 0 0 0; }

  .modal-wrapper .modal-window .modal-content div dt {

    position: relative;

    padding: 0 0 0 18px; }

    .modal-wrapper .modal-window .modal-content div dt:before {

      position: absolute;

      content: "";

      width: 14px;

      height: 14px;

      background-color: #C3C6CD;

      display: block;

      border-radius: 50%;

      top: 11px;

      left: 0; }



.modal-overlay {

  z-index: 10;

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  background: rgba(0, 0, 0, 0.8); }



.modal-wrapper .modal-close.circle {

  z-index: 20;

  position: absolute;

  top: 10px;

  right: 10px;

  width: 50px;

  height: 50px;

  text-align: center;

  background: linear-gradient(90deg, #0080BF, #18A068);

  color: #fff;

  border-radius: 50%;

  font: 30px/48px 'Noto Sans JP', sans-serif;

  font-weight: 300; }

  .modal-wrapper .modal-close.circle:hover {

    color: #fff !important;

    background: linear-gradient(90deg, #384158, #384158); }

.modal-wrapper .modal-close.btn {

  color: #fff;

  display: block;

  background-color: #384158;

  color: #fff;

  margin: 30px auto 0;

  max-width: 400px;

  width: 100%;

  height: 70px;

  font: 18px/68px 'Noto Serif JP', serif;

  font-weight: 500;

  border: 1px solid #384158; }

  .modal-wrapper .modal-close.btn:hover {

    color: #384158;

    background-color: #fff; }



/*max-width:1280px*/

/*max-width:1024px*/

/*max-width:768px*/

@media (max-width: 480px) {

  .modal-wrapper .modal-window {

    width: calc(100% - 20px);

    height: calc(100% - 20px);

    padding: 60px 20px 40px; }



  .modal-wrapper .modal-window .modal-content h2 {

    font: 2.0rem/1.0em 'Noto Serif JP', serif;

    font-weight: 500;

    margin: 0 0 30px; }

    .modal-wrapper .modal-window .modal-content h2 small {

      font: 1.4rem/1.0em 'Noto Serif JP', serif;

      font-weight: 500;

      display: block;

      margin: 0 auto 20px; }

  .modal-wrapper .modal-window .modal-content dl {

    padding: 30px 0; }

  .modal-wrapper .modal-window .modal-content dt {

    font: 1.6rem/2.0em 'Noto Serif JP', serif;

    font-weight: 500; }

  .modal-wrapper .modal-window .modal-content dd {

    font: 1.5rem/1.8em 'Noto Serif JP', serif;

    font-weight: 400; }

  .modal-wrapper .modal-window .modal-content div dt:before {

    top: 9px;

    left: 0; }



  .modal-wrapper .modal-close.circle {

    z-index: 20;

    position: absolute;

    top: 5px;

    right: 5px;

    width: 50px;

    height: 50px;

    text-align: center;

    background: linear-gradient(90deg, #0080BF, #18A068);

    color: #fff;

    border-radius: 50%;

    font: 30px/48px 'Noto Sans JP', sans-serif;

    font-weight: 300; }

    .modal-wrapper .modal-close.circle:hover {

      color: #fff !important;

      background: linear-gradient(90deg, #384158, #384158); }

  .modal-wrapper .modal-close.btn {

    color: #fff;

    display: block;

    background-color: #384158;

    color: #fff;

    margin: 20px auto 0;

    max-width: 280px;

    width: 100%;

    height: 60px;

    font: 18px/58px 'Noto Serif JP', serif;

    font-weight: 500;

    border: 1px solid #384158; }

    .modal-wrapper .modal-close.btn:hover {

      color: #384158;

      background-color: #fff; } }

/*max-width:480px*/