|
|
| 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, |