@charset "utf-8";
/*--------------------------------------------------------------------------------
  大見出し
--------------------------------------------------------------------------------*/
.c-hdline {
  text-align: center;
  position: relative;
  overflow-y: hidden;
}
.c-hdline .jp {
  display: block;
  text-align: center;
  font-weight: 900;
  font-family: var(--ff-mgo);
  font-size: var(--fs-3l);
  color: var(--blue);
  line-height: 1.3;
}
.c-hdline svg {
  line-height: 1;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  margin: 0 auto;
  width: clamp(100px, calc(120 / 500 * 100vw), 120px);
}
.c-hdline path {
  fill: none;
}
.c-hdline text {
  font-size: var(--fs-2s);
  font-weight: 900;
  fill: var(--black);
}

/*--------------------------------------------------------------------------------
  小見出し
--------------------------------------------------------------------------------*/
.c-hdline-s1 {
  border-bottom: 2px solid var(--bblue);
  font-weight: 700;
  font-family: var(--ff-mgo);
  font-size: var(--fs-2l);
  color: var(--bblue);
  line-height: 1.5;
  padding-bottom: 0.6rem;
}
.c-hdline-s2 {
  background-color: var(--bblue);
  font-weight: 700;
  font-family: var(--ff-mgo);
  font-size: var(--fs-l);
  color: #FFF;
  line-height: 1.5;
  border-radius: 0.5rem;
  padding: 0.6rem 0.8rem;
}

/*--------------------------------------------------------------------------------
  \ スラッシュ /
--------------------------------------------------------------------------------*/
.c-slash-txt {
  line-height: 1.6;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 500;
  font-family: var(--ff-mgo);
  font-size: var(--fs-m);
}
.c-slash-txt:before,
.c-slash-txt:after {
  content: "";
  align-self: flex-end;
  background-color: var(--black);
  width: 1.5em;
  height: 1px;
  margin-bottom: 0.75em;
}
.c-slash-txt:before {
  margin-right: 0.5em;
  transform: rotate(60deg);
}
.c-slash-txt:after {
  margin-left: 0.5em;
  transform: rotate(-60deg);
}
.c-slash-txt[slash-size="2"]:before,
.c-slash-txt[slash-size="2"]:after { width: 2.5em; }
.c-slash-txt[slash-size="3"]:before,
.c-slash-txt[slash-size="3"]:after { width: 3.5em; }

/*--------------------------------------------------------------------------------
  button
--------------------------------------------------------------------------------*/
.c-btn {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: inline-block;
  vertical-align: middle;
  border: none;
  margin: 0;
  outline: none;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  line-height: 1.2;
  position: relative;
  overflow: hidden;
  border-radius: 9999px;
  padding: 0.85rem 1.5rem;
  font-family: var(--ff-mgo);
  font-weight: 700;
  font-size: var(--fs-m);
}
.c-btn,
.c-btn:visited,
.c-btn:hover,
.c-btn a,
.c-btn a:visited,
.c-btn a:hover {
  text-decoration: none;
}
.c-btn[btn-size="S"] {
  padding: 0.5rem 1.25rem;
  font-size: var(--fs-n);
}
.c-btn[btn-outline="on"],
.c-btn[btn-outline="on"]:hover,
.c-btn[btn-outline="on"] a:hover {
  outline-color: #FFF;
  outline-style: solid;
  outline-width: 3px;
}
.c-btn_icon {
  pointer-events: none;
  width: 0.65rem;
  height: 0.65rem;
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  filter: #FFF;
  color: #FFF;
}

/* color
----------------------------------------*/
.c-btn,
.c-btn:visited,
.c-btn:hover,
.c-btn a,
.c-btn a:visited,
.c-btn a:hover {
  text-decoration: none;
  color: #FFF;
  background-color: var(--pink);
  border: 2px solid var(--pink);
}
.c-btn[btn-color="gray"],
.c-btn[btn-color="gray"]:visited,
.c-btn[btn-color="gray"]:hover,
.c-btn[btn-color="gray"] a,
.c-btn[btn-color="gray"] a:visited,
.c-btn[btn-color="gray"] a:hover {
  color: #FFF;
  background-color: var(--gray);
  border: 2px solid var(--gray);
}
.c-btn[btn-color="bblue"],
.c-btn[btn-color="bblue"]:visited,
.c-btn[btn-color="bblue"]:hover,
.c-btn[btn-color="bblue"] a,
.c-btn[btn-color="bblue"] a:visited,
.c-btn[btn-color="bblue"] a:hover {
  color: #FFF;
  background-color: var(--bblue);
  border: 2px solid var(--bblue);
}
@media (hover: hover) {
  .c-btn,
  input.c-btn,
  button.c-btn {
    transition: color 0.15s ease-out, opacity 0.15s ease-out, background 0.2s ease-out, border 0.15s ease-out;
  }
  .c-btn:hover,
  .c-btn a:hover,
  .c-btn-link:hover .c-btn,
  .c-btn-link:hover .c-btn a {
    color: var(--pink);
    background-color: #FFF;
  }
  .c-btn:hover .c-btn_icon,
  .c-btn a:hover .c-btn_icon,
  .c-btn-link:hover .c-btn_icon,
  .c-btn-link:hover .c-btn_icon a {
    filter: var(--pink);
    color: var(--pink);
  }
  .c-btn[btn-color="gray"]:hover,
  .c-btn[btn-color="gray"] a:hover,
  .c-btn-link:hover .c-btn[btn-color="gray"],
  .c-btn-link:hover .c-btn[btn-color="gray"] a {
    color: var(--gray);
    background-color: #FFF;
  }
  .c-btn[btn-color="gray"]:hover .c-btn_icon,
  .c-btn[btn-color="gray"] a:hover .c-btn_icon,
  .c-btn-link:hover .c-btn[btn-color="gray"] .c-btn_icon,
  .c-btn-link:hover .c-btn[btn-color="gray"] .c-btn_icon a {
    filter: var(--gray);
    color: var(--gray);
  }
  .c-btn[btn-color="bblue"]:hover,
  .c-btn[btn-color="bblue"] a:hover,
  .c-btn-link:hover .c-btn[btn-color="bbluebblue"],
  .c-btn-link:hover .c-btn[btn-color="gray"] a {
    color: var(--bblue);
    background-color: #FFF;
  }
  .c-btn[btn-color="bblue"]:hover .c-btn_icon,
  .c-btn[btn-color="bblue"] a:hover .c-btn_icon,
  .c-btn-link:hover .c-btn[btn-color="bblue"] .c-btn_icon,
  .c-btn-link:hover .c-btn[btn-color="bblue"] .c-btn_icon a {
    filter: var(--bblue);
    color: var(--bblue);
  }
}

/* TEL
----------------------------------------*/
.c-telBtn a,
a.c-telBtn {
  display: block;
  text-align: center;
  border-radius: 2em;
  padding: 0.5rem 1rem;
  font-size: var(--fs-2l);
  font-weight: 900;
}
.c-telBtn a,
.c-telBtn a:visited,
.c-telBtn a:hover,
a.c-telBtn,
a.c-telBtn:visited,
a.c-telBtn:hover {
  text-decoration: none;
  color: #FFF;
  background-color: var(--blue);
  border: 2px solid var(--blue);
}
.c-telBtn .svg-icon {
  width: 0.9em;
  height: 0.9em;
  margin-right: 0.15rem;
  filter: #FFF;
  color: #FFF;
}
.c-telBtn[btn-outline="on"],
.c-telBtn[btn-outline="on"]:hover,
.c-telBtn[btn-outline="on"] a:hover {
  outline-color: #FFF;
  outline-style: solid;
  outline-width: 3px;
}
@media (hover: hover) {
  .c-telBtn a,
    .c-telBtn {
    transition: color 0.15s ease-out, opacity 0.15s ease-out, background 0.2s ease-out, border 0.15s ease-out;
  }
  .c-telBtn a:hover,
   a.c-telBtn:hover {
    color: var(--blue);
    background-color: #FFF;
  }
  .c-telBtn a:hover .svg-icon,
  a.c-telBtn:hover .svg-icon {
    filter: var(--blue);
    color: var(--blue);
  }
}

/*--------------------------------------------------------------------------------
  list
--------------------------------------------------------------------------------*/
ul.c-list,
ol.c-list {
  line-height:1.6;
}
ul.c-list[listspace="S"] li:not(:first-child),
ol.c-list[listspace="S"] li:not(:first-child),
ul.c-listMk[listspace="S"] li:not(:first-child),
ol.c-listMk[listspace="S"] li:not(:first-child) {
  padding-top:0.25rem;
}
ul.c-list[listspace="M"] li:not(:first-child),
ol.c-list[listspace="M"] li:not(:first-child),
ul.c-listMk[listspace="M"] li:not(:first-child),
ol.c-listMk[listspace="M"] li:not(:first-child) {
  padding-top:0.5rem;
}
ul.c-list[listspace="L"] li:not(:first-child),
ol.c-list[listspace="L"] li:not(:first-child),
ul.c-listMk[listspace="L"] li:not(:first-child),
ol.c-listMk[listspace="L"] li:not(:first-child) {
  padding-top:0.75rem;
}

ul.c-listIn {
  margin-left:1.15rem;
}

/* マーク
----------------------------------------*/
ul.c-listMk {
  list-style:none;
  line-height:1.6;
  margin-left: 1em;
}
:not(ul).c-listMk {
  display: inline-block;
  line-height:1.6;
  margin-left: 1em;
}
ul.c-listMk li:before,
:not(ul).c-listMk:before {
  width: 1em;
  margin-left: -1em;
  display:inline-block;
}
ul.c-listMk[listmk="maru"] li:before,
:not(ul).c-listMk[listmk="maru"]:before {
  content:"●";
  color: var(--bblue);
}
ul.c-listMk[listmk="maru"][listcolor="pink"] li:before,
:not(ul).c-listMk[listmk="maru"][listcolor="pink"]:before {
  color: var(--pink);
}
ul.c-listMk[listmk="dot"] li:before,
:not(ul).c-listMk[listmk="dot"]:before {
  content:"・";
}
ul.c-listMk[listmk="kome"] li,
:not(ul).c-listMk[listmk="kome"] {
  padding-left: 0.3em;
}
ul.c-listMk[listmk="kome"] li:before,
:not(ul).c-listMk[listmk="kome"]:before {
  content:"※";
  width: 1.3em;
  margin-left: -1.3em;
}

/* Flex
----------------------------------------*/
ul.c-listFlex {
  list-style:none;
  line-height:1.6;
  display: flex;
  flex-wrap: wrap;
}

/*--------------------------------------------------------------------------------
  タグ
--------------------------------------------------------------------------------*/
.c-tag {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  column-gap: 0.5rem;
  row-gap: 0.5rem;
  line-height: 1;
}
.c-tag li {
  background-color: var(--bblue20);
  border-radius: 0.25rem;
  padding: 0.6em;
}
.c-tag .c-tag_end {
  background: none;
  border-radius: 0;
}
.c-tag a,
.c-tag a:visited,
.c-tag a:hover {
  color: inherit;
  text-decoration: none;
}

/*--------------------------------------------------------------------------------
  table
--------------------------------------------------------------------------------*/
.c-tbl {
  line-height:1.6;
  display: flex;
  flex-direction: column;
  width: 100%;
  border-collapse: collapse;
  border: 0;
  border-top: 1px solid rgba(0,0,0, 0.15);
}
.c-tbl tr {
  display: flex;
  flex-wrap: wrap;
}
.c-tbl th,
.c-tbl td {
  flex-basis: 100%;
  border-left: 1px solid rgba(0,0,0, 0.15);
  border-right: 1px solid rgba(0,0,0, 0.15);
}
.c-tbl th {
  padding: 0.75rem;
  font-weight: bold;
  background-color: #F8F8F8;
  border-bottom: 1px solid rgba(0,0,0, 0.05);
}
.c-tbl td {
  padding: 1rem 0.75rem;
  border-bottom: 1px solid rgba(0,0,0, 0.15);
}

/* grid
----------------------------------------*/
.c-grid-tbl {
  line-height:1.6;
  display: grid;
  grid-template-columns: auto 1fr;
  row-gap: 3px;
  font-size: 0.95rem;
}
.c-grid-tbl > dt,
.c-grid-tbl > dd {
  padding: 0.75rem;
}
.c-grid-tbl > dt {
  font-weight: bold;
  background-color: var(--bblue50);
}
.c-grid-tbl > dd {
  background-color: var(--bblue20);
}

/*--------------------------------------------------------------------------------
  フォーム
--------------------------------------------------------------------------------*/
/* 入力画面
----------------------------------------*/
.c-fm-hd {
  padding-top: var(--space-s);
  display: flex;
  column-gap: 1rem;
  align-items: center;
}
.c-fm-hd:first-of-type { padding-top: 0; }
.c-fm-hd_label-status {
  line-height: 1;
  border-radius: 0.25rem;
  padding: 0.6em;
  font-size: var(--fs-2s);
  color: #FFF;
  background-color: var(--gray);
}
.c-fm-hd_label-status.required {
  background-color: var(--pink);
}
.c-fm-hd_label-main {
  font-family: var(--ff-mgo);
  font-size: var(--fs-m);
  font-weight: 700;
}
.c-fm-item {
  padding-top: 0.75rem;
}
/* エラーメッセージ */
.c-fm-item .error-message {
  color: var(--pink);
  padding-bottom: 0.5rem;
  font-size: var(--fs-s);
  display: none;
}
.c-fm-item.is-err .error-message {
  display: block;
}
/* ボタン */
.c-fm-btn {
  padding-top: var(--space-s);
  line-height: 1.5;
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
}
.c-fm-btn_item {
  text-align: center;
  width: 100%;
}
.c-fm-btn_item .c-btn {
  width: 100%;
}
@media print, screen and (min-width:501px) {
  .c-fm-btn_item .c-btn {
    max-width: 340px;
  }
}

/* 確認・完了画面
----------------------------------------*/
.c-fm-alart {
  background-color: var(--bpink20);
  border-radius: 0.75rem;
  padding: var(--space-2s);
  font-size: 0.95rem;
}
.c-fm-alart_ttl {
  line-height: 1.6;
  font-family: var(--ff-mgo);
  font-size: var(--fs-l);
  color: var(--pink);
  font-weight: 500;
  padding-bottom: 0.5rem;
}
.c-fm-setup {
  line-height: 1.6;
  color: var(--pink);
  background-color: var(--bpink20);
  border-radius: 0.75rem;
  padding: var(--space-3s);
  margin-bottom: var(--space-2s);
}
.c-fm-sendok {
  text-align: center;
  margin-bottom: var(--space-2s);
}
.c-fm-sendok_ttl {
  line-height: 1.6;
  font-family: var(--ff-mgo);
  font-size: var(--fs-l);
  font-weight: 700;
  padding-bottom: 0.5rem;
}

/* フォームパーツ
----------------------------------------*/
.c-fm-ip,
.c-fm-textarea,
.c-fm-chexbox,
.c-fm-radio {
  width: 100%;
  display: inline-block;
  outline: none;
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  border: 1px solid rgba(0,0,0, 0.15);
  background-color: #F8F8F8;
  transition: background-color ease-out 0.1s, border-color ease-out 0.1s;
  line-height: 1.6;
}
.c-fm-textarea {
  height: 8em;
  resize: vertical;
}
.c-fm-chexbox,
.c-fm-radio {
  cursor: pointer;
  position: relative;
}
.c-fm-chexbox_text,
.c-fm-radio_text {
  display: inline-block;
  position: relative;
  padding-left: 2rem;
}
.c-fm-chexbox input,
.c-fm-radio input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0, 0);
  border: 0;
}
.c-fm-chexbox_text:before,
.c-fm-radio_text:before,
.c-fm-chexbox_text:after,
.c-fm-radio_text:after {
  content: "";
  display: inline-block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
/* チェックボックス */
.c-fm-chexbox_text:before {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 0.25rem;
  background-color: rgba(0,0,0,0.15);
}
.c-fm-chexbox input:checked + .c-fm-chexbox_text:before {
  background-color: var(--bblue);
}
.c-fm-chexbox_text:after {
  width: 1.25rem;
  height: 1.25rem;
  background: url("../image/icon/check.svg") no-repeat center center;
  background-size: 70% auto;
  opacity: 0;
}
.c-fm-chexbox input:checked + .c-fm-chexbox_text:after { opacity: 1; }

/* ラジオボタン */
.c-fm-radio_text:before {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 100%;
  background-color: rgba(0,0,0,0.15);
}
.c-fm-radio_text:after {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 100%;
  background-color: #FFF;
  left: 0.375rem;
}
.c-fm-radio input:checked + .c-fm-radio_text:before { background-color: var(--bblue); }
/* フォーカス */
.c-fm-ip:focus,
.c-fm-textarea:focus {
  background-color: #FFF;
}
/* エラー */
.c-fm-item.is-err .c-fm-ip,
.c-fm-item.is-err .c-fm-textarea,
.c-fm-item.is-err .c-fm-chexbox,
.c-fm-item.is-err .c-fm-radio {
  border-color: var(--pink);
  background-color: var(--bpink20);
}
/* グループ */
.c-fm-ip-group {
  list-style: none;
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
}