/* 基本スタイル（レイアウトの土台）。各要素の見た目は page.css */
html, body { margin: 0; padding: 0; }
body { background: #fff; color: #333; font-family: sans-serif; line-height: 1; word-spacing: 1px; -webkit-font-smoothing: antialiased; }
:where(.canvas, .modal) :where(*) { box-sizing: border-box; border: 0; margin: 0; padding: 0; font-size: 100%; font: inherit; line-height: 1; list-style: none; text-decoration: none; color: inherit; vertical-align: baseline; transition: all .3s cubic-bezier(.4,.4,0,1); -webkit-backface-visibility: hidden; }
:where(.canvas, .modal) :where(a, button) { background: none; cursor: pointer; -webkit-tap-highlight-color: #00000026; }
:where(.canvas, .modal) :where(img) { display: block; }
:where(.canvas, .modal) :where(hr) { border-top: 1px solid #ccc; height: 1px; display: block; }
:where(.canvas) :where(table) { border-collapse: collapse; border-spacing: 0; }
:where(.sd) { position: relative; z-index: 0; display: flex; flex-flow: column; flex: none; align-content: center; align-items: center; max-width: 100%; pointer-events: all; transition-property: all; }
:where(.sd)::-webkit-scrollbar { display: none; }
:where(.sd.text, .sd.icon) { display: flex; flex-direction: row; place-content: center; align-items: center; overflow: visible; word-break: break-word; overflow-wrap: anywhere; }
:where(.sd.icon.material-symbols) { font-family: 'Material Symbols Rounded'; font-variation-settings: "FILL" var(--symbol-fill,0), "wght" var(--symbol-weight,400); justify-content: center; align-items: center; min-width: 1em; min-height: 1em; font-style: normal; font-weight: normal; letter-spacing: normal; text-transform: none; white-space: nowrap; direction: ltr; }
:where(.sd.material-symbols-weight-400) { --symbol-weight: 400; }
:where(.image) { position: relative; }
:where(.image)::before { content: ""; position: absolute; inset: 0; width: 100%; height: 100%; border-radius: inherit; z-index: -2; pointer-events: none; background-position: 50%; background-size: cover; transition: inherit; }
:where(.fixed) { z-index: 2; }
:where(.link) { cursor: pointer; }
:where(.frame) { display: block; overflow: hidden; }
:where(.frame) > iframe { width: 100%; height: 100%; }
:where(.richText) { display: block; word-break: break-word; }
:where(.richText) :where(a, blockquote, em, h1, h2, h3, h4, li, ol, p, s, strong, u, ul, span, td, th, tbody, tr) { color: inherit; font-family: inherit; font-size: inherit; text-align: inherit; letter-spacing: inherit; line-height: inherit; font-weight: inherit; font-style: inherit; }
:where(.richText) :where(p) { display: block; align-self: stretch; margin: 10px 0; }
:where(.richText) > p { min-height: 1em; }
:where(.richText) :where(strong) { font-weight: 900; display: inline; }
:where(.richText) :where(a) { color: #007cff; text-decoration: underline; display: inline; }
:where(.richText) :where(ul, ol) { margin: 0 0 0 20px; }
:where(.richText) :where(ul li) { margin: 10px 0; list-style: outside; }
:where(.richText) :where(ol li) { margin: 10px 0; list-style: decimal; }
:where(.richText) :where(ul li p, ol li p) { margin: 0; }
:where(.richText) :where(h1) { display: block; align-self: stretch; margin: 20px 0; font-size: 3em; font-weight: 700; }
:where(.richText) :where(h2) { display: block; align-self: stretch; margin: 10px 0; font-size: 2em; font-weight: 700; }
:where(.richText) :where(h3) { display: block; align-self: stretch; margin: 10px 0; font-size: 1em; font-weight: 700; }
:where(.richText) :where(h4, h5) { display: block; align-self: stretch; margin: 10px 0; font-size: 1em; font-weight: 600; }
:where(.richText) :where(h6) { display: block; align-self: stretch; margin: 10px 0; font-size: 1em; font-weight: 500; }
:where(.richText) :where(img, video) { max-width: 100%; height: auto; vertical-align: bottom; display: inline; }
:where(.richText) :where(blockquote) { margin: 10px 0; padding: 10px 15px; border-left: 3px solid #00000026; font-style: italic; }
:where(.richText) :where(hr) { border-top: 1px solid #ccc; margin: 10px 0; }
:where(.richText) :where(em) { font-style: italic; }
:where(.richText) :where(u) { text-decoration: underline; }
:where(.richText) :where(s) { text-decoration: line-through; }
:where(.richText) :where(table) { table-layout: auto; border-collapse: collapse; color: #1a1a1a; border: 1px solid #f2f2f2; margin: 10px 0; font-size: 14px; line-height: 1.4; }
:where(.richText) :where(th) { background: #f5f5f580; }
:where(.richText) :where(td, th) { border: 1px solid #f2f2f2; min-width: 100px; max-width: 240px; padding: 12px; }
:where(.richText) :where(td p, th p) { margin: 0; }
:where(.richText) :where([data-type=table]) { overflow-x: auto; }
:where(.richText) :where([data-type=table] p) { white-space: pre-line; word-break: break-all; }
:where(.richText) :where(pre) { white-space: pre-wrap; background: #eee; border-radius: 6px; margin: 20px 0; padding: 25px 35px; font-family: Menlo, Monaco, 'Courier New', monospace; }
:where(.richText) :where(p > code) { display: inline; background: #eee; border: 1px solid #0000001a; border-radius: 6px; margin: 2px; padding: 0 5px; }
:where(.richText) :where([data-type=embed_code]) { margin: 20px 0; position: relative; }
:where(.richText) :where([data-type=pdf_link], [data-type=video_block]) { margin: 10px 0; }
.canvas { display: flex; min-height: 100dvh; height: auto; }
.canvas > .sd { min-height: 100dvh; overflow: clip; }
/* モーダル（メニュー・説明） */
.modal { position: fixed; inset: 0; z-index: 50; opacity: 1; transition: opacity .4s cubic-bezier(.4,.4,0,1); }
.modal[hidden] { display: block; opacity: 0; visibility: hidden; pointer-events: none; }
.modal-backdrop { position: fixed; inset: 0; width: 100%; height: 100%; background: rgba(0,0,0,.6); border: 0; cursor: pointer; z-index: -1; }
.modal-body { height: 100%; pointer-events: none; }
.modal-body > * { pointer-events: none; background: none !important; }
html.modal-open { overflow: hidden; }
:where(.sd.icon.material-icons) { font-family: 'Material Icons'; font-weight: normal; font-style: normal; letter-spacing: normal; text-transform: none; white-space: nowrap; word-wrap: normal; direction: ltr; line-height: 1; display: inline-flex; justify-content: center; align-items: center; -webkit-font-feature-settings: 'liga'; font-feature-settings: 'liga'; }
/* フォームの送信結果メッセージ */
.form-msg { width: 100%; margin: 0 0 16px; padding: 12px 16px; border-radius: 6px; font: 500 14px/1.7 'Noto Sans JP', sans-serif; background: #eef3f8; color: #1d415f; text-align: left; }
.form-msg[data-state="error"] { background: #fdecea; color: #a1281c; }
.form-msg[data-state="done"] { background: #e8f4ec; color: #1f5c35; }
.form-msg[hidden] { display: none; }
.form-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.canvas [aria-invalid="true"] { outline: 2px solid #c0392b; outline-offset: 2px; }
.canvas a[hidden], .canvas [hidden] { display: none !important; }
.image[style*="--bg"]::before { background-image: var(--bg); }
:where(.canvas, .modal) :where(hr) { box-sizing: content-box; }
/* ファイル添付欄：標準の部品は透明にして、ラベル全体を押せるボタンにする（元サイトと同じ見え方） */
:where(.sd.file) { word-break: break-word; overflow-wrap: anywhere; cursor: pointer; flex-direction: row; outline: 2px solid #0000; outline-offset: -1px; }
:where(.sd.file):focus-within { outline-color: -webkit-focus-ring-color; }
.sd.file > input[type=file] { opacity: 0; pointer-events: none; position: absolute; }