@charset "UTF-8";
/*
Readme:
・本ページでは単位指定において、主に css変数「--std」というを使用しています。
PCサイズ以上では基本的に --std: 10px と定義しており、SP~PC中間あたりからvw単位を指定することで、レスポンシブ調整を行っています。
--std は、ページ内で流用できるよう指定していますが、セクション単位で上書きしている場合もあります。

・共通コンポーネントは、c_ という接頭辞を付けて管理しています。その中で、セクション内固有のスタイル変更がある場合はセクション内で上書きしています。

*/
.page_cancellation {
  line-height: 1.4;
  font-family: var(--fontFamily-base);
  font-size: 16px;
  --fontFigtree: "Figtree", sans-serif;
  --blue: #00aeeb;
  --light-blue: #e3ecf7;
  --yellow-gray: #f9f8f4;
  --orange: #eb737d;
  --std: 10px;
  letter-spacing: calc(var(--std) * 0.05);
}
.page_cancellation .image {
  display: block;
  width: 100%;
}
.page_cancellation a:hover {
  text-decoration: none;
  opacity: 0.7;
}

@media screen and (max-width: 767px) {
  /* sp only */
  .page_cancellation {
    --std: 2.332vw;
  }
} /* sp only */
.figtree {
  font-family: var(--fontFigtree);
}

.d-ib {
  display: inline-block;
}

.blue {
  color: var(--blue);
}

.black {
  color: #000;
}

.bold {
  font-weight: bold;
}

.marker {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, var(--line-color)));
  background: linear-gradient(transparent 60%, var(--line-color) 60%);
}

.indent {
  --indent: 1em;
  text-indent: calc(var(--indent) * -1);
  padding-left: calc(var(--indent) * 1);
}

sup.sup,
sub.sub {
  font-size: clamp(9px, var(--std) * 10, 12px);
}

.section__link {
  margin-top: calc(var(--std) * 4);
}

.section__link a.-blue {
  font-weight: normal;
  font-size: 14px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: auto;
  max-width: 400px;
  min-width: 200px;
  padding: 1em 1em;
}
.section__link a.-arrow {
  position: relative;
  padding-inline: 3em;
}
.section__link a.-arrow:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: calc(var(--std) * 2);
  width: calc(var(--std) * 0.9);
  height: calc(var(--std) * 0.9);
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(45deg) translateY(-50%);
          transform: rotate(45deg) translateY(-50%);
  -webkit-transform-origin: top center;
          transform-origin: top center;
  -webkit-transition: border-color 0.5s 0s;
  transition: border-color 0.5s 0s;
}
.section__link a.-arrow:hover::after {
  border-color: var(--blue);
}
.section__link a.-multiple {
  --std: 10px;
  max-width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  line-height: 1.4;
}
.section__link a.-multiple .sub-text {
  font-size: calc(var(--std) * 1.6);
}
.section__link a.-multiple .main-text {
  font-size: calc(var(--std) * 2);
  margin-top: 10px;
}

@media screen and (max-width: 767px) {
  /* sp only */
  .section__link a.-multiple {
    --std: 2vw;
  }
  .section__link a.-multiple .main-text {
    margin-top: 0.5em;
  }
} /* sp only */
/* ★ ==================
* ページ内複数使用コンポーネント（接頭辞 c_ を付けてこちらに保管）
* ================== */
.container {
  --middle-w: calc(100% - 40px);
  --min-w: 0px;
  --max-w: 1200px;
  width: clamp(var(--min-w), var(--middle-w), var(--max-w));
  margin-inline: auto;
}

@media screen and (max-width: 767px) {
  /* sp only */
  .container {
    --middle-w: calc(100% - 28px);
  }
} /* sp only */
/* ==================
* c_wave-title
* ================== */
.c_wave-title {
  font-size: calc(var(--std) * 3.8);
  font-weight: bold;
  text-align: center;
  color: var(--blue);
  line-height: 2;
}
.c_wave-title::after {
  content: "";
  display: block;
  background: url("/images/cancellation/icon_wave.svg") rgba(255, 255, 255, 0) no-repeat top 50% left 50%/contain;
  aspect-ratio: 63/6;
  width: calc(var(--std) * 6.3);
  margin: calc(var(--std) * 2.4) auto 0;
}

@media screen and (max-width: 767px) {
  /* sp only */
  .c_wave-title {
    font-size: calc(var(--std) * 2.65);
  }
  .c_wave-title::after {
    width: calc(var(--std) * 5.5);
  }
} /* sp only */
/* end c_wave-title */
.c_annotation {
  --main-font-size: calc(var(--std) * 1.8);
  font-size: clamp(9px, var(--main-font-size), 12px);
  margin-top: calc(var(--std) * 2);
  line-height: 1.55;
}

.c_lead {
  font-size: calc(var(--std) * 1.6);
  line-height: 2.1875;
}

/* ==================
* c_sec
* ================== */
.c_sec {
  margin-top: calc(var(--std) * 12);
}
.c_sec--first {
  margin-top: calc(var(--std) * 9.1);
}
.c_sec .c_sec_title + .c_lead {
  margin-top: calc(var(--std) * 4.5);
}

.c_sec_title {
  font-weight: bold;
  font-size: calc(var(--std) * 2.2);
  line-height: 1.6;
  color: var(--blue);
  position: relative;
}
.c_sec_title::after {
  content: "";
  background: url("/images/cancellation/pettern_dot-horizonal-line.gif") rgba(255, 255, 255, 0) repeat top 50% left 50%/auto 2px;
  width: calc(100% - var(--std) * 42.1);
  height: 2px;
  position: absolute;
  top: calc(var(--std) * 1.7);
  right: 0;
}
.c_sec_title .text {
  background-color: #FFF;
  padding-right: calc(var(--std) * 2);
  z-index: 2;
  position: relative;
}

@media screen and (max-width: 767px) {
  /* sp only */
  .c_sec {
    margin-top: calc(var(--std) * 7.5);
  }
  .c_sec--first {
    margin-top: calc(var(--std) * 4.5);
  }
  .c_sec .c_sec_title {
    font-size: calc(var(--std) * 2.3);
  }
  .c_sec .c_sec_title::after {
    width: calc(100% - 0px);
  }
  .c_sec .c_sec_title + .c_lead {
    margin-top: calc(var(--std) * 1.3);
  }
} /* sp only */
/* end c_sec */
/* ★ end ページ内複数使用コンポーネント（接頭辞 c_ を付けてこちらに保管） */
/* ==================
* sec_fv
* ================== */
.sec_fv {
  /*padding-top: 26px;*/
}

.sec_fv .fv_image {
  border-radius: calc(var(--std) * 2.6);
  width: 100%;
}
.sec_fv .c_wave-title {
  margin-top: calc(var(--std) * 3);
}
.sec_fv .c_lead {
  text-align: center;
  margin-top: calc(var(--std) * 5.3);
}

@media screen and (max-width: 767px) {
  /* sp only */
  .sec_fv {
    /*padding-top: 10px;*/
  }
  
  .sec_fv .c_lead {
    margin-top: calc(var(--std) * 2.1);
  }
} /* sp only */
/* end sec_fv */
/* ==================
* alert-box
* ================== */
.alert-box {
  font-size: calc(var(--std) * 1.6);
  background-color: #FDF1F0;
  border-radius: calc(var(--std) * 2.6);
  padding-inline: calc(var(--std) * 2);
  padding-block: calc(var(--std) * 2) calc(var(--std) * 3);
  text-align: center;
  margin-top: calc(var(--std) * 5);
}
.alert-box > .title {
  --height: calc(var(--std) * 5.4);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-weight: bold;
  color: #DD1514;
  background: url("/images/cancellation/icon_alert.png") rgba(255, 255, 255, 0) no-repeat top 50% left 50%/var(--height) auto;
  min-height: var(--height);
  line-height: 1;
  padding-top: calc(var(--std) * 0.4);
}
.alert-box .sentence {
  line-height: 2.1875;
  margin-top: calc(var(--std) * 0.6);
}
.alert-box .sentence * + p {
  margin-top: 1em;
}

@media screen and (max-width: 767px) {
  /* sp only */
  .alert-box {
    margin-top: calc(var(--std) * 2);
    padding-inline: calc(var(--std) * 0.5);
  }
  .alert-box > .title {
    font-size: calc(var(--std) * 1.9);
    --height: calc(var(--std) * 4.5);
  }
  .alert-box .sentence {
    line-height: 2;
  }
  .alert-box .sentence * + p {
    margin-top: 0.5em;
  }
} /* sp only */
/* end alert-box */
/* ==================
* index_nav
* ================== */
.index_nav {
  margin-top: calc(var(--std) * 6.2);
}
.index_nav .nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: calc(var(--std) * 1.5);
}
.index_nav .nav li {
  width: 100%;
}
.index_nav .nav li a {
  text-decoration: none;
  color: var(--blue);
  display: block;
  font-size: calc(var(--std) * 2.2);
  font-weight: bold;
  text-align: center;
  padding-inline: calc(var(--std) * 3);
  padding-block: calc(var(--std) * 1.5) calc(var(--std) * 1.3);
  border: 2px solid;
  border-radius: 9999px;
  background: url("/images/cancellation/icon_down-arrow.png") rgba(255, 255, 255, 0) no-repeat top 50% left calc(var(--std) * 15)/calc(var(--std) * 1.9) auto;
}

@media screen and (max-width: 767px) {
  /* sp only */
  .index_nav {
    margin-top: calc(var(--std) * 3.5);
  }
  .index_nav .nav {
    gap: calc(var(--std) * 1);
  }
  .index_nav .nav li a {
    font-size: calc(var(--std) * 1.25);
    background-size: calc(var(--std) * 1.5) auto;
    background-position: top 50% left calc(var(--std) * 2.5);
    border-width: 1px;
    padding-inline: calc(var(--std) * 1);
    padding-block: calc(var(--std) * 1.2);
  }
} /* sp only */
/* end index_nav */
/* ==================
* flow
* ================== */
.flow {
  --innner-width: 61.4%;
  background-color: #DDEFF9;
  font-size: calc(var(--std) * 1.6);
  border-radius: calc(var(--std) * 2.6);
  padding-inline: calc(var(--std) * 2);
  padding-block: calc(var(--std) * 4) calc(var(--std) * 3);
  margin-top: calc(var(--std) * 4);
}
.flow .flow_title {
  font-size: calc(var(--std) * 1.6);
  width: var(--innner-width);
  margin-inline: auto;
  font-weight: bold;
}
.flow .flow_chart {
  width: var(--innner-width);
  margin-inline: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  list-style: none;
  padding-left: 0;
  margin-top: calc(var(--std) * 2.5);
}
.flow .flow_chart li {
  font-size: calc(var(--std) * 1.6);
  position: relative;
  padding-bottom: calc(var(--std) * 1.4);
  padding-left: calc(var(--std) * 3.2);
}
.flow .flow_chart li::before {
  --url: url("/images/cancellation/icon_no1.png");
  content: "";
  display: block;
  position: absolute;
  left: calc(var(--std) * 0.4);
  top: calc(var(--std) * 0.2);
  background: var(--url) rgba(255, 255, 255, 0) no-repeat top 50% left 50%/contain;
  width: calc(var(--std) * 1.75);
  aspect-ratio: 1;
  z-index: 1;
}
.flow .flow_chart li:not(:last-child)::after {
  content: "";
  display: block;
  width: 1px;
  height: 100%;
  background-color: var(--blue);
  position: absolute;
  left: calc(var(--std) * 1.2);
  top: calc(var(--std) * 0.3);
  will-change: left, top;
  z-index: 0;
}
.flow .flow_chart li:nth-of-type(2)::before {
  --url: url("/images/cancellation/icon_no2.png");
}
.flow .flow_chart li:nth-of-type(3)::before {
  --url: url("/images/cancellation/icon_no3.png");
}
.flow .c_annotation {
  text-align: center;
  margin-top: calc(var(--std) * 3.3);
}

@media screen and (min-width: 768px) and (max-width: 850px) {
  /* PC small window */
  .flow {
    --innner-width: 80%;
  }
} /* PC small window */
@media screen and (max-width: 767px) {
  /* sp only */
  .flow {
    padding-inline: calc(var(--std) * 0.7);
    padding-block: calc(var(--std) * 1.8);
    --innner-width: calc(100% - 20px);
  }
  .flow .flow_title {
    font-size: calc(var(--std) * 2);
  }
  .flow .flow_chart li {
    font-size: calc(var(--std) * 1.65);
    line-height: 1.7;
  }
  .flow .flow_chart li::before {
    width: calc(var(--std) * 2);
    top: calc(var(--std) * 0.4);
  }
  .flow .flow_chart li:not(:last-child)::after {
    top: calc(var(--std) * 1.8);
  }
  .flow .c_annotation {
    margin-top: calc(var(--std) * 1);
    text-align: left;
    padding-inline: calc(var(--std) * 1);
  }
} /* sp only */
/* end flow */
/* ==================
* クーリングオフ関連
* ================== */
.ac_contents {
  display: none;
}
.ac_button {
  display: block;
  border-radius: 9999px;
  background-color: #FFF;
  color: var(--blue);
  margin-inline: auto;
  border: 2px solid;
  font-size: calc(var(--std) * 1.4);
  font-weight: bold;
  padding: calc(var(--std) * 1.2) calc(var(--std) * 1);
  min-width: calc(var(--std) * 23.8);
  margin-top: calc(var(--std) * 5);
}
.ac_button:hover {
  opacity: 0.7;
}

@media screen and (max-width: 767px) {
  /* sp only */
  .ac_button {
    width: 100%;
    font-size: calc(var(--std) * 1.8);
    padding: calc(var(--std) * 1.7) calc(var(--std) * 1);
    margin-top: calc(var(--std) * 2);
  }
} /* sp only */
/* end クーリングオフ関連 */
/* ==================
* sec_plan
* ================== */
.sec_plan .section__link {
  margin-top: calc(var(--std) * 4);
}
.sec_plan .section__link a {
  font-weight: bold;
}

@media screen and (max-width: 767px) {
  /* sp only */
  .sec_plan .section__link a {
    width: 100%;
  }
} /* sp only */
/* end sec_plan */
/* ==================
* plan-list
* ================== */
.plan-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  gap: calc(var(--std) * 3);
  margin-top: calc(var(--std) * 5);
}

/* end plan-list */
/* ==================
* plan
* ================== */
.plan .plan_title {
  font-weight: bold;
  text-align: center;
  font-size: calc(var(--std) * 1.6);
}
.plan .plan_title .sub {
  font-weight: normal;
}
.plan .plan_table {
  margin-inline: auto;
  margin-top: calc(var(--std) * 2.2);
  border-collapse: separate;
  border-spacing: calc(var(--std) * 0.4);
  width: 100%;
  max-width: 630px;
}
.plan .plan_table th,
.plan .plan_table td {
  font-size: calc(var(--std) * 1.6);
  padding: calc(var(--std) * 1.4) calc(var(--std) * 1);
}
.plan .plan_table th {
  background-color: #DDEFF9;
  color: var(--blue);
  width: 50%;
  font-weight: normal;
}
.plan .plan_table td {
  border: 1px solid #DDEFF9;
  text-align: center;
}
.plan .c_annotation {
  width: 100%;
  margin-inline: auto;
  margin-top: calc(var(--std) * 0.6);
  max-width: 630px;
  text-align: right;
}

@media screen and (max-width: 767px) {
  /* sp only */
  .plan .plan_title {
    font-size: calc(var(--std) * 1.8);
  }
  .plan .plan_title .sub {
    font-size: 0.7em;
    display: block;
    margin-top: calc(var(--std) * 1);
  }
  .plan .plan_table th,
  .plan .plan_table td {
    padding: calc(var(--std) * 1.2) calc(var(--std) * 0.6);
  }
} /* sp only */
/* end plan */
/* ==================
* faq
* ================== */
.sec_faq {
  margin-block: calc(var(--std) * 8.4) calc(var(--std) * 5);
}
.sec_faq .c_sec_title {
  margin-top: calc(var(--std) * 8.5);
}

.faq {
  margin-top: calc(var(--std) * 5.7);
}
.faq .dt,
.faq .dd {
  font-size: calc(var(--std) * 1.6);
  position: relative;
  padding-left: calc(var(--std) * 2.3);
  line-height: 2.0588235294;
}
.faq .dt::before,
.faq .dd::before {
  content: "";
  background: var(--url) rgba(255, 255, 255, 0) no-repeat top 50% left 50%/contain;
  aspect-ratio: 35/29;
  width: calc(var(--std) * 1.8);
  position: absolute;
  left: 0;
  top: calc(var(--std) * 1);
}
.faq .dt {
  font-weight: bold;
}
.faq .dt::before {
  --url: url("/images/cancellation/icon_q.png");
}
.faq .dt:not(:nth-of-type(1)) {
  margin-top: calc(var(--std) * 5);
}
.faq .dd::before {
  --url: url("/images/cancellation/icon_a.png");
}

@media screen and (max-width: 767px) {
  /* sp only */
  .sec_faq {
    margin-top: calc(var(--std) * 10);
  }
  .sec_faq .c_sec_title {
    margin-top: calc(var(--std) * 4);
  }
  .sec_faq .c_sec_title::after {
    width: calc(var(--std) * 12);
  }
  .faq {
    margin-top: calc(var(--std) * 2);
  }
  .faq .dt,
  .faq .dd {
    font-size: calc(var(--std) * 1.7);
  }
  .faq .dt:not(:nth-of-type(1)) {
    margin-top: calc(var(--std) * 3);
  }
} /* sp only */
/* end faq */