@charset "UTF-8";
/*
============================================================
# Components
============================================================
*/
/* mv
--------------------------------------------- */
.c-mv {
  padding-top: 5em;
  padding-bottom: 5em;
}

.c-mv h1,
.c-mv h2,
.c-mv h3 {
  text-align: center;
}

/* タイトル
--------------------------------------------- */
.c-title {
  padding: 1em 0;
  text-align: center;
}

/* 文字
--------------------------------------------- */
.c-text.--small {
  font-size: 0.8em;
}

.c-text.--bold {
  font-weight: 700;
}

.c-text.--big {
  font-size: 2em;
  font-weight: 700;
}

.c-text.--center {
  display: flex;
  flex-flow: nowrap column;
  align-items: center;
  justify-content: center;
}

.c-text.--right {
  text-align: right;
}

.c-text.--red {
  color: #f20;
}

/* コンテナ
--------------------------------------------- */
.c-linkContainer {
  display: flex;
  flex-flow: wrap row;
  gap: 1em;
  align-items: flex-start;
  justify-content: center;
}

.c-linkContainer.--left {
  flex-flow: wrap column;
  justify-content: center;
}

.c-imgContainer {
  display: flex;
  flex-flow: wrap row;
  align-items: center;
  justify-content: center;
  padding: clamp(1rem, 0.875rem + 0.5vw, 1.5rem) 0;
}

.c-imgContainer.--frontSmall {
  margin-top: 1em;
  margin-bottom: 1em;
}

.c-imgContainer.--frontSmall img {
  width: 100%;
  max-width: 20rem;
}

/* テキストリンク
--------------------------------------------- */
.c-fileLink {
  position: relative;
  display: inline-flex;
  gap: 0.3em;
  align-items: center;
  justify-content: center;
  padding-right: 0.4em;
  padding-left: 0.4em;
  font-size: 1.2em;
  font-weight: 800;
  color: #06B1ED;
}

.c-fileLink:hover {
  text-decoration: underline;
  opacity: 1;
}

.c-fileLink > img {
  width: 1.3em;
  height: 1.3em;
  pointer-events: none;
}

.c-fileLink .c-icon {
  width: 1.3em;
  height: 1.3em;
}

.c-textLink {
  font-weight: 700;
  color: #06B1ED;
  text-decoration: underline;
}

/* テキスト装飾系
--------------------------------------------- */
.c-lineTitle {
  padding: 1em 0;
  text-align: center;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
}

.c-bubbleTitle {
  position: relative;
  display: flex;
  flex-flow: nowrap row;
  align-items: center;
  justify-content: center;
  padding: 1em 0.5em;
  text-align: center;
  background-color: #FDEB0B;
}

.c-bubbleTitle::before {
  position: absolute;
  bottom: -0.5em;
  display: block;
  width: 1.5em;
  height: 1.5em;
  content: "";
  background-color: #FDEB0B;
  transform: rotate(45deg);
}

.c-tableHeader {
  position: relative;
  display: flex;
  flex-flow: nowrap row;
  align-items: center;
  justify-content: center;
  padding: 1em 0.5em;
  text-align: center;
  background-color: #D9EFF7;
  border: 1px solid #000;
  border-bottom: none;
}

.c-btnDecoText {
  position: relative;
  display: flex;
  flex-flow: nowrap row;
  gap: 0.5em;
  align-items: center;
  justify-content: center;
  font-size: 1.4em;
  font-weight: 700;
  color: #DE6F2C;
  text-align: center;
}

.c-btnDecoText::before, .c-btnDecoText::after {
  display: block;
  width: 1em;
  height: 1em;
  content: "";
  background-image: url("../img/icon-hukidashi-line.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.c-btnDecoText::before {
  top: 0;
  left: 0;
}

.c-btnDecoText::after {
  top: 0;
  right: 0;
  transform: scaleX(-1);
}

/* css slider
--------------------------------------------- */
.c-slider {
  width: 100%;
  height: auto;
  padding-bottom: clamp(0.5rem, 0.125rem + 1.5vw, 2rem);
  margin-right: auto;
  margin-left: auto;
  overflow: scroll;
  overscroll-behavior-x: contain;
}

.c-slider::-webkit-scrollbar {
  width: 6px;
  height: 6px;
  background-color: transparent;
}

.c-slider::-webkit-scrollbar-track {
  background-color: transparent;
}

.c-slider::-webkit-scrollbar-corner {
  background-color: transparent;
}

.c-slider::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.8);
}

.c-slider__item {
  scroll-snap-align: start;
}

/* faq内のテーブル
--------------------------------------------- */
.c-table {
  min-width: -webkit-fit-content;
  min-width: -moz-fit-content;
  min-width: fit-content;
  text-align: left;
  text-indent: 0;
  border-collapse: collapse;
  border: 1px solid #000;
}

.c-table tr {
  border: 1px solid #000;
}

.c-table tr + .c-table tr {
  border-top: 1px solid #000;
}

.c-table th {
  padding: 0.5em;
  background-color: rgb(219, 219, 219);
  border-right: 1px solid #000;
}

.c-table td {
  padding: 0.5em;
  border-right: 1px solid #000;
}

/* 電話番号ボックス
--------------------------------------------- */
.c-tellBox {
  display: flex;
  flex-flow: wrap row;
  gap: 1em 1em;
  align-items: center;
  justify-content: center;
  max-width: 30rem;
  padding: 1.5em 1em;
  margin-right: auto;
  margin-left: auto;
  border: 0.25rem solid #06B1ED;
}

@media screen and (min-width: 43.75em) {
  .c-tellBox {
    padding: 2em 3em;
  }
}
.c-tellBox__title {
  flex: 0 1 auto;
  font-size: 1.2em;
  font-weight: 700;
}

.c-tellBox__tell {
  flex: 0 1 100%;
  font-size: 2.7em;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  letter-spacing: 0;
}

.c-tellBox__point {
  flex: 0 0 auto;
  padding: 0.25em 0.6em;
  border: 1px solid #000;
}

.c-tellBox__text {
  flex: 0 1 auto;
}

/* パンクズリスト
--------------------------------------------- */
.c-breadcrumb {
  padding: 0.5em 0;
  font-size: 0.8em;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.7529411765);
  text-indent: 0.05em;
  letter-spacing: 0.05em;
  background-color: rgba(255, 255, 255, 0.5333333333);
}

.c-breadcrumb ul {
  display: flex;
  flex-flow: wrap row;
  gap: 0 1em;
  align-items: center;
  justify-content: flex-start;
}

.c-breadcrumb li {
  position: relative;
}

.c-breadcrumb li + li::after {
  position: absolute;
  top: 50%;
  left: -0.9em;
  z-index: -1;
  display: block;
  width: 0.5em;
  height: 0.5em;
  content: "";
  border-top: 0.125rem solid #000;
  border-right: 0.125rem solid #000;
  opacity: 0.3;
  transform: translateY(-50%) rotate(45deg);
  transform-origin: center;
}

.c-breadcrumb li > span {
  display: block;
  padding: 0.25em 0.5em;
  opacity: 0.5;
}

.c-breadcrumb li > a {
  display: block;
  padding: 0.25em 0.5em;
  opacity: 0.5;
}

.c-breadcrumb li > a:hover {
  text-decoration: underline;
}

/* button
--------------------------------------------- */
.c-btn {
  display: flex;
  flex-flow: nowrap row;
  gap: 0.3em;
  align-items: center;
  justify-content: center;
  width: 12em;
  padding: 1em 0.4em 1em 0;
  font-size: 1.4em;
  font-weight: 700;
  color: #fff;
  text-align: center;
  background-color: #DE6F2C;
  border-radius: 1.5rem;
}

.c-btn .icon {
  width: 3.5em;
}

/* btnContainer
--------------------------------------------- */
.c-btnContainer {
  display: flex;
  flex-flow: wrap row;
  row-gap: 1em;
  column-gap: 1em;
  align-items: flex-start;
  justify-content: center;
}

.c-btnContainer.-left {
  justify-content: flex-start;
}

.c-btnContainer.-right {
  justify-content: flex-end;
}

.c-btnContainer .c-btn {
  flex: 1 1 content;
  max-width: 30em;
}

.c-btnContainer.--stretch .c-btn {
  max-width: none;
}

/* お客さまの声用カード
--------------------------------------------- */
.c-voiceCard {
  padding: 2em;
  background-color: #FFFAE6;
  border-radius: 1rem;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.0823529412);
}

.c-voiceCard__header {
  display: flex;
  flex-flow: wrap row;
  gap: 2em;
  align-items: flex-start;
  justify-content: center;
}

.c-voiceCard__headerImg {
  width: 5rem;
  padding: 0.5em;
  background-color: #fff;
  border-radius: 50%;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.0666666667);
}

@media screen and (min-width: 43.75em) {
  .c-voiceCard__headerImg {
    width: 7rem;
    padding: 0.8em;
  }
}
.c-voiceCard__headerInfo {
  flex: 1 1 60%;
}

.c-voiceCard__headerInfo > * + * {
  margin-top: 1em;
}

.c-voiceCard__title {
  font-size: 1.2em;
}

.c-voiceCard__rating {
  display: flex;
  flex-flow: nowrap row;
  gap: 0.25em;
  align-items: flex-start;
  justify-content: flex-start;
}

.c-voiceCard__star {
  width: 2em;
}

.c-voiceCard__star.--active {
  fill: #FFD900;
}

.c-voiceCard__star {
  fill: #ccc;
}

.c-voiceCard__text {
  margin-top: 1em;
}

/* フォーム
--------------------------------------------- */
.c-form__radioBox {
  display: flex;
  flex-flow: nowrap row;
  align-items: center;
  justify-content: flex-start;
}

.c-form__radioBox + .c-form__radioBox {
  margin-top: 0.5em;
}

.c-form__radioBox label {
  margin: 0;
}

.c-form__radioBox input {
  margin-right: 0.5em;
}

.c-form__btnContainer {
  display: flex;
  flex-flow: wrap row;
  align-items: center;
  justify-content: center;
  margin-top: 2em;
}

/* フォームのリストデザイン
--------------------------------------------- */
.c-formList__container {
  display: flex;
  flex-flow: wrap row;
  align-items: stretch;
  justify-content: flex-start;
  box-shadow: 0 5px 5px rgba(0, 0, 0, 0.062745098);
}

.c-formList__container + .c-formList__container {
  margin-top: 1em;
}

.c-formList__title {
  flex: 1 0 100%;
  padding: 1em;
  background-color: #FFFCEB;
}

@media screen and (min-width: 43.75em) {
  .c-formList__title {
    flex: 0 0 14em;
  }
}
.c-formList__contents {
  flex: 1 1 60%;
  padding: 1em;
  background-color: #E2F7FD;
}

.c-formList dd + dd {
  margin-top: 1em;
}

.c-formList .required {
  display: block;
  font-size: 0.8em;
  color: red;
}

/* 
--------------------------------------------- */
.c-icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-right: 0.2em;
  margin-bottom: 0.2em;
  margin-left: 0.2em;
  line-height: 1;
  vertical-align: middle;
  fill: currentcolor;
}

.c-icon.--large {
  width: 1.2em;
  height: 1.2em;
}

/* c-icon-humberger
--------------------------------------------- */
.c-icon-humberger {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 0.5em;
  pointer-events: none;
}

.c-icon-humberger span {
  position: relative;
  width: 100%;
  height: 0.2rem;
}

.c-icon-humberger span::before, .c-icon-humberger span::after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  content: "";
  background-color: currentcolor;
  transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
  transition-duration: 200ms;
  transform-origin: center;
}

.c-icon-humberger span::before {
  transform: translateY(-200%);
}

.is-drawerActive .c-icon-humberger span::before {
  transform: rotate(45deg);
}

.c-icon-humberger span::after {
  transform: translateY(200%);
}

.is-drawerActive .c-icon-humberger span::after {
  transform: rotate(-45deg);
}

/* c-icon-arrow-circle
--------------------------------------------- */
.c-icon-arrow-circle {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  vertical-align: middle;
}

.c-icon-arrow-circle::before {
  position: absolute;
  right: 0;
  width: 100%;
  height: 100%;
  margin-left: 1em;
  content: "";
  border: 0.125rem solid currentcolor;
  border-radius: 50%;
}

.c-icon-arrow-circle::after {
  position: absolute;
  right: 40%;
  height: 32%;
  aspect-ratio: 1/1;
  content: "";
  border-top: 0.125rem solid #002944;
  border-right: 0.125rem solid #002944;
  transform: rotate(45deg);
}

/* FAQ用のアコーディオン
--------------------------------------------- */
summary::-webkit-details-marker {
  display: none;
}

.c-faqAccordion + .c-faqAccordion {
  margin-top: 1em;
}

.c-faqAccordion summary {
  position: relative;
  display: flex;
  align-items: center;
  padding-right: 2em;
  font-weight: 700;
  cursor: pointer;
  border-bottom: 1px solid #000;
}

.c-faqAccordion summary::before, .c-faqAccordion summary::after {
  position: absolute;
  right: 0.5em;
  width: 3px;
  height: 0.9em;
  content: "";
  background-color: #000;
  border-radius: 5px;
  transform-origin: center;
}

.c-faqAccordion summary::before {
  rotate: 90deg;
}

.c-faqAccordion summary::after {
  transition: rotate 0.3s;
}

.c-faqAccordion summary > span {
  position: relative;
  display: block;
  padding: 1em 0 1em 3.2em;
  font-size: 1.1em;
}

.c-faqAccordion summary > span::before {
  position: absolute;
  top: 1em;
  left: 0;
  display: flex;
  flex-flow: wrap row;
  align-items: center;
  justify-content: center;
  width: 2em;
  height: 2em;
  font-weight: 700;
  color: #fff;
  content: "Q";
  background-image: url("../img/illust-hukidashi.svg");
  background-size: cover;
}

.c-faqAccordion__contents {
  position: relative;
  padding: 2em 2em 2em 3.2em;
  margin: 0;
  color: #333;
  opacity: 0;
  transition: transform 0.5s, opacity 0.5s;
  transform: translateY(-10px);
}

.c-faqAccordion__contents::before {
  position: absolute;
  top: 2em;
  left: 0;
  display: block;
  display: flex;
  flex-flow: wrap row;
  align-items: center;
  justify-content: center;
  width: 2em;
  height: 2em;
  font-weight: 700;
  color: #fff;
  content: "A";
  background-color: #DE6F2C;
  border-radius: 0.5rem;
}

.c-faqAccordion__contents .title {
  font-size: 1.1em;
  font-weight: 700;
}

.c-faqAccordion__contents .title + .contents {
  margin-top: 1em;
}

.c-faqAccordion[open] summary::after {
  rotate: 90deg;
}

.c-faqAccordion[open] .c-faqAccordion__contents {
  opacity: 1;
  transform: none;
}

.c-faqAccordion a {
  font-weight: bold;
  color: #16A0E8;
  text-decoration: underline;
}

/* リスト・テーブル
--------------------------------------------- */
.c-innerTableRow {
  display: flex;
  flex-flow: wrap row;
  align-items: flex-start;
  justify-content: flex-start;
  height: calc(100% + 2em);
  margin: -1em;
}

.c-innerTableRow__wrap {
  flex: 1 1 50%;
  height: 100%;
}

.c-innerTableRow__wrap + .c-innerTableRow__wrap {
  border-left: 1px solid #000;
}

.c-innerTableRow__wrap dt {
  display: flex;
  flex-flow: nowrap column;
  align-items: center;
  justify-content: center;
  padding: 1em;
  border-bottom: 1px solid #000;
}

.c-innerTableRow__wrap dd {
  display: flex;
  flex-flow: nowrap column;
  align-items: center;
  justify-content: center;
  padding: 1em;
}

.c-innerTableCol {
  display: flex;
  flex-flow: wrap row;
  align-items: flex-start;
  justify-content: flex-start;
  margin: -1em;
}

.c-innerTableCol__wrap {
  display: flex;
  flex: 1 1 100%;
  flex-flow: wrap row;
  align-items: stretch;
  justify-content: flex-start;
  height: 100%;
}

.c-innerTableCol__wrap + .c-innerTableCol__wrap {
  border-top: 1px solid #000;
}

.c-innerTableCol__wrap dt {
  flex: 1 1 10em;
  padding: 1em;
  border-right: 1px solid #000;
}

.c-innerTableCol__wrap dd {
  display: flex;
  flex: 1 1 50%;
  flex-flow: nowrap row;
  align-items: center;
  justify-content: flex-start;
  padding: 1em;
}

.c-simpleColTable {
  display: flex;
  flex-flow: wrap row;
  align-items: stretch;
  justify-content: flex-start;
  border: 1px solid #000;
}

.c-simpleColTable__wrap {
  flex: 1 1 50%;
}

.c-simpleColTable__wrap > dt {
  flex: 1 1 25%;
  min-width: 10em;
  padding: 1em;
  background-color: #FFFAE6;
}

.c-simpleColTable__wrap > dd {
  flex: 1 1 75%;
  padding: 1em;
}

.c-table01 {
  border: 1px solid #000;
}

.c-table01__wrap {
  display: flex;
  flex-flow: nowrap row;
  align-items: stretch;
  justify-content: flex-start;
}

.c-table01__wrap + .c-table01__wrap {
  border-top: 1px solid #000;
}

.c-table01__wrap > dt {
  flex: 0 0 15em;
  padding: 1em;
  background-color: #FFFAE6;
  border-right: 1px solid #000;
}

.c-table01__wrap > dd {
  flex: 1 1 auto;
  padding: 1em;
}

.c-table01.--option01 {
  min-width: 45em;
}

.c-table01.--option01 .c-table01__wrap > dt {
  flex: 0 0 12em;
}

.c-simpleTable {
  border: 1px solid #000;
}

.c-simpleTable__wrap {
  display: flex;
  flex-flow: wrap row;
  align-items: stretch;
  justify-content: flex-start;
}

.c-simpleTable__wrap + .c-simpleTable__wrap {
  border-top: 1px solid #000;
}

.c-simpleTable__wrap > dt {
  flex: 1 1 25%;
  min-width: 10em;
  padding: 1em;
  background-color: #FFFAE6;
}

.c-simpleTable__wrap > dd {
  flex: 1 1 75%;
  padding: 1em;
}

.c-simpleTable02 {
  min-width: 35em;
  border: 1px solid #000;
}

.c-simpleTable02__wrap {
  display: flex;
  flex-flow: nowrap row;
  align-items: stretch;
  justify-content: flex-start;
}

.c-simpleTable02__wrap + .c-simpleTable02__wrap {
  border-top: 1px solid #000;
}

.c-simpleTable02__wrap > dt {
  flex: 0 0 9em;
  padding: 1em;
  background-color: #FFFAE6;
  border-right: 1px solid #000;
}

.c-simpleTable02__wrap > dd {
  flex: 1 1 auto;
  padding: 1em;
}

.c-simpleTable02__wrap > dd > dl {
  margin: -1em;
}

.c-simpleTable02__wrap > dd > dl > .wrap {
  display: flex;
  flex-flow: nowrap row;
  align-items: stretch;
  justify-content: flex-start;
}

.c-simpleTable02__wrap > dd > dl > .wrap > dt {
  flex: 0 0 13em;
  min-width: 10em;
  padding: 1em;
  background-color: #FFFAE6;
  border-right: 1px solid #000;
}

.c-simpleTable02__wrap > dd > dl > .wrap > dd {
  flex: 1 1 auto;
  padding: 1em;
}

.c-simpleTable02__wrap > dd > dl > .wrap + .wrap {
  border-top: 1px solid #000;
}

.c-simpleTable04 {
  min-width: 35em;
  border: 1px solid #000;
}

.c-simpleTable04__wrap {
  display: flex;
  flex-flow: nowrap row;
  align-items: stretch;
  justify-content: flex-start;
}

.c-simpleTable04__wrap.--title {
  background-color: #fffae6;
}

.c-simpleTable04__wrap + .c-simpleTable04__wrap {
  border-top: 1px solid #000;
}

.c-simpleTable04__wrap > dt {
  flex: 1 1 40%;
  padding: 1em;
  border-right: 1px solid #000;
}

.c-simpleTable04__wrap > dd {
  flex: 1 1 60%;
  padding: 1em;
}

.c-tableCta__wrap {
  position: relative;
  display: flex;
  flex-flow: wrap row;
  align-items: stretch;
  justify-content: center;
  border: 1px solid #DE6F2C;
}

.c-tableCta__wrap + .c-tableCta__wrap {
  margin-top: 3em;
}

.c-tableCta__wrap + .c-tableCta__wrap::before {
  position: absolute;
  top: -2.5em;
  display: block;
  width: 2em;
  height: 2em;
  content: "";
  background-image: url("../img/icon-arrow-cta.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.c-tableCta__wrap > dt {
  display: flex;
  flex: 1 1 25%;
  flex-flow: wrap row;
  align-items: center;
  justify-content: flex-start;
  min-width: 8em;
  padding: 1em;
  font-weight: 700;
  color: #fff;
  background-color: #DE6F2C;
}

.c-tableCta__wrap > dd {
  flex: 1 1 75%;
  padding: 1em;
}

.c-tableCta__wrap > dd > div > * + * {
  margin-top: 0.5em;
}

.c-tableCta__grid {
  display: flex;
  flex-flow: wrap row;
  gap: 1em;
  align-items: flex-start;
  justify-content: flex-start;
}

.c-tableCta__grid > div {
  flex: 1 1 40%;
  min-width: 15em;
}
