@charset "UTF-8";
/* ===================================================================
CSS information

file name  : _settings.scss
author     : Abilive
style info : Forwarder for all foundation settings
=================================================================== */
/* ===================================================================
   foundation/_variables.scss
   style info : Design tokens — all Sass variables
=================================================================== */
:root {
  --base: 14;
  --bp-tab: 1199px;
  --bp-sp: 767px;
  --column-width: 1280px;
  --base-size: 14px;
  --base-size-sp: 12px;
  --max-width-contaimer: 1360px;
  --space-screen: 40px;
  --space-section: calc(120/var(--base) * 1em);
  --base-color: #1C1D1C;
  --base-color-rgb: 28, 29, 28;
  --c-cvr: #915444;
  --c-white: #fff;
  --c-gray-dark: #444444;
  --c-gray-medium: #999999;
  --c-gray-light: #F5F5F5;
  --bg-white-1: url(../images/common/bg_white-1.png);
  --bg-white-2: url(../images/common/bg_white-2.png);
  --lh-100: 1;
  --lh-160: 1.6;
  --lh-200: 2;
  --fw-regular: 400;
  --fw-medium: 500;
}

@media screen and (min-width: calc(767px + 1)) and (max-width: 1199px) {
  :root {
    --space-section: calc(90/var(--base) * 1em);
  }
}
@media screen and (max-width: 767px) {
  :root {
    --space-section: calc(60/var(--base) * 1em);
  }
}
/* ===================================================================
CSS information

file name  : _settings.scss
author     : Abilive
style info : Forwarder for all foundation settings
=================================================================== */
/* ===================================================================
   foundation/_breakpoints.scss
   style info : Breakpoint variables + mq() mixin
=================================================================== */
/* ===================================================================
CSS information

file name  : _settings.scss
author     : Abilive
style info : Forwarder for all foundation settings
=================================================================== */
/* ===================================================================
   foundation/_functions.scss
   style info : Sass utility functions
=================================================================== */
/* ===================================================================
CSS information

file name  : _settings.scss
author     : Abilive
style info : Forwarder for all foundation settings
=================================================================== */
/* ===================================================================
   foundation/_mixins.scss
   style info : All reusable Sass mixins
=================================================================== */
/* ===================================================================
CSS information

file name  : _settings.scss
author     : Abilive
style info : Forwarder for all foundation settings
=================================================================== */
/* ===================================================================
   foundation/_placeholders.scss
   style info : Sass placeholders (%)
=================================================================== */
.p-contact__intro, .p-contact__flow, .p-contact__form-wrap, .p-contact__thanks {
  width: 90%;
  max-width: 1280px;
  margin: auto;
}
@media only screen and (max-width: 1199px) {
  .p-contact__intro, .p-contact__flow, .p-contact__form-wrap, .p-contact__thanks {
    width: 91.6666666667%;
  }
}

.p-contact__intro:after, .p-contact__flow:after, .p-contact__form-wrap:after, .p-contact__thanks:after {
  content: "";
  display: table;
  clear: both;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes splide-loading {
  0% {
    transform: rotateZ(0);
  }
  100% {
    transform: rotateZ(360deg);
  }
}
@keyframes scrollLine {
  0% {
    background-position: 0 -100%;
  }
  100% {
    background-position: 0 100%;
  }
}
/* ==========================================================
Utility: Spacing
-------------------------------------------------------------
Margin
  .u-m-{size}   -> margin
  .u-mx-{size}  -> margin-left + margin-right
  .u-my-{size}  -> margin-top + margin-bottom
  .u-mt-{size}  -> margin-top
  .u-mr-{size}  -> margin-right
  .u-mb-{size}  -> margin-bottom
  .u-ml-{size}  -> margin-left

Padding
  .u-p-{size}   -> padding
  .u-px-{size}  -> padding-left + padding-right
  .u-py-{size}  -> padding-top + padding-bottom
  .u-pt-{size}  -> padding-top
  .u-pr-{size}  -> padding-right
  .u-pb-{size}  -> padding-bottom
  .u-pl-{size}  -> padding-left

Example:
  <div class="u-px-20 u-py-10 u-mb-30">
    Content
  </div>
========================================================== */
/* Margin */
.u-m-0 {
  margin: calc(0 / var(--base) * 1em);
}

.u-mx-0 {
  margin-left: calc(0 / var(--base) * 1em);
  margin-right: calc(0 / var(--base) * 1em);
}

.u-my-0 {
  margin-top: calc(0 / var(--base) * 1em);
  margin-bottom: calc(0 / var(--base) * 1em);
}

.u-mt-0 {
  margin-top: calc(0 / var(--base) * 1em);
}

.u-mr-0 {
  margin-right: calc(0 / var(--base) * 1em);
}

.u-mb-0 {
  margin-bottom: calc(0 / var(--base) * 1em);
}

.u-ml-0 {
  margin-left: calc(0 / var(--base) * 1em);
}

/* Margin negative */
.u-m-n0 {
  margin: calc(0 / var(--base) * -1em);
}

.u-mx-n0 {
  margin-left: calc(0 / var(--base) * -1em);
  margin-right: calc(0 / var(--base) * -1em);
}

.u-my-n0 {
  margin-top: calc(0 / var(--base) * -1em);
  margin-bottom: calc(0 / var(--base) * -1em);
}

.u-mt-n0 {
  margin-top: calc(0 / var(--base) * -1em);
}

.u-mr-n0 {
  margin-right: calc(0 / var(--base) * -1em);
}

.u-mb-n0 {
  margin-bottom: calc(0 / var(--base) * -1em);
}

.u-ml-n0 {
  margin-left: calc(0 / var(--base) * -1em);
}

/* Padding */
.u-p-0 {
  padding: calc(0 / var(--base) * 1em);
}

.u-px-0 {
  padding-left: calc(0 / var(--base) * 1em);
  padding-right: calc(0 / var(--base) * 1em);
}

.u-py-0 {
  padding-top: calc(0 / var(--base) * 1em);
  padding-bottom: calc(0 / var(--base) * 1em);
}

.u-pt-0 {
  padding-top: calc(0 / var(--base) * 1em);
}

.u-pr-0 {
  padding-right: calc(0 / var(--base) * 1em);
}

.u-pb-0 {
  padding-bottom: calc(0 / var(--base) * 1em);
}

.u-pl-0 {
  padding-left: calc(0 / var(--base) * 1em);
}

/* Margin */
.u-m-5 {
  margin: calc(5 / var(--base) * 1em);
}

.u-mx-5 {
  margin-left: calc(5 / var(--base) * 1em);
  margin-right: calc(5 / var(--base) * 1em);
}

.u-my-5 {
  margin-top: calc(5 / var(--base) * 1em);
  margin-bottom: calc(5 / var(--base) * 1em);
}

.u-mt-5 {
  margin-top: calc(5 / var(--base) * 1em);
}

.u-mr-5 {
  margin-right: calc(5 / var(--base) * 1em);
}

.u-mb-5 {
  margin-bottom: calc(5 / var(--base) * 1em);
}

.u-ml-5 {
  margin-left: calc(5 / var(--base) * 1em);
}

/* Margin negative */
.u-m-n5 {
  margin: calc(5 / var(--base) * -1em);
}

.u-mx-n5 {
  margin-left: calc(5 / var(--base) * -1em);
  margin-right: calc(5 / var(--base) * -1em);
}

.u-my-n5 {
  margin-top: calc(5 / var(--base) * -1em);
  margin-bottom: calc(5 / var(--base) * -1em);
}

.u-mt-n5 {
  margin-top: calc(5 / var(--base) * -1em);
}

.u-mr-n5 {
  margin-right: calc(5 / var(--base) * -1em);
}

.u-mb-n5 {
  margin-bottom: calc(5 / var(--base) * -1em);
}

.u-ml-n5 {
  margin-left: calc(5 / var(--base) * -1em);
}

/* Padding */
.u-p-5 {
  padding: calc(5 / var(--base) * 1em);
}

.u-px-5 {
  padding-left: calc(5 / var(--base) * 1em);
  padding-right: calc(5 / var(--base) * 1em);
}

.u-py-5 {
  padding-top: calc(5 / var(--base) * 1em);
  padding-bottom: calc(5 / var(--base) * 1em);
}

.u-pt-5 {
  padding-top: calc(5 / var(--base) * 1em);
}

.u-pr-5 {
  padding-right: calc(5 / var(--base) * 1em);
}

.u-pb-5 {
  padding-bottom: calc(5 / var(--base) * 1em);
}

.u-pl-5 {
  padding-left: calc(5 / var(--base) * 1em);
}

/* Margin */
.u-m-10 {
  margin: calc(10 / var(--base) * 1em);
}

.u-mx-10 {
  margin-left: calc(10 / var(--base) * 1em);
  margin-right: calc(10 / var(--base) * 1em);
}

.u-my-10 {
  margin-top: calc(10 / var(--base) * 1em);
  margin-bottom: calc(10 / var(--base) * 1em);
}

.u-mt-10 {
  margin-top: calc(10 / var(--base) * 1em);
}

.u-mr-10 {
  margin-right: calc(10 / var(--base) * 1em);
}

.u-mb-10 {
  margin-bottom: calc(10 / var(--base) * 1em);
}

.u-ml-10 {
  margin-left: calc(10 / var(--base) * 1em);
}

/* Margin negative */
.u-m-n10 {
  margin: calc(10 / var(--base) * -1em);
}

.u-mx-n10 {
  margin-left: calc(10 / var(--base) * -1em);
  margin-right: calc(10 / var(--base) * -1em);
}

.u-my-n10 {
  margin-top: calc(10 / var(--base) * -1em);
  margin-bottom: calc(10 / var(--base) * -1em);
}

.u-mt-n10 {
  margin-top: calc(10 / var(--base) * -1em);
}

.u-mr-n10 {
  margin-right: calc(10 / var(--base) * -1em);
}

.u-mb-n10 {
  margin-bottom: calc(10 / var(--base) * -1em);
}

.u-ml-n10 {
  margin-left: calc(10 / var(--base) * -1em);
}

/* Padding */
.u-p-10 {
  padding: calc(10 / var(--base) * 1em);
}

.u-px-10 {
  padding-left: calc(10 / var(--base) * 1em);
  padding-right: calc(10 / var(--base) * 1em);
}

.u-py-10 {
  padding-top: calc(10 / var(--base) * 1em);
  padding-bottom: calc(10 / var(--base) * 1em);
}

.u-pt-10 {
  padding-top: calc(10 / var(--base) * 1em);
}

.u-pr-10 {
  padding-right: calc(10 / var(--base) * 1em);
}

.u-pb-10 {
  padding-bottom: calc(10 / var(--base) * 1em);
}

.u-pl-10 {
  padding-left: calc(10 / var(--base) * 1em);
}

/* Margin */
.u-m-15 {
  margin: calc(15 / var(--base) * 1em);
}

.u-mx-15 {
  margin-left: calc(15 / var(--base) * 1em);
  margin-right: calc(15 / var(--base) * 1em);
}

.u-my-15 {
  margin-top: calc(15 / var(--base) * 1em);
  margin-bottom: calc(15 / var(--base) * 1em);
}

.u-mt-15 {
  margin-top: calc(15 / var(--base) * 1em);
}

.u-mr-15 {
  margin-right: calc(15 / var(--base) * 1em);
}

.u-mb-15 {
  margin-bottom: calc(15 / var(--base) * 1em);
}

.u-ml-15 {
  margin-left: calc(15 / var(--base) * 1em);
}

/* Margin negative */
.u-m-n15 {
  margin: calc(15 / var(--base) * -1em);
}

.u-mx-n15 {
  margin-left: calc(15 / var(--base) * -1em);
  margin-right: calc(15 / var(--base) * -1em);
}

.u-my-n15 {
  margin-top: calc(15 / var(--base) * -1em);
  margin-bottom: calc(15 / var(--base) * -1em);
}

.u-mt-n15 {
  margin-top: calc(15 / var(--base) * -1em);
}

.u-mr-n15 {
  margin-right: calc(15 / var(--base) * -1em);
}

.u-mb-n15 {
  margin-bottom: calc(15 / var(--base) * -1em);
}

.u-ml-n15 {
  margin-left: calc(15 / var(--base) * -1em);
}

/* Padding */
.u-p-15 {
  padding: calc(15 / var(--base) * 1em);
}

.u-px-15 {
  padding-left: calc(15 / var(--base) * 1em);
  padding-right: calc(15 / var(--base) * 1em);
}

.u-py-15 {
  padding-top: calc(15 / var(--base) * 1em);
  padding-bottom: calc(15 / var(--base) * 1em);
}

.u-pt-15 {
  padding-top: calc(15 / var(--base) * 1em);
}

.u-pr-15 {
  padding-right: calc(15 / var(--base) * 1em);
}

.u-pb-15 {
  padding-bottom: calc(15 / var(--base) * 1em);
}

.u-pl-15 {
  padding-left: calc(15 / var(--base) * 1em);
}

/* Margin */
.u-m-20 {
  margin: calc(20 / var(--base) * 1em);
}

.u-mx-20 {
  margin-left: calc(20 / var(--base) * 1em);
  margin-right: calc(20 / var(--base) * 1em);
}

.u-my-20 {
  margin-top: calc(20 / var(--base) * 1em);
  margin-bottom: calc(20 / var(--base) * 1em);
}

.u-mt-20 {
  margin-top: calc(20 / var(--base) * 1em);
}

.u-mr-20 {
  margin-right: calc(20 / var(--base) * 1em);
}

.u-mb-20 {
  margin-bottom: calc(20 / var(--base) * 1em);
}

.u-ml-20 {
  margin-left: calc(20 / var(--base) * 1em);
}

/* Margin negative */
.u-m-n20 {
  margin: calc(20 / var(--base) * -1em);
}

.u-mx-n20 {
  margin-left: calc(20 / var(--base) * -1em);
  margin-right: calc(20 / var(--base) * -1em);
}

.u-my-n20 {
  margin-top: calc(20 / var(--base) * -1em);
  margin-bottom: calc(20 / var(--base) * -1em);
}

.u-mt-n20 {
  margin-top: calc(20 / var(--base) * -1em);
}

.u-mr-n20 {
  margin-right: calc(20 / var(--base) * -1em);
}

.u-mb-n20 {
  margin-bottom: calc(20 / var(--base) * -1em);
}

.u-ml-n20 {
  margin-left: calc(20 / var(--base) * -1em);
}

/* Padding */
.u-p-20 {
  padding: calc(20 / var(--base) * 1em);
}

.u-px-20 {
  padding-left: calc(20 / var(--base) * 1em);
  padding-right: calc(20 / var(--base) * 1em);
}

.u-py-20 {
  padding-top: calc(20 / var(--base) * 1em);
  padding-bottom: calc(20 / var(--base) * 1em);
}

.u-pt-20 {
  padding-top: calc(20 / var(--base) * 1em);
}

.u-pr-20 {
  padding-right: calc(20 / var(--base) * 1em);
}

.u-pb-20 {
  padding-bottom: calc(20 / var(--base) * 1em);
}

.u-pl-20 {
  padding-left: calc(20 / var(--base) * 1em);
}

/* Margin */
.u-m-30 {
  margin: calc(30 / var(--base) * 1em);
}

.u-mx-30 {
  margin-left: calc(30 / var(--base) * 1em);
  margin-right: calc(30 / var(--base) * 1em);
}

.u-my-30 {
  margin-top: calc(30 / var(--base) * 1em);
  margin-bottom: calc(30 / var(--base) * 1em);
}

.u-mt-30 {
  margin-top: calc(30 / var(--base) * 1em);
}

.u-mr-30 {
  margin-right: calc(30 / var(--base) * 1em);
}

.u-mb-30 {
  margin-bottom: calc(30 / var(--base) * 1em);
}

.u-ml-30 {
  margin-left: calc(30 / var(--base) * 1em);
}

/* Margin negative */
.u-m-n30 {
  margin: calc(30 / var(--base) * -1em);
}

.u-mx-n30 {
  margin-left: calc(30 / var(--base) * -1em);
  margin-right: calc(30 / var(--base) * -1em);
}

.u-my-n30 {
  margin-top: calc(30 / var(--base) * -1em);
  margin-bottom: calc(30 / var(--base) * -1em);
}

.u-mt-n30 {
  margin-top: calc(30 / var(--base) * -1em);
}

.u-mr-n30 {
  margin-right: calc(30 / var(--base) * -1em);
}

.u-mb-n30 {
  margin-bottom: calc(30 / var(--base) * -1em);
}

.u-ml-n30 {
  margin-left: calc(30 / var(--base) * -1em);
}

/* Padding */
.u-p-30 {
  padding: calc(30 / var(--base) * 1em);
}

.u-px-30 {
  padding-left: calc(30 / var(--base) * 1em);
  padding-right: calc(30 / var(--base) * 1em);
}

.u-py-30 {
  padding-top: calc(30 / var(--base) * 1em);
  padding-bottom: calc(30 / var(--base) * 1em);
}

.u-pt-30 {
  padding-top: calc(30 / var(--base) * 1em);
}

.u-pr-30 {
  padding-right: calc(30 / var(--base) * 1em);
}

.u-pb-30 {
  padding-bottom: calc(30 / var(--base) * 1em);
}

.u-pl-30 {
  padding-left: calc(30 / var(--base) * 1em);
}

/* Margin */
.u-m-40 {
  margin: calc(40 / var(--base) * 1em);
}

.u-mx-40 {
  margin-left: calc(40 / var(--base) * 1em);
  margin-right: calc(40 / var(--base) * 1em);
}

.u-my-40 {
  margin-top: calc(40 / var(--base) * 1em);
  margin-bottom: calc(40 / var(--base) * 1em);
}

.u-mt-40 {
  margin-top: calc(40 / var(--base) * 1em);
}

.u-mr-40 {
  margin-right: calc(40 / var(--base) * 1em);
}

.u-mb-40 {
  margin-bottom: calc(40 / var(--base) * 1em);
}

.u-ml-40 {
  margin-left: calc(40 / var(--base) * 1em);
}

/* Margin negative */
.u-m-n40 {
  margin: calc(40 / var(--base) * -1em);
}

.u-mx-n40 {
  margin-left: calc(40 / var(--base) * -1em);
  margin-right: calc(40 / var(--base) * -1em);
}

.u-my-n40 {
  margin-top: calc(40 / var(--base) * -1em);
  margin-bottom: calc(40 / var(--base) * -1em);
}

.u-mt-n40 {
  margin-top: calc(40 / var(--base) * -1em);
}

.u-mr-n40 {
  margin-right: calc(40 / var(--base) * -1em);
}

.u-mb-n40 {
  margin-bottom: calc(40 / var(--base) * -1em);
}

.u-ml-n40 {
  margin-left: calc(40 / var(--base) * -1em);
}

/* Padding */
.u-p-40 {
  padding: calc(40 / var(--base) * 1em);
}

.u-px-40 {
  padding-left: calc(40 / var(--base) * 1em);
  padding-right: calc(40 / var(--base) * 1em);
}

.u-py-40 {
  padding-top: calc(40 / var(--base) * 1em);
  padding-bottom: calc(40 / var(--base) * 1em);
}

.u-pt-40 {
  padding-top: calc(40 / var(--base) * 1em);
}

.u-pr-40 {
  padding-right: calc(40 / var(--base) * 1em);
}

.u-pb-40 {
  padding-bottom: calc(40 / var(--base) * 1em);
}

.u-pl-40 {
  padding-left: calc(40 / var(--base) * 1em);
}

/* Margin */
.u-m-50 {
  margin: calc(50 / var(--base) * 1em);
}

.u-mx-50 {
  margin-left: calc(50 / var(--base) * 1em);
  margin-right: calc(50 / var(--base) * 1em);
}

.u-my-50 {
  margin-top: calc(50 / var(--base) * 1em);
  margin-bottom: calc(50 / var(--base) * 1em);
}

.u-mt-50 {
  margin-top: calc(50 / var(--base) * 1em);
}

.u-mr-50 {
  margin-right: calc(50 / var(--base) * 1em);
}

.u-mb-50 {
  margin-bottom: calc(50 / var(--base) * 1em);
}

.u-ml-50 {
  margin-left: calc(50 / var(--base) * 1em);
}

/* Margin negative */
.u-m-n50 {
  margin: calc(50 / var(--base) * -1em);
}

.u-mx-n50 {
  margin-left: calc(50 / var(--base) * -1em);
  margin-right: calc(50 / var(--base) * -1em);
}

.u-my-n50 {
  margin-top: calc(50 / var(--base) * -1em);
  margin-bottom: calc(50 / var(--base) * -1em);
}

.u-mt-n50 {
  margin-top: calc(50 / var(--base) * -1em);
}

.u-mr-n50 {
  margin-right: calc(50 / var(--base) * -1em);
}

.u-mb-n50 {
  margin-bottom: calc(50 / var(--base) * -1em);
}

.u-ml-n50 {
  margin-left: calc(50 / var(--base) * -1em);
}

/* Padding */
.u-p-50 {
  padding: calc(50 / var(--base) * 1em);
}

.u-px-50 {
  padding-left: calc(50 / var(--base) * 1em);
  padding-right: calc(50 / var(--base) * 1em);
}

.u-py-50 {
  padding-top: calc(50 / var(--base) * 1em);
  padding-bottom: calc(50 / var(--base) * 1em);
}

.u-pt-50 {
  padding-top: calc(50 / var(--base) * 1em);
}

.u-pr-50 {
  padding-right: calc(50 / var(--base) * 1em);
}

.u-pb-50 {
  padding-bottom: calc(50 / var(--base) * 1em);
}

.u-pl-50 {
  padding-left: calc(50 / var(--base) * 1em);
}

/* Margin */
.u-m-60 {
  margin: calc(60 / var(--base) * 1em);
}

.u-mx-60 {
  margin-left: calc(60 / var(--base) * 1em);
  margin-right: calc(60 / var(--base) * 1em);
}

.u-my-60 {
  margin-top: calc(60 / var(--base) * 1em);
  margin-bottom: calc(60 / var(--base) * 1em);
}

.u-mt-60 {
  margin-top: calc(60 / var(--base) * 1em);
}

.u-mr-60 {
  margin-right: calc(60 / var(--base) * 1em);
}

.u-mb-60 {
  margin-bottom: calc(60 / var(--base) * 1em);
}

.u-ml-60 {
  margin-left: calc(60 / var(--base) * 1em);
}

/* Margin negative */
.u-m-n60 {
  margin: calc(60 / var(--base) * -1em);
}

.u-mx-n60 {
  margin-left: calc(60 / var(--base) * -1em);
  margin-right: calc(60 / var(--base) * -1em);
}

.u-my-n60 {
  margin-top: calc(60 / var(--base) * -1em);
  margin-bottom: calc(60 / var(--base) * -1em);
}

.u-mt-n60 {
  margin-top: calc(60 / var(--base) * -1em);
}

.u-mr-n60 {
  margin-right: calc(60 / var(--base) * -1em);
}

.u-mb-n60 {
  margin-bottom: calc(60 / var(--base) * -1em);
}

.u-ml-n60 {
  margin-left: calc(60 / var(--base) * -1em);
}

/* Padding */
.u-p-60 {
  padding: calc(60 / var(--base) * 1em);
}

.u-px-60 {
  padding-left: calc(60 / var(--base) * 1em);
  padding-right: calc(60 / var(--base) * 1em);
}

.u-py-60 {
  padding-top: calc(60 / var(--base) * 1em);
  padding-bottom: calc(60 / var(--base) * 1em);
}

.u-pt-60 {
  padding-top: calc(60 / var(--base) * 1em);
}

.u-pr-60 {
  padding-right: calc(60 / var(--base) * 1em);
}

.u-pb-60 {
  padding-bottom: calc(60 / var(--base) * 1em);
}

.u-pl-60 {
  padding-left: calc(60 / var(--base) * 1em);
}

/* ===================================================================
   pages/_contact.scss
=================================================================== */
.p-contact {
  padding-top: 2em;
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .p-contact {
    padding-top: 2em;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact {
    padding-top: 2em;
  }
}
.p-contact {
  padding-bottom: 4em;
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .p-contact {
    padding-bottom: 3em;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact {
    padding-bottom: 1em;
  }
}
.p-contact {
  /* ==========================================================
   Intro
  ========================================================== */
}
.p-contact__intro {
  margin-top: 5em;
  margin-bottom: 50px;
  padding: 1px;
  margin-top: 2em;
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .p-contact__intro {
    margin-top: 2em;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact__intro {
    margin-top: 1em;
  }
}
.p-contact__notes {
  background: var(--c-gray-light);
  padding: 3% 10%;
}
.p-contact__note {
  list-style-type: disc;
}
@media only screen and (max-width: 767px) {
  .p-contact__note {
    margin-left: 10px;
  }
}
.p-contact__required {
  color: var(--c-cvr);
  padding-right: 0.3em;
}
.p-contact {
  /* ==========================================================
   Flow
  ========================================================== */
}
.p-contact__flow {
  margin-bottom: 85px;
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .p-contact__flow {
    margin-bottom: 65px;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact__flow {
    margin-bottom: 45px;
  }
}
.p-contact__steps {
  width: 90%;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5em;
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .p-contact__steps {
    gap: 5em;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact__steps {
    gap: 2em;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact__steps {
    width: 100%;
  }
}
.p-contact__step {
  float: left;
  text-align: center;
  border: 1px solid var(--c-gray-medium);
  font-size: 110%;
  padding: 10px;
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .p-contact__step {
    font-size: 108%;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact__step {
    font-size: 86%;
    padding: 10px 0;
  }
}
.p-contact__step::after {
  content: "";
  display: inline-block;
  position: absolute;
  width: 12px;
  height: 12px;
  top: 50%;
  right: -2.75em;
  margin-top: -0.5em;
  background-color: var(--base-color);
  -webkit-mask: url("./../images/svg/icon_arrow_right.svg") no-repeat center;
  mask: url("./../images/svg/icon_arrow_right.svg") no-repeat center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
@media only screen and (max-width: 767px) {
  .p-contact__step::after {
    right: -1.8em;
  }
}
.p-contact__step--active {
  background: var(--c-gray-dark);
  border: 2px solid var(--c-gray-dark);
  color: #fff;
}
.p-contact__step--last::after {
  display: none;
}
.p-contact {
  /* ==========================================================
   Form
  ========================================================== */
}
.p-contact__form-wrap {
  margin-bottom: 3em;
}
.p-contact__table-wrap {
  width: 90%;
  margin-inline: auto;
}
@media only screen and (max-width: 767px) {
  .p-contact__table-wrap {
    width: 100%;
  }
}
.p-contact__table {
  width: 100%;
  margin: auto;
}
@media only screen and (max-width: 767px) {
  .p-contact__table {
    width: 100%;
  }
}
.p-contact__table th,
.p-contact__table td {
  padding: 1.5rem;
}
@media only screen and (max-width: 767px) {
  .p-contact__table th,
  .p-contact__table td {
    display: block;
  }
}
.p-contact__table input,
.p-contact__table select {
  padding: 0.3em 1em;
  color: #000;
}
@media only screen and (max-width: 767px) {
  .p-contact__table input,
  .p-contact__table select {
    width: 100%;
    padding: 0.3em 0.8em;
  }
}
.p-contact__row {
  width: 100%;
  margin-top: 1em;
}
.p-contact__heading {
  width: 25%;
  overflow: hidden;
  background: var(--c-gray-light);
  text-align: center;
  box-sizing: border-box;
  border-bottom: 1px solid var(--c-white);
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .p-contact__heading {
    width: 28%;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact__heading {
    width: 100%;
  }
}
.p-contact__heading span {
  color: var(--c-cvr);
  padding-left: 0.5em;
  font-size: 1em;
  box-sizing: border-box;
}
.p-contact__data {
  width: auto;
  border-bottom: 1px solid #ddd;
  box-sizing: border-box;
}
.p-contact__data input {
  box-sizing: border-box;
}
@media only screen and (min-width: 768px) {
  .p-contact__data .c-link {
    margin-left: 1em;
  }
}
.p-contact__data .error {
  color: var(--c-cvr);
  font-size: 90%;
  padding-top: 0.5em;
}
.p-contact {
  /* ==========================================================
   Agreement
  ========================================================== */
}
.p-contact__agree {
  margin-top: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .p-contact__agree {
    margin-top: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact__agree {
    margin-top: 2em;
  }
}
.p-contact__agree-text {
  letter-spacing: 2px;
  line-height: 2;
  margin-bottom: 1em;
  text-align: center;
}
.p-contact__agree-check {
  margin-top: 20px;
}
@media only screen and (max-width: 767px) {
  .p-contact__agree-check {
    margin-top: 1em;
  }
}
.p-contact__agree-check {
  text-align: center;
}
.p-contact {
  /* ==========================================================
   Buttons
  ========================================================== */
}
.p-contact__buttons {
  margin-top: 50px;
  width: 500px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(30 / var(--base) * 1em);
  max-width: 100%;
}
@media only screen and (max-width: 767px) {
  .p-contact__buttons {
    grid-template-columns: 1fr;
  }
}
.p-contact {
  /* ==========================================================
   Thanks
  ========================================================== */
}
.p-contact__thanks {
  margin-bottom: 30px;
  text-align: center;
}
.p-contact__thanks .c-title-page {
  padding-top: 0;
}
@media only screen and (max-width: 767px) {
  .p-contact__thanks .c-title-page .jp {
    letter-spacing: 0.1em;
  }
}
@media only screen and (min-width: 768px) {
  .p-contact__thanks .c-txt {
    text-align: center;
    line-height: 2.3;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact__thanks .c-txt {
    line-height: 1.8;
  }
}
.p-contact__thanks .c-link {
  margin-top: 30px;
  max-width: 100%;
  margin-inline: auto;
}
.p-contact {
  /* ==========================================================
   Appearance Reset
  ========================================================== */
}
.p-contact input[type=text],
.p-contact input[type=tel],
.p-contact input[type=email],
.p-contact input[type=submit] {
  -webkit-appearance: none;
  outline: none;
}
.p-contact input::-moz-focus-inner {
  padding: 0;
}
.p-contact input[type=checkbox],
.p-contact input[type=radio] {
  margin-right: 5px;
  -webkit-appearance: normal;
  -moz-appearance: normal;
  appearance: normal;
}
.p-contact textarea,
.p-contact input {
  padding: 5px;
  border: 1px solid #ddd;
  padding-left: 1em;
}
.p-contact select {
  -webkit-appearance: button;
  -moz-appearance: button;
  appearance: button;
  height: 42px;
  border: 1px solid #ddd;
  padding-right: 25px !important;
  margin-bottom: 1em;
}
@media only screen and (max-width: 767px) {
  .p-contact select {
    width: 30%;
  }
}
.p-contact select::-ms-expand {
  display: none;
}
.p-contact select {
  -moz-appearance: none;
  text-indent: 0.01px;
  text-overflow: "";
}
.p-contact textarea {
  -webkit-appearance: none;
  border: 1px solid #ddd;
  background: #fff;
}

/* ==========================================================
 Component
========================================================== */
.c-form-input {
  width: 60%;
  height: 42px;
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .c-form-input {
    width: 80%;
  }
}
@media only screen and (max-width: 767px) {
  .c-form-input {
    width: 91%;
    margin: 0.3em 0;
  }
}

.c-form-textarea {
  width: 95%;
  height: 150px;
}
@media only screen and (max-width: 767px) {
  .c-form-textarea {
    width: 95%;
  }
}

.c-checkbox {
  display: inline-block;
  cursor: pointer;
}
.c-checkbox__input {
  display: none;
}
.c-checkbox__input:checked + .c-checkbox__text::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: -0.2em;
  width: 0.4em;
  height: 0.8em;
  transform: rotate(42deg);
  border-bottom: 2px solid var(--c-cvr);
  border-right: 2px solid var(--c-cvr);
}
.c-checkbox__text {
  position: relative;
  padding-left: 1.5em;
  display: inline-block;
  letter-spacing: 2px;
}
.c-checkbox__text::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: -0.5em;
  width: 0.8em;
  height: 0.8em;
  border: 1px solid #aeaeae;
  border-radius: 2px;
  transform: translateY(-50%);
}
/*# sourceMappingURL=contact.css.map */