/* ==========================================================================
   Studio ランタイム CSS（仕様書 §3 をそのまま移植。各要素の CSS（top.css / privacy.css）より先に読み込む）
   ========================================================================== */
html, body { margin: 0; padding: 0; }
body { background: #fff; transition: background .5s cubic-bezier(.4,.4,0,1); }
.StudioCanvas { height: auto; min-height: 100dvh; display: flex; }
.StudioCanvas > .sd { min-height: 100dvh; overflow: clip; }

:root {
  /* フォント変数（Studio の --s-font-* と同名。中身は fonts.css のファミリー名） */
  --s-font-d09cd289: "A1ゴシック M JIS2004", "Raffines Sub M", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "Noto Sans CJK JP", sans-serif;
  --s-font-89862173: "A1ゴシック R JIS2004", "Raffines Sub R", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "Noto Sans CJK JP", sans-serif;
  --s-font-0180e749: Rubik;
  --s-font-4ebf83a0: "Noto Sans JP";
  --s-color-dc905583: #979797ff;
}

:where(.render-canvas), :where(.render-canvas) * {
  -webkit-font-smoothing: antialiased;
  box-sizing: border-box;
  color: rgb(51,51,51);
  word-spacing: 1px;
  backface-visibility: hidden;
  border: 0; margin: 0; padding: 0;
  font-family: sans-serif;
  line-height: 1;
  text-decoration: none;
  list-style: none;
  transition: 0.3s cubic-bezier(0.4, 0.4, 0, 1);
}
:where(.render-canvas) a:focus:not(:focus-visible),
:where(.render-canvas) button:focus:not(:focus-visible) { outline: none; }
:where(.render-canvas) a, :where(.render-canvas) button { vertical-align: baseline; background: 0 0; margin: 0; padding: 0; font-size: 100%; }
:where(.render-canvas) input, :where(.render-canvas) select { vertical-align: middle; }
:where(.render-canvas) textarea { resize: none; }
:where(.render-canvas) input[type="email"], :where(.render-canvas) input[type="tel"],
:where(.render-canvas) input[type="text"], :where(.render-canvas) select, :where(.render-canvas) textarea { appearance: none; }
:where(.render-canvas) a, :where(.render-canvas) a.icon, :where(.render-canvas) a.text { -webkit-tap-highlight-color: rgba(0,0,0,.15); }

:where(.render-canvas) .sd {
  z-index: 0; pointer-events: all;
  flex-flow: column; flex: 0 0 auto;
  align-content: center; align-items: center;
  max-width: 100%;
  display: flex; position: relative;
}
:where(.render-canvas) .sd::-webkit-scrollbar { display: none; }
:where(.render-canvas) input.sd, :where(.render-canvas) textarea.sd { align-content: normal; }
:where(.render-canvas) .sd[tabindex]:focus { outline: none; }
:where(.render-canvas) .sd[tabindex]:focus-visible { outline: -webkit-focus-ring-color solid 1px; }

:where(.render-canvas) .frame { display: block; overflow: hidden; }
:where(.render-canvas) .frame > iframe { width: 100%; height: 100%; }
:where(.render-canvas) .image { position: relative; }
:where(.render-canvas) .image::before {
  content: ""; border-radius: inherit; z-index: -2; pointer-events: none;
  background-position: 50% center; background-size: cover;
  width: 100%; height: 100%; transition: inherit;
  position: absolute; top: 0; left: 0;
}
:where(.render-canvas) .sd.text, :where(.render-canvas) .sd:where(.icon) {
  word-break: break-word; overflow-wrap: anywhere;
  flex-direction: row; place-content: center; align-items: center;
  display: flex; overflow: visible;
}
:where(.render-canvas) .material-icons {
  letter-spacing: normal; text-transform: none; white-space: nowrap; overflow-wrap: normal;
  text-rendering: optimizelegibility; -webkit-font-smoothing: antialiased; direction: ltr;
  justify-content: center; align-items: center;
  font-family: "Material Icons"; font-size: 24px; font-style: normal; font-weight: 400; line-height: 1;
  display: inline-flex;
}
:where(.render-canvas) .fixed  { z-index: 2; }
:where(.render-canvas) .sticky { z-index: 1; }
:where(.render-canvas) .button { cursor: pointer; transition: 0.4s cubic-bezier(0.4, 0.4, 0, 1); }
:where(.render-canvas) .link   { cursor: pointer; }

:where(.render-canvas) .sd.section {
  flex-flow: column !important; align-content: center !important; align-items: center !important;
  width: 100% !important; max-width: 100% !important; height: auto !important; padding: 0 !important;
}
:where(.render-canvas) .sd.section-inner { position: static !important; }

/* Studio の BR 出し分け（<br data-bp="base:0 @tablet:1 …"> の値は Studio 側の設定。未取得のため build では data-bp を付けていない） */
br[data-bp~="base:0"]{display:none;}
br[data-bp~="base:1"]{display:inline;}
@media screen and (max-width: 840px){
br[data-bp~="@tablet:0"]{display:none;}
br[data-bp~="@tablet:1"]{display:inline;}
}
@media screen and (max-width: 540px){
br[data-bp~="@mobile:0"]{display:none;}
br[data-bp~="@mobile:1"]{display:inline;}
}
