/* 旧 WebForum（wforum.cgi）風の表示 */
.ybbs {
	--ybbs-bg: #eef5f9;
	--ybbs-text: #1f2a33;
	--ybbs-link: #0000cc;
	--ybbs-no: #2e8b2e;
	--ybbs-red: #e00000;
	--ybbs-rule: #9aa3a8;
	background: var(--ybbs-bg);
	color: var(--ybbs-text);
	font-size: 15px;
	line-height: 1.75;
	padding: 4px 24px 32px;
	margin: 0 auto;
	max-width: 960px;
	box-sizing: border-box;
}
.ybbs a { color: var(--ybbs-link); text-decoration: underline; }
.ybbs a:hover { color: #6666ff; }
.ybbs hr { border: 0; border-top: 1px solid var(--ybbs-rule); margin: 8px 0; height: 0; }

/* 上部メニュー */
.ybbs-nav { text-align: center; margin: 12px 0 16px; }
.ybbs-nav hr:first-child { margin-bottom: 6px; }
.ybbs-nav hr:last-child { margin-top: 6px; }

/* 注意書き */
.ybbs-notes { list-style: none; margin: 0 auto 18px; padding: 0; width: fit-content; }
.ybbs-notes li::before { content: "・"; margin-right: .6em; }

/* ツリー */
.ybbs-tree { list-style: none; margin: 0; padding: 0 0 0 16px; }
.ybbs-thread { margin: 0 0 18px; }
.ybbs-all { text-decoration: none !important; }
.ybbs-tri { color: var(--ybbs-link); }
.ybbs-branch { margin: 0; padding-left: 40px; }
.ybbs-l1 { list-style-type: circle; }
.ybbs-l2, .ybbs-l3 { list-style-type: square; }
.ybbs-branch li::marker { font-size: .8em; }
.ybbs-name { font-weight: bold; }
.ybbs-no { color: var(--ybbs-no); }
.ybbs-no.is-current { color: var(--ybbs-red); font-weight: bold; }
.ybbs-new { color: var(--ybbs-red); }

/* 記事表示 */
.ybbs-article { margin: 8px 0 16px; }
.ybbs-head { border: 0; border-collapse: collapse; margin: 0 0 12px; background: none; width: auto; }
.ybbs-head th, .ybbs-head td { border: 0; padding: 1px 0; background: none; text-align: left; vertical-align: top; font-weight: normal; }
.ybbs-head th { padding-right: 1em; white-space: nowrap; }
.ybbs-title { color: var(--ybbs-red); }
.ybbs-body { margin: 0 0 0 2.6em; overflow-wrap: anywhere; }
.ybbs-body p { margin: 0 0 1.75em; }
.ybbs-body img { max-width: 100%; height: auto; }
.ybbs-edit, .ybbs-to-thread { text-align: right; margin: 4px 0; font-size: .9em; }
.ybbs-sep { margin: 12px 0 !important; }

/* 見出し */
.ybbs-h { font-size: 1em; font-weight: bold; margin: 18px 0 10px; padding-top: 10px; border-top: 1px solid var(--ybbs-rule); }
.ybbs-h small { font-size: .95em; font-weight: normal; }

/* フォーム */
.ybbs-form table { border: 0; border-collapse: collapse; background: none; width: auto; margin-left: 2.6em; }
.ybbs-form th, .ybbs-form td { border: 0; padding: 3px 6px 3px 0; background: none; text-align: left; vertical-align: top; }
.ybbs-form th { font-weight: bold; white-space: nowrap; padding-top: 6px; }
.ybbs-form input[type=text], .ybbs-form input[type=url], .ybbs-form textarea { font: inherit; padding: 2px 4px; border: 1px solid #999; background: #fff; max-width: 100%; box-sizing: border-box; }
.ybbs-form textarea { width: 36em; }
/* ボタン（投稿する／返信する／検索） */
.ybbs-form button,
.ybbs-search button {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-width: 160px; height: 42px; padding: 0 28px;
	border: 0; border-radius: 21px;
	background: #1C82E0; color: #fff;
	font: inherit; font-size: 15px; font-weight: bold; letter-spacing: .1em;
	box-shadow: 0 2px 4px rgba(28, 130, 224, .35);
	cursor: pointer; transition: background .2s, box-shadow .2s, transform .1s;
}
.ybbs-form button::after {
	content: ""; width: 7px; height: 7px;
	border-top: 2px solid currentColor; border-right: 2px solid currentColor; transform: rotate(45deg);
}
.ybbs-form button:hover,
.ybbs-search button:hover { background: #0066AB; box-shadow: 0 3px 8px rgba(0, 102, 171, .35); }
.ybbs-form button:active,
.ybbs-search button:active { transform: translateY(1px); box-shadow: 0 1px 2px rgba(0, 102, 171, .35); }
.ybbs-form button:focus-visible,
.ybbs-search button:focus-visible { outline: 3px solid #9ccbf3; outline-offset: 2px; }
.ybbs-form button:disabled { background: #9aa3a8; box-shadow: none; cursor: wait; }
.ybbs-search button { min-width: 0; height: 32px; padding: 0 18px; border-radius: 16px; font-size: 14px; margin-left: 6px; }
.ybbs-form tr:last-child td { padding-top: 12px; }

/* 検索・ページ送り・お知らせ */
.ybbs-search { margin: 0 0 12px 2.6em; }
.ybbs-results { padding-left: 2.6em; }
.ybbs-results li { margin-bottom: 10px; }
.ybbs-excerpt { font-size: .9em; color: #555; }
.ybbs-pager { text-align: center; margin-top: 16px; }
.ybbs-note { margin-left: 2.6em; }
.ybbs .bbp-template-notice { background: #fff8e1; border: 1px solid #e0c060; padding: 6px 12px; margin: 8px 0; }
.ybbs .bbp-template-notice.error { background: #fdecea; border-color: #e57373; }
.ybbs .bbp-template-notice ul { margin: 0; padding: 0; list-style: none; }

@media (max-width: 640px) {
	.ybbs { padding: 4px 12px 24px; font-size: 14px; }
	.ybbs-branch { padding-left: 22px; }
	.ybbs-body, .ybbs-form table, .ybbs-search, .ybbs-results, .ybbs-note { margin-left: 0; }
	.ybbs-form textarea { width: 100%; }
}

/* 自動投稿（スパム）対策の入力欄は画面に出さない */
.ybbs-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* 掲示板パスワードの入力画面 */
.ybbs-gate { max-width: 480px; margin: 40px auto 24px; padding: 28px 32px 32px; background: #fff; border: 1px solid var(--ybbs-rule); border-top: 4px solid #1C82E0; text-align: center; }
.ybbs-gate__title { margin: 0 0 12px; font-size: 18px; font-weight: bold; color: #00468C; }
.ybbs-gate__lead { margin: 0 0 18px; font-size: 14px; }
.ybbs-gate__error { margin: 0 0 14px; padding: 8px 12px; background: #fdecea; border: 1px solid #e57373; color: #b00020; font-size: 14px; text-align: left; }
.ybbs-gate__form { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; }
.ybbs-gate__form label { font-weight: bold; }
.ybbs-gate__form input[type=password] { flex: 1 1 200px; height: 40px; padding: 0 10px; font: inherit; border: 1px solid #999; border-radius: 4px; box-sizing: border-box; }
.ybbs-gate__form button {
	height: 40px; padding: 0 26px; border: 0; border-radius: 20px; background: #1C82E0; color: #fff;
	font: inherit; font-weight: bold; letter-spacing: .1em; cursor: pointer; box-shadow: 0 2px 4px rgba(28, 130, 224, .35);
}
.ybbs-gate__form button:hover { background: #0066AB; }
