@charset "UTF-8";
.form_part,
.preview_wrap {
  --labelColor: var(--formLabelColor);
  --borderColor: var(--formBorderColor);
  --bgColor: var(--formBgColor);
  --borderWidth: var(--formBorder);
  --partsRadius: var(--formRadius);
  --h: var(--formPartHeight);
  --topPadding: var(--formPartPaddingRow);
  --bottomPadding: var(--formPartPaddingRow);
  --leftPadding: var(--formPartPaddingColumn);
  --rightPadding: var(--formPartPaddingColumn);
  --formPartTextColor: var(--formTextColor);
  display: flex;
  flex-direction: column;
  grid-gap: var(--space1);
  margin-bottom: var(--space3);
  width: 100%; }
  .form_part .label,
  .preview_wrap .label {
    color: var(--labelColor);
    font-size: var(--fontSize_s);
    font-family: "Montserrat", "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 800;
    font-style: normal; }
  .form_part input.empty,
  .form_part select.empty,
  .form_part textarea.empty,
  .preview_wrap input.empty,
  .preview_wrap select.empty,
  .preview_wrap textarea.empty {
    --borderColor:var(--colorRed); }

.require::before {
  content: "*";
  color: #C53027; }

.input_wrap,
.select_wrap,
.textarea_wrap {
  position: relative; }

input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=submit]):not([type=button]),
select,
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
  display: block;
  border: var(--borderWidth) solid var(--borderColor);
  background: var(--bgColor);
  border-radius: var(--partsRadius);
  padding: var(--topPadding) var(--rightPadding) var(--bottomPadding) var(--leftPadding);
  height: var(--h);
  width: 100%;
  box-sizing: border-box;
  font-size: var(--fontSize);
  color: var(--formPartTextColor); }
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=submit]):not([type=button])::placeholder,
  select::placeholder,
  textarea::placeholder {
    color: var(--tertiaryColor); }

select.empty {
  color: var(--tertiaryColor); }

.select_wrap {
  --rightPadding: calc(var(--formPartPaddingColumn) + var(--space2)); }
  .select_wrap::after {
    width: 8px;
    height: 6px;
    background: var(--primaryColor);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: calc(var(--formPartPaddingColumn) + (var(--space2) - 8px) / 2);
    margin: auto;
    pointer-events: none; }

textarea {
  font-family: "Montserrat", "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  height: auto; }

label {
  position: relative;
  cursor: pointer;
  --crHeight: calc(var(--h) * 2 / 5);
  --bgColor: #FFF;
  --borderColor: var(--secondaryColor); }
  label input[type=checkbox], label input[type=radio] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    filter: Alpha(opacity=0); }
    label input[type=checkbox] + .txt, label input[type=radio] + .txt {
      position: relative;
      display: flex;
      width: fit-content;
      grid-gap: var(--space1);
      align-items: center;
      flex-wrap: wrap; }
      label input[type=checkbox] + .txt::before, label input[type=radio] + .txt::before {
        width: var(--crHeight);
        height: var(--crHeight);
        content: "";
        border: var(--borderWidth) solid var(--borderColor);
        background: var(--bgColor);
        box-sizing: border-box; }
      label input[type=checkbox] + .txt::after, label input[type=radio] + .txt::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto;
        transition: var(-animationDuration) opacity; }
    label input[type=checkbox]:not(:checked) + .txt::after, label input[type=radio]:not(:checked) + .txt::after {
      opacity: 0;
      filter: Alpha(opacity=0); }
    label input[type=checkbox].empty + .txt, label input[type=radio].empty + .txt {
      --borderColor:var(--colorRed); }
  label input[type=checkbox] + .txt::after {
    width: 10px;
    height: 7px;
    border-width: 3px;
    border-style: solid;
    border-color: transparent transparent var(--primaryColor) var(--primaryColor);
    transform: translateY(-3px) rotate(-45deg);
    left: 3px; }
  label input[type=radio] + .txt::before {
    border-radius: 50%; }
  label input[type=radio] + .txt::after {
    width: calc(var(--crHeight) - 3px * 2);
    height: calc(var(--crHeight) - 3px * 2);
    border-radius: 50%;
    box-sizing: border-box;
    left: 4px;
    background: var(--primaryColor); }

.radio_wrap,
.checkbox_wrap {
  display: flex;
  flex-direction: row;
  grid-gap: var(--columnRowGap) var(--columnColumnGap);
  flex-wrap: wrap;
  width: 100%; }
  .radio_wrap label,
  .checkbox_wrap label {
    margin-right: 0;
    background: #FFF;
    border-radius: var(--radius);
    min-height: var(--h);
    align-items: center;
    display: flex;
    box-sizing: border-box;
    padding: calc( var(--space1) / 2 ) var(--space1);
    box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.1); }
    .radio_wrap label input[type=checkbox] + .txt::after, .radio_wrap label input[type=radio] + .txt::after,
    .checkbox_wrap label input[type=checkbox] + .txt::after,
    .checkbox_wrap label input[type=radio] + .txt::after {
      background: url("../images/common/icon_check.png") no-repeat center center;
      background-size: contain;
      width: 14px !important;
      height: 10px !important;
      border: 0 !important;
      transform: none;
      top: 0 !important;
      bottom: 0 !important;
      left: calc( ( var(--crHeight) - 14px ) / 2 );
      margin: auto !important; }
    .radio_wrap label input[type=checkbox]:checked + .txt::before, .radio_wrap label input[type=radio]:checked + .txt::before,
    .checkbox_wrap label input[type=checkbox]:checked + .txt::before,
    .checkbox_wrap label input[type=radio]:checked + .txt::before {
      background: var(--primaryColor);
      border-color: var(--primaryColor); }
    .radio_wrap label input[type=checkbox] + .txt::before,
    .checkbox_wrap label input[type=checkbox] + .txt::before {
      border-radius: 4px !important; }
  @media (min-width: 768px) {
    .radio_wrap label,
    .checkbox_wrap label {
      min-height: 74px;
      padding-left: var(--space2);
      padding-right: var(--space2); }
      .radio_wrap label input[type=checkbox] + .txt, .radio_wrap label input[type=radio] + .txt,
      .checkbox_wrap label input[type=checkbox] + .txt,
      .checkbox_wrap label input[type=radio] + .txt {
        grid-gap: var(--space2); } }
  @media (min-width: 1280px) {
    .radio_wrap label,
    .checkbox_wrap label {
      padding-left: var(--space3);
      padding-right: var(--space3); }
      .radio_wrap label input[type=checkbox] + .txt, .radio_wrap label input[type=radio] + .txt,
      .checkbox_wrap label input[type=checkbox] + .txt,
      .checkbox_wrap label input[type=radio] + .txt {
        grid-gap: var(--space3); } }

.search_wrap {
  position: relative; }
  .search_wrap > input {
    padding-right: calc(var(--formPartHeight) / 2 + var(--rightPadding)) !important; }
  .search_wrap > button {
    left: auto;
    width: calc(var(--formPartHeight) / 2);
    height: calc(var(--formPartHeight) / 2);
    right: 10px;
    border: 0;
    background: none; }
    .search_wrap > button .icon {
      display: block;
      background-image: url("../images/icon/search.svg");
      background-size: contain;
      width: 100%;
      height: 100%; }

.password_wrap {
  position: relative; }
  .password_wrap input + .btn {
    left: auto;
    right: var(--space2);
    width: calc( var(--h) * 3 / 4 );
    height: calc( var(--h) * 3 / 4 );
    border-radius: 50%;
    border: 0;
    background: var(--primaryColor);
    color: #FFF;
    box-sizing: border-box;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center; }
    .password_wrap input + .btn::before {
      content: "表示";
      font-size: var(--fontSize_ss); }
  .password_wrap input[type=text] + btn::before {
    content: "非表示"; }

.form_part.for_agree .wpcf7-form-control-wrap {
  width: auto; }
  .form_part.for_agree .wpcf7-form-control-wrap .wpcf7-list-item {
    margin-left: 0;
    margin-right: 0; }

.form_wrap {
  max-width: 620px; }
  .form_wrap .to_link {
    flex-direction: column;
    align-items: flex-start;
    margin-top: var(--space5); }
    .form_wrap .to_link .a.confirm, .form_wrap .to_link .a.send, .form_wrap .to_link .a.submit {
      width: 100%;
      max-width: 480px; }

.flex_line {
  display: flex;
  grid-gap: var(--space1);
  flex-wrap: wrap;
  align-items: center; }
  .flex_line > p {
    display: none; }
  .flex_line > .label {
    font-size: 0.86rem;
    width: 100%; }

.w25p {
  width: 25%; }

.w50p {
  width: 50%; }

.privacy_text {
  box-sizing: border-box;
  border: 1px solid var(--baseBorderColor);
  background: #FFF;
  height: 240px; }
  .privacy_text .inner {
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    box-sizing: border-box;
    padding: var(--space3) var(--space2); }

.preview_wrap {
  border-bottom: 1px solid var(--baseBorderColor);
  box-sizing: border-box;
  padding-bottom: var(--space1); }
  .preview_wrap:last-child {
    margin-bottom: 0px; }

.block_form[mode=preview] .for_edit {
  display: none !important; }
.block_form[mode=preview] .preview_wrap .cont {
  min-height: calc( var(--fontSize_n) * 1.3 + var(--space1) ); }
.block_form[mode=edit] .for_preview {
  display: none !important; }

.filtering_wrap {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  grid-gap: var(--space1) var(--space2);
  width: 100%; }
  .filtering_wrap > .to_link .a {
    min-width: 0px; }
  @media (min-width: 768px) {
    .filtering_wrap {
      flex-direction: row;
      justify-content: space-between; }
      .filtering_wrap > .to_link {
        margin-top: calc( var(--fontSize_s) * 1.5 + var(--space1) ); } }
