br.sp{ display: none;}

/* CLS対策：ヒーロー領域のプレースホルダ */
#banner .banner_slide{
  aspect-ratio: 16 / 9;     /* 例：16:9 */
  min-height: 420px;        /* モバイルでの見切れ防止 */
  width: 100%;
  display:block;
}
.banner_slide{
aspect-ratio:16/9; min-height:420px;
}
@media screen and (max-width:768px){
  br.sp{ display: inline;}
}
/******************************************/
/* about                                */
/******************************************/

#about.content_bg{
  background-color: transparent;
}

/* 見出し＆キャッチコピー（会社案内） */
/* アクセント色はここで変更可能 */
:root {
  --accent: #0ea5e9;            /* アクセント（青系） */
  --accent-weak: rgba(14,165,233,.20);
  --ink: #111;                  /* 文字色 */
  --muted: #6b7280;             /* サブテキスト */
}

header.cont_caption {
  text-align: center;
  position: relative;
  isolation: isolate;
}

/* 見出し */
header.cont_caption .heading {
  align-items: baseline;
  gap: .6em;                       /* 和文とENの間隔 */
  font-size: clamp(24px, 4.4vw, 40px);
  font-weight: 800;
  letter-spacing: .04em;
  line-height: 1.2;
  color: var(--ink);
  position: relative;
  padding-bottom: 1.5rem;           /* 下線分の余白 */
  animation: cc-rise-in .6s ease both;
}

/* 見出しのセンター下線（グラデーション） */
header.cont_caption .heading::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: clamp(120px, 35vw, 260px);
  height: 3px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, var(--accent-weak), var(--accent) 42%, var(--accent-weak));
  border-radius: 999px;
}

/* ENタグ（カプセル） */
header.cont_caption .heading .en {
  font-size: .55em;
  text-transform: uppercase;
  letter-spacing: .2em;
  color: var(--accent);
  border: 1px solid var(--accent);
  border-radius: 999px;
  padding: .2em .7em;
  line-height: 1;
  font-weight: 700;
}

/* キャッチコピー */
header.cont_caption .byline {
  display: inline-block;
  margin-top: 14px;
  font-size: clamp(14px, 1.6vw, 20px);
  color: var(--muted);
  letter-spacing: .04em;
  padding: .15em .25em;
  border-radius: .4em;
  animation: cc-rise-in .6s ease .05s both; /* 少し遅れて出す */
  line-height: 1.4;
}


/******************************************/
/* service                                */
/******************************************/

#service .inner p.price{
    text-align: center;
    background: #fff;
    border: 1px solid #ccc;
    padding: 10px;
    line-height: 1.5;
}

#service figure.icon-image {
  width: 180px;              /* 好きなサイズに調整 */
  height: 180px;
  border-radius: 50%;        /* 円形にする */
  background-color: #ffffff; /* 背景色を指定 */
  display: flex;             /* 中央配置のためflexを利用 */
  align-items: center;       /* 縦中央 */
  justify-content: center;   /* 横中央 */
  overflow: hidden;          /* はみ出し防止（任意） */
  margin: 0 auto;            /* 中央寄せ（親要素内で） */
}

#service figure.icon-image img {
  max-width: 100%;   /* アイコンの比率を調整 */
  height: auto;
}

@media screen and (min-width:1080px){
    #service .inner{
        margin: 0 0 0 210px;
        height: 270px;
    }
    #service .inner p.price{
        text-align: center;
        background: #fff;

    }
}
@media screen and (max-width:767px){
    #service figure.icon-image {
      width: 120px;              /* 好きなサイズに調整 */
      height: 120px;
      margin-right: 16px;
      border: 2px solid #00ae93;
    }
    #footer header img{
      max-width: 200px;
    }
}


/******************************************/
/* [contact]                              */
/******************************************/

#contact header{
    border-radius: 16px;
    padding: 1em 2em;
}