.ahs-hero{
  position:relative;
  min-height:var(--ahs-height-desktop,680px);
  width:100%;
  overflow:hidden;
  background:#111;
  isolation:isolate;
  box-sizing:border-box;
}
.ahs-hero.alignfull,
.ahs-hero.ahs-force-full{
  width:100vw;
  max-width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
}
.ahs-panels,.ahs-panel,.ahs-panel-slide,.ahs-overlay,.ahs-layers{position:absolute;inset:0}
.ahs-panels{
  z-index:0;
  display:grid;
  gap:var(--ahs-panel-gap,0px);
  background:var(--ahs-separator-color,rgba(255,255,255,.25));
}
.ahs-panel{position:relative;overflow:hidden;background:#111}
.ahs-panel-count-1 .ahs-panels{grid-template-columns:1fr;grid-template-rows:1fr}
.ahs-panel-count-2 .ahs-panels{grid-template-columns:repeat(2,1fr);grid-template-rows:1fr}
.ahs-panel-count-3 .ahs-panels{grid-template-columns:repeat(3,1fr);grid-template-rows:1fr}
.ahs-panel-count-4 .ahs-panels{grid-template-columns:repeat(4,1fr);grid-template-rows:1fr}
.ahs-panel-count-5 .ahs-panels,
.ahs-panel-count-6 .ahs-panels,
.ahs-panel-count-7 .ahs-panels,
.ahs-panel-count-8 .ahs-panels{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr)}
.ahs-panel::after{
  content:"";
  position:absolute;
  inset:0;
  border-right:var(--ahs-separator-width,0px) solid var(--ahs-separator-color,rgba(255,255,255,.25));
  border-bottom:var(--ahs-separator-width,0px) solid var(--ahs-separator-color,rgba(255,255,255,.25));
  pointer-events:none;
  z-index:3;
}
.ahs-panel-slide{
  opacity:0;
  transition:opacity var(--ahs-transition,1200ms) var(--ahs-easing,ease-in-out),transform var(--ahs-transition,1200ms) var(--ahs-easing,ease-in-out),filter var(--ahs-transition,1200ms) var(--ahs-easing,ease-in-out);
  transform:scale(1.01);
  filter:none;
  z-index:0;
}
.ahs-panel-slide.is-active{opacity:1;transform:scale(1);z-index:2}
.ahs-panel-slide img{width:100%;height:100%;object-fit:cover;object-position:var(--ahs-object-position,center center);display:block}
.ahs-panel-empty{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1f2937,#111827 45%,#334155)}
.ahs-panel-empty span{width:36px;height:36px;border:1px solid rgba(255,255,255,.9);border-radius:999px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;background:rgba(255,255,255,.08)}
.ahs-overlay{z-index:2;background:var(--ahs-overlay-color,#000);opacity:var(--ahs-overlay-opacity,.25);pointer-events:none}
.ahs-layers{z-index:3;pointer-events:none}
.ahs-layer{position:absolute;box-sizing:border-box;transform:translate(-50%,-50%);line-height:1.18;letter-spacing:.02em;word-break:break-word;pointer-events:auto;max-width:calc(100% - 24px)}
.ahs-layer.has-shadow{text-shadow:0 3px 18px rgba(0,0,0,.55)}
.ahs-layer-image img{width:100%;height:auto;display:block;filter:drop-shadow(0 14px 26px rgba(0,0,0,.28))}
.ahs-layer-button .ahs-button{display:inline-flex;align-items:center;justify-content:center;gap:.35em;text-decoration:none;color:inherit;background:rgba(255,255,255,.14);border:1px solid currentColor;border-radius:999px;padding:.72em 1.35em;backdrop-filter:blur(6px);transition:transform .25s ease,opacity .25s ease,background .25s ease}
.ahs-layer-button .ahs-button:hover{transform:translateY(-2px);background:rgba(255,255,255,.25)}
.ahs-effect-none .ahs-panel-slide{transition:none}
.ahs-effect-slide-left .ahs-panel-slide{transform:translateX(100%);opacity:1}
.ahs-effect-slide-left .ahs-panel-slide.is-active{transform:translateX(0)}
.ahs-effect-slide-right .ahs-panel-slide{transform:translateX(-100%);opacity:1}
.ahs-effect-slide-right .ahs-panel-slide.is-active{transform:translateX(0)}
.ahs-effect-slide-up .ahs-panel-slide{transform:translateY(100%);opacity:1}
.ahs-effect-slide-up .ahs-panel-slide.is-active{transform:translateY(0)}
.ahs-effect-slide-down .ahs-panel-slide{transform:translateY(-100%);opacity:1}
.ahs-effect-slide-down .ahs-panel-slide.is-active{transform:translateY(0)}
.ahs-effect-zoom .ahs-panel-slide{transform:scale(1.14);opacity:0}
.ahs-effect-zoom .ahs-panel-slide.is-active{transform:scale(1);opacity:1}
.ahs-effect-blur .ahs-panel-slide{filter:blur(16px);transform:scale(1.05)}
.ahs-effect-blur .ahs-panel-slide.is-active{filter:blur(0);transform:scale(1)}
.ahs-image-effect-zoom-in .ahs-panel-slide.is-active img{animation:ahsImageZoomIn var(--ahs-image-duration,9000ms) var(--ahs-easing,ease-in-out) both}
.ahs-image-effect-zoom-out .ahs-panel-slide.is-active img{animation:ahsImageZoomOut var(--ahs-image-duration,9000ms) var(--ahs-easing,ease-in-out) both}
.ahs-image-effect-kenburns .ahs-panel-slide.is-active img,.ahs-effect-kenburns .ahs-panel-slide.is-active img{animation:ahsKenburns var(--ahs-image-duration,9000ms) var(--ahs-easing,ease-in-out) both}
.ahs-image-effect-pan-left .ahs-panel-slide.is-active img{animation:ahsPanLeft var(--ahs-image-duration,9000ms) var(--ahs-easing,ease-in-out) both}
.ahs-image-effect-pan-right .ahs-panel-slide.is-active img{animation:ahsPanRight var(--ahs-image-duration,9000ms) var(--ahs-easing,ease-in-out) both}
.ahs-image-effect-blur-in .ahs-panel-slide.is-active img{animation:ahsImageBlurIn var(--ahs-image-duration,9000ms) var(--ahs-easing,ease-in-out) both}
.ahs-image-effect-grayscale .ahs-panel-slide.is-active img{animation:ahsImageGrayscale var(--ahs-image-duration,9000ms) var(--ahs-easing,ease-in-out) both}
.ahs-anim-none{animation:none}
.ahs-anim-fade-up{animation:ahsFadeUp .8s ease both .15s}
.ahs-anim-fade-in{animation:ahsFadeIn .8s ease both .15s}
.ahs-anim-slide-left{animation:ahsLayerSlideLeft .85s ease both .15s}
.ahs-anim-pop{animation:ahsLayerPop .65s cubic-bezier(.2,1.4,.35,1) both .15s}
@keyframes ahsZoom{from{transform:scale(1)}to{transform:scale(1.1)}}
@keyframes ahsImageZoomIn{from{transform:scale(1)}to{transform:scale(1.12)}}
@keyframes ahsImageZoomOut{from{transform:scale(1.16)}to{transform:scale(1)}}
@keyframes ahsKenburns{from{transform:scale(1.08) translate3d(-1.5%,1%,0)}to{transform:scale(1.16) translate3d(1.5%,-1%,0)}}
@keyframes ahsPanLeft{from{transform:scale(1.08) translateX(2%)}to{transform:scale(1.08) translateX(-2%)}}
@keyframes ahsPanRight{from{transform:scale(1.08) translateX(-2%)}to{transform:scale(1.08) translateX(2%)}}
@keyframes ahsImageBlurIn{from{filter:blur(12px);transform:scale(1.04)}to{filter:blur(0);transform:scale(1)}}
@keyframes ahsImageGrayscale{from{filter:grayscale(1);transform:scale(1.02)}to{filter:grayscale(0);transform:scale(1)}}
@keyframes ahsFadeUp{from{opacity:0;transform:translate(-50%,calc(-50% + 24px))}to{opacity:1;transform:translate(-50%,-50%)}}
@keyframes ahsFadeIn{from{opacity:0}to{opacity:1}}
@keyframes ahsLayerSlideLeft{from{opacity:0;transform:translate(calc(-50% + 32px),-50%)}to{opacity:1;transform:translate(-50%,-50%)}}
@keyframes ahsLayerPop{from{opacity:0;transform:translate(-50%,-50%) scale(.82)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@media (max-width:960px){
  .ahs-hero{min-height:var(--ahs-height-tablet,540px)}
  .ahs-panel-count-3 .ahs-panels,
  .ahs-panel-count-4 .ahs-panels,
  .ahs-panel-count-5 .ahs-panels,
  .ahs-panel-count-6 .ahs-panels,
  .ahs-panel-count-7 .ahs-panels,
  .ahs-panel-count-8 .ahs-panels{grid-template-columns:repeat(2,1fr);grid-template-rows:auto}
  .ahs-layer{font-size:clamp(16px,5vw,56px)!important;width:min(var(--layer-width,80%),92%)}
}
@media (max-width:640px){
  .ahs-hero{min-height:var(--ahs-height-mobile,420px)}
  .ahs-panel-count-2 .ahs-panels,
  .ahs-panel-count-3 .ahs-panels,
  .ahs-panel-count-4 .ahs-panels,
  .ahs-panel-count-5 .ahs-panels,
  .ahs-panel-count-6 .ahs-panels,
  .ahs-panel-count-7 .ahs-panels,
  .ahs-panel-count-8 .ahs-panels{grid-template-columns:repeat(2,1fr);grid-template-rows:auto}
  .ahs-layer{font-size:clamp(14px,7vw,44px)!important;max-width:94%}
  .ahs-layer-button .ahs-button{padding:.65em 1em}
}

/* v1.0.2 レスポンシブ個別設定 */
@media (max-width:960px){
  .ahs-hero .ahs-panels{grid-template-columns:repeat(var(--ahs-grid-cols-tablet,2),1fr)!important;grid-template-rows:auto!important;}
  .ahs-hero .ahs-panel-slide img{object-position:var(--ahs-object-position-tablet,var(--ahs-object-position,center center));}
  .ahs-hero .ahs-layer{
    left:var(--ahs-layer-x-tablet,var(--ahs-layer-x));
    top:var(--ahs-layer-y-tablet,var(--ahs-layer-y));
    width:min(var(--ahs-layer-w-tablet,var(--ahs-layer-w)),94%);
    font-size:var(--ahs-layer-font-tablet,var(--ahs-layer-font))!important;
  }
}
@media (max-width:640px){
  .ahs-hero .ahs-panels{grid-template-columns:repeat(var(--ahs-grid-cols-mobile,1),1fr)!important;grid-template-rows:auto!important;}
  .ahs-hero .ahs-panel-slide img{object-position:var(--ahs-object-position-mobile,var(--ahs-object-position-tablet,var(--ahs-object-position,center center)));}
  .ahs-hero .ahs-layer{
    left:var(--ahs-layer-x-mobile,var(--ahs-layer-x-tablet,var(--ahs-layer-x)));
    top:var(--ahs-layer-y-mobile,var(--ahs-layer-y-tablet,var(--ahs-layer-y)));
    width:min(var(--ahs-layer-w-mobile,var(--ahs-layer-w-tablet,var(--ahs-layer-w))),94%);
    font-size:var(--ahs-layer-font-mobile,var(--ahs-layer-font-tablet,var(--ahs-layer-font)))!important;
  }
}


/* v1.0.5: 編集画面のタブレット/スマホプレビューと公開ページの表示を一致させる。
   画面幅ではなく、ブロック自体の表示幅をJSで判定して is-device-* を付与します。 */
.ahs-hero.is-device-tablet{min-height:var(--ahs-height-tablet,540px)}
.ahs-hero.is-device-tablet .ahs-panels{grid-template-columns:repeat(var(--ahs-grid-cols-tablet,2),1fr)!important;grid-template-rows:auto!important;}
.ahs-hero.is-device-tablet .ahs-panel-slide img{object-position:var(--ahs-object-position-tablet,var(--ahs-object-position,center center));}
.ahs-hero.is-device-tablet .ahs-layer{
  left:var(--ahs-layer-x-tablet,var(--ahs-layer-x));
  top:var(--ahs-layer-y-tablet,var(--ahs-layer-y));
  width:min(var(--ahs-layer-w-tablet,var(--ahs-layer-w)),94%);
  font-size:var(--ahs-layer-font-tablet,var(--ahs-layer-font))!important;
}
.ahs-hero.is-device-mobile{min-height:var(--ahs-height-mobile,420px)}
.ahs-hero.is-device-mobile .ahs-panels{grid-template-columns:repeat(var(--ahs-grid-cols-mobile,1),1fr)!important;grid-template-rows:auto!important;}
.ahs-hero.is-device-mobile .ahs-panel-slide img{object-position:var(--ahs-object-position-mobile,var(--ahs-object-position-tablet,var(--ahs-object-position,center center)));}
.ahs-hero.is-device-mobile .ahs-layer{
  left:var(--ahs-layer-x-mobile,var(--ahs-layer-x-tablet,var(--ahs-layer-x)));
  top:var(--ahs-layer-y-mobile,var(--ahs-layer-y-tablet,var(--ahs-layer-y)));
  width:min(var(--ahs-layer-w-mobile,var(--ahs-layer-w-tablet,var(--ahs-layer-w))),94%);
  font-size:var(--ahs-layer-font-mobile,var(--ahs-layer-font-tablet,var(--ahs-layer-font)))!important;
}


/* v1.0.6: スマートフォン表示で画像レイヤーのサイズが編集時と異なる問題を修正。
   文字レイヤー用の最大幅制限を画像レイヤーには適用せず、PC/タブレット/スマホごとの幅設定をそのまま反映します。 */
.ahs-hero .ahs-layer-image{
  width:var(--ahs-layer-w) !important;
  max-width:none !important;
}
.ahs-hero .ahs-layer-image img{
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  display:block;
}
.ahs-hero.is-device-tablet .ahs-layer-image{
  width:var(--ahs-layer-w-tablet,var(--ahs-layer-w)) !important;
  max-width:none !important;
}
.ahs-hero.is-device-mobile .ahs-layer-image{
  width:var(--ahs-layer-w-mobile,var(--ahs-layer-w-tablet,var(--ahs-layer-w))) !important;
  max-width:none !important;
}
@media (max-width:960px){
  .ahs-hero:not(.is-device-desktop) .ahs-layer-image{
    width:var(--ahs-layer-w-tablet,var(--ahs-layer-w)) !important;
    max-width:none !important;
  }
}
@media (max-width:640px){
  .ahs-hero:not(.is-device-desktop) .ahs-layer-image{
    width:var(--ahs-layer-w-mobile,var(--ahs-layer-w-tablet,var(--ahs-layer-w))) !important;
    max-width:none !important;
  }
}
