見出しスタイル改善 ===
本文中で多用されている タイトル
を見やすく整える */
#main-area > hr:first-of-type,
#main-area > p > strong > font[size="+2"] {
/* 古い見出しの font タグを保持しつつ表示改善 */
}
#main-area font[size="+2"] {
color: var(--jsvir-primary) !important;
font-weight: 700 !important;
font-family: inherit;
}
#main-area font[size="+1"] {
font-family: inherit;
}
#main-area hr {
border: none;
border-top: 1px solid var(--jsvir-border);
margin: 18px 0;
}
/* ===== 11. 本文中の inline-style 背景セクション ============
形式の
"セクション見出し" を現代風に */
#main-area p[style*="background-color:#000080"] {
background: var(--jsvir-primary) !important;
padding: 10px 16px !important;
border-radius: var(--radius-sm);
margin: 18px 0 12px !important;
box-shadow: var(--shadow-sm);
}
#main-area p[style*="background-color:#3b86b1"],
#main-area p[style*="background-color:#4169e1"] {
background: var(--jsvir-primary-light) !important;
padding: 12px 16px !important;
border-radius: var(--radius-sm);
box-shadow: var(--shadow-sm);
transition: transform var(--transition), box-shadow var(--transition);
}
#main-area p[style*="background-color:#4169e1"]:hover {
transform: translateY(-2px);
box-shadow: var(--shadow-md);
}
#main-area a:has(p[style*="background-color"]) {
text-decoration: none;
display: inline-block;
}
#main-area p[style*="background-color:#B60B0B"] {
background: var(--jsvir-accent) !important;
padding: 14px 20px !important;
border-radius: var(--radius-md);
box-shadow: var(--shadow-md);
}
/* ===== 12. 右サイド: バナー画像 ============================ */
#right-area #banner-area li a {
display: block;
transition: transform var(--transition), opacity var(--transition);
}
#right-area #banner-area li a:hover {
transform: translateY(-2px);
opacity: 0.92;
}
#right-area #banner-area li a img {
border-radius: var(--radius-sm);
box-shadow: var(--shadow-sm);
}
/* ===== 14. フッターナビ =================================== */
#footer-nav {
background: var(--jsvir-bg);
border: none;
border-top: 1px solid var(--jsvir-border);
padding: 16px 0;
margin-top: 30px;
margin-bottom: 0;
}
#footer-nav ul li {
font-size: 0.9em;
}
#footer-nav a {
text-decoration: none;
color: var(--jsvir-text);
transition: color var(--transition);
}
#footer-nav a:hover {
color: var(--jsvir-primary);
}
#footer-area {
background: var(--jsvir-primary-dark) !important;
padding: 8px 0;
}
#footer-area address {
color: rgba(255, 255, 255, 0.85);
font-size: 0.85em;
}
.footer_block {
padding: 14px 10px;
border-bottom: 1px solid var(--jsvir-border);
}
.footer_block .boxR li {
font-size: 0.85em;
}
.footer_block .boxR a {
color: var(--jsvir-text) !important;
transition: color var(--transition);
}
.footer_block .boxR a:hover {
color: var(--jsvir-primary) !important;
}
/* ===== 15. 表組み (役員一覧 / 訂正表 など) ================= */
#main-area table {
border-collapse: collapse;
width: 100%;
margin: 12px 0;
background: var(--jsvir-card-bg);
border-radius: var(--radius-sm);
overflow: hidden;
box-shadow: var(--shadow-sm);
}
#main-area table td,
#main-area table th {
padding: 10px 14px;
border-bottom: 1px solid var(--jsvir-border);
}
#main-area table tr:last-child td {
border-bottom: none;
}
#main-area table tr:hover td {
background: var(--jsvir-bg);
}
/* ===== 16. リスト (sectionB 等) ============================ */
#main-area .liststyleB {
background: var(--jsvir-bg);
padding: 14px 18px;
border-radius: var(--radius-sm);
border-left: 3px solid var(--jsvir-primary);
margin: 12px 0;
}
/* ===== 18. body 全体 (デスクトップ時) ====================== */
@media (min-width: 941px) {
body {
background: var(--jsvir-bg) !important;
}
#wrapper {
background: var(--jsvir-card-bg);
box-shadow: var(--shadow-lg);
border-radius: var(--radius-md);
overflow: hidden;
margin-top: 16px !important;
margin-bottom: 16px !important;
}
/* #contents-area は元 900px の中に main-area(670) + right-area(210) = 880px を
float で配置している。padding を追加すると right-area が下に押し出される。
垂直方向の padding のみ追加する。 */
#contents-area {
padding-top: 12px;
padding-bottom: 24px;
}
}
/* ===== 19. レスポンシブ調整 (タブレット以下) ================ */
@media (max-width: 768px) {
#main-area {
padding: 16px;
}
#right-area #banner-area li a img {
max-width: 200px;
}
.headingA h1,
.headingA h2 {
font-size: 1.2em;
}
}
/* ===== ページタイトル h1 (旧 見出しの置換) ===== */
h1.page-ttl {
font-size: x-large; /* 旧 font size="+2" 相当 */
font-weight: bold;
padding-left: 1em; /* 旧: 行頭の全角スペース */
}
/* ===== 20. フォーカス可視化 (アクセシビリティ) ============== */
a:focus-visible,
button:focus-visible {
outline: 2px solid var(--jsvir-primary);
outline-offset: 2px;
border-radius: var(--radius-sm);
}
/* ===== 21. 印刷時のクリーンアップ ========================== */
@media print {
#global-nav-area,
#right-area,
#footer-nav {
display: none !important;
}
#wrapper {
box-shadow: none !important;
}
}
/* ============================================================
===== JSVIR 固有の追補 (2026-10-21) =========================
JSVIR のページ構造向けの上書き。
============================================================ */
/* ----- ニュース詳細ページ (news01〜03) のタイトル帯
旧: ……
*/
h1.page-ttl.page-ttl-band {
background: var(--jsvir-primary);
color: #fff;
padding: 10px 16px;
border-radius: var(--radius-sm);
box-shadow: var(--shadow-sm);
margin: 0 0 16px;
line-height: 1.5;
overflow-wrap: anywhere;
}
/* ----- 本文中の橙帯 (#cc6600: 個人情報保護方針・事業計画の小見出し)
色は JSVIR 既存のまま残し、他の帯と同じ余白・角丸だけ揃える */
#main-area p[style*="background-color:#cc6600"] {
padding: 8px 14px !important;
border-radius: var(--radius-sm);
margin: 18px 0 10px !important;
}
/* ----- お知らせ一覧 (index / news.html に直接埋め込み)
長い見出しでも横にはみ出さない */
#information .liststyleA dd p a {
overflow-wrap: anywhere;
}
/* layout.css の `.news #information { width:670px }` 固定を解除
(design.css の padding/border を足すと main-area の内側幅を超えてはみ出す) */
#information,
.news #information,
#top #information {
width: auto;
box-sizing: border-box;
}
/* ----- トップページ 2026-10-21 表示調整 -----------------------
(a) 「次回開催」案内ブロックを大きく (index.html の .next-meeting)
(b) 「お知らせ」見出し: 旧デザインの灰色グラデ画像 (headdinga_top/bottom.gif) を
外し、タブの文字の左余白を一覧・次回開催ブロックの文字位置 (21px) に揃える。
index.html だけ .headingA-flat を付けて適用 (他ページの .headingA は変えない) */
.headingA.headingA-flat {
background-image: none;
padding-bottom: 0;
margin-bottom: 20px;
}
.headingA.headingA-flat h1 {
background-image: none;
padding: 0;
margin: 0;
}
.headingA.headingA-flat h1 .icon {
padding: 8px 21px;
border-radius: var(--radius-sm) var(--radius-sm) 0 0;
font-size: 1em;
line-height: 1.4;
}
#main-area .liststyleB.next-meeting {
margin: 20px 0 28px;
padding: 22px 21px 20px 24px;
border-left-width: 6px;
border-radius: var(--radius-md);
box-shadow: var(--shadow-md);
border-top: 1px solid var(--jsvir-border);
border-right: 1px solid var(--jsvir-border);
border-bottom: 1px solid var(--jsvir-border);
}
.next-meeting p {
margin: 0;
}
.next-meeting .next-label {
display: inline-block;
background: var(--jsvir-primary);
color: #fff;
font-size: 1.05em;
font-weight: 700;
letter-spacing: 0.12em;
padding: 3px 14px;
border-radius: 999px;
margin-bottom: 10px;
}
.next-meeting .next-title {
font-size: 1.65em;
font-weight: 700;
line-height: 1.4;
margin-bottom: 10px;
}
.next-meeting .next-title a {
color: var(--jsvir-primary-dark);
text-decoration: none;
overflow-wrap: anywhere;
}
.next-meeting .next-title a:hover {
text-decoration: underline;
}
.next-meeting .next-info {
font-size: 1.15em;
font-weight: 600;
line-height: 1.7;
color: var(--jsvir-text);
margin-bottom: 4px;
}
.next-meeting .next-date,
.next-meeting .next-place {
display: inline-block;
margin-right: 1.2em;
}
.next-meeting .next-call {
font-size: 1.1em;
line-height: 1.7;
color: var(--jsvir-text);
}
.next-meeting .next-call strong {
color: var(--jsvir-accent);
font-weight: 700;
}
.next-meeting .next-more {
margin-top: 14px;
}
.next-meeting .next-more a {
display: inline-block;
background: var(--jsvir-primary);
color: #fff;
font-size: 1.05em;
font-weight: 700;
text-decoration: none;
padding: 11px 22px;
min-height: 44px;
box-sizing: border-box;
border-radius: var(--radius-sm);
}
.next-meeting .next-more a:hover {
background: var(--jsvir-primary-dark);
}
@media (max-width: 480px) {
#main-area .liststyleB.next-meeting {
padding: 16px 14px 16px 16px;
border-left-width: 5px;
}
.next-meeting .next-title {
font-size: 1.3em;
}
.next-meeting .next-info {
font-size: 1.05em;
}
.next-meeting .next-date,
.next-meeting .next-place {
display: block;
margin-right: 0;
}
.next-meeting .next-call {
font-size: 1em;
}
.next-meeting .next-more a {
display: block;
text-align: center;
}
}
/* ----- 2026-10-21 参加登録ボタン (index.html の .next-meeting) ----- */
.next-meeting .next-more a.next-entry {
background: var(--jsvir-accent);
margin-left: 10px;
}
.next-meeting .next-more a.next-entry:hover {
background: #962d22;
}
.next-meeting .next-note {
margin-top: 8px;
font-size: 0.9em;
color: var(--jsvir-text);
}
@media (max-width: 480px) {
.next-meeting .next-more a.next-entry {
margin-left: 0;
margin-top: 10px;
}
}