@charset "UTF-8";

.card-divider{ margin:10px 0; }

/* サービス */
.service{ width:min(100%,1000px); }
.service__lead{ text-align:center; color:var(--ink-weak); margin-bottom:24px; }
.service-list{ display:grid; gap:18px; }
.section .service h3{
  margin:0 0 6px; font-weight:600; font-size:clamp(18px,3vw,24px);
}
.section .service p{ margin:.2em 0 10px; color:var(--ink-weak); }

/* ボタン風チップ */
.chip2{
  display:inline-flex; align-items:center; justify-content:center;
  padding:15px 12px; font-weight:700; color:#fff; text-decoration:none;
  background:linear-gradient(to left,#fabe00,#fddf8f); line-height:1.3;
}

/* 説明箱 */
.step__services{
  max-width:1000px; margin:.5em auto 0; padding:1em;
  background:#fff; color:#333; border:1px solid #e6e6e6; border-radius:4px;
  font-size:clamp(.8rem,1.4vw,1rem); line-height:1.6; text-align:left; box-sizing:border-box; word-break:break-word;
}

/* バッジ */
.badge{ text-align:initial; border-radius:999px; }

/* バッジリスト */
.badges--list{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.6em 2em; margin:16px 0 0; padding:0; list-style:none;
}
.badges--list.badges--tight>li{ --bullet-gap:0; }
.badges--list>li{
  --bullet-color:#0aa7a7; --bullet-size:1em; --bullet-gap:.55em; --bullet-lh:1.6;
  position:relative; padding-left:calc(var(--bullet-size) + var(--bullet-gap)); line-height:var(--bullet-lh);
  background:transparent; border:0; border-radius:0; text-align:left;
}
.badges--list>li::before{
  content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:var(--bullet-size); height:var(--bullet-size); background:var(--bullet-color); border-radius:50%; pointer-events:none;
}
.badges--list>li:first-child{ margin-top:0; }

/* STEPカード */
.card.card--band.step{ position:relative; overflow:visible; }
.section.card-list>.card.card--band.step:nth-of-type(2)>.card-divider{ grid-column:1/-1; }

.card__cta.small--band{ position:absolute; top:0; left:0; right:0; transform:translateY(-50%); }
.small--band{ margin-block-start:0; }

.initial{ color:#009591; }
.STEP-text{ font-size:.85rem; }
.block100 {
  height: 100px;
  display: block;
  width: 100%;
  pointer-events: none;
}

/* テキスト */
.text__list{ font-size:.85rem; margin:2px 0 15px; }
.text2__list{ font-size:.85rem; margin:2px 0 2px; }
p.text{ margin:0 0 .5em; font-size:20px; }
.step__list{ font-size:20px; margin:0 1em 1em; }

/* モバイル */
@media (max-width:767px){
  .step{ grid-template-columns:1fr; grid-auto-flow:row; } 
  .text__list{ margin-bottom:10px!important; }
}
