転生したらスライムだった件Wiki

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

メッセージ 議論

MediaWiki:Common.css (ソースを閲覧)

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

34,540 バイト追加 、 2026年9月2日 (水)
編集の要約なし
編集の要約なし
編集の要約なし
 
(同じ利用者による、間の37版が非表示)
704行目: 704行目:
}
}


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


.ts-main {
.ts-main {
     max-width: 1200px;
    --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;
     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;
}
}


/* ---------- ヘッダー ---------- */


.ts-main-header {
/* =========================================================
     margin: 0 0 22px;
  Welcome
     padding: 6px 0 18px;
  ========================================================= */
     border-bottom: 1px solid #d8dfe8;
 
.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-main-title {
.ts-welcome-title {
     margin: 0;
     margin: 0 0 5px;
     font-size: 2rem;
    color: #202122;
     font-size: 1.45rem;
     font-weight: 700;
     font-weight: 700;
     color: #202122;
    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-main-subtitle {
.ts-welcome-count strong {
    margin-top: 6px;
     color: var(--ts-blue-dark);
     color: #54595d;
     font-size: 1.1rem;
     font-size: 0.95rem;
}
}


.ts-main-count {
 
     margin-top: 8px;
/* =========================================================
     font-size: 0.9rem;
  Section
    color: #72777d;
  ========================================================= */
 
.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;


.ts-section {
    font-size: 1.2rem !important;
     margin: 22px 0;
    font-weight: 700 !important;
     line-height: 1.4 !important;
}
}


.ts-section-title {
.ts-main-heading::after {
    margin: 0 0 12px;
     display: none !important;
    padding: 0 0 7px 10px;
    border-left: 4px solid #3366cc;
    border-bottom: 1px solid #eaecf0;
    font-size: 1.25rem;
    font-weight: 700;
     color: #202122;
}
}




/* ---------- 6入口 ---------- */
/* =========================================================
  6 portal links
  ========================================================= */


.ts-portal-grid {
.ts-portal-grid {
     display: grid;
     display: grid !important;
     grid-template-columns: repeat(3, 1fr);
     grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
     border: 1px solid #c8ccd1;
     gap: 0 !important;
     border-radius: 6px;
 
     width: 100%;
     overflow: hidden;
     overflow: hidden;
    border: 1px solid var(--ts-border);
    border-radius: 5px;
     background: #fff;
     background: #fff;
}
}


.ts-portal {
.ts-portal-card {
     position: relative;
     display: grid !important;
     min-height: 105px;
    grid-template-columns: 46px minmax(0, 1fr);
     padding: 18px 20px;
    align-items: start;
     border-right: 1px solid #eaecf0;
    gap: 13px;
     border-bottom: 1px solid #eaecf0;
 
    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;
     box-sizing: border-box;
}
}


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


.ts-portal:nth-last-child(-n+3) {
.ts-portal-card:hover {
     border-bottom: none;
     background: #f8faff;
}
}


.ts-portal:hover {
.ts-portal-icon {
     background: #f8f9fa;
    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 {
.ts-portal-title {
     margin-bottom: 6px;
     margin: 1px 0 4px;
     font-size: 1.08rem;
     font-size: 1.02rem;
     font-weight: 700;
     font-weight: 700;
}
}


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


.ts-portal-desc {
.ts-portal-description {
     margin-bottom: 8px;
     margin: 0 0 7px;
     color: #54595d;
     color: var(--ts-subtext);
     font-size: 0.88rem;
     font-size: .86rem;
     line-height: 1.6;
     line-height: 1.55;
}
}


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




/* ---------- 汎用グリッド ---------- */
/* =========================================================
  General panels
  ========================================================= */


.ts-grid-4,
.ts-grid-2 {
.ts-grid-2 {
     display: grid;
     display: grid !important;
     grid-template-columns: 1fr 1fr;
    gap: 0 !important;
    gap: 16px;
 
    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-3 {
.ts-grid-2 {
    display: grid;
     grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
     grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
}


.ts-panel {
.ts-panel {
     padding: 16px 18px;
    min-width: 0;
     border: 1px solid #c8ccd1;
 
    border-radius: 6px;
    margin: 0 !important;
     padding: 15px 17px !important;
 
     border-right: 1px solid var(--ts-border-light);
     background: #fff;
     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-title {
.ts-panel-symbol {
     margin: 0 0 12px;
     color: var(--ts-blue);
    padding-bottom: 7px;
    border-bottom: 1px solid #eaecf0;
    font-size: 1.08rem;
     font-weight: 700;
     font-weight: 700;
    color: #245c9f;
}
}


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


/* ---------- ピックアップ ---------- */
    font-size: .88rem;
    line-height: 1.65;
}


.ts-pickup-name {
.ts-panel-content > p:first-child {
     margin-bottom: 7px;
     margin-top: 0;
    font-size: 1.15rem;
    font-weight: 700;
}
}


.ts-pickup-text {
.ts-panel-content ul {
     color: #202122;
     margin: 0 0 0 1.3em !important;
     line-height: 1.7;
     padding: 0 !important;
}
}


.ts-pickup-meta {
.ts-panel-content li {
     margin-top: 12px;
     margin: 4px 0;
    color: #72777d;
    font-size: 0.82rem;
}
}




/* ---------- リスト ---------- */
/* =========================================================
  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-list {
.ts-pickup-text {
     margin: 0;
     margin: 0;
     padding-left: 1.4em;
     color: var(--ts-subtext);
    line-height: 1.6;
}
}


.ts-list li {
.ts-panel-footer {
     margin: 5px 0;
     margin-top: 10px;
    text-align: right;
    font-size: .83rem;
}
}
/* =========================================================
  Ranking
  ========================================================= */


.ts-ranking {
.ts-ranking {
     width: 100%;
     width: 100%;
    margin: 0 !important;
    border: 0 !important;
     border-collapse: collapse;
     border-collapse: collapse;
    background: transparent !important;
    font-size: .88rem;
}
.ts-ranking tr,
.ts-ranking td {
    background: transparent !important;
}
}


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


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


.ts-ranking-value {
.ts-ranking-value {
    width: 70px;
    color: var(--ts-muted);
     text-align: right;
     text-align: right;
     white-space: nowrap;
     white-space: nowrap;
     color: #54595d;
}
 
.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-links {
.ts-edit-list {
     line-height: 2;
     margin: 0 !important;
    padding-left: 1.25em !important;
}
}


.ts-beginner {
.ts-edit-list li {
    margin: 4px 0;
}
 
.ts-beginner-box {
     margin-top: 12px;
     margin-top: 12px;
     padding: 12px 14px;
     padding: 11px 12px;
     background: #f8f9fa;
 
     border-left: 3px solid #36c;
    border-left: 3px solid var(--ts-blue);
     background: #f4f7fc;
 
     font-size: .86rem;
}
 
.ts-beginner-title {
    margin-bottom: 3px;
    font-weight: 700;
}
}




/* ---------- 作品概要 ---------- */
/* =========================================================
  About
  ========================================================= */


.ts-about {
.ts-about {
     padding: 18px 20px;
    margin: 0;
     padding: 16px 18px;
 
    border: 1px solid var(--ts-border);
    border-radius: 5px;
     background: #f8f9fa;
     background: #f8f9fa;
     border: 1px solid #eaecf0;
 
     border-radius: 6px;
    font-size: .9rem;
     line-height: 1.75;
    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: 850px) {
@media screen and (max-width: 800px) {


     .ts-portal-grid {
     .ts-portal-grid {
         grid-template-columns: 1fr 1fr;
         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 {
     .ts-portal-card:nth-last-of-type(-n+3) {
         border-right: 1px solid #eaecf0;
         border-bottom: 1px solid var(--ts-border-light);
        border-bottom: 1px solid #eaecf0;
     }
     }


     .ts-portal:nth-child(3n) {
     .ts-portal-card:nth-last-of-type(-n+2) {
         border-right: 1px solid #eaecf0;
         border-bottom: 0;
     }
     }


     .ts-portal:nth-child(2n) {
     .ts-grid-2 {
         border-right: none;
         grid-template-columns: 1fr !important;
     }
     }


     .ts-portal:nth-last-child(-n+3) {
     .ts-grid-2 .ts-panel {
         border-bottom: 1px solid #eaecf0;
        border-right: 0;
         border-bottom: 1px solid var(--ts-border-light);
     }
     }


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


     .ts-grid-2,
     .ts-welcome {
     .ts-grid-3 {
        display: block;
         grid-template-columns: 1fr;
    }
 
     .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) {
@media screen and (max-width: 520px) {


     .ts-portal-grid {
     .ts-portal-grid,
         grid-template-columns: 1fr;
    .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-portal,
     .ts-fullchron-meta-label {
    .ts-portal:nth-child(2n),
        flex-basis: 3.2em !important;
    .ts-portal:nth-child(3n) {
 
         border-right: none;
        width: 3.2em !important;
         border-bottom: 1px solid #eaecf0;
        min-width: 3.2em !important;
         max-width: 3.2em !important;
 
         font-size: .82rem;
     }
     }


     .ts-portal:last-child {
     .ts-fullchron-meta-value {
         border-bottom: none;
         font-size: .82rem;
        line-height: 1.5;
     }
     }


     .ts-main-title {
 
         font-size: 1.65rem;
    /* ---------- 注記 ---------- */
 
     .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;
}
}
「https://tensura-wiki.info/wiki/特別:携帯機器差分/3862...4346」から取得