@charset "utf-8";
/* ===============================================
# 合格保証システム
=============================================== */
.page_guarantee .ttl {
  padding: 15px 60px;
}

.page_guarantee .sec_guarantee {
  padding: 0 0 6.25rem;
}

.page_guarantee .box_frame {
  position: relative;
  /* inner(max-width:1300px)の中にあっても背景だけ画面幅いっぱいに広げる */
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-top: 3.75rem;
  padding-bottom: 6.25rem;
  /* 広げた分、中身は元のinner+6.5%パディングと同じ幅に収まるよう戻す */
  padding-inline: max(5.28125rem, calc((100vw - 1300px) / 2 + 5.28125rem));
  /* SUPPORTカードや利用条件の線をこの幅に合わせるための共有変数 */
  --support-w: min(1260px, 92vw);
  background-color: #dbebf4;
  /* ドットのサイズ・間隔・色(不透明度)はここで調整 */
  --guarantee-dot-size: 2px;
  --guarantee-dot-gap: 22px;
  --guarantee-dot-color: rgba(26, 111, 196, 0.18);
  background-image: radial-gradient(
    circle,
    var(--guarantee-dot-color) var(--guarantee-dot-size),
    transparent var(--guarantee-dot-size)
  );
  background-size: var(--guarantee-dot-gap) var(--guarantee-dot-gap);
}
@media screen and (max-width: 1023px) {
  .page_guarantee .box_frame {
    width: auto;
    margin-left: 0;
    margin-right: 0;
    padding-inline: 6.5%;
  }
}

/* タブ */
.page_guarantee .ttl_tab {
  display: block;
  width: fit-content;
  margin: 0 auto 2.5rem;
  padding: 0.625rem 2rem;
  border-radius: 24px;
  background-color: #0080cc;
  color: #fff;
  font-weight: bold;
  font-size: 1rem;
  text-align: center;
}

/* リード */
.page_guarantee .ttl_lead {
  color: #1a6fc4;
  font-size: 1.875rem;
  font-weight: bold;
  line-height: 1.6;
  text-align: center;
}
.page_guarantee .txt_lead {
  max-width: 910px;
  margin: 1.5rem auto 0;
  color: #333;
  font-size: 1rem;
  line-height: 2;
}

/* SUPPORTカード */
.page_guarantee .list_support {
  /* 1260pxを上限に、画面幅が狭いときは%(vw)で自然に縮む。
     マージンも同じ変数を使って計算することで、幅が縮んでも中央寄せを維持する */
  --support-w: min(1260px, 92vw);
  width: var(--support-w);
  margin-left: calc(50% - (var(--support-w) / 2));
  margin-right: calc(50% - (var(--support-w) / 2));
  margin-top: 3.5rem;
}
@media screen and (max-width: 1023px) {
  .page_guarantee .list_support {
    width: auto;
    margin-left: 0;
    margin-right: 0;
  }
}
.page_guarantee .box_support {
  display: flex;
  align-items: center;
  gap: 5.625rem;
  background-color: #fff;
  border-radius: 8px;
  padding: 2.5rem 7.5rem 2.5rem 5rem;
}
.page_guarantee .box_support + .box_support {
  margin-top: 2rem;
}
.page_guarantee .box_support .txt_side {
  /* img_side(35%)の残りを可変で埋める。px固定にしない */
  flex: 1 1 auto;
}
.page_guarantee .box_support .img_side {
  /* デザイン比率(370:1060 ≒ 35%)を%で指定。カード幅が変わっても比率を維持する */
  flex: 0 0 35%;
  aspect-ratio: 370 / 260;
}
.page_guarantee .box_support .img_side img {
  width: 100%;
  height: auto;
}
.page_guarantee .box_support .no img {
  /* 1440px(ビューポート)のとき480:90になるよう vw で指定(480/1440=100vw/3) */
  display: block;
  width: 33.3333vw;
  max-width: 480px;
  aspect-ratio: 480 / 90;
}
.page_guarantee .box_support .ttl_support {
  margin-top: 2.5rem;
  font-size: 1.875rem;
  font-weight: bold;
  color: #000;
  line-height: 1.5;
}
.page_guarantee .box_support .txt {
  margin-top: 2.125rem;
  font-size: 1rem;
  line-height: 1.4;
  color: #333;
}

/* 利用条件・合格保証が意味するもの */
.page_guarantee .block_txt {
  /* 見出しの線はカード(list_support)と同じ幅まで伸ばす */
  width: var(--support-w);
  margin-left: calc(50% - (var(--support-w) / 2));
  margin-right: calc(50% - (var(--support-w) / 2));
  margin-top: 3.75rem;
  text-align: center;
}
@media screen and (max-width: 1023px) {
  .page_guarantee .block_txt {
    width: auto;
    margin-left: 0;
    margin-right: 0;
  }
}
.page_guarantee .block_txt .txt {
  /* 本文は読みやすさのため線より狭い幅に収める */
  margin: 2.5rem auto 0;
  font-size: 1rem;
  color: #000;
}
.page_guarantee .ttl_line {
  display: flex;
  align-items: center;
  gap: 3.75rem;
  font-size: 1.875rem;
  font-weight: bold;
  color: #000;
}
.page_guarantee .ttl_line::before,
.page_guarantee .ttl_line::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background-color: #000;
}

@media screen and (max-width: 767px) {
  .page_guarantee .ttl {
    padding: 10px 30px;
    font-size: 1.25rem;
  }
  .page_guarantee .sec_guarantee {
    padding: 1.875rem 0 3.75rem;
  }
  .page_guarantee .box_frame {
    padding: 2.5rem 5%;
    border-radius: 8px;
    --guarantee-dot-size: 1px;
    --guarantee-dot-gap: 14px;
  }
  .page_guarantee .ttl_tab {
    margin-bottom: 1.5rem;
    padding: 0.5rem 1.375rem;
    font-size: 0.875rem;
  }
  .page_guarantee .ttl_lead {
    font-size: 1.25rem;
  }
  .page_guarantee .txt_lead {
    margin-top: 1rem;
    font-size: 0.875rem;
    text-align: left;
  }
  .page_guarantee .list_support {
    margin-top: 2.25rem;
  }
  .page_guarantee .box_support {
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.5rem;
  }
  .page_guarantee .box_support .img_side {
    width: 100%;
    flex: 1 1 auto;
  }
  .page_guarantee .box_support .no img {
    width: 70%;
    max-width: 300px;
    aspect-ratio: 300 / 56;
  }
  .page_guarantee .box_support .ttl_support {
    font-size: 1.125rem;
    margin-top: 1.25rem;
  }
  .page_guarantee .box_support .txt {
    margin-top: 1.25rem;
  }
  .page_guarantee .block_txt {
    margin-top: 2.5rem;
  }
  .page_guarantee .ttl_line {
    gap: 0.75rem;
    font-size: 1.125rem;
  }
}

/* sec_about_system / sec_flow / sec_reason の内側の幅
----------------------------------------------- */
/* デザインでは1440px幅のとき954pxになる。66.25vwの単純な比例だと768px付近で
   縮みすぎるため、box_frameと同じく「画面幅 - 左右の最小余白」を使い、
   954pxを上限にしつつ狭い画面でも余白が一定以上小さくならないようにする */
.page_guarantee .sec_about_system .inner,
.page_guarantee .sec_flow .inner,
.page_guarantee .sec_reason .inner {
  width: min(954px, calc(100vw - 5rem));
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .page_guarantee .sec_about_system .inner,
  .page_guarantee .sec_flow .inner,
  .page_guarantee .sec_reason .inner {
    width: auto;
    padding-inline: 5%;
  }
}

/* sec_about_system
----------------------------------------------- */
.page_guarantee .sec_about_system {
  padding: 5rem 0;
}
.page_guarantee .txt_desc {
  margin-top: 1.75rem;
  font-size: 1rem;
  line-height: 2;
  color: #000;
  max-width: 910px;
}
.page_guarantee .box_quote {
  margin-top: 2.5rem;
  text-align: center;
}
.page_guarantee .box_quote p {
  font-size: 0.9375rem;
  line-height: 1.3;
  color: #000;
  display: inline-block;
  padding: 0.875rem 10rem;
  border: 1px solid #000;
}

/* sec_flow
----------------------------------------------- */
.page_guarantee .sec_flow {
  padding: 0 0 6.25rem;
}

/* judoseifuku(course/judoseifuku)のカリキュラム矢印(.curriculum-pc / .pc-col / .pc-arrow)を
   そのまま移植し、4列→5列(pre, y1, y2, y3, y4)に拡張したもの。テキストのみ変更 */
.page_guarantee .curriculum-pc {
  display: block;
  width: 100%;
  overflow: hidden;
  margin-top: 50px;
}
.page_guarantee .curriculum-sp {
  display: none;
}
.page_guarantee .curriculum-pc__flow {
  display: flex;
  align-items: stretch;
  gap: clamp(0.75rem, 0.464rem + 0.6vw, 1rem);
  width: 100%;
  margin: 0 auto;
  /* 一番右の矢印の先端(28px)がcurriculum-pcのoverflow:hiddenで
     切れてしまうため、右側に先端分の余白を確保しておく */
  padding-right: 28px;
}
.page_guarantee .pc-col {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1 1 0%;
}
.page_guarantee .pc-col:nth-child(1) {
  z-index: 10;
}
.page_guarantee .pc-col:nth-child(2) {
  z-index: 4;
}
.page_guarantee .pc-col:nth-child(3) {
  z-index: 3;
}
.page_guarantee .pc-col:nth-child(4) {
  z-index: 2;
}
.page_guarantee .pc-col:nth-child(5) {
  z-index: 1;
}
.page_guarantee .pc-arrow {
  position: relative;
  height: 110px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-weight: 700;
  overflow: visible;
  box-sizing: border-box;
}
.page_guarantee .pc-arrow span {
  position: relative;
  z-index: 5;
  padding: 0 8px;
  word-break: keep-all;
  font-size: clamp(1rem, 0.429rem + 0.93vw, 1.25rem);
}
/* 左に切り欠きがある2〜5列目は、見える矢印の形の中心が箱の中心より右に
   寄るため、テキストも同じ分だけ右にずらして見た目の中央に合わせる */
.page_guarantee .pc-arrow--step1 span,
.page_guarantee .pc-arrow--step2 span,
.page_guarantee .pc-arrow--step3 span,
.page_guarantee .pc-arrow--step4 span {
  margin-left: 30px;
}
.page_guarantee .pc-arrow--step0 span {
  font-size: clamp(0.75rem, 0.464rem + 0.59vw, 1rem);
}
/* 1つ目：入学前と同じ白背景+枠線のスタイル */
.page_guarantee .pc-arrow--step0 {
  position: relative;
  background: #fff;
  border-left: 2px solid #333;
  border-top: 2px solid #333;
  border-bottom: 2px solid #333;
  border-right: none;
  color: #222;
  overflow: visible !important;
}
.page_guarantee .pc-arrow--step0::before {
  content: "";
  position: absolute;
  top: -2px;
  right: -24px;
  width: 25px;
  height: 111px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='114' viewBox='0 0 24 114' fill='none'><path d='M0 2 L22 57 L0 112' stroke='%23333333' stroke-width='2' stroke-linecap='square'/></svg>");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  z-index: 10;
}
.page_guarantee .pc-arrow--step0::after {
  content: "";
  position: absolute;
  top: 0;
  right: -22px;
  width: 22px;
  height: 110px;
  background: #fff;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  z-index: 9;
}
/* 2つ目〜5つ目：色つきの矢印(元は1〜3年次の3色。4つ目の色を追加して5列に拡張) */
.page_guarantee .pc-arrow--step1 {
  position: relative;
  background: #a9cdea;
  color: #0f3868;
  z-index: 1;
}
.page_guarantee .pc-arrow--step1::before {
  content: "";
  position: absolute;
  left: -2px;
  top: 0;
  width: 24px;
  height: 110px;
  background: #fff;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  z-index: 1;
}
.page_guarantee .pc-arrow--step1::after {
  content: "";
  position: absolute;
  right: -28px;
  top: 0;
  width: 28px;
  height: 110px;
  background: #a9cdea;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  z-index: 2;
}
.page_guarantee .pc-arrow--step2 {
  position: relative;
  background: #d8333d;
  color: #fff;
}
.page_guarantee .pc-arrow--step2::before {
  content: "";
  position: absolute;
  left: -1px;
  top: 0;
  width: 28px;
  height: 110px;
  background: #fff;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  z-index: 2;
}
.page_guarantee .pc-arrow--step2::after {
  content: "";
  position: absolute;
  right: -28px;
  top: 0;
  width: 28px;
  height: 110px;
  background: #d8333d;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  z-index: 2;
}
.page_guarantee .pc-arrow--step3 {
  position: relative;
  background: #3d84c8;
  color: #fff;
}
.page_guarantee .pc-arrow--step3::before {
  content: "";
  position: absolute;
  left: -1px;
  top: 0;
  width: 28px;
  height: 110px;
  background: #fff;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  z-index: 2;
}
.page_guarantee .pc-arrow--step3::after {
  content: "";
  position: absolute;
  right: -28px;
  top: 0;
  width: 28px;
  height: 110px;
  background: #3d84c8;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  z-index: 2;
}
/* 5列目として新たに追加した色(元の1〜3年次にはなかった4色目) */
.page_guarantee .pc-arrow--step4 {
  position: relative;
  background: #0f3868;
  color: #fff;
}
.page_guarantee .pc-arrow--step4::before {
  content: "";
  position: absolute;
  left: -1px;
  top: 0;
  width: 28px;
  height: 110px;
  background: #fff;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  z-index: 2;
}
.page_guarantee .pc-arrow--step4::after {
  content: "";
  position: absolute;
  right: -28px;
  top: 0;
  width: 28px;
  height: 110px;
  background: #0f3868;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  z-index: 2;
}
.page_guarantee .pc-body {
  border-left: 3px solid #1a6fc4;
  box-sizing: border-box;
  margin-left: 8px;
  flex: 1;
  padding-block: clamp(0.75rem, 0.42rem + 0.95vw, 1rem);
  padding-left: clamp(0.938rem, 0.525rem + 1.19vw, 1.25rem);
  padding-right: clamp(0.5rem, 0.335rem + 0.48vw, 0.625rem);
}
.page_guarantee .pc-col:first-child .pc-body {
  border-left: 3px solid #000;
}
.page_guarantee .pc-body p {
  line-height: 1.6;
  font-size: clamp(0.75rem, 0.482rem + 0.65vw, 0.9375rem);
}

.page_guarantee .box_check {
  display: flex;
  justify-content: center;
  /* txt_check側の高さにttl_check(赤いCHECK部分)を追従させる */
  align-items: stretch;
  margin-top: 3.125rem;
}
.page_guarantee .box_check .ttl_check {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 2.81rem;
  color: #fff;
  font-size: 0.9375rem;
  background-color: #cc0000;
}
.page_guarantee .box_check .txt_check {
  flex: 1 1 auto;
  font-size: 0.9375rem;
  line-height: 1.3;
  max-width: 570px;
  padding: 0.875rem 1.625rem 0.8125rem;
  border: 1px solid #000;
  border-left: none;
}

@media screen and (max-width: 767px) {
  .page_guarantee .sec_about_system {
    padding: 2.5rem 0;
  }
  .page_guarantee .box_quote {
    padding: 0;
  }
  .page_guarantee .box_quote p {
    padding: 1rem 1rem;
  }
  .page_guarantee .sec_flow {
    padding: 0 0 3.75rem;
  }
  /* judoseifukuの.curriculum-sp(縦積みの矢印)をそのまま移植 */
  .page_guarantee .curriculum-pc {
    display: none;
  }
  .page_guarantee .curriculum-sp {
    display: block;
    box-sizing: border-box;
    margin-top: 30px;
  }
  .page_guarantee .sp-row {
    display: flex;
    align-items: stretch;
    gap: clamp(0.75rem, 0.35rem + 1.8vw, 1.25rem);
    /* 矢印同士の間隔を-16pxでギュッと狭めて深く重ねる */
    margin-bottom: -16px;
  }
  .page_guarantee .sp-row:last-child {
    margin-bottom: 0;
  }
  .page_guarantee .sp-shape {
    position: relative;
    width: 42%;
    max-width: 240px;
    min-width: 120px;
    aspect-ratio: 1 / 1.2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-weight: 700;
    color: #fff;
    box-sizing: border-box;
    padding-top: clamp(1.875rem, 1.5rem + 1.8vw, 2.25rem);
    padding-bottom: clamp(2.5rem, 2rem + 1.8vw, 3rem);
    padding-inline: 12px;
    z-index: 2;
    clip-path: polygon(
      0 0,
      50% 30px,
      100% 0,
      100% calc(100% - 30px),
      50% 100%,
      0 calc(100% - 30px)
    );
  }
  /* 【在学中の学習（一番上）】の調整 */
  .page_guarantee .sp-row:first-child .sp-shape {
    clip-path: polygon(
      0 0,
      100% 0,
      100% calc(100% - 30px),
      50% 100%,
      0 calc(100% - 30px)
    );
    aspect-ratio: 1 / 1.2;
    padding-top: clamp(1.5rem, 1rem + 1.8vw, 2rem);
    padding-bottom: clamp(3.5rem, 2.5rem + 3vw, 4.5rem);
  }
  .page_guarantee .sp-shape--step0 {
    background: #fff;
    color: #000;
  }
  .page_guarantee .sp-shape--step0::before {
    content: "";
    position: absolute;
    inset: 0;
    background: #000;
    z-index: -2;
  }
  .page_guarantee .sp-shape--step0::after {
    content: "";
    position: absolute;
    inset: 2px;
    background: #fff;
    z-index: -1;
    clip-path: polygon(
      0 0,
      100% 0,
      100% calc(100% - 29px),
      50% calc(100% - 2px),
      0 calc(100% - 29px)
    );
  }
  .page_guarantee .sp-shape--step0 span {
    font-size: clamp(1rem, 0.163rem + 3.57vw, 1.875rem);
    line-height: 1.4;
    font-weight: 700;
  }
  .page_guarantee .sp-shape--step1 {
    background: #a9cdea;
    color: #0f3868;
  }
  .page_guarantee .sp-shape--step2 {
    background: #d8333d;
    color: #fff;
  }
  .page_guarantee .sp-shape--step3 {
    background: #3d84c8;
    color: #fff;
  }
  .page_guarantee .sp-shape--step4 {
    background: #0f3868;
    color: #fff;
  }
  .page_guarantee .sp-shape strong {
    font-size: clamp(1rem, 0.462rem + 2.3vw, 1.563rem);
    line-height: 1.3;
    letter-spacing: 0.05em;
  }
  .page_guarantee .sp-content {
    flex: 1;
    padding-top: clamp(0.75rem, 0.45rem + 1.3vw, 1.125rem);
    padding-bottom: clamp(0.75rem, 0.45rem + 1.3vw, 1.125rem);
  }
  .page_guarantee .sp-content p {
    line-height: 1.6;
    font-size: clamp(0.813rem, 0.72rem + 0.4vw, 0.938rem);
    color: #000;
    border-top: 2px solid #3d84c8;
    padding-top: 1rem;
    padding-inline: 0.5rem;
  }
  .page_guarantee .sp-row:first-child .sp-content p {
    border-top: 2px solid #000;
  }
  .page_guarantee .box_check .txt_check{
    padding: 0.75rem 1rem 0.625rem;
  }
}

/* sec_reason
----------------------------------------------- */
.page_guarantee .sec_reason {
  padding: 0 0 6.25rem;
}
.page_guarantee .sec_reason .title02 + .txt_desc,
.page_guarantee .sec_reason .title02 {
  margin-top: 2.75rem;
}
.page_guarantee .sec_reason .title02:first-child {
  margin-top: 0;
}

.page_guarantee .list_reason {
  margin-top: 2.5rem;
}
.page_guarantee .box_reason .ttl_reason {
  color: #0080CC;
  font-size: 1.125rem;
  font-weight: bold;
  line-height: 1.5;
  padding-bottom: 0.75rem;
  margin-top: 1.5rem;
}
.page_guarantee .box_reason .txt {
  margin-top: 1rem;
  font-size: 0.9375rem;
  line-height: 1.9;
  color: #333;
}

/* 箇条書き(青いドット) */
.page_guarantee .list_check {
  margin-top: 1rem;
}
.page_guarantee .list_check li {
  position: relative;
  padding-left: 1.25rem;
  font-size: 0.9375rem;
  line-height: 1.9;
  color: #333;
}
.page_guarantee .list_check li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.7em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #0080cc;
}

/* 合格実績テーブル(青いヘッダー) */
.page_guarantee .table_reason {
  width: 100%;
  border-collapse: collapse;
  margin-top: 2rem;
}
.page_guarantee .table_reason th {
  padding: 0.875rem 1rem;
  background-color: #0080cc;
  color: #fff;
  font-size: 0.9375rem;
  text-align: center;
  border: 1px solid #fff;
}
.page_guarantee .table_reason td {
  padding: 0.875rem 1rem;
  background-color: #fff;
  font-size: 0.9375rem;
  text-align: center;
  border: 1px solid #dde5ea;
}
.page_guarantee .table_reason td.num {
  color: #0080cc;
  font-weight: bold;
}

.page_guarantee .txt_note {
  margin-top: 1rem;
  font-size: 0.8125rem;
  line-height: 1.8;
  color: #666;
}

.page_guarantee .box_note {
  margin-top: 2.5rem;
  display: flex;
  align-items: stretch;
  border: 1px solid #000;
  margin-inline: 4rem;
}
.page_guarantee .box_note .ttl_note {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem 0.75rem 1rem 2rem;
  font-size: 0.9375rem;
  font-weight: bold;
  color: #000;
  text-align: center;
}
.page_guarantee .box_note .txt_note_desc {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  padding: 1rem 1.25rem;
  font-size: 0.9375rem;
  line-height: 1.7;
}

@media screen and (max-width: 767px) {
  .page_guarantee .sec_reason {
    padding: 2.5rem 0 3.75rem;
  }
  .page_guarantee .list_reason {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .page_guarantee .table_reason th,
  .page_guarantee .table_reason td {
    padding: 0.625rem 0.5rem;
    font-size: 0.8125rem;
  }
  .page_guarantee .box_note {
    width: auto;
    flex-direction: column;
    margin-inline: 1rem;
  }
  .page_guarantee .box_note .ttl_note {
    width: auto;
    padding: 1.5rem 1rem 0.75rem;
    border-right: none;
  }
  .page_guarantee .box_note .txt_note_desc {
    padding: 0.75rem 1.25rem;
  }
}

/* course_faq (judoseifukuのFAQをそのまま移植)
----------------------------------------------- */
/* アコーディオン本体(青丸+/-アイコン・水色背景など)は common_parts.css の
   .block_accordion が全ページ共通で効いているので、ここではcourse_faq
   固有のレイアウト(全幅の白背景・幅954px・水色ラッパー)だけ移植する。
   judoseifukuと違い、タイトル(title02)は青帯のまま(上書きしない)にする */
.page_guarantee .course_faq {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background-color: #fff;
  padding: 0 60px 100px;
}
.page_guarantee .course_faq-inner {
  /* 他セクションと同じく1440pxのとき954pxになる幅 */
  width: min(954px, calc(100vw - 5rem));
  margin: 0 auto;
}
.page_guarantee .course_faq-wrapper {
  background-color: #e3f0f5;
  margin-top: 30px;
  min-width: 0;
  padding: 20px;
  border-radius: 4px;
}
/* .page_guarantee .course_faq .accordion {
  padding: 0 20px;
} */
.page_guarantee .course_faq .label {
  /* アイコン(36px幅)がright:20pxにあるので、テキストが被らないよう
     右側のパディングをアイコン分(20+36+余白)確保する */
  padding: 0 64px 0 20px;
}
.page_guarantee .course_faq .block_accordion .acd_title {
  border: none;
  margin-top: 10px;
}
.page_guarantee .course_faq .block_accordion:first-child .acd_title {
  margin-top: 0;
}
.page_guarantee .course_faq .block_accordion .acd_title .icon {
  right: 20px;
}
.page_guarantee .course_faq .acd_detail {
  border-top: 1px solid #0185cf;
}

@media screen and (max-width: 767px) {
  .page_guarantee .course_faq {
    padding: 0 0 50px;
  }
  .page_guarantee .course_faq-inner {
    width: auto;
    padding-inline: 5%;
  }
  .page_guarantee .course_faq .title02 {
    font-size: 1.25rem;
  }
  .page_guarantee .course_faq-wrapper {
    margin-top: 20px;
    padding: 10px;
  }
  .page_guarantee .course_faq .label {
    /* モバイルはアイコンが28px幅になるので、その分だけ右側を確保 */
    padding: 0 60px 0 20px;
    font-size: 0.875rem;
  }
  .page_guarantee .course_faq .block_accordion .acd_detail p {
    font-size: 0.875rem;
  }
}