「MediaWiki:Common.css」の版間の差分

編集の要約なし
タグ: 差し戻し済み
編集の要約なし
 
(同じ利用者による、間の26版が非表示)
1,282行目: 1,282行目:


/* =========================================================
/* =========================================================
   転スラWiki 年表
   転スラ年表・転スラ全史
  共通デザイン
   ========================================================= */
   ========================================================= */


.ts-chronology {
    --chron-blue: #36c;
    --chron-blue-dark: #2a4b8d;
    --chron-border: #c8ccd1;
    --chron-border-light: #eaecf0;
    --chron-text: #202122;
    --chron-subtext: #54595d;
    --chron-muted: #72777d;
    --chron-bg: #f8f9fa;
    --chron-bg-blue: #f4f7fc;


/* =========================================================
  0. 基本
  ========================================================= */
.ts-chronology,
.ts-fullchronology {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
}
/* 年表内でMediaWiki側が生成する段落余白を抑える */
.ts-chronology p,
.ts-fullchronology p,
.ts-chron-entry p,
.ts-fullchron-entry p {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
/* =========================================================
  1. ページ上部
  ========================================================= */
.ts-chron-header,
.ts-fullchron-header {
     width: 100%;
     width: 100%;
     color: var(--chron-text);
     margin: 0 0 20px;
    padding: 0;
}
 
 
/* ---------- 導入文 ---------- */
 
.ts-chron-lead,
.ts-fullchron-lead {
    margin: 0 0 12px;
    padding: 0;
 
    font-size: 1rem;
    line-height: 1.85;
}
 
 
/* ---------- 注意書き ---------- */
 
.ts-chron-notice,
.ts-fullchron-notice {
    margin: 14px 0;
    padding: 10px 14px;
 
    background: #f8f9fa;
 
    border: 1px solid #c8ccd1;
    border-left: 3px solid #36c;
    border-radius: 2px;
 
    font-size: .94rem;
    line-height: 1.75;
 
     box-sizing: border-box;
     box-sizing: border-box;
}
.ts-chron-notice p,
.ts-fullchron-notice p {
    margin: 0 !important;
}
.ts-chron-notice p + p,
.ts-fullchron-notice p + p {
    margin-top: 5px !important;
}
/* ---------- 年表内ナビ ---------- */
.ts-chron-nav,
.ts-fullchron-nav {
    margin: 14px 0 18px;
    padding: 7px 0;
    border-top: 1px solid #c8ccd1;
    border-bottom: 1px solid #c8ccd1;
    font-size: .94rem;
    line-height: 1.8;
}
.ts-chron-nav a,
.ts-fullchron-nav a {
    white-space: nowrap;
}
/* ---------- 他方の年表へのリンクなど ---------- */
.ts-chron-more,
.ts-fullchron-more {
    margin: 8px 0 0;
    padding: 0;
    font-size: .94rem;
    line-height: 1.6;
}
}




/* =========================================================
/* =========================================================
   時代セクション
   2. 時代セクション
   ========================================================= */
   ========================================================= */


.ts-chron-section {
.ts-chron-section,
     margin: 25px 0 32px;
.ts-fullchron-section {
    width: 100%;
 
     margin: 20px 0 26px !important;
    padding: 0 !important;
 
    box-sizing: border-box;
}
}


.ts-chron-section-title {
 
     margin: 0 0 14px !important;
/* 年表と全史の見出しを完全に同じデザインにする */
     padding: 4px 0 7px 10px !important;
h2.ts-chron-section-title,
     border: 0 !important;
h2.ts-fullchron-section-title,
     border-left: 4px solid var(--chron-blue) !important;
.ts-chron-section-title,
     border-bottom: 1px solid var(--chron-border) !important;
.ts-fullchron-section-title {
     color: var(--chron-text);
     margin: 0 0 8px !important;
     font-size: 1.2rem !important;
     padding: 5px 10px !important;
     font-weight: 700 !important;
 
     line-height: 1.4 !important;
     border-top: 0 !important;
     border-right: 0 !important;
     border-bottom: 1px solid #c8ccd1 !important;
    border-left: 4px solid #36c !important;
 
     background: transparent !important;
 
     font-size: 1.18rem !important;
     font-weight: 600 !important;
     line-height: 1.5 !important;
 
    box-sizing: border-box;
}
}




/* =========================================================
/* =========================================================
   年表本体
   3. タイムライン本体
   ========================================================= */
   ========================================================= */


.ts-chron-list {
.ts-chron-list,
.ts-fullchron-list {
     position: relative;
     position: relative;
     margin: 0;
 
     padding: 2px 0;
    display: block !important;
 
    width: 100% !important;
    max-width: none !important;
 
     margin: 0 !important;
     padding: 0 !important;
 
    gap: 0 !important;
 
    box-sizing: border-box;
}
}


/*
 
* 年代と出来事の間を通る縦線
/* ---------- 縦線 ---------- */
*/
 
.ts-chron-list::before {
.ts-chron-list::before,
.ts-fullchron-list::before {
     content: "";
     content: "";
     position: absolute;
     position: absolute;
     top: 8px;
 
     bottom: 8px;
     left: 145px;
     left: 130px;
     top: 0;
     bottom: 0;
 
     width: 1px;
     width: 1px;
     background: #a7b9d8;
 
     background: #a7c1ee;
 
    z-index: 0;
}
}




/* =========================================================
/* =========================================================
   1件の出来事
   4. 1件の出来事
   ========================================================= */
   ========================================================= */


.ts-chron-entry {
.ts-chron-entry,
.ts-fullchron-entry {
     position: relative;
     position: relative;
     display: grid;
 
     grid-template-columns: 112px minmax(0, 1fr);
     display: grid !important;
     column-gap: 40px;
     grid-template-columns: 130px minmax(0, 1fr) !important;
     min-width: 0;
     column-gap: 30px !important;
     padding: 11px 0 14px;
 
    width: 100% !important;
    max-width: none !important;
 
    height: auto !important;
     min-height: 0 !important;
    max-height: none !important;
 
    margin: 0 !important;
 
    /*
    * 以前よりかなりコンパクト。
    * これ以上狭くすると逆に詰まりすぎるため
    * まずは7px / 9pxを標準とする。
    */
     padding: 7px 0 9px !important;
 
    border-bottom: 1px solid #eaecf0;
 
    box-sizing: border-box;
}
 
 
/* 最終項目 */
.ts-chron-entry:last-child,
.ts-fullchron-entry:last-child {
    border-bottom: 0;
}
}


/*
 
* タイムライン上の丸
/* ---------- タイムライン上の丸 ---------- */
*/
 
.ts-chron-entry::before {
.ts-chron-entry::before,
.ts-fullchron-entry::before {
     content: "";
     content: "";
     position: absolute;
     position: absolute;
     top: 17px;
 
     left: 126px;
     left: 140px;
     width: 7px;
     top: 12px;
     height: 7px;
 
     border: 2px solid #fff;
     width: 11px;
     height: 11px;
 
    background: #fff;
 
     border: 2px solid #36c;
     border-radius: 50%;
     border-radius: 50%;
    background: var(--chron-blue);
 
     box-shadow: 0 0 0 1px var(--chron-blue);
     box-sizing: border-box;
     z-index: 1;
 
     z-index: 2;
}
}




/* =========================================================
/* =========================================================
   年代
   5. 年代
   ========================================================= */
   ========================================================= */


.ts-chron-date {
.ts-chron-date,
     padding-top: 1px;
.ts-fullchron-date {
     color: var(--chron-blue-dark);
    width: auto !important;
     font-size: .84rem;
    min-width: 0 !important;
    max-width: none !important;
 
    margin: 0 !important;
     padding: 0 !important;
 
    text-align: right;
 
     color: #2457a6;
 
     font-size: .94rem;
     font-weight: 600;
     font-weight: 600;
     line-height: 1.5;
     line-height: 1.5;
     text-align: right;
 
     white-space: nowrap;
 
    box-sizing: border-box;
}
 
 
/* =========================================================
  6. 本文エリア
  ========================================================= */
 
.ts-chron-body,
.ts-fullchron-main {
    display: block !important;
 
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
 
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
 
    margin: 0 !important;
    padding: 0 !important;
 
    box-sizing: border-box;
}
 
 
/* =========================================================
  7. 出来事名
  ========================================================= */
 
.ts-chron-event,
.ts-fullchron-event {
    width: 100%;
 
    margin: 0 0 2px !important;
    padding: 0 !important;
 
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.55;
 
    box-sizing: border-box;
}
 
 
/* =========================================================
  8. 概要
  ========================================================= */
 
.ts-chron-summary,
.ts-fullchron-summary {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
 
    margin: 0 !important;
    padding: 0 !important;
 
    font-size: .96rem;
    line-height: 1.65;
 
    box-sizing: border-box;
}
}




/* =========================================================
/* =========================================================
   出来事本文
   9. 全史のみ:人物・国家・組織・出典
   ========================================================= */
   ========================================================= */


.ts-chron-body {
.ts-fullchron-meta {
     min-width: 0;
    display: block !important;
     padding: 0 0 13px;
 
     border-bottom: 1px solid var(--chron-border-light);
    width: 100% !important;
     min-width: 0 !important;
    max-width: none !important;
 
    height: auto !important;
    min-height: 0 !important;
 
    margin: 5px 0 0 !important;
     padding: 0 !important;
 
    box-sizing: border-box;
}
 
 
/* ---------- 1行 ---------- */
 
.ts-fullchron-meta-row {
    position: static !important;
 
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
 
    float: none !important;
 
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
 
    height: auto !important;
    min-height: 0 !important;
 
     margin: 1px 0 !important;
    padding: 0 !important;
 
    gap: 8px;
 
    line-height: 1.55;
 
    box-sizing: border-box;
}
 
 
/* ---------- 人物・国家・組織・出典ラベル ---------- */
 
.ts-fullchron-meta-label {
    display: block !important;
 
    flex: 0 0 3.5em !important;
 
    width: 3.5em !important;
    min-width: 3.5em !important;
    max-width: 3.5em !important;
 
    margin: 0 !important;
    padding: 0 !important;
 
    color: #54595d;
 
    font-size: .9rem;
    font-weight: 600;
    line-height: 1.55;
 
    white-space: nowrap !important;
 
    box-sizing: border-box;
}
 
 
/* ---------- 実際の値 ---------- */
 
.ts-fullchron-meta-value {
    display: block !important;
 
    flex: 1 1 auto !important;
 
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
 
    margin: 0 !important;
    padding: 0 !important;
 
    font-size: .9rem;
    line-height: 1.55;
 
    white-space: normal !important;
 
    word-break: normal !important;
    overflow-wrap: anywhere;
 
    box-sizing: border-box;
}
}


.ts-chron-entry:last-child .ts-chron-body {
 
     border-bottom: 0;
/* =========================================================
  10. 年代・前後関係に関する注記
  ========================================================= */
 
.ts-order-note {
    width: 100%;
 
    margin: 3px 0 0 !important;
    padding: 0 !important;
 
    color: #72777d;
 
    font-size: .78rem;
     line-height: 1.5;
}
}


.ts-chron-event {
 
     margin: 0 0 4px;
/* =========================================================
     color: var(--chron-text);
  11. 詳細を見る
     font-size: .98rem;
  ========================================================= */
    font-weight: 700;
 
.ts-chron-detail,
.ts-fullchron-detail {
    width: 100%;
 
     margin: 4px 0 0 !important;
     padding: 0 !important;
 
     font-size: .9rem;
     line-height: 1.5;
     line-height: 1.5;
}
}


.ts-chron-event a {
 
    color: var(--chron-blue-dark);
/* =========================================================
  12. リンク
  ========================================================= */
 
.ts-chronology a,
.ts-fullchronology a {
    text-decoration: none;
}
 
.ts-chronology a:hover,
.ts-fullchronology a:hover {
    text-decoration: underline;
}
 
 
/* =========================================================
  13. タブレット
  ========================================================= */
 
@media screen and (max-width: 900px) {
 
    .ts-chron-list::before,
    .ts-fullchron-list::before {
        left: 125px;
    }
 
    .ts-chron-entry,
    .ts-fullchron-entry {
        grid-template-columns: 110px minmax(0, 1fr) !important;
        column-gap: 30px !important;
    }
 
    .ts-chron-entry::before,
    .ts-fullchron-entry::before {
        left: 120px;
    }
}
 
 
/* =========================================================
  14. スマートフォン
  ========================================================= */
 
@media screen and (max-width: 720px) {
 
    /* ---------- ページ上部 ---------- */
 
    .ts-chron-header,
    .ts-fullchron-header {
        margin-bottom: 14px;
    }
 
    .ts-chron-lead,
    .ts-fullchron-lead {
        font-size: .95rem;
        line-height: 1.75;
    }
 
    .ts-chron-notice,
    .ts-fullchron-notice {
        margin: 10px 0;
        padding: 9px 11px;
 
        font-size: .88rem;
        line-height: 1.7;
    }
 
 
    /* ナビは横スクロール可能にする */
    .ts-chron-nav,
    .ts-fullchron-nav {
        margin: 10px 0 14px;
        padding: 6px 0;
 
        overflow-x: auto;
        overflow-y: hidden;
 
        white-space: nowrap;
 
        font-size: .88rem;
 
        -webkit-overflow-scrolling: touch;
    }
 
 
    /* ---------- セクション ---------- */
 
    .ts-chron-section,
    .ts-fullchron-section {
        margin: 16px 0 22px !important;
    }
 
    h2.ts-chron-section-title,
    h2.ts-fullchron-section-title,
    .ts-chron-section-title,
    .ts-fullchron-section-title {
        margin-bottom: 6px !important;
        padding: 5px 8px !important;
 
        font-size: 1.08rem !important;
    }
 
 
    /* ---------- 縦線 ---------- */
 
    .ts-chron-list::before,
    .ts-fullchron-list::before {
        left: 8px;
    }
 
 
    /* ---------- 1件 ---------- */
 
    .ts-chron-entry,
    .ts-fullchron-entry {
        display: block !important;
 
        width: 100% !important;
 
        margin: 0 !important;
 
        padding:
            7px
            0
            8px
            27px !important;
    }
 
 
    /* 丸 */
    .ts-chron-entry::before,
    .ts-fullchron-entry::before {
        left: 3px;
        top: 12px;
 
        width: 11px;
        height: 11px;
    }
 
 
    /* ---------- 年代 ---------- */
 
    .ts-chron-date,
    .ts-fullchron-date {
        margin: 0 0 2px !important;
 
        text-align: left;
 
        font-size: .84rem;
        line-height: 1.45;
    }
 
 
    /* ---------- 出来事 ---------- */
 
    .ts-chron-event,
    .ts-fullchron-event {
        margin-bottom: 2px !important;
 
        font-size: .96rem;
        line-height: 1.5;
    }
 
 
    /* ---------- 概要 ---------- */
 
    .ts-chron-summary,
    .ts-fullchron-summary {
        font-size: .9rem;
        line-height: 1.6;
    }
 
 
    /* ---------- 全史メタ情報 ---------- */
 
    .ts-fullchron-meta {
        margin-top: 4px !important;
    }
 
    .ts-fullchron-meta-row {
        gap: 5px;
 
        margin: 1px 0 !important;
 
        line-height: 1.5;
    }
 
    .ts-fullchron-meta-label {
        flex-basis: 3.2em !important;
 
        width: 3.2em !important;
        min-width: 3.2em !important;
        max-width: 3.2em !important;
 
        font-size: .82rem;
    }
 
    .ts-fullchron-meta-value {
        font-size: .82rem;
        line-height: 1.5;
    }
 
 
    /* ---------- 注記 ---------- */
 
    .ts-order-note {
        margin-top: 3px !important;
 
        font-size: .74rem;
    }
 
 
    /* ---------- 詳細 ---------- */
 
    .ts-chron-detail,
    .ts-fullchron-detail {
        margin-top: 3px !important;
 
        font-size: .84rem;
    }
}
 
/* ResourceLoader cache refresh 2026-08-28 */
 
/* 案内・お知らせボックス */
.ts-notice-box {
display: flex;
align-items: center;
gap: 12px;
margin: 12px 0 20px;
padding: 12px 16px;
background: #f5f9ff;
border: 1px solid #a2a9b1;
border-left: 5px solid #36c;
border-radius: 2px;
box-sizing: border-box;
}
 
.ts-notice-icon {
flex: 0 0 auto;
width: 28px;
height: 28px;
border: 2px solid #36c;
border-radius: 50%;
color: #36c;
font-size: 18px;
font-weight: bold;
line-height: 24px;
text-align: center;
}
 
.ts-notice-content {
flex: 1;
line-height: 1.6;
}
 
@media screen and (max-width: 600px) {
.ts-notice-box {
align-items: flex-start;
padding: 10px 12px;
}
}
/* =========================================================
  転スラWiki 外部画像スライドギャラリー 完全版
  ・画像を切り抜かない
  ・高さを統一
  ・PCでは横並び+左右ボタン
  ・スマホでは横スワイプ
  ========================================================= */
 
.mw-parser-output .ts-gallery {
position: relative !important;
display: block !important;
width: 100% !important;
max-width: 100% !important;
margin: 0.8em 0 1.5em !important;
padding: 0 !important;
box-sizing: border-box !important;
}
 
/* =========================================================
  横スクロール領域
  ========================================================= */
 
.mw-parser-output .ts-gallery .ts-gallery__track {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: flex-start !important;
 
width: 100% !important;
max-width: 100% !important;
 
gap: 12px !important;
margin: 0 !important;
padding: 4px 44px 10px 0 !important;
 
overflow-x: auto !important;
overflow-y: hidden !important;
 
box-sizing: border-box !important;
 
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
-webkit-overflow-scrolling: touch;
 
scrollbar-width: thin;
scrollbar-color: #a2a9b1 transparent;
}
 
.mw-parser-output .ts-gallery .ts-gallery__track::-webkit-scrollbar {
height: 6px;
}
 
.mw-parser-output .ts-gallery .ts-gallery__track::-webkit-scrollbar-track {
background: transparent;
}
 
.mw-parser-output .ts-gallery .ts-gallery__track::-webkit-scrollbar-thumb {
background: #a2a9b1;
border-radius: 999px;
}
 
/* =========================================================
  カード
  ========================================================= */
 
.mw-parser-output .ts-gallery .ts-gallery__item {
position: relative !important;
display: block !important;
 
flex: 0 0 360px !important;
width: 360px !important;
min-width: 360px !important;
max-width: 360px !important;
 
margin: 0 !important;
padding: 0 !important;
 
border: 1px solid #a2a9b1 !important;
border-radius: 5px !important;
background: #fff !important;
overflow: hidden !important;
 
box-sizing: border-box !important;
scroll-snap-align: start;
}
 
/* =========================================================
  画像表示領域
  ========================================================= */
 
.mw-parser-output .ts-gallery .ts-gallery__imagebox {
display: flex !important;
align-items: center !important;
justify-content: center !important;
 
width: 100% !important;
height: 300px !important;
min-height: 300px !important;
max-height: 300px !important;
 
margin: 0 !important;
padding: 0 !important;
 
background: #f8f9fa !important;
overflow: hidden !important;
 
box-sizing: border-box !important;
 
/* 余計なベースライン隙間防止 */
line-height: 0 !important;
font-size: 0 !important;
}
 
/* =========================================================
  MediaWikiが挿入する可能性があるラッパーを全部無害化
  ここが超重要
  ========================================================= */
 
.mw-parser-output .ts-gallery .ts-gallery__imagebox > p,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > a,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > span,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > div,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > p > a,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > div > a,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > span > a,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > p > span,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > div > span {
display: flex !important;
align-items: center !important;
justify-content: center !important;
 
width: 100% !important;
height: 100% !important;
max-width: 100% !important;
max-height: 100% !important;
 
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
 
box-sizing: border-box !important;
line-height: 0 !important;
font-size: 0 !important;
}
 
/* pタグが入っても余白を出さない */
.mw-parser-output .ts-gallery .ts-gallery__imagebox p {
margin: 0 !important;
}
 
/* =========================================================
  画像本体
  画像全体を必ず表示(切り抜かない)
  ========================================================= */
 
.mw-parser-output .ts-gallery .ts-gallery__imagebox img {
display: block !important;
 
width: 100% !important;
height: 100% !important;
 
max-width: 100% !important;
max-height: 100% !important;
min-width: 0 !important;
min-height: 0 !important;
 
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
box-shadow: none !important;
 
object-fit: contain !important;
object-position: center center !important;
 
background: transparent !important;
box-sizing: border-box !important;
vertical-align: top !important;
}
 
/* =========================================================
  キャプション
  ========================================================= */
 
.mw-parser-output .ts-gallery .ts-gallery__caption {
display: block !important;
width: 100% !important;
 
margin: 0 !important;
padding: 10px 12px 12px !important;
 
background: #fff !important;
color: #202122 !important;
 
font-size: 12px !important;
line-height: 1.6 !important;
 
box-sizing: border-box !important;
overflow-wrap: anywhere;
}
 
.mw-parser-output .ts-gallery .ts-gallery__source {
color: #54595d !important;
font-size: 11px !important;
line-height: 1.55 !important;
}
 
/* =========================================================
  左右ボタン
  ========================================================= */
 
.mw-parser-output .ts-gallery .ts-gallery__nav {
position: absolute !important;
top: 154px !important;
z-index: 20 !important;
 
display: flex !important;
align-items: center !important;
justify-content: center !important;
 
width: 40px !important;
height: 40px !important;
 
margin: 0 !important;
padding: 0 !important;
 
border: 1px solid #a2a9b1 !important;
border-radius: 50% !important;
 
background: rgba(255,255,255,.92) !important;
color: #202122 !important;
 
font-size: 26px !important;
line-height: 1 !important;
 
box-shadow: 0 1px 5px rgba(0,0,0,.2) !important;
cursor: pointer !important;
transform: translateY(-50%);
}
 
.mw-parser-output .ts-gallery .ts-gallery__prev {
left: 8px !important;
}
 
.mw-parser-output .ts-gallery .ts-gallery__next {
right: 8px !important;
}
 
.mw-parser-output .ts-gallery .ts-gallery__nav:disabled {
opacity: .25 !important;
}
}


.ts-chron-summary {
.mw-parser-output .ts-gallery:not(.ts-gallery--scrollable) .ts-gallery__nav {
    color: var(--chron-subtext);
display: none !important;
    font-size: .88rem;
    line-height: 1.7;
}
}


.ts-chron-summary p {
/* =========================================================
    margin: 0;
  スマホ
  ========================================================= */
 
@media screen and (max-width: 720px) {
 
.mw-parser-output .ts-gallery {
margin: 0.6em 0 1.2em !important;
}
 
.mw-parser-output .ts-gallery .ts-gallery__track {
gap: 9px !important;
padding: 3px 28px 8px 0 !important;
scrollbar-width: none;
}
 
.mw-parser-output .ts-gallery .ts-gallery__track::-webkit-scrollbar {
display: none;
}
 
.mw-parser-output .ts-gallery .ts-gallery__item {
flex: 0 0 calc(100% - 28px) !important;
width: calc(100% - 28px) !important;
min-width: calc(100% - 28px) !important;
max-width: calc(100% - 28px) !important;
}
 
.mw-parser-output .ts-gallery .ts-gallery__imagebox {
height: 250px !important;
min-height: 250px !important;
max-height: 250px !important;
}
 
.mw-parser-output .ts-gallery .ts-gallery__nav {
top: 128px !important;
width: 34px !important;
height: 34px !important;
font-size: 23px !important;
}
 
.mw-parser-output .ts-gallery .ts-gallery__prev {
left: 5px !important;
}
 
.mw-parser-output .ts-gallery .ts-gallery__next {
right: 5px !important;
}
}
}


@media screen and (max-width: 380px) {
.mw-parser-output .ts-gallery .ts-gallery__imagebox {
height: 220px !important;
min-height: 220px !important;
max-height: 220px !important;
}
.mw-parser-output .ts-gallery .ts-gallery__nav {
top: 113px !important;
}
}


/* =========================================================
/* =========================================================
   「詳細を見る」
   Infobox 外部画像スライダー
   ========================================================= */
   ========================================================= */


.ts-chron-detail {
.ts-infobox-slider {
    margin-top: 6px;
position: relative !important;
    font-size: .8rem;
 
display: block !important;
 
width: 100% !important;
max-width: 100% !important;
 
margin: 0 !important;
padding: 0 !important;
 
box-sizing: border-box !important;
 
overflow: hidden !important;
}
 
 
/* =========================================================
  スライド領域
  ========================================================= */
 
.ts-infobox-slider__track {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
 
width: 100% !important;
max-width: 100% !important;
 
margin: 0 !important;
padding: 0 !important;
 
overflow-x: auto !important;
overflow-y: hidden !important;
 
box-sizing: border-box !important;
 
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
 
-webkit-overflow-scrolling: touch;
overscroll-behavior-x: contain;
 
/* スクロールバーは非表示 */
scrollbar-width: none;
}
 
.ts-infobox-slider__track::-webkit-scrollbar {
display: none;
}
 
 
/* =========================================================
  1枚のスライド
  ========================================================= */
 
.ts-infobox-slider__slide {
position: relative !important;
 
display: block !important;
 
flex: 0 0 100% !important;
 
width: 100% !important;
min-width: 100% !important;
max-width: 100% !important;
 
margin: 0 !important;
padding: 0 !important;
 
box-sizing: border-box !important;
 
scroll-snap-align: start;
scroll-snap-stop: always;
 
background: #fff;
}
 
 
/* =========================================================
  画像表示領域
  ========================================================= */
 
.ts-infobox-slider__imagebox {
display: flex !important;
align-items: center !important;
justify-content: center !important;
 
width: 100% !important;
 
/*
* Infobox内なのでギャラリーより少しコンパクト
*/
height: 300px !important;
min-height: 300px !important;
max-height: 300px !important;
 
margin: 0 !important;
padding: 0 !important;
 
background: #f8f9fa !important;
 
overflow: hidden !important;
 
box-sizing: border-box !important;
 
line-height: 0 !important;
font-size: 0 !important;
}
 
 
/* =========================================================
  MediaWikiによるラッパー対策
  ========================================================= */
 
.ts-infobox-slider__imagebox p,
.ts-infobox-slider__imagebox a,
.ts-infobox-slider__imagebox span {
margin: 0 !important;
padding: 0 !important;
}
 
 
/* =========================================================
  画像本体
  絶対にトリミングしない
  ========================================================= */
 
.ts-infobox-slider__imagebox img {
display: block !important;
 
width: 100% !important;
height: 100% !important;
 
max-width: 100% !important;
max-height: 100% !important;
 
min-width: 0 !important;
min-height: 0 !important;
 
margin: 0 !important;
padding: 0 !important;
 
border: 0 !important;
box-shadow: none !important;
 
/*
* 元画像全体を表示する。
* cover は使用しない。
*/
object-fit: contain !important;
object-position: center center !important;
 
background: transparent !important;
 
box-sizing: border-box !important;
}
 
 
/* =========================================================
  各画像の説明
  ========================================================= */
 
.ts-infobox-slider__caption {
display: block !important;
 
width: 100% !important;
 
margin: 0 !important;
padding: 7px 8px 9px !important;
 
background: #fff;
 
color: #202122;
 
font-size: 11px !important;
line-height: 1.5 !important;
 
text-align: left;
 
box-sizing: border-box !important;
 
overflow-wrap: anywhere;
}
 
 
.ts-infobox-slider__source {
color: #54595d;
 
font-size: 10px;
line-height: 1.45;
}
 
 
/* =========================================================
  左右ボタン
  ========================================================= */
 
.ts-infobox-slider__nav {
position: absolute !important;
 
/*
* 300pxの画像枠中央
*/
top: 150px !important;
 
z-index: 20 !important;
 
display: flex !important;
align-items: center !important;
justify-content: center !important;
 
width: 32px !important;
height: 32px !important;
 
margin: 0 !important;
padding: 0 !important;
 
border: 1px solid rgba(84, 89, 93, 0.35) !important;
border-radius: 50% !important;
 
background: rgba(255, 255, 255, 0.88) !important;
color: #54595d !important;
 
font-family: Arial, sans-serif;
font-size: 22px !important;
font-weight: normal;
line-height: 1 !important;
 
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
 
cursor: pointer;
 
transform: translateY(-50%);
}
 
 
.ts-infobox-slider__prev {
left: 5px !important;
}
 
 
.ts-infobox-slider__next {
right: 5px !important;
}
 
 
.ts-infobox-slider__nav:hover {
background: #fff !important;
color: #202122 !important;
}
 
 
.ts-infobox-slider__nav:disabled {
opacity: 0.25 !important;
cursor: default;
}
 
 
/* 1枚しかない場合はナビ不要 */
.ts-infobox-slider--single .ts-infobox-slider__nav {
display: none !important;
}
 
 
/* =========================================================
  スマートフォン
  ========================================================= */
 
@media screen and (max-width: 720px) {
 
.ts-infobox-slider__imagebox {
height: 280px !important;
min-height: 280px !important;
max-height: 280px !important;
}
 
.ts-infobox-slider__nav {
top: 140px !important;
}
 
}
 
/* メインページ4カラムを内容量に合わせる */
.ts-grid-4 {
grid-auto-rows: auto !important;
height: auto !important;
min-height: 0 !important;
}
}


.ts-chron-detail a {
.ts-grid-4 > .ts-panel {
    color: var(--chron-blue);
height: auto !important;
min-height: 0 !important;
}
}

2026年9月2日 (水) 19:11時点における最新版

/* ここに記述したCSSはすべての外装に反映されます */

/**
 * Styling for links generated by [[MediaWiki:Edittools]] in WikimediaUI inspired theme.
 * @source https://www.mediawiki.org/wiki/Extension:CharInsert#Styling
 * @updated 2020-03-17
 */
.mw-charinsert-buttons {
	margin-top: 8px;
	border: 1px solid #c8ccd1;
	padding: 2px 4px 4px;
	font-size: 1.1em;
	text-align: center;
}

.mw-charinsert-buttons a {
	background-color: #f8f9fa !important;
	color: #202122;
	border: thin #36c outset;
	padding: 0 1px 2px;
	font-size: 0.9em;
	font-weight: bold;
	text-decoration: none;
}

.mw-charinsert-buttons a:hover {
	background-color: #fff;
    color: #404244;
}

.mw-charinsert-buttons a:active {
	background-color: #c8ccd1;
	border-style: inset;
}

.client-js .mw-edittools-section {
	display: inline;
}

.client-js .mw-edittools-section input[type="button"] {
	background-color: #f8f9fa;
	color: #202122;
	margin-left: 1px;
    border-radius: 2px;
	padding: 1px 6px;
	font-size: 0.9em;
    /* Apply pointer cursor to all interactive elements. */
    cursor: pointer;
}

.client-js .mw-edittools-section input[type="button"]:hover {
	background-color: #fff;
    color: #404244;
}

.client-js .mw-edittools-section input[type="button"]:active {
	background-color: #c8ccd1;
    color: #000;
}

.box26 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 1px #afeeee;
    border-radius: 8px;
}
.box26 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 135%;
    background: #FFF;
    color: #000;
    font-weight: bold;
}
.box26 p {
    margin: 0; 
    padding: 0;
}

/* 線形グラデーション(左右) */
.mainpage {
  width: 50%;
 background-color: #f0ffff;
  background: linear-gradient(to right, #d6eaff, #f9fcff);
  background: -moz-linear-gradient(left, #d6eaff, #f9fcff);
  background: -webkit-linear-gradient(left, #d6eaff, #f9fcff);
  border-radius: 10px;
}

/*---- DPL Forum ----*/
/* Forumheader style */
.forum-header {
	border: 1px solid #aaa; 
	background-color: #cedff2; 
	margin: 0 0 1em; 
	padding: 0 0.5em;
}
/* Forum table outside border */
table.forum-table {
	border: 1px solid lightgrey;
}
/* Forum table cell padding and borders for all table body cells */
table.forum-table > tbody > tr > td {
	border-top: 1px solid lightgrey;
	padding: 8px;
}
/* Forum table background color (show on odd rows) */
table.forum-table > tbody > tr {
	background-color:#fff;
}
/* Forum table background color (shows on even rows) */
table.forum-table > tbody > tr:nth-child(even) {
	background-color:#f5faff;
}
/* Forum table header row background, style and padding */
table.forum-table > tbody > tr > th {
	background-color:#cedff2;
	font-weight:bold;
	padding: 8px;
}

/*-- InputBox --*/
.inputbox-sidebar {
	width: 300px; 
	border: 1px solid lightgrey; 
	clear: right; 
	float: right; 
	margin: 3px; 
	padding:10px;
	margin-left: 2em;
}

/* 以下の内容はhttps://creativecommons.org/licenses/by-sa/3.0/ (クリエイティブ・コモンズ・表示・継承ライセンス3.0) のもとで公表されたウィキペディアの項目https://ja.wikipedia.org/wiki/MediaWiki:Common.css「MediaWiki:Common.css」を複製しています。
以下の内容はhttps://creativecommons.org/licenses/by-sa/3.0/ (クリエイティブ・コモンズ・表示・継承ライセンス3.0)の下で利用可能です。
変更履歴 → https:/ja.wikipedia.org/w/index.php?title=MediaWiki:Common.css&action=history */
/* フォント・ファミリの設定 */
/* [[MediaWiki‐ノート:Common.css#特定テンプレート用のCSSをTemplateStylesに移行する提案(1回目)]]により非推奨化([[Template:Unicode]]への移行推奨) */
.Unicode {
	font-family: 'TITUS Cyberbit Basic', 'Code2000', 'Chrysanthi Unicode', 'Doulos SIL', 'Bitstream Cyberbit', 'Bitstream CyberBase', 'Bitstream Vera', 'Thryomanes', 'Gentium', 'GentiumAlt', 'Visual Geez Unicode', 'Lucida Grande', 'Arial Unicode MS', 'Microsoft Sans Serif', 'Lucida Sans Unicode', sans-serif;
}

.IPA {
	font-family: 'Charis SIL', 'Doulos SIL', 'DejaVu Sans', 'Code2000', 'Hiragino Kaku Gothic Pro', 'Matrix Unicode', 'Tahoma', 'Microsoft Sans Serif', sans-serif;
}

/* make the list of references look smaller */
ol.references,
div.reflist {
	font-size: 90%;            /* Default font-size */
}

div.reflist ol.references {
	font-size: 100%;           /* Reset font-size when nested in div.reflist */
	list-style-type: inherit;  /* Enable custom list style types */
}

/* Default style for navigation boxes */
.navbox {                     /* Navbox container style */
	box-sizing: border-box;
	border: 1px solid #a2a9b1;
	width: 100%;
	margin: auto;
	clear: both;
	font-size: 88%;
	text-align: center;
	padding: 1px;
}

.navbox + .navbox {
	margin-top: -1px;         /* Single pixel border between adjacent navboxes */
}

.navbox-inner,
.navbox-subgroup {
	width: 100%;
}

.navbox-title,
.navbox-abovebelow,
.navbox th {
	text-align: center;       /* Title, group and above/below styles */
	padding-left: 1em;
	padding-right: 1em;
}

th.navbox-group {             /* Group style */
	white-space: nowrap;
	/* @noflip */
	text-align: right;
}

.navbox,
.navbox-subgroup {
	background-color: #fdfdfd; /* Background color */
}

.navbox-list {
	border-color: #fdfdfd;    /* Must match background color */
}

/* cell spacing for navbox cells */
tr + tr > .navbox-abovebelow,
tr + tr > .navbox-group,
tr + tr > .navbox-image,
tr + tr > .navbox-list {    /* Borders above 2nd, 3rd, etc. rows */
	border-top: 2px solid #fdfdfd; /* Must match background color */
}

.navbox th,
.navbox-title {
	background-color: #ccccff;      /* Level 1 color */
}

.navbox-abovebelow,
th.navbox-group,
.navbox-subgroup .navbox-title {
	background-color: #ddddff;      /* Level 2 color */
}

.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
	background-color: #e6e6ff;      /* Level 3 color */
}

.navbox-even {
	background-color: #f7f7f7;      /* Even row striping */
}

.navbox-odd {
	background-color: transparent;  /* Odd row striping */
}

/* [[MediaWiki:Common.js]] にある createCollapseButtons 関数を参照。 */
.collapseButton {
	float: right;
	font-weight: normal;
	text-align: right;
	width: auto;
}

/* Styling for jQuery makeCollapsible, matching that of collapseButton */
.mw-parser-output .mw-collapsible-toggle:not(.mw-ui-button) {
	font-weight: normal;
	/* @noflip */
	text-align: right;
	padding-right: 0.2em;
	padding-left: 0.2em;
}

.mw-collapsible-leftside-toggle .mw-collapsible-toggle {
	/* @noflip */
	float: left;
	/* @noflip */
	text-align: left;
}

/* 表組みを折り畳んだ場合、横幅が極端に狭くなることを強引に修正 */
table.mw-collapsed > caption {
	white-space: nowrap;
}

/* Style for horizontal lists (separator following item).
   @source mediawiki.org/wiki/Snippets/Horizontal_lists
   @revision 9 (2016-08-10)
   @author [[User:Edokter]]
 */
.hlist dl,
.hlist ol,
.hlist ul {
	margin: 0;
	padding: 0;
}

/* Display list items inline */
.hlist dd,
.hlist dt,
.hlist li {
	margin: 0;
	display: inline;
}

/* Display nested lists inline */
.hlist.inline,
.hlist.inline dl,
.hlist.inline ol,
.hlist.inline ul,
.hlist dl dl, .hlist dl ol, .hlist dl ul,
.hlist ol dl, .hlist ol ol, .hlist ol ul,
.hlist ul dl, .hlist ul ol, .hlist ul ul {
	display: inline;
}

/* Hide empty list items */
.hlist .mw-empty-li,
.hlist .mw-empty-elt {
	display: none;
}

/* Generate interpuncts */
.hlist dt:after {
	content: ": ";
}

.hlist dd:after,
.hlist li:after {
	content: " · ";
	font-weight: bold;
}

/* 日本語版の独自仕様。-pipe、-hyphen、-comma、-slash */
.hlist-pipe dd:after,
.hlist-pipe li:after {
	content: " | ";
	font-weight: normal;
}

.hlist-hyphen dd:after,
.hlist-hyphen li:after {
	content: " - ";
	font-weight: normal;
}

.hlist-comma dd:after,
.hlist-comma li:after {
	content: "、 ";
	font-weight: normal;
}
.hlist-slash dd:after,
.hlist-slash li:after {
	content: " / ";
	font-weight: normal;
}

.hlist dd:last-child:after,
.hlist dt:last-child:after,
.hlist li:last-child:after {
	content: none;
}

/* Add parentheses around nested lists */
.hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before,
.hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before,
.hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before {
	content: " (";
	font-weight: normal;
}

.hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after,
.hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after,
.hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after {
	content: ")";
	font-weight: normal;
}

/* Put ordinals in front of ordered list items */
.hlist ol {
	counter-reset: listitem;
}

.hlist ol > li {
	counter-increment: listitem;
}

.hlist ol > li:before {
	content: " " counter(listitem) ".\a0";
}

.hlist dd ol > li:first-child:before,
.hlist dt ol > li:first-child:before,
.hlist li ol > li:first-child:before {
	content: " (" counter(listitem) "\a0";
}

/* Avoid elements from breaking between columns */
li, dd {
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	break-inside: avoid-column;
}

dt {
	-webkit-column-break-after: avoid;
	page-break-after: avoid;
	break-after: avoid-column;
}

dd {
	-webkit-column-break-before: avoid;
	page-break-before: avoid;
	break-before: avoid-column;
}

/* Merge template style */
.messagebox {
	border: 1px solid #a2a9b1;
	background-color: #f8f9fa;
	width: 80%;
	margin: 0 auto 1em auto;
	padding: 0.2em;
	text-align: justify;
}

.infobox {
	border: 1px solid #a2a9b1;
	background-color: #f8f9fa;
	color: black;
	margin: 0.5em 0 0.5em 1em;
	padding: 0.2em;
	float: right;
	clear: right;
	text-align: left;
	font-size: 88%;
	line-height: 1.5em;
}

.infobox caption {
	margin-top: 0.5em;
	font-size: 125%;
	font-weight: bold;
}

.infobox td,
.infobox th {
	vertical-align: top;
}

.infobox.bordered {
	border-collapse: collapse;
}

.infobox.bordered td,
.infobox.bordered th {
	border: 1px solid #a2a9b1;
}

.infobox.bordered .borderless td,
.infobox.bordered .borderless th {
	border: 0;
}

/* styles for bordered infobox with merged rows */
.infobox.bordered .mergedtoprow td,
.infobox.bordered .mergedtoprow th {
	border: 0;
	border-top: 1px solid #a2a9b1;
	/* @noflip */
	border-right: 1px solid #a2a9b1;
}

.infobox.bordered .mergedrow td,
.infobox.bordered .mergedrow th {
	border: 0;
	/* @noflip */
	border-right: 1px solid #a2a9b1;
}

/* Styles for geography infoboxes, eg countries,
   country subdivisions, cities, etc.            */
.infobox.geography {
	border-collapse: collapse;
	line-height: 1.6em;
	font-size: 88%;
}

.infobox.geography  td,
.infobox.geography  th {
	border-top: 1px solid #a2a9b1;
	padding: 0.4em 0.6em 0.4em 0.6em;
}

.infobox.geography .mergedtoprow td,
.infobox.geography .mergedtoprow th {
	border-top: 1px solid #a2a9b1;
	padding: 0.4em 0.6em 0.2em 0.6em;
}

.infobox.geography .mergedrow td,
.infobox.geography .mergedrow th {
	border: 0;
	padding: 0 0.6em 0.2em 0.6em;
}

.infobox.geography .mergedbottomrow td,
.infobox.geography .mergedbottomrow th {
	border-top: 0;
	border-bottom: 1px solid #a2a9b1;
	padding: 0 0.6em 0.4em 0.6em;
}

.infobox.geography .maptable td,
.infobox.geography .maptable th {
	border: 0;
	padding: 0;
}

/* NavFrame関係。[[MediaWiki:Monobook.css]]も参照 */
div.NavFrame {
	margin: 0px;
	padding: 2px;
	border: 1px solid #a2a9b1;
	text-align: center;
	border-collapse: collapse;
	font-size: 95%;
}

div.NavFrame div.NavHead {
	height: 1.6em;
	font-weight: bold;
	font-size: 100%;
	background-color: #efefef;
	position: relative;
	text-align: center;
}

div.NavFrame p {
	font-size: 100%;
}

div.NavFrame div.NavContent {
	font-size: 100%;
}

div.NavFrame div.NavContent p {
	font-size: 100%;
}

a.NavToggle {
	position: absolute;
	top: 0px;
	right: 3px;
	font-weight: normal;
}

/* System messages styled similarly to fmbox */
div.mw-warning-with-logexcerpt,
div.mw-lag-warn-high,
div.mw-cascadeprotectedwarning,
div#mw-protect-cascadeon,
div.titleblacklist-warning {
	clear: both;
	margin: 0.2em 0;
	border: 1px solid #bb7070;
	background-color: #ffdbdb;
	padding: 0.25em 0.9em;
	box-sizing: border-box;
}

/* 脚注ジャンプ先強調 */
.citation:target {
	background-color: #eaf3ff;
}

/* 特定場所での改行を防ぐ:
   1) 個別に指定した場所
   2) リンク途中
   3) グループ名付きの ref タグ <ref group="注"> --> "[注 1]" */
.nowrap,
.nowraplinks a,
sup.reference a {
	white-space: nowrap;
}

/* 以下のクラスを指定した場所では解除する: */
.wrap,
.wraplinks a {
	white-space: normal;
}

/*
 * カテゴリページのリスト部にフロート指定のブロックを入れない。
 * 2009-01-24 by [[User:mizusumashi]]
 */
#mw-subcategories, #mw-pages, #mw-category-media {
	clear: both;
}

/* Don't display page title on the main page */
.page-メインページ #deleteconfirm,
.page-メインページ #t-cite,
.page-メインページ #footer-info-lastmod,
.action-view.page-メインページ #siteSub,
.action-view.page-メインページ .subtitle,
.action-view.page-メインページ .firstHeading,
.action-view.page-メインページ #contentSub,
.action-view.page-メインページ #contentSub2 {
	display: none;
}

/* Unbulleted lists */
.plainlist ol,
.plainlist ul {
	line-height: inherit;
	list-style: none;
	margin: 0;
}

.plainlist ol li,
.plainlist ul li {
	margin-bottom: 0;
}

/* [[Template:Math]]用のtexhtmlクラス。(2021-05-24更新)
   texhtml class for inline math (based on generic times-serif class) */
span.texhtml {
	font-family: "Nimbus Roman No9 L", "Times New Roman", Times, serif;
	font-size: 108%;
	line-height: 1;
	white-space: nowrap;
	/* Force tabular and lining display for texhtml */
	-webkit-font-feature-settings: "lnum", "tnum", "kern" 0;
	font-feature-settings: "lnum", "tnum", "kern" 0;
	font-variant-numeric: lining-nums tabular-nums;
	font-kerning: none;
}

span.texhtml span.texhtml {
	font-size: 100%;
}

span.mwe-math-mathml-inline {
	font-size: 108%;
}

/* Make <math display="block"> be left aligned with one space indent for
 * compatibility with style conventions
 */
.mwe-math-fallback-image-display,
.mwe-math-mathml-display {
	margin-left: 1.6em !important;
	margin-top: 0.6em;
	margin-bottom: 0.6em;
}

.mwe-math-mathml-display math {
	display: inline;
}

/* 日本語版追加分 */
span.texhtml sup {
	vertical-align: 1.0ex;
	font-size: 75%;
}

span.texhtml sub {
	vertical-align: -0.5ex;
	font-size: 75%;
}

/* MediaWiki:Common.js - modifyEditsection
   拡張節編集リンク内の分割線をビジュアルエディター無効でも表示する */
.ve-not-available .editsection-extensions .mw-editsection-divider {
	display: inline;
}

/* 履歴や本文で長い文字列を折り返せない問題の解消 */
#bodyContent {
	word-wrap: break-word;
	overflow-wrap: break-word;
}

/* Hide broken download box on [[Special:Book]] pending [[phab:T285400]] */
.mw-special-Book #coll-downloadbox {
	display: none;
}

/* T156351: Support for Parsoid's Cite implementation */
span[rel="mw:referencedBy"]::before {
    content: "^ ";
}
a[rel="mw:referencedBy"]::before {
    font-weight: bold;
    content: "^";
}
span[ rel="mw:referencedBy" ] {
    counter-reset: mw-ref-linkback 0;
}
span[ rel="mw:referencedBy" ] > a::before {
    font-weight: bold;
    font-style: italic;
    content: counter( mw-ref-linkback, lower-alpha );
}
.mw-ref > a[data-mw-group=lower-roman]::after {
    content: '[' counter( mw-Ref, lower-roman ) ']';
}   
.mw-ref > a[data-mw-group=upper-roman]::after {
    content: '[' counter( mw-Ref, upper-roman ) ']';
}
.mw-ref > a[data-mw-group=decimal]::after {
    content: '[' counter( mw-Ref, decimal ) ']';
}
.mw-ref > a[data-mw-group=lower-greek]::after {
    content: '[' counter( mw-Ref, lower-greek ) ']';
}
.mw-ref > a[data-mw-group=upper-alpha]::after {
    content: '[' counter( mw-Ref, upper-alpha ) ']';
}
.mw-ref > a[data-mw-group=lower-alpha]::after {
    content: '[' counter( mw-Ref, lower-alpha ) ']';
}

/* =========================================================
   転スラWiki メインページ
   ========================================================= */

.ts-main {
    --ts-blue: #36c;
    --ts-blue-dark: #2a4b8d;
    --ts-blue-light: #f4f7fc;
    --ts-border: #c8ccd1;
    --ts-border-light: #eaecf0;
    --ts-text: #202122;
    --ts-subtext: #54595d;
    --ts-muted: #72777d;

    width: 100%;
    max-width: 1220px;
    margin: 0 auto;
    color: var(--ts-text);
    box-sizing: border-box;
}

/*
 MediaWikiが空行から生成するp/brが
 Gridのセルとして扱われるのを防ぐ
*/
.ts-main > p,
.ts-main-section > p,
.ts-portal-grid > p,
.ts-grid-4 > p,
.ts-grid-2 > p,
.ts-main > br,
.ts-main-section > br,
.ts-portal-grid > br,
.ts-grid-4 > br,
.ts-grid-2 > br {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* =========================================================
   Welcome
   ========================================================= */

.ts-welcome {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;

    margin: 0 0 20px;
    padding: 15px 18px;

    border: 1px solid var(--ts-border);
    border-radius: 5px;
    background: #fff;
}

.ts-welcome-title {
    margin: 0 0 5px;
    color: #202122;
    font-size: 1.45rem;
    font-weight: 700;
    line-height: 1.35;
}

.ts-welcome-desc {
    color: var(--ts-subtext);
    font-size: .92rem;
    line-height: 1.65;
}

.ts-welcome-count {
    flex-shrink: 0;
    padding-left: 20px;
    border-left: 1px solid var(--ts-border-light);
    color: var(--ts-muted);
    font-size: .87rem;
    white-space: nowrap;
}

.ts-welcome-count strong {
    color: var(--ts-blue-dark);
    font-size: 1.1rem;
}


/* =========================================================
   Section
   ========================================================= */

.ts-main-section {
    margin: 18px 0 !important;
    padding: 0 !important;
}

.ts-main-heading {
    margin: 0 0 10px !important;
    padding: 4px 0 7px 10px !important;

    border: 0 !important;
    border-left: 4px solid var(--ts-blue) !important;
    border-bottom: 1px solid var(--ts-border-light) !important;

    font-size: 1.2rem !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

.ts-main-heading::after {
    display: none !important;
}


/* =========================================================
   6 portal links
   ========================================================= */

.ts-portal-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0 !important;

    width: 100%;
    overflow: hidden;

    border: 1px solid var(--ts-border);
    border-radius: 5px;
    background: #fff;
}

.ts-portal-card {
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: start;
    gap: 13px;

    min-width: 0;
    min-height: 118px;

    margin: 0 !important;
    padding: 17px 18px !important;

    border-right: 1px solid var(--ts-border-light);
    border-bottom: 1px solid var(--ts-border-light);

    background: #fff;
    box-sizing: border-box;
}

.ts-portal-card:nth-of-type(3n) {
    border-right: 0;
}

.ts-portal-card:nth-last-of-type(-n+3) {
    border-bottom: 0;
}

.ts-portal-card:hover {
    background: #f8faff;
}

.ts-portal-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    border: 1px solid #a7b9d8;
    border-radius: 5px;
    background: #f8faff;

    color: var(--ts-blue-dark);
    font-size: 1rem;
    font-weight: 700;
}

.ts-portal-title {
    margin: 1px 0 4px;
    font-size: 1.02rem;
    font-weight: 700;
}

.ts-portal-title a {
    color: var(--ts-blue-dark);
}

.ts-portal-description {
    margin: 0 0 7px;
    color: var(--ts-subtext);
    font-size: .86rem;
    line-height: 1.55;
}

.ts-portal-more {
    font-size: .84rem;
}


/* =========================================================
   General panels
   ========================================================= */

.ts-grid-4,
.ts-grid-2 {
    display: grid !important;
    gap: 0 !important;

    width: 100%;

    overflow: hidden;
    border: 1px solid var(--ts-border);
    border-radius: 5px;
    background: #fff;
}

.ts-grid-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.ts-grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.ts-panel {
    min-width: 0;

    margin: 0 !important;
    padding: 15px 17px !important;

    border-right: 1px solid var(--ts-border-light);
    background: #fff;

    box-sizing: border-box;
}

.ts-grid-4 > .ts-panel:last-of-type,
.ts-grid-2 > .ts-panel:last-of-type {
    border-right: none;
}

.ts-panel-heading {
    display: flex;
    align-items: center;
    gap: 6px;

    margin: 0 0 10px !important;
    padding: 0 0 7px !important;

    border-bottom: 1px solid var(--ts-border-light);

    color: var(--ts-blue-dark);
    font-size: 1rem;
    font-weight: 700;
}

.ts-panel-symbol {
    color: var(--ts-blue);
    font-weight: 700;
}

.ts-panel-content {
    margin: 0 !important;
    padding: 0 !important;

    font-size: .88rem;
    line-height: 1.65;
}

.ts-panel-content > p:first-child {
    margin-top: 0;
}

.ts-panel-content ul {
    margin: 0 0 0 1.3em !important;
    padding: 0 !important;
}

.ts-panel-content li {
    margin: 4px 0;
}


/* =========================================================
   Pickup
   ========================================================= */

.ts-pickup-label {
    display: inline-block;

    margin: 0 0 7px;
    padding: 2px 7px;

    border-radius: 3px;
    background: #eef3fb;

    color: var(--ts-blue-dark);
    font-size: .72rem;
    font-weight: 700;
}

.ts-pickup-title {
    margin: 0 0 6px;
    font-size: 1.08rem;
    font-weight: 700;
}

.ts-pickup-text {
    margin: 0;
    color: var(--ts-subtext);
    line-height: 1.6;
}

.ts-panel-footer {
    margin-top: 10px;
    text-align: right;
    font-size: .83rem;
}


/* =========================================================
   Ranking
   ========================================================= */

.ts-ranking {
    width: 100%;
    margin: 0 !important;

    border: 0 !important;
    border-collapse: collapse;
    background: transparent !important;

    font-size: .88rem;
}

.ts-ranking tr,
.ts-ranking td {
    background: transparent !important;
}

.ts-ranking td {
    padding: 4px 3px !important;
    border: 0 !important;
}

.ts-ranking-num {
    width: 26px;
    color: var(--ts-muted);
    text-align: center;
}

.ts-ranking-value {
    width: 70px;
    color: var(--ts-muted);
    text-align: right;
    white-space: nowrap;
}

.ts-up {
    color: #14866d;
    font-weight: 700;
}


/* =========================================================
   DPL
   ========================================================= */

.ts-dpl ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.ts-dpl li {
    margin: 0 !important;
    padding: 5px 0 !important;
    border-bottom: 1px dotted #d8dfe8;
}

.ts-dpl li:last-child {
    border-bottom: none;
}


/* =========================================================
   Edit
   ========================================================= */

.ts-edit-list {
    margin: 0 !important;
    padding-left: 1.25em !important;
}

.ts-edit-list li {
    margin: 4px 0;
}

.ts-beginner-box {
    margin-top: 12px;
    padding: 11px 12px;

    border-left: 3px solid var(--ts-blue);
    background: #f4f7fc;

    font-size: .86rem;
}

.ts-beginner-title {
    margin-bottom: 3px;
    font-weight: 700;
}


/* =========================================================
   About
   ========================================================= */

.ts-about {
    margin: 0;
    padding: 16px 18px;

    border: 1px solid var(--ts-border);
    border-radius: 5px;
    background: #f8f9fa;

    font-size: .9rem;
    line-height: 1.7;
}

.ts-about-title {
    margin-bottom: 5px;
    color: #202122;
    font-size: 1.03rem;
    font-weight: 700;
}


/* =========================================================
   Bottom nav
   ========================================================= */

.ts-subnav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;

    margin: 18px 0 0;
    padding: 10px 0;

    border-top: 1px solid var(--ts-border-light);
    border-bottom: 1px solid var(--ts-border-light);

    font-size: .82rem;
}

.ts-subnav a {
    margin: 2px 0;
    padding: 0 11px;
    border-right: 1px solid var(--ts-border);
}

.ts-subnav a:last-child {
    border-right: none;
}


/* =========================================================
   Mobile / tablet
   ========================================================= */

@media screen and (max-width: 1000px) {

    .ts-grid-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .ts-grid-4 .ts-panel:nth-of-type(2n) {
        border-right: 0;
    }

    .ts-grid-4 .ts-panel:nth-of-type(-n+2) {
        border-bottom: 1px solid var(--ts-border-light);
    }
}


@media screen and (max-width: 800px) {

    .ts-portal-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .ts-portal-card:nth-of-type(3n) {
        border-right: 1px solid var(--ts-border-light);
    }

    .ts-portal-card:nth-of-type(2n) {
        border-right: 0;
    }

    .ts-portal-card:nth-last-of-type(-n+3) {
        border-bottom: 1px solid var(--ts-border-light);
    }

    .ts-portal-card:nth-last-of-type(-n+2) {
        border-bottom: 0;
    }

    .ts-grid-2 {
        grid-template-columns: 1fr !important;
    }

    .ts-grid-2 .ts-panel {
        border-right: 0;
        border-bottom: 1px solid var(--ts-border-light);
    }

    .ts-grid-2 .ts-panel:last-of-type {
        border-bottom: 0;
    }

    .ts-welcome {
        display: block;
    }

    .ts-welcome-count {
        margin-top: 10px;
        padding: 8px 0 0;
        border-top: 1px solid var(--ts-border-light);
        border-left: 0;
    }
}


@media screen and (max-width: 520px) {

    .ts-portal-grid,
    .ts-grid-4 {
        grid-template-columns: 1fr !important;
    }

    .ts-portal-card,
    .ts-portal-card:nth-of-type(2n),
    .ts-portal-card:nth-of-type(3n) {
        border-right: 0;
        border-bottom: 1px solid var(--ts-border-light);
    }

    .ts-portal-card:last-of-type {
        border-bottom: 0;
    }

    .ts-grid-4 .ts-panel,
    .ts-grid-4 .ts-panel:nth-of-type(2n) {
        border-right: 0;
        border-bottom: 1px solid var(--ts-border-light);
    }

    .ts-grid-4 .ts-panel:last-of-type {
        border-bottom: 0;
    }
}
.ts-spoiler-note {
    color: var(--ts-muted);
    font-size: .82rem;
}
.ts-ranking-value {
    color: var(--ts-muted);
    font-size: .82rem;
}

/* =========================================================
   転スラ年表・転スラ全史
   共通デザイン
   ========================================================= */


/* =========================================================
   0. 基本
   ========================================================= */

.ts-chronology,
.ts-fullchronology {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
}


/* 年表内でMediaWiki側が生成する段落余白を抑える */
.ts-chronology p,
.ts-fullchronology p,
.ts-chron-entry p,
.ts-fullchron-entry p {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}


/* =========================================================
   1. ページ上部
   ========================================================= */

.ts-chron-header,
.ts-fullchron-header {
    width: 100%;
    margin: 0 0 20px;
    padding: 0;
}


/* ---------- 導入文 ---------- */

.ts-chron-lead,
.ts-fullchron-lead {
    margin: 0 0 12px;
    padding: 0;

    font-size: 1rem;
    line-height: 1.85;
}


/* ---------- 注意書き ---------- */

.ts-chron-notice,
.ts-fullchron-notice {
    margin: 14px 0;
    padding: 10px 14px;

    background: #f8f9fa;

    border: 1px solid #c8ccd1;
    border-left: 3px solid #36c;
    border-radius: 2px;

    font-size: .94rem;
    line-height: 1.75;

    box-sizing: border-box;
}

.ts-chron-notice p,
.ts-fullchron-notice p {
    margin: 0 !important;
}

.ts-chron-notice p + p,
.ts-fullchron-notice p + p {
    margin-top: 5px !important;
}


/* ---------- 年表内ナビ ---------- */

.ts-chron-nav,
.ts-fullchron-nav {
    margin: 14px 0 18px;
    padding: 7px 0;

    border-top: 1px solid #c8ccd1;
    border-bottom: 1px solid #c8ccd1;

    font-size: .94rem;
    line-height: 1.8;
}

.ts-chron-nav a,
.ts-fullchron-nav a {
    white-space: nowrap;
}


/* ---------- 他方の年表へのリンクなど ---------- */

.ts-chron-more,
.ts-fullchron-more {
    margin: 8px 0 0;
    padding: 0;

    font-size: .94rem;
    line-height: 1.6;
}


/* =========================================================
   2. 時代セクション
   ========================================================= */

.ts-chron-section,
.ts-fullchron-section {
    width: 100%;

    margin: 20px 0 26px !important;
    padding: 0 !important;

    box-sizing: border-box;
}


/* 年表と全史の見出しを完全に同じデザインにする */
h2.ts-chron-section-title,
h2.ts-fullchron-section-title,
.ts-chron-section-title,
.ts-fullchron-section-title {
    margin: 0 0 8px !important;
    padding: 5px 10px !important;

    border-top: 0 !important;
    border-right: 0 !important;
    border-bottom: 1px solid #c8ccd1 !important;
    border-left: 4px solid #36c !important;

    background: transparent !important;

    font-size: 1.18rem !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;

    box-sizing: border-box;
}


/* =========================================================
   3. タイムライン本体
   ========================================================= */

.ts-chron-list,
.ts-fullchron-list {
    position: relative;

    display: block !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    gap: 0 !important;

    box-sizing: border-box;
}


/* ---------- 縦線 ---------- */

.ts-chron-list::before,
.ts-fullchron-list::before {
    content: "";

    position: absolute;

    left: 145px;
    top: 0;
    bottom: 0;

    width: 1px;

    background: #a7c1ee;

    z-index: 0;
}


/* =========================================================
   4. 1件の出来事
   ========================================================= */

.ts-chron-entry,
.ts-fullchron-entry {
    position: relative;

    display: grid !important;
    grid-template-columns: 130px minmax(0, 1fr) !important;
    column-gap: 30px !important;

    width: 100% !important;
    max-width: none !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;

    /*
     * 以前よりかなりコンパクト。
     * これ以上狭くすると逆に詰まりすぎるため
     * まずは7px / 9pxを標準とする。
     */
    padding: 7px 0 9px !important;

    border-bottom: 1px solid #eaecf0;

    box-sizing: border-box;
}


/* 最終項目 */
.ts-chron-entry:last-child,
.ts-fullchron-entry:last-child {
    border-bottom: 0;
}


/* ---------- タイムライン上の丸 ---------- */

.ts-chron-entry::before,
.ts-fullchron-entry::before {
    content: "";

    position: absolute;

    left: 140px;
    top: 12px;

    width: 11px;
    height: 11px;

    background: #fff;

    border: 2px solid #36c;
    border-radius: 50%;

    box-sizing: border-box;

    z-index: 2;
}


/* =========================================================
   5. 年代
   ========================================================= */

.ts-chron-date,
.ts-fullchron-date {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    text-align: right;

    color: #2457a6;

    font-size: .94rem;
    font-weight: 600;
    line-height: 1.5;

    white-space: nowrap;

    box-sizing: border-box;
}


/* =========================================================
   6. 本文エリア
   ========================================================= */

.ts-chron-body,
.ts-fullchron-main {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    box-sizing: border-box;
}


/* =========================================================
   7. 出来事名
   ========================================================= */

.ts-chron-event,
.ts-fullchron-event {
    width: 100%;

    margin: 0 0 2px !important;
    padding: 0 !important;

    font-size: 1rem;
    font-weight: 700;
    line-height: 1.55;

    box-sizing: border-box;
}


/* =========================================================
   8. 概要
   ========================================================= */

.ts-chron-summary,
.ts-fullchron-summary {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    font-size: .96rem;
    line-height: 1.65;

    box-sizing: border-box;
}


/* =========================================================
   9. 全史のみ:人物・国家・組織・出典
   ========================================================= */

.ts-fullchron-meta {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 5px 0 0 !important;
    padding: 0 !important;

    box-sizing: border-box;
}


/* ---------- 1行 ---------- */

.ts-fullchron-meta-row {
    position: static !important;

    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;

    float: none !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 1px 0 !important;
    padding: 0 !important;

    gap: 8px;

    line-height: 1.55;

    box-sizing: border-box;
}


/* ---------- 人物・国家・組織・出典ラベル ---------- */

.ts-fullchron-meta-label {
    display: block !important;

    flex: 0 0 3.5em !important;

    width: 3.5em !important;
    min-width: 3.5em !important;
    max-width: 3.5em !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #54595d;

    font-size: .9rem;
    font-weight: 600;
    line-height: 1.55;

    white-space: nowrap !important;

    box-sizing: border-box;
}


/* ---------- 実際の値 ---------- */

.ts-fullchron-meta-value {
    display: block !important;

    flex: 1 1 auto !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    font-size: .9rem;
    line-height: 1.55;

    white-space: normal !important;

    word-break: normal !important;
    overflow-wrap: anywhere;

    box-sizing: border-box;
}


/* =========================================================
   10. 年代・前後関係に関する注記
   ========================================================= */

.ts-order-note {
    width: 100%;

    margin: 3px 0 0 !important;
    padding: 0 !important;

    color: #72777d;

    font-size: .78rem;
    line-height: 1.5;
}


/* =========================================================
   11. 詳細を見る
   ========================================================= */

.ts-chron-detail,
.ts-fullchron-detail {
    width: 100%;

    margin: 4px 0 0 !important;
    padding: 0 !important;

    font-size: .9rem;
    line-height: 1.5;
}


/* =========================================================
   12. リンク
   ========================================================= */

.ts-chronology a,
.ts-fullchronology a {
    text-decoration: none;
}

.ts-chronology a:hover,
.ts-fullchronology a:hover {
    text-decoration: underline;
}


/* =========================================================
   13. タブレット
   ========================================================= */

@media screen and (max-width: 900px) {

    .ts-chron-list::before,
    .ts-fullchron-list::before {
        left: 125px;
    }

    .ts-chron-entry,
    .ts-fullchron-entry {
        grid-template-columns: 110px minmax(0, 1fr) !important;
        column-gap: 30px !important;
    }

    .ts-chron-entry::before,
    .ts-fullchron-entry::before {
        left: 120px;
    }
}


/* =========================================================
   14. スマートフォン
   ========================================================= */

@media screen and (max-width: 720px) {

    /* ---------- ページ上部 ---------- */

    .ts-chron-header,
    .ts-fullchron-header {
        margin-bottom: 14px;
    }

    .ts-chron-lead,
    .ts-fullchron-lead {
        font-size: .95rem;
        line-height: 1.75;
    }

    .ts-chron-notice,
    .ts-fullchron-notice {
        margin: 10px 0;
        padding: 9px 11px;

        font-size: .88rem;
        line-height: 1.7;
    }


    /* ナビは横スクロール可能にする */
    .ts-chron-nav,
    .ts-fullchron-nav {
        margin: 10px 0 14px;
        padding: 6px 0;

        overflow-x: auto;
        overflow-y: hidden;

        white-space: nowrap;

        font-size: .88rem;

        -webkit-overflow-scrolling: touch;
    }


    /* ---------- セクション ---------- */

    .ts-chron-section,
    .ts-fullchron-section {
        margin: 16px 0 22px !important;
    }

    h2.ts-chron-section-title,
    h2.ts-fullchron-section-title,
    .ts-chron-section-title,
    .ts-fullchron-section-title {
        margin-bottom: 6px !important;
        padding: 5px 8px !important;

        font-size: 1.08rem !important;
    }


    /* ---------- 縦線 ---------- */

    .ts-chron-list::before,
    .ts-fullchron-list::before {
        left: 8px;
    }


    /* ---------- 1件 ---------- */

    .ts-chron-entry,
    .ts-fullchron-entry {
        display: block !important;

        width: 100% !important;

        margin: 0 !important;

        padding:
            7px
            0
            8px
            27px !important;
    }


    /* 丸 */
    .ts-chron-entry::before,
    .ts-fullchron-entry::before {
        left: 3px;
        top: 12px;

        width: 11px;
        height: 11px;
    }


    /* ---------- 年代 ---------- */

    .ts-chron-date,
    .ts-fullchron-date {
        margin: 0 0 2px !important;

        text-align: left;

        font-size: .84rem;
        line-height: 1.45;
    }


    /* ---------- 出来事 ---------- */

    .ts-chron-event,
    .ts-fullchron-event {
        margin-bottom: 2px !important;

        font-size: .96rem;
        line-height: 1.5;
    }


    /* ---------- 概要 ---------- */

    .ts-chron-summary,
    .ts-fullchron-summary {
        font-size: .9rem;
        line-height: 1.6;
    }


    /* ---------- 全史メタ情報 ---------- */

    .ts-fullchron-meta {
        margin-top: 4px !important;
    }

    .ts-fullchron-meta-row {
        gap: 5px;

        margin: 1px 0 !important;

        line-height: 1.5;
    }

    .ts-fullchron-meta-label {
        flex-basis: 3.2em !important;

        width: 3.2em !important;
        min-width: 3.2em !important;
        max-width: 3.2em !important;

        font-size: .82rem;
    }

    .ts-fullchron-meta-value {
        font-size: .82rem;
        line-height: 1.5;
    }


    /* ---------- 注記 ---------- */

    .ts-order-note {
        margin-top: 3px !important;

        font-size: .74rem;
    }


    /* ---------- 詳細 ---------- */

    .ts-chron-detail,
    .ts-fullchron-detail {
        margin-top: 3px !important;

        font-size: .84rem;
    }
}

/* ResourceLoader cache refresh 2026-08-28 */

/* 案内・お知らせボックス */
.ts-notice-box {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 12px 0 20px;
	padding: 12px 16px;
	background: #f5f9ff;
	border: 1px solid #a2a9b1;
	border-left: 5px solid #36c;
	border-radius: 2px;
	box-sizing: border-box;
}

.ts-notice-icon {
	flex: 0 0 auto;
	width: 28px;
	height: 28px;
	border: 2px solid #36c;
	border-radius: 50%;
	color: #36c;
	font-size: 18px;
	font-weight: bold;
	line-height: 24px;
	text-align: center;
}

.ts-notice-content {
	flex: 1;
	line-height: 1.6;
}

@media screen and (max-width: 600px) {
	.ts-notice-box {
		align-items: flex-start;
		padding: 10px 12px;
	}
}
/* =========================================================
   転スラWiki 外部画像スライドギャラリー 完全版
   ・画像を切り抜かない
   ・高さを統一
   ・PCでは横並び+左右ボタン
   ・スマホでは横スワイプ
   ========================================================= */

.mw-parser-output .ts-gallery {
	position: relative !important;
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0.8em 0 1.5em !important;
	padding: 0 !important;
	box-sizing: border-box !important;
}

/* =========================================================
   横スクロール領域
   ========================================================= */

.mw-parser-output .ts-gallery .ts-gallery__track {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: flex-start !important;

	width: 100% !important;
	max-width: 100% !important;

	gap: 12px !important;
	margin: 0 !important;
	padding: 4px 44px 10px 0 !important;

	overflow-x: auto !important;
	overflow-y: hidden !important;

	box-sizing: border-box !important;

	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;

	scrollbar-width: thin;
	scrollbar-color: #a2a9b1 transparent;
}

.mw-parser-output .ts-gallery .ts-gallery__track::-webkit-scrollbar {
	height: 6px;
}

.mw-parser-output .ts-gallery .ts-gallery__track::-webkit-scrollbar-track {
	background: transparent;
}

.mw-parser-output .ts-gallery .ts-gallery__track::-webkit-scrollbar-thumb {
	background: #a2a9b1;
	border-radius: 999px;
}

/* =========================================================
   カード
   ========================================================= */

.mw-parser-output .ts-gallery .ts-gallery__item {
	position: relative !important;
	display: block !important;

	flex: 0 0 360px !important;
	width: 360px !important;
	min-width: 360px !important;
	max-width: 360px !important;

	margin: 0 !important;
	padding: 0 !important;

	border: 1px solid #a2a9b1 !important;
	border-radius: 5px !important;
	background: #fff !important;
	overflow: hidden !important;

	box-sizing: border-box !important;
	scroll-snap-align: start;
}

/* =========================================================
   画像表示領域
   ========================================================= */

.mw-parser-output .ts-gallery .ts-gallery__imagebox {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	width: 100% !important;
	height: 300px !important;
	min-height: 300px !important;
	max-height: 300px !important;

	margin: 0 !important;
	padding: 0 !important;

	background: #f8f9fa !important;
	overflow: hidden !important;

	box-sizing: border-box !important;

	/* 余計なベースライン隙間防止 */
	line-height: 0 !important;
	font-size: 0 !important;
}

/* =========================================================
   MediaWikiが挿入する可能性があるラッパーを全部無害化
   ここが超重要
   ========================================================= */

.mw-parser-output .ts-gallery .ts-gallery__imagebox > p,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > a,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > span,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > div,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > p > a,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > div > a,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > span > a,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > p > span,
.mw-parser-output .ts-gallery .ts-gallery__imagebox > div > span {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	max-height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;

	box-sizing: border-box !important;
	line-height: 0 !important;
	font-size: 0 !important;
}

/* pタグが入っても余白を出さない */
.mw-parser-output .ts-gallery .ts-gallery__imagebox p {
	margin: 0 !important;
}

/* =========================================================
   画像本体
   画像全体を必ず表示(切り抜かない)
   ========================================================= */

.mw-parser-output .ts-gallery .ts-gallery__imagebox img {
	display: block !important;

	width: 100% !important;
	height: 100% !important;

	max-width: 100% !important;
	max-height: 100% !important;
	min-width: 0 !important;
	min-height: 0 !important;

	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	box-shadow: none !important;

	object-fit: contain !important;
	object-position: center center !important;

	background: transparent !important;
	box-sizing: border-box !important;
	vertical-align: top !important;
}

/* =========================================================
   キャプション
   ========================================================= */

.mw-parser-output .ts-gallery .ts-gallery__caption {
	display: block !important;
	width: 100% !important;

	margin: 0 !important;
	padding: 10px 12px 12px !important;

	background: #fff !important;
	color: #202122 !important;

	font-size: 12px !important;
	line-height: 1.6 !important;

	box-sizing: border-box !important;
	overflow-wrap: anywhere;
}

.mw-parser-output .ts-gallery .ts-gallery__source {
	color: #54595d !important;
	font-size: 11px !important;
	line-height: 1.55 !important;
}

/* =========================================================
   左右ボタン
   ========================================================= */

.mw-parser-output .ts-gallery .ts-gallery__nav {
	position: absolute !important;
	top: 154px !important;
	z-index: 20 !important;

	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	width: 40px !important;
	height: 40px !important;

	margin: 0 !important;
	padding: 0 !important;

	border: 1px solid #a2a9b1 !important;
	border-radius: 50% !important;

	background: rgba(255,255,255,.92) !important;
	color: #202122 !important;

	font-size: 26px !important;
	line-height: 1 !important;

	box-shadow: 0 1px 5px rgba(0,0,0,.2) !important;
	cursor: pointer !important;
	transform: translateY(-50%);
}

.mw-parser-output .ts-gallery .ts-gallery__prev {
	left: 8px !important;
}

.mw-parser-output .ts-gallery .ts-gallery__next {
	right: 8px !important;
}

.mw-parser-output .ts-gallery .ts-gallery__nav:disabled {
	opacity: .25 !important;
}

.mw-parser-output .ts-gallery:not(.ts-gallery--scrollable) .ts-gallery__nav {
	display: none !important;
}

/* =========================================================
   スマホ
   ========================================================= */

@media screen and (max-width: 720px) {

	.mw-parser-output .ts-gallery {
		margin: 0.6em 0 1.2em !important;
	}

	.mw-parser-output .ts-gallery .ts-gallery__track {
		gap: 9px !important;
		padding: 3px 28px 8px 0 !important;
		scrollbar-width: none;
	}

	.mw-parser-output .ts-gallery .ts-gallery__track::-webkit-scrollbar {
		display: none;
	}

	.mw-parser-output .ts-gallery .ts-gallery__item {
		flex: 0 0 calc(100% - 28px) !important;
		width: calc(100% - 28px) !important;
		min-width: calc(100% - 28px) !important;
		max-width: calc(100% - 28px) !important;
	}

	.mw-parser-output .ts-gallery .ts-gallery__imagebox {
		height: 250px !important;
		min-height: 250px !important;
		max-height: 250px !important;
	}

	.mw-parser-output .ts-gallery .ts-gallery__nav {
		top: 128px !important;
		width: 34px !important;
		height: 34px !important;
		font-size: 23px !important;
	}

	.mw-parser-output .ts-gallery .ts-gallery__prev {
		left: 5px !important;
	}

	.mw-parser-output .ts-gallery .ts-gallery__next {
		right: 5px !important;
	}
}

@media screen and (max-width: 380px) {

	.mw-parser-output .ts-gallery .ts-gallery__imagebox {
		height: 220px !important;
		min-height: 220px !important;
		max-height: 220px !important;
	}

	.mw-parser-output .ts-gallery .ts-gallery__nav {
		top: 113px !important;
	}
}

/* =========================================================
   Infobox 外部画像スライダー
   ========================================================= */

.ts-infobox-slider {
	position: relative !important;

	display: block !important;

	width: 100% !important;
	max-width: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	box-sizing: border-box !important;

	overflow: hidden !important;
}


/* =========================================================
   スライド領域
   ========================================================= */

.ts-infobox-slider__track {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;

	width: 100% !important;
	max-width: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	overflow-x: auto !important;
	overflow-y: hidden !important;

	box-sizing: border-box !important;

	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;

	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;

	/* スクロールバーは非表示 */
	scrollbar-width: none;
}

.ts-infobox-slider__track::-webkit-scrollbar {
	display: none;
}


/* =========================================================
   1枚のスライド
   ========================================================= */

.ts-infobox-slider__slide {
	position: relative !important;

	display: block !important;

	flex: 0 0 100% !important;

	width: 100% !important;
	min-width: 100% !important;
	max-width: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	box-sizing: border-box !important;

	scroll-snap-align: start;
	scroll-snap-stop: always;

	background: #fff;
}


/* =========================================================
   画像表示領域
   ========================================================= */

.ts-infobox-slider__imagebox {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	width: 100% !important;

	/*
	 * Infobox内なのでギャラリーより少しコンパクト
	 */
	height: 300px !important;
	min-height: 300px !important;
	max-height: 300px !important;

	margin: 0 !important;
	padding: 0 !important;

	background: #f8f9fa !important;

	overflow: hidden !important;

	box-sizing: border-box !important;

	line-height: 0 !important;
	font-size: 0 !important;
}


/* =========================================================
   MediaWikiによるラッパー対策
   ========================================================= */

.ts-infobox-slider__imagebox p,
.ts-infobox-slider__imagebox a,
.ts-infobox-slider__imagebox span {
	margin: 0 !important;
	padding: 0 !important;
}


/* =========================================================
   画像本体
   絶対にトリミングしない
   ========================================================= */

.ts-infobox-slider__imagebox img {
	display: block !important;

	width: 100% !important;
	height: 100% !important;

	max-width: 100% !important;
	max-height: 100% !important;

	min-width: 0 !important;
	min-height: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	border: 0 !important;
	box-shadow: none !important;

	/*
	 * 元画像全体を表示する。
	 * cover は使用しない。
	 */
	object-fit: contain !important;
	object-position: center center !important;

	background: transparent !important;

	box-sizing: border-box !important;
}


/* =========================================================
   各画像の説明
   ========================================================= */

.ts-infobox-slider__caption {
	display: block !important;

	width: 100% !important;

	margin: 0 !important;
	padding: 7px 8px 9px !important;

	background: #fff;

	color: #202122;

	font-size: 11px !important;
	line-height: 1.5 !important;

	text-align: left;

	box-sizing: border-box !important;

	overflow-wrap: anywhere;
}


.ts-infobox-slider__source {
	color: #54595d;

	font-size: 10px;
	line-height: 1.45;
}


/* =========================================================
   左右ボタン
   ========================================================= */

.ts-infobox-slider__nav {
	position: absolute !important;

	/*
	 * 300pxの画像枠中央
	 */
	top: 150px !important;

	z-index: 20 !important;

	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	width: 32px !important;
	height: 32px !important;

	margin: 0 !important;
	padding: 0 !important;

	border: 1px solid rgba(84, 89, 93, 0.35) !important;
	border-radius: 50% !important;

	background: rgba(255, 255, 255, 0.88) !important;
	color: #54595d !important;

	font-family: Arial, sans-serif;
	font-size: 22px !important;
	font-weight: normal;
	line-height: 1 !important;

	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);

	cursor: pointer;

	transform: translateY(-50%);
}


.ts-infobox-slider__prev {
	left: 5px !important;
}


.ts-infobox-slider__next {
	right: 5px !important;
}


.ts-infobox-slider__nav:hover {
	background: #fff !important;
	color: #202122 !important;
}


.ts-infobox-slider__nav:disabled {
	opacity: 0.25 !important;
	cursor: default;
}


/* 1枚しかない場合はナビ不要 */
.ts-infobox-slider--single .ts-infobox-slider__nav {
	display: none !important;
}


/* =========================================================
   スマートフォン
   ========================================================= */

@media screen and (max-width: 720px) {

	.ts-infobox-slider__imagebox {
		height: 280px !important;
		min-height: 280px !important;
		max-height: 280px !important;
	}

	.ts-infobox-slider__nav {
		top: 140px !important;
	}

}

/* メインページ4カラムを内容量に合わせる */
.ts-grid-4 {
	grid-auto-rows: auto !important;
	height: auto !important;
	min-height: 0 !important;
}

.ts-grid-4 > .ts-panel {
	height: auto !important;
	min-height: 0 !important;
}