/* AIKATA 138：トップの単調さを解消（econte の手法を参考に新規）。左右の余白・文言・構成は変えない */
html body.aikata[data-brush138]{--p138:#0f64ae;--p138b:#26a2dc;--g138:#d9480f;--lav138:#f3f8fe}

/* 1) 背景の交互配色：白 → 淡いラベンダー。幅1200pxのセクションも画面幅いっぱいに色を敷く（横スクロールを出さない方法） */
html body.aikata[data-brush138] main>section:is(.home-cases,.faq106){position:relative;isolation:isolate}
html body.aikata[data-brush138] main>section:is(.home-cases,.faq106)::before{content:'';position:absolute;inset:0;z-index:-2;background:var(--lav138);box-shadow:0 0 0 100vmax var(--lav138);clip-path:inset(0 -100vmax);pointer-events:none}
html body.aikata[data-brush138] .faq137 details{background:#fff}

/* 2) 見出しの上のドーナツ記号（入ってきたら回りながら現れる） */
html body.aikata[data-brush138] :is(.title106,.story-side110){position:relative}
html body.aikata[data-brush138] :is(.title106,.story-side110)::before{content:'';display:block;width:54px;height:54px;margin:0 auto 18px;border-radius:50%;border:13px solid var(--p138);border-right-color:var(--g138);box-sizing:border-box;opacity:.9}
html body.aikata[data-brush138] .services-section .title106::before{border-color:#b3d4f9;border-right-color:var(--g138)}
html body.aikata[data-brush138] .story-side110::before{margin-left:auto;margin-right:auto}

/* 3) 見出し横の小さなイラスト */
html body.aikata[data-brush138] .has-deco138{position:relative}
html body.aikata[data-brush138] .deco138{position:absolute;right:0;top:-24px;width:clamp(150px,15vw,220px);height:auto;pointer-events:none;z-index:0}
html body.aikata[data-brush138] .has-deco138>:not(.deco138){position:relative;z-index:1}

/* 4) 画面外へはみ出す大きなリング（装飾） */
html body.aikata[data-brush138] main>section.has-ring138{position:relative;isolation:isolate;overflow-x:clip}
html body.aikata[data-brush138] .ring138{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
html body.aikata[data-brush138] .ring138 i{position:absolute;border-radius:50%;border:clamp(40px,6vw,90px) solid var(--p138);opacity:.06}
html body.aikata[data-brush138] .ring138 i:first-child{width:clamp(320px,38vw,560px);aspect-ratio:1;right:calc(-1 * clamp(120px,14vw,220px));top:40px}
html body.aikata[data-brush138] .ring138 i:last-child{width:clamp(200px,22vw,320px);aspect-ratio:1;left:calc(-1 * clamp(90px,10vw,150px));bottom:60px;border-color:var(--g138);opacity:.16}
html body.aikata[data-brush138] .art-pricing .ring138 i:first-child{right:auto;left:calc(-1 * clamp(120px,14vw,220px))}
html body.aikata[data-brush138] .art-pricing .ring138 i:last-child{left:auto;right:calc(-1 * clamp(90px,10vw,150px))}

/* 5) 動き：ふわっと現れて、ゆっくり浮く（動きを減らす設定では静止） */
@media(prefers-reduced-motion:no-preference){
  html body.aikata[data-brush138] :is(.title106,.story-side110):not(.in138)::before{transform:scale(.4) rotate(-120deg);opacity:0}
  html body.aikata[data-brush138] :is(.title106,.story-side110)::before{transition:transform .9s cubic-bezier(.2,.8,.2,1),opacity .6s ease}
  html body.aikata[data-brush138] .has-deco138:not(.in138) .deco138{opacity:0;transform:translateY(10px) scale(.94)}
  html body.aikata[data-brush138] .deco138{transition:opacity .6s ease .2s,transform .6s ease .2s}
  html body.aikata[data-brush138] .has-deco138.in138 .deco138{animation:float138 6s ease-in-out .8s infinite}
  html body.aikata[data-brush138] .has-ring138.in138 .ring138 i:first-child{animation:drift138 18s ease-in-out infinite alternate}
  html body.aikata[data-brush138] .has-ring138.in138 .ring138 i:last-child{animation:drift138 14s ease-in-out -4s infinite alternate-reverse}
  @keyframes float138{0%,100%{translate:0 0}50%{translate:0 -10px}}
  @keyframes drift138{from{translate:0 0}to{translate:-24px 18px}}
}

@media(max-width:767px){
  html body.aikata[data-brush138] .deco138{width:96px;top:-58px;right:-6px}
  html body.aikata[data-brush138] :is(.title106,.story-side110)::before{width:44px;height:44px;border-width:11px;margin-bottom:14px}
}

/* 138補正：既存の「main img は横幅いっぱい」より強く。見出しのドーナツも全セクションに */
html body.aikata[data-brush138][data-titles117] main .has-deco138 img.deco138{position:absolute!important;width:clamp(140px,13vw,200px)!important;max-width:none!important;height:auto!important;aspect-ratio:4/3!important;margin:0!important;right:0!important;left:auto!important;top:-30px!important;object-fit:contain!important;border-radius:0!important;box-shadow:none!important}
html body.aikata[data-brush138][data-titles117] main :is(.chapter.title106,.story-side110)::before{content:''!important;display:block!important;position:static!important;width:54px!important;height:54px!important;margin:0 auto 18px!important;border-radius:50%!important;border:13px solid var(--p138)!important;border-right-color:var(--g138)!important;background:none!important;box-sizing:border-box!important}
html body.aikata[data-brush138][data-titles117] main .services-section .chapter.title106::before{border-color:#b3d4f9!important;border-right-color:var(--g138)!important}

@media(max-width:767px){html body.aikata[data-brush138][data-titles117] main .has-deco138 img.deco138{width:92px!important;top:-62px!important;right:-4px!important}html body.aikata[data-brush138][data-titles117] main :is(.chapter.title106,.story-side110)::before{width:42px!important;height:42px!important;border-width:10px!important}}
html body.aikata[data-lp137] .faq137-text{min-width:0;overflow-wrap:anywhere;word-break:normal}