2,710
回編集
編集の要約なし
編集の要約なし |
編集の要約なし タグ: 差し戻し済み |
||
| 1,246行目: | 1,246行目: | ||
@media screen and (max-width: 520px) { | @media screen and (max-width: 520px) { | ||
.ts-portal-grid, | /* ========================================= | ||
.ts-grid-4 { | 全体 | ||
========================================= */ | |||
.ts-main { | |||
width: 100%; | |||
max-width: none; | |||
} | |||
.ts-main-section { | |||
margin: 15px 0 !important; | |||
} | |||
.ts-main-heading { | |||
margin-bottom: 8px !important; | |||
padding: 3px 0 6px 8px !important; | |||
font-size: 1.08rem !important; | |||
} | |||
/* ========================================= | |||
上部のWelcome | |||
========================================= */ | |||
.ts-welcome { | |||
display: block; | |||
margin-bottom: 15px; | |||
padding: 13px 14px; | |||
} | |||
.ts-welcome-title { | |||
font-size: 1.22rem; | |||
} | |||
.ts-welcome-desc { | |||
font-size: .86rem; | |||
line-height: 1.6; | |||
} | |||
.ts-welcome-count { | |||
margin-top: 9px; | |||
padding: 8px 0 0; | |||
border-top: 1px solid var(--ts-border-light); | |||
border-left: 0; | |||
font-size: .82rem; | |||
} | |||
.ts-spoiler-note { | |||
font-size: .78rem; | |||
} | |||
/* ========================================= | |||
「探す」 | |||
スマホでも2列を維持 | |||
========================================= */ | |||
.ts-portal-grid { | |||
grid-template-columns: repeat(2, minmax(0, 1fr)) !important; | |||
} | |||
.ts-portal-card, | |||
.ts-portal-card:nth-of-type(2n), | |||
.ts-portal-card:nth-of-type(3n) { | |||
display: block !important; | |||
min-height: 105px; | |||
padding: 12px 11px !important; | |||
border-right: 1px solid var(--ts-border-light); | |||
border-bottom: 1px solid var(--ts-border-light); | |||
} | |||
.ts-portal-card:nth-of-type(2n) { | |||
border-right: 0; | |||
} | |||
.ts-portal-card:nth-last-of-type(-n+2) { | |||
border-bottom: 0; | |||
} | |||
.ts-portal-icon { | |||
width: 32px; | |||
height: 32px; | |||
margin-bottom: 7px; | |||
font-size: .88rem; | |||
} | |||
.ts-portal-title { | |||
margin: 0 0 3px; | |||
font-size: .92rem; | |||
line-height: 1.4; | |||
} | |||
.ts-portal-description { | |||
margin: 0; | |||
font-size: .76rem; | |||
line-height: 1.45; | |||
} | |||
/* | |||
* スマホでは「→○○一覧」は省略 | |||
* タイトルと説明だけで十分 | |||
*/ | |||
.ts-portal-more { | |||
display: none; | |||
} | |||
/* ========================================= | |||
各パネル | |||
========================================= */ | |||
.ts-grid-4, | |||
.ts-grid-2 { | |||
grid-template-columns: 1fr !important; | grid-template-columns: 1fr !important; | ||
} | } | ||
.ts-grid-4 .ts-panel, | |||
.ts-grid-4 .ts-panel:nth-of-type(2n), | |||
.ts-grid-2 .ts-panel { | |||
border-right: 0; | |||
border-bottom: 1px solid var(--ts-border-light); | |||
} | |||
.ts-grid-4 .ts-panel:last-of-type, | |||
.ts-grid-2 .ts-panel:last-of-type { | |||
border-bottom: 0; | |||
} | |||
.ts-panel { | |||
padding: 13px 14px !important; | |||
} | |||
.ts-panel-heading { | |||
margin-bottom: 8px !important; | |||
padding-bottom: 6px !important; | |||
font-size: .98rem; | |||
} | |||
.ts-panel-content { | |||
font-size: .86rem; | |||
line-height: 1.6; | |||
} | |||
/* ========================================= | |||
ピックアップ | |||
========================================= */ | |||
.ts-pickup-title { | |||
font-size: 1rem; | |||
} | |||
.ts-pickup-text { | |||
font-size: .84rem; | |||
} | |||
.ts-panel-footer { | |||
margin-top: 8px; | |||
font-size: .8rem; | |||
} | |||
/* ========================================= | |||
人気記事・急上昇ランキング | |||
========================================= */ | |||
.ts-ranking { | |||
font-size: .84rem; | |||
} | |||
.ts-ranking td { | |||
padding: 5px 2px !important; | |||
} | |||
.ts-ranking-num { | |||
width: 22px; | |||
} | |||
.ts-ranking-value { | |||
width: auto; | |||
padding-left: 7px !important; | |||
font-size: .78rem; | |||
white-space: nowrap; | |||
} | |||
.ts-ranking-note { | |||
margin-bottom: 6px; | |||
font-size: .75rem; | |||
} | |||
/* ========================================= | |||
新着・最近更新 | |||
========================================= */ | |||
.ts-update-list li { | |||
gap: 8px; | |||
padding: 5px 0 !important; | |||
} | |||
.ts-update-title { | |||
overflow-wrap: anywhere; | |||
} | |||
.ts-update-date { | |||
font-size: .74rem; | |||
} | |||
/* ========================================= | |||
編集案内 | |||
========================================= */ | |||
.ts-beginner-box { | |||
margin-top: 10px; | |||
padding: 9px 10px; | |||
font-size: .82rem; | |||
} | |||
/* ========================================= | |||
作品紹介 | |||
========================================= */ | |||
.ts-about { | |||
padding: 13px 14px; | |||
font-size: .84rem; | |||
line-height: 1.65; | |||
} | |||
.ts-about-title { | |||
font-size: .98rem; | |||
} | |||
/* ========================================= | |||
最下部ナビ | |||
========================================= */ | |||
.ts-subnav { | |||
justify-content: flex-start; | |||
margin-top: 15px; | |||
padding: 8px 0; | |||
font-size: .77rem; | |||
line-height: 1.8; | |||
} | |||
.ts-subnav a { | |||
padding: 0 8px; | |||
} | |||
} | |||
@media screen and (max-width: 360px) { | |||
.ts-portal-card { | |||
padding: 11px 9px !important; | |||
} | |||
.ts-portal-title { | |||
font-size: .86rem; | |||
} | |||
.ts-portal-description { | |||
font-size: .72rem; | |||
} | |||
.ts-panel { | |||
padding: 12px !important; | |||
} | |||
.ts-ranking { | |||
font-size: .8rem; | |||
} | |||
.ts-ranking-value { | |||
font-size: .73rem; | |||
} | |||
} | |||
.ts-portal-card, | .ts-portal-card, | ||