@charset "UTF-8"; /* Theme Name: NeotecJapan Template: code_tcd090 Author: HACTAC LTD. Author URI: https://hactac.jp Description: NeotecJapan専用テーマ Version: 2.8.2.1759708288 Updated: 2025-10-06 08:51:28 */ /* 上書き方針（保守性） - 原則 !important は使わず、html.pc / body / body.post-type-archive-team / body.single-team などで詳細度を上げる - 親テーマ・プラグインが !important 固定の箇所のみ、コメント付きで例外とする */ /* ===================================================== 共通：見出し上の装飾ラベル - 単一クラス: class="h2_deco" - ブロックで「h2 deco」と2語にした場合: class="h2 deco" → .h2.deco - h2 要素に class="deco" だけ付けた場合: h2.deco body / #container を付けて本文・Elementor より具体度を確保 ===================================================== */ body .h2_deco, body .h2.deco, body h2.deco, #container .h2_deco, #container .h2.deco, #container h2.deco, #body .h2_deco, #body .h2.deco, #body h2.deco, .post_content .h2_deco, .post_content .h2.deco, .post_content h2.deco, .elementor-widget-container .h2_deco, .elementor-widget-container .h2.deco, .elementor-widget-container h2.deco { color: #1e73be; font-size: 13px; font-weight: bold; margin-bottom: -35px !important; margin-top: 60px !important; } @media screen and (max-width: 750px) { body .h2_deco, body .h2.deco, body h2.deco, #container .h2_deco, #container .h2.deco, #container h2.deco, #body .h2_deco, #body .h2.deco, #body h2.deco, .post_content .h2_deco, .post_content .h2.deco, .post_content h2.deco, .elementor-widget-container .h2_deco, .elementor-widget-container .h2.deco, .elementor-widget-container h2.deco { margin-bottom: -26px !important; } } @media screen and (max-width: 600px) { body .h2_deco, body .h2.deco, body h2.deco, #container .h2_deco, #container .h2.deco, #container h2.deco, #body .h2_deco, #body .h2.deco, #body h2.deco, .post_content .h2_deco, .post_content .h2.deco, .post_content h2.deco, .elementor-widget-container .h2_deco, .elementor-widget-container .h2.deco, .elementor-widget-container h2.deco { font-size: 12px; margin-bottom: -18px !important; } } /* ===================================================== ヘッダーナビ ===================================================== */ /*SP用ロゴの非表示 PC版*/ .pchide { display: none; } /* モバイル用メニュー */ #drawer_menu { display: none; } #global_menu_button { display: none; } /* TCD head.php の responsive.css（max-width:1201px）と同じ幅で SP 用ロゴを出す */ @media screen and (max-width: 1201px) { .pchide { display: block; } } body #tcd_toc { display: none; } /* ======================================================= PC専用：横並びヘッダーメニュー（#pc_nav） - 親テーマ responsive.css が max-width:1201px で有効になるため、 ここは min-width:1202px で揃え（案A：ハンバーガーと二重表示を防ぐ） - 第2階層はホバー/フォーカスでドロップダウン - 1201px 以下は TCD のメガメニュー／ハンバーガー側 ======================================================= */ /* ---------- 広い画面（1202px以上）：横並びナビ ---------- */ @media (min-width: 1202px) { /* ヘッダー本体をバー化＆横並びレイアウト */ #pc_nav { position: sticky; top: 0; left: 0; z-index: 9999; width: 100%; font-weight: 600; } .pc_nav_waku { width: 95%; margin: auto; max-width: 1400px; display: flex; align-items: center; gap: 16px; justify-content: flex-end; } /* ハンバーガーはPCで非表示 */ html.pc body #pc_nav #pc_nav_button { display: none; } #pc_nav #header_logo { margin: 0; } /* 縦書き説明は使わない（必要ならロゴに差し替えてOK） */ html.pc body #pc_nav #site_desc { display: none; } /* SNSは右寄せ */ #side_sns { display: none; margin-left: auto; padding: 0; list-style: none; } #side_sns li { display: inline-block; margin-left: 12px; } /* ナビラッパーをフレックス伸長 */ #pc_nav_content { flex: 1 1 auto; height: 64px; display: flex; align-items: center; overflow: visible; /* ドロップダウンが切れないように */ justify-content: flex-end; } /* wp_nav_menu の出力差を吸収（div→ul/直接ul） */ #pc_nav_content nav { height: 64px; } #pc_nav_content nav > ul, #pc_nav_content nav > div > ul { display: flex; align-items: center; gap: 0; height: 64px; margin: 0; padding: 0; list-style: none; } /* 第1階層（横並び） */ #pc_nav_content nav > ul > li, #pc_nav_content nav > div > ul > li { position: relative; height: 64px; font-size: 16px; white-space: nowrap; } #pc_nav_content nav > ul > li > a, #pc_nav_content nav > div > ul > li > a { display: block; height: 64px; line-height: 64px; padding: 0 16px; color: #222; text-decoration: none; transition: color 0.2s ease; } #pc_nav_content nav a:hover { color: #0070f3; } /* 親メニューの矢印 */ #pc_nav_content .menu-item-has-children > a::after { content: ""; display: inline-block; width: 6px; height: 6px; border-right: 2px solid #1e40bc; border-bottom: 2px solid #1e40bc; margin-bottom: 6px; transform: rotate(45deg); margin-left: 8px; vertical-align: middle; } /* 第2階層：ドロップダウン */ #pc_nav_content nav .sub-menu { display: none; position: absolute; top: 100%; left: 0; z-index: 1000; min-width: 220px; background-color: rgba(255, 255, 255, 0.8); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); box-shadow: 0 10px 10px rgba(0, 0, 0, 0.6); padding: 0; margin: 0; list-style: none; border-radius: 0 0 5px 5px; } #pc_nav_content .sub-menu li { position: relative; } #pc_nav_content .sub-menu li:last-child { border-radius: 0 0 5px 5px; overflow: hidden; } #pc_nav_content .sub-menu a { display: block; height: 56px; line-height: 56px; padding: 0 10px 0 17px; color: #222; text-decoration: none; white-space: nowrap; } #pc_nav_content .sub-menu a:hover { background: #f7f7f7; } /* ホバー/フォーカスで開く（アクセシビリティ配慮） */ #pc_nav_content .menu-item-has-children:hover > .sub-menu, #pc_nav_content .menu-item-has-children:focus-within > .sub-menu { display: block; } /* 第3階層：右スライド */ #pc_nav_content .sub-menu .menu-item-has-children > .sub-menu { top: 0; left: 100%; margin-left: 2px; } /* 親や祖先のoverflow:hiddenで切れないよう保険 */ html.pc body #pc_nav, html.pc body #pc_nav * { overflow: visible; } html.pc body #global_menu_button { display: none; } } /* ---------- 1201px以下（TCD responsive と同ゾーン）---------- カスタム PC バーは隠し、TCD のハンバーガー／メガメニューを利用 */ @media (max-width: 1201px) { #pc_nav { display: none; } } /* ---------------------------------------------------------------------- トップページ　ヘッダーコンテンツ ---------------------------------------------------------------------- */ body.home #header, #header { width: 100%; margin: auto; pointer-events: auto; height: auto; background: rgba(255, 255, 255, 0.8); backdrop-filter: blur(8px); } body.home.header_fix #header, #header { background: rgba(255, 255, 255, 0.8); pointer-events: auto; backdrop-filter: blur(8px); } /*第二階層以降のHEROヘッダー*/ #page_header { width: 100%; height: 300px; position: relative; overflow: hidden; background: #000; } /* ===================================================== とりあえず移動したやつ ===================================================== */ /* ---------------------------------------------------------------------- WordPress プリセットスタイル ---------------------------------------------------------------------- */ /* text and headline */ #container .post_content p { line-height: 2; margin: 0.5em 0 1.5em 0; } /* #main_col / #one_col / #article：2カラム固定ページ（募集要項など）で親テーマより詳細度を上げる */ #container #article .post_content h2, #container #main_col .post_content h2, #container #one_col .post_content h2, #container .post_content h2, .post_content h2 { padding-bottom: 12px !important; border-bottom: 2px solid #eeeeee; } #container #article .post_content h3, #container #main_col .post_content h3, #container #one_col .post_content h3, #container .post_content h3, .post_content h3 { padding: 12px 20px !important; background-color: #f5f5f5; } /* * TCD Classic Editor が the_content を .tcdce-body で包むため、editor.css の見出しは --tcdce-h2-* 等に依存する。 * クイックタグ側の変数が本文に乗らないページでは font-size 等が無効になり、見出しだけ素の表示になる。 * 詳細度を上げて、固定ページ（デフォルトテンプレ #one_col 等）でも必ずベースの見た目になるよう補強する。 */ #container #article .post_content .tcdce-body h2, #container #main_col .post_content .tcdce-body h2, #container #one_col .post_content .tcdce-body h2, #container .post_content .tcdce-body h2 { font-size: clamp(1.2rem, 2.5vw, 1.5rem); font-weight: 700; line-height: 1.45; color: #1a1a1a; margin: 1.25em 0 0.65em; padding: 0 0 12px 0 !important; border: none !important; border-bottom: 2px solid #eeeeee !important; border-image: none !important; background: transparent; width: auto; max-width: none; } #container #article .post_content .tcdce-body h3, #container #main_col .post_content .tcdce-body h3, #container #one_col .post_content .tcdce-body h3, #container .post_content .tcdce-body h3 { font-size: clamp(1.05rem, 2vw, 1.2rem); font-weight: 700; line-height: 1.5; color: #333; margin: 1.25em 0 0.75em; padding: 12px 20px !important; background-color: #f5f5f5 !important; border: none !important; border-image: none !important; } @media screen and (max-width: 767px) { #container #article .post_content h3, #container #main_col .post_content h3, #container #one_col .post_content h3, #container .post_content h3, .post_content h3 { margin-top: 24px !important; } } /* 見出しブロック：直後の a、または見出し内の子 a が別タブ等の外部リンクのとき、見出し末尾にアイコン（装飾） */ #container .post_content .wp-block-heading:has(+ a:is([target="_blank"], [rel~="noopener"], [rel~="noreferrer"]))::after, #container .post_content .wp-block-heading:has(> a:is([target="_blank"], [rel~="noopener"], [rel~="noreferrer"]))::after, .post_content .wp-block-heading:has(+ a:is([target="_blank"], [rel~="noopener"], [rel~="noreferrer"]))::after, .post_content .wp-block-heading:has(> a:is([target="_blank"], [rel~="noopener"], [rel~="noreferrer"]))::after, .editor-styles-wrapper .wp-block-heading:has(+ a:is([target="_blank"], [rel~="noopener"], [rel~="noreferrer"]))::after, .editor-styles-wrapper .wp-block-heading:has(> a:is([target="_blank"], [rel~="noopener"], [rel~="noreferrer"]))::after { content: ""; display: inline-block; width: 0.85em; height: 0.85em; margin-left: 0.35em; vertical-align: -0.12em; background-color: rgb(207 207 207); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M19 19H5V5h7V3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M19 19H5V5h7V3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z'/%3E%3C/svg%3E"); -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; } /* ブロックエディタのキャプション（画像・ギャラリー等） */ .wp-element-caption { text-align: center; color: #999; font-size: 14px; margin-top: 12px; } /* ---------------------------------------------------------------------- neotec/link-card（モダンなカード） ---------------------------------------------------------------------- */ .post_content .nt-link-card, .nt-link-card { box-sizing: border-box; display: flex; flex-direction: column; max-width: 100%; margin: 0 0 1.75rem; overflow: hidden; background: #fff; /* border: 1px solid rgba(15, 23, 42, 0.08); */ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05), 0 12px 32px rgba(15, 23, 42, 0.06); transition: box-shadow 0.28s ease, transform 0.28s ease, border-color 0.22s ease; } .post_content .nt-link-card:hover, .nt-link-card:hover { transform: translateY(-3px); border-color: rgba(30, 115, 190, 0.22); box-shadow: 0 4px 16px rgba(15, 23, 42, 0.07), 0 20px 48px rgba(30, 115, 190, 0.1); } .nt-link-card__media { position: relative; aspect-ratio: 16 / 9; background: linear-gradient(150deg, #f1f5f9 0%, #e2e8f0 55%, #cbd5e1 100%); overflow: hidden; } .nt-link-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.4s ease; } .nt-link-card:hover .nt-link-card__media img { transform: scale(1.045); } .nt-link-card__media-placeholder { display: flex; align-items: center; justify-content: center; min-height: 140px; height: 100%; font-size: 14px; font-weight: 500; color: #64748b; letter-spacing: 0.02em; } .nt-link-card__head { padding: 1.15rem 1.35rem 0.35rem; } /* .post_content h3 のグレー帯を打ち消す（#main_col 等の高詳細度 h3 より上にする） */ #container #article .post_content .nt-link-card h3.nt-link-card__title, #container #main_col .post_content .nt-link-card h3.nt-link-card__title, #container #one_col .post_content .nt-link-card h3.nt-link-card__title, #container .post_content .nt-link-card h3.nt-link-card__title, .post_content .nt-link-card h3.nt-link-card__title, .nt-link-card h3.nt-link-card__title { margin: 0; padding: 0 !important; background: none !important; border: none; font-size: 1.125rem; line-height: 1.35; font-weight: 700; letter-spacing: -0.02em; color: #0f172a; } .nt-link-card__title a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: 0.35em; transition: color 0.2s ease; } .nt-link-card__title a:hover, .nt-link-card__title a:focus-visible { color: #1e73be; } .nt-link-card__title a:focus-visible { outline: 2px solid rgba(30, 115, 190, 0.35); outline-offset: 3px; border-radius: 2px; } .nt-link-card__text { margin: 0; margin-bottom: 0 !important; padding: 0.35rem 1.35rem 26px; font-size: 0.9375rem; line-height: 1.4 !important; color: #475569; } @media (max-width: 600px) { .post_content .nt-link-card, .nt-link-card { margin-bottom: 1.35rem; } .nt-link-card__head { padding: 1rem 1.1rem 0.25rem; } .post_content .nt-link-card h3.nt-link-card__title, .nt-link-card h3.nt-link-card__title { font-size: 1.05rem; margin-top: 0 !important; } .nt-link-card__text { padding: 0.25rem 1.1rem 26px; font-size: 0.9rem; line-height: 1.4; margin-bottom: 0; } } /* グループに追加 CSS クラス「nt-link-cards-grid」を付与 → 最大3列（4枚目以降は折り返し） */ .post_content .wp-block-group.nt-link-cards-grid:has(> .wp-block-group__inner-container) { display: block; } .post_content .wp-block-group.nt-link-cards-grid > .wp-block-group__inner-container { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; width: 100%; max-width: none; } .post_content .wp-block-group.nt-link-cards-grid:not(:has(> .wp-block-group__inner-container)) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; width: 100%; box-sizing: border-box; } .post_content .wp-block-group.nt-link-cards-grid .wp-block-neotec-link-card { width: 100%; max-width: none; min-width: 0; margin: 0; } .post_content .wp-block-group.nt-link-cards-grid .nt-link-card { margin-bottom: 0; height: 100%; } .post_content .wp-block-group.nt-link-cards-grid .nt-link-card__text { flex: 1 1 auto; } @media (max-width: 900px) { .post_content .wp-block-group.nt-link-cards-grid > .wp-block-group__inner-container, .post_content .wp-block-group.nt-link-cards-grid:not(:has(> .wp-block-group__inner-container)) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; } } @media (max-width: 560px) { .post_content .wp-block-group.nt-link-cards-grid > .wp-block-group__inner-container, .post_content .wp-block-group.nt-link-cards-grid:not(:has(> .wp-block-group__inner-container)) { grid-template-columns: minmax(0, 1fr); gap: 1rem; } } /* ---------------------------------------------------------------------- 会社概要ブロックパターン（コア：テーブル・グループ） パターン挿入後も「追加 CSS クラス」で company-info / office / company-history を付ければ同じ見た目にできる フロント: .post_content ／ 編集画面: .editor-styles-wrapper / .is-root-container（add_editor_style で style.css 読込） ---------------------------------------------------------------------- */ /* 会社情報：従来の dl.company-info（ラベル＋値の並び） #container 付与：親テーマの #container .post_content 系より詳細度で勝つ */ #container .post_content .company-info, #container .post_content .company-profile .company-info, .editor-styles-wrapper .company-info, .editor-styles-wrapper .company-profile .company-info, .is-root-container .company-info, .is-root-container .company-profile .company-info { margin-bottom: 48px; width: 100% !important; max-width: 100% !important; box-sizing: border-box; } #container .post_content .company-info dt, #container .post_content .company-profile .company-info dt, .editor-styles-wrapper .company-info dt, .editor-styles-wrapper .company-profile .company-info dt, .is-root-container .company-info dt, .is-root-container .company-profile .company-info dt { font-weight: bold; padding-top: 16px; overflow-wrap: anywhere; word-break: break-word; } #container .post_content .company-info dd, #container .post_content .company-profile .company-info dd, .editor-styles-wrapper .company-info dd, .editor-styles-wrapper .company-profile .company-info dd, .is-root-container .company-info dd, .is-root-container .company-profile .company-info dd { margin: 6px 0 12px 0; padding-bottom: 1em; border-bottom: 1px solid #f0f0f0; overflow-wrap: anywhere; word-break: break-word; } /* 会社情報：ブロック「テーブル」＋ company-history と同様（行を flex） */ #container .post_content .wp-block-table.company-info, .editor-styles-wrapper .wp-block-table.company-info, .is-root-container .wp-block-table.company-info { margin-bottom: 48px; width: 100% !important; max-width: 100% !important; box-sizing: border-box; } #container .post_content .wp-block-table.company-info table, .editor-styles-wrapper .wp-block-table.company-info table, .is-root-container .wp-block-table.company-info table { display: block; width: 100%; border-collapse: collapse; border-spacing: 0; } #container .post_content .wp-block-table.company-info tbody, .editor-styles-wrapper .wp-block-table.company-info tbody, .is-root-container .wp-block-table.company-info tbody { display: block; width: 100%; } #container .post_content .wp-block-table.company-info tr, .editor-styles-wrapper .wp-block-table.company-info tr, .is-root-container .wp-block-table.company-info tr { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 24px; padding: 24px 0 24px 16px; border-bottom: 1px solid #f0f0f0; } #container .post_content .wp-block-table.company-info td, .editor-styles-wrapper .wp-block-table.company-info td, .is-root-container .wp-block-table.company-info td { display: block; flex: 0 0 auto; width: auto; margin: 0; padding: 0; border: 0; vertical-align: top; line-height: 1.7; overflow-wrap: anywhere; word-break: break-word; } #container .post_content .wp-block-table.company-info td:first-child, .editor-styles-wrapper .wp-block-table.company-info td:first-child, .is-root-container .wp-block-table.company-info td:first-child { min-width: 8em; max-width: 40%; font-weight: bold; color: #333; flex-shrink: 0; } #container .post_content .wp-block-table.company-info td:last-child, .editor-styles-wrapper .wp-block-table.company-info td:last-child, .is-root-container .wp-block-table.company-info td:last-child { flex: 1; min-width: 0; } /* --------------------------------------------------------------------- 採用「recruit」直下の固定ページ（募集要項など）：本文テーブルを company-info 型に body.neotec-under-recruit-page … は neotec-toc-for-pages.php の body_class で付与。 .company-info / .company-history は従来どおり専用ルールに任せる。 ---------------------------------------------------------------------- */ body.neotec-under-recruit-page #container #article .post_content .wp-block-table:not(.company-info):not(.company-history), body.neotec-under-recruit-page #container #main_col .post_content .wp-block-table:not(.company-info):not(.company-history), body.neotec-under-recruit-page #container #one_col .post_content .wp-block-table:not(.company-info):not(.company-history), body.neotec-under-recruit-page #container .post_content .wp-block-table:not(.company-info):not(.company-history) { margin-bottom: 48px; width: 100% !important; max-width: 100% !important; box-sizing: border-box; } body.neotec-under-recruit-page #container #article .post_content .wp-block-table:not(.company-info):not(.company-history) table, body.neotec-under-recruit-page #container #main_col .post_content .wp-block-table:not(.company-info):not(.company-history) table, body.neotec-under-recruit-page #container #one_col .post_content .wp-block-table:not(.company-info):not(.company-history) table, body.neotec-under-recruit-page #container .post_content .wp-block-table:not(.company-info):not(.company-history) table { display: block; width: 100%; border-collapse: collapse; border-spacing: 0; } body.neotec-under-recruit-page #container #article .post_content .wp-block-table:not(.company-info):not(.company-history) tbody, body.neotec-under-recruit-page #container #main_col .post_content .wp-block-table:not(.company-info):not(.company-history) tbody, body.neotec-under-recruit-page #container #one_col .post_content .wp-block-table:not(.company-info):not(.company-history) tbody, body.neotec-under-recruit-page #container .post_content .wp-block-table:not(.company-info):not(.company-history) tbody { display: block; width: 100%; } body.neotec-under-recruit-page #container #article .post_content .wp-block-table:not(.company-info):not(.company-history) tr, body.neotec-under-recruit-page #container #main_col .post_content .wp-block-table:not(.company-info):not(.company-history) tr, body.neotec-under-recruit-page #container #one_col .post_content .wp-block-table:not(.company-info):not(.company-history) tr, body.neotec-under-recruit-page #container .post_content .wp-block-table:not(.company-info):not(.company-history) tr { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 24px; padding: 24px 0 24px 16px; border-bottom: 1px solid #f0f0f0; } body.neotec-under-recruit-page #container #article .post_content .wp-block-table:not(.company-info):not(.company-history) td, body.neotec-under-recruit-page #container #main_col .post_content .wp-block-table:not(.company-info):not(.company-history) td, body.neotec-under-recruit-page #container #one_col .post_content .wp-block-table:not(.company-info):not(.company-history) td, body.neotec-under-recruit-page #container .post_content .wp-block-table:not(.company-info):not(.company-history) td { display: block; flex: 0 0 auto; width: auto; margin: 0; padding: 0; border: 0; vertical-align: top; line-height: 1.7; overflow-wrap: anywhere; word-break: break-word; } body.neotec-under-recruit-page #container #article .post_content .wp-block-table:not(.company-info):not(.company-history) td:first-child, body.neotec-under-recruit-page #container #main_col .post_content .wp-block-table:not(.company-info):not(.company-history) td:first-child, body.neotec-under-recruit-page #container #one_col .post_content .wp-block-table:not(.company-info):not(.company-history) td:first-child, body.neotec-under-recruit-page #container .post_content .wp-block-table:not(.company-info):not(.company-history) td:first-child { min-width: 8em; max-width: 40%; font-weight: bold; color: #333; flex-shrink: 0; } body.neotec-under-recruit-page #container #article .post_content .wp-block-table:not(.company-info):not(.company-history) td:last-child, body.neotec-under-recruit-page #container #main_col .post_content .wp-block-table:not(.company-info):not(.company-history) td:last-child, body.neotec-under-recruit-page #container #one_col .post_content .wp-block-table:not(.company-info):not(.company-history) td:last-child, body.neotec-under-recruit-page #container .post_content .wp-block-table:not(.company-info):not(.company-history) td:last-child { flex: 1; min-width: 0; } .post_content .wp-block-group.office, .post_content .office, .editor-styles-wrapper .wp-block-group.office, .is-root-container .wp-block-group.office { margin-top: 40px; } .post_content .office p, .post_content .wp-block-group.office p, .editor-styles-wrapper .wp-block-group.office p, .is-root-container .wp-block-group.office p { line-height: 1.8; } /* MAPリンク：.post_content が無いラッパーでも当たるよう先に全称形 → 本文内はより詳細に上書き可 */ .office p .map-link, .wp-block-group.office p .map-link, .office .wp-block-paragraph .map-link, .wp-block-group.office .wp-block-paragraph .map-link, .editor-styles-wrapper .office p .map-link, .editor-styles-wrapper .wp-block-group.office p .map-link, .is-root-container .office p .map-link, .is-root-container .wp-block-group.office p .map-link, .post_content .office p .map-link, .post_content .wp-block-group.office p .map-link, #container .post_content .office p .map-link, #container .post_content .wp-block-group.office p .map-link { display: inline-block; margin-left: 8px; font-size: 0.85em; letter-spacing: 0.05em; color: #666; text-decoration: none; border-bottom: 1px solid #ccc; transition: color 0.2s ease, border-bottom-color 0.2s ease; cursor: pointer; } /* p が無い場合や、段落が wp-block-paragraph のみで p セレクタと重ならないときのフォールバック */ .office .map-link, .wp-block-group.office .map-link, .editor-styles-wrapper .office .map-link, .is-root-container .office .map-link, .post_content .office .map-link, .post_content .wp-block-group.office .map-link, #container .post_content .office .map-link, #container .post_content .wp-block-group.office .map-link { display: inline-block; margin-left: 8px; font-size: 0.85em; letter-spacing: 0.05em; color: #666; text-decoration: none; border-bottom: 1px solid #ccc; transition: color 0.2s ease, border-bottom-color 0.2s ease; cursor: pointer; } .office p .map-link a, .wp-block-group.office p .map-link a, .office .wp-block-paragraph .map-link a, .wp-block-group.office .wp-block-paragraph .map-link a, .editor-styles-wrapper .office p .map-link a, .editor-styles-wrapper .wp-block-group.office p .map-link a, .is-root-container .office p .map-link a, .is-root-container .wp-block-group.office p .map-link a, .post_content .office p .map-link a, .post_content .wp-block-group.office p .map-link a, #container .post_content .office p .map-link a, #container .post_content .wp-block-group.office p .map-link a, .office .map-link a, .wp-block-group.office .map-link a, .post_content .office .map-link a, .post_content .wp-block-group.office .map-link a, #container .post_content .office .map-link a, #container .post_content .wp-block-group.office .map-link a, .editor-styles-wrapper .wp-block-group.office .map-link a, .is-root-container .wp-block-group.office .map-link a { color: inherit; text-decoration: none !important; border-bottom: none; transition: color 0.2s ease; cursor: pointer; } .office p .map-link a:hover, .wp-block-group.office p .map-link a:hover, .office .wp-block-paragraph .map-link a:hover, .wp-block-group.office .wp-block-paragraph .map-link a:hover, .editor-styles-wrapper .office p .map-link a:hover, .editor-styles-wrapper .wp-block-group.office p .map-link a:hover, .is-root-container .office p .map-link a:hover, .is-root-container .wp-block-group.office p .map-link a:hover, .post_content .office p .map-link a:hover, .post_content .wp-block-group.office p .map-link a:hover, #container .post_content .office p .map-link a:hover, #container .post_content .wp-block-group.office p .map-link a:hover, .office .map-link a:hover, .wp-block-group.office .map-link a:hover, .post_content .office .map-link a:hover, .post_content .wp-block-group.office .map-link a:hover, #container .post_content .office .map-link a:hover, #container .post_content .wp-block-group.office .map-link a:hover, .editor-styles-wrapper .wp-block-group.office .map-link a:hover, .is-root-container .wp-block-group.office .map-link a:hover, .office p .map-link:hover a, .wp-block-group.office p .map-link:hover a, .post_content .office .map-link:hover a, .post_content .wp-block-group.office .map-link:hover a { color: #000; border-bottom-color: #000; } /* 沿革：従来の ul.history-list（年・本文を flex で横並び） */ #container .post_content .company-history, #container .post_content .wp-block-group.company-history, .editor-styles-wrapper .company-history, .editor-styles-wrapper .wp-block-group.company-history, .is-root-container .company-history, .is-root-container .wp-block-group.company-history { width: 100% !important; max-width: 100% !important; box-sizing: border-box; } #container .post_content .history-list, #container .post_content .company-history .history-list, .editor-styles-wrapper .history-list, .editor-styles-wrapper .company-history .history-list, .is-root-container .history-list, .is-root-container .company-history .history-list { list-style: none; padding: 0; margin-left: 0 !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box; } #container .post_content .history-list > li, #container .post_content .company-history .history-list > li, .editor-styles-wrapper .history-list > li, .editor-styles-wrapper .company-history .history-list > li, .is-root-container .history-list > li, .is-root-container .company-history .history-list > li { display: flex; flex-wrap: wrap; gap: 24px; padding: 24px 0 24px 16px; border-bottom: 1px solid #f0f0f0; } #container .post_content .history-list .year, #container .post_content .company-history .history-list .year, .editor-styles-wrapper .history-list .year, .editor-styles-wrapper .company-history .history-list .year, .is-root-container .history-list .year, .is-root-container .company-history .history-list .year { min-width: 60px; font-weight: bold; color: #333; line-height: 1.7; overflow-wrap: anywhere; word-break: break-word; } #container .post_content .history-list .text, #container .post_content .company-history .history-list .text, .editor-styles-wrapper .history-list .text, .editor-styles-wrapper .company-history .history-list .text, .is-root-container .history-list .text, .is-root-container .company-history .history-list .text { flex: 1; line-height: 1.7; min-width: 0; overflow-wrap: anywhere; word-break: break-word; } /* 沿革：ブロック「テーブル」＋追加クラス company-history（行を history-list の li と同じ見た目に） */ #container .post_content .wp-block-table.company-history, .editor-styles-wrapper .wp-block-table.company-history, .is-root-container .wp-block-table.company-history { margin-left: 0 !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box; } #container .post_content .wp-block-table.company-history table, .editor-styles-wrapper .wp-block-table.company-history table, .is-root-container .wp-block-table.company-history table { display: block; width: 100%; border-collapse: collapse; border-spacing: 0; } #container .post_content .wp-block-table.company-history tbody, .editor-styles-wrapper .wp-block-table.company-history tbody, .is-root-container .wp-block-table.company-history tbody { display: block; width: 100%; } #container .post_content .wp-block-table.company-history tr, .editor-styles-wrapper .wp-block-table.company-history tr, .is-root-container .wp-block-table.company-history tr { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 24px; padding: 24px 0 24px 16px; border-bottom: 1px solid #f0f0f0; } #container .post_content .wp-block-table.company-history td, .editor-styles-wrapper .wp-block-table.company-history td, .is-root-container .wp-block-table.company-history td { display: block; flex: 0 0 auto; width: auto; margin: 0; padding: 0; border: 0; vertical-align: top; line-height: 1.7; overflow-wrap: anywhere; word-break: break-word; } #container .post_content .wp-block-table.company-history td:first-child, .editor-styles-wrapper .wp-block-table.company-history td:first-child, .is-root-container .wp-block-table.company-history td:first-child { min-width: 60px; font-weight: bold; color: #333; flex-shrink: 0; } #container .post_content .wp-block-table.company-history td:last-child, .editor-styles-wrapper .wp-block-table.company-history td:last-child, .is-root-container .wp-block-table.company-history td:last-child { flex: 1; min-width: 0; } @media screen and (max-width: 600px) { #container .post_content .history-list > li, #container .post_content .company-history .history-list > li, .editor-styles-wrapper .history-list > li, .editor-styles-wrapper .company-history .history-list > li, .is-root-container .history-list > li, .is-root-container .company-history .history-list > li { flex-wrap: wrap; padding-left: 0; gap: 8px 24px; } #container .post_content .history-list .year, #container .post_content .company-history .history-list .year, .editor-styles-wrapper .history-list .year, .editor-styles-wrapper .company-history .history-list .year, .is-root-container .history-list .year, .is-root-container .company-history .history-list .year { min-width: 0; width: 100%; } #container .post_content .wp-block-table.company-history tr, .editor-styles-wrapper .wp-block-table.company-history tr, .is-root-container .wp-block-table.company-history tr { flex-wrap: wrap; padding-left: 0; gap: 8px 24px; } #container .post_content .wp-block-table.company-history td:first-child, .editor-styles-wrapper .wp-block-table.company-history td:first-child, .is-root-container .wp-block-table.company-history td:first-child { min-width: 0; width: 100%; } #container .post_content .wp-block-table.company-info tr, .editor-styles-wrapper .wp-block-table.company-info tr, .is-root-container .wp-block-table.company-info tr { flex-wrap: wrap; padding-left: 0; gap: 8px 24px; } #container .post_content .wp-block-table.company-info td:first-child, .editor-styles-wrapper .wp-block-table.company-info td:first-child, .is-root-container .wp-block-table.company-info td:first-child { min-width: 0; max-width: none; width: 100%; } body.neotec-under-recruit-page #container #article .post_content .wp-block-table:not(.company-info):not(.company-history) tr, body.neotec-under-recruit-page #container #main_col .post_content .wp-block-table:not(.company-info):not(.company-history) tr, body.neotec-under-recruit-page #container #one_col .post_content .wp-block-table:not(.company-info):not(.company-history) tr, body.neotec-under-recruit-page #container .post_content .wp-block-table:not(.company-info):not(.company-history) tr { flex-wrap: wrap; padding-left: 0; gap: 8px 24px; } body.neotec-under-recruit-page #container #article .post_content .wp-block-table:not(.company-info):not(.company-history) td:first-child, body.neotec-under-recruit-page #container #main_col .post_content .wp-block-table:not(.company-info):not(.company-history) td:first-child, body.neotec-under-recruit-page #container #one_col .post_content .wp-block-table:not(.company-info):not(.company-history) td:first-child, body.neotec-under-recruit-page #container .post_content .wp-block-table:not(.company-info):not(.company-history) td:first-child { min-width: 0; max-width: none; width: 100%; } } /* ---------------------------------------------------------------------- 本文内画像：スマホ等で縦に引き伸ばされるのを防ぐ - 親が flex のときの align-items: stretch や height:100% との競合を抑止 - メディアとテキスト（画像フィル等）はレイアウト用に高さ指定があるため除外 ---------------------------------------------------------------------- */ #container .post_content img:not(.wp-block-media-text__media img,.rinen_icon img) { height: auto !important; max-width: 100%; box-sizing: border-box; vertical-align: bottom; } #container .post_content .wp-block-image.alignfull img, #container .post_content .wp-block-image.alignwide img { width: 100%; height: auto !important; } #container .post_content .wp-block-column > .wp-block-image, #container .post_content .wp-block-column > figure.wp-block-image { align-self: flex-start; max-width: 100%; min-height: 0; } /* ---------------------------------------------------------------------- コンテンツビルダー「フリースペース」：スクロール連動フェードインを無効化 親 TCD style.css: - .cb_free_space .inview / .inview.animate（752–760 行付近） - .lp_free_space_inner .inview / .inview.animate（LP、888–893 行付近） 初期 opacity:0 + transition → footer_script の scroll で .animate 付与で表示 ---------------------------------------------------------------------- */ #container .cb_free_space .inview, #container .cb_free_space .inview.animate, #container .lp_free_space_inner .inview, #container .lp_free_space_inner .inview.animate { opacity: 1; top: 0; -webkit-transition: none; transition: none; } /* ---------------------------------------------------------------------- 本文テーブル（会社概要・沿革など） - PC：セル内は折り返し - スマホ：セルは1行（改行しない）・テーブル幅は内容に合わせ横スクロール - 右に変な余白：コアが .aligncenter 等で figure を display:table;width:auto にするのを打ち消し ---------------------------------------------------------------------- */ #container .post_content table td, #container .post_content table th { white-space: normal; overflow-wrap: break-word; word-break: normal; } /* TCD .s_table：PC は折り返し＋必要時スクロール */ #container .post_content .s_table { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; box-sizing: border-box; } #container .post_content .s_table table { width: auto !important; min-width: 100%; table-layout: auto; } /* ブロック表：PC は折り返し用ラッパー */ #container .post_content .wp-block-table { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; box-sizing: border-box; } #container .post_content .wp-block-table table { width: auto !important; min-width: 100%; table-layout: auto; } @media screen and (max-width: 767px) { /* コア: .alignleft/center/right で display:table + width:auto → 横幅が縮むのを防ぐ */ #container .post_content .wp-block-table.alignleft, #container .post_content .wp-block-table.aligncenter, #container .post_content .wp-block-table.alignright, #container .post_content .wp-block-table { display: block !important; width: calc(100% + 20px) !important; max-width: calc(100% + 20px) !important; float: none !important; margin-left: 0 !important; margin-right: 0 !important; margin-bottom: 2em; white-space: normal; } #container .post_content .wp-block-table table, #container .post_content .wp-block-table table.has-fixed-layout { width: max-content !important; min-width: 100%; table-layout: auto !important; } #container .post_content .wp-block-table td, #container .post_content .wp-block-table th { white-space: nowrap; overflow-wrap: normal; word-break: keep-all; } /* 会社概要・沿革テーブルは上の nowrap を打ち消し（詳細度で上書き） */ #container .post_content .wp-block-table.company-info, #container .post_content .wp-block-table.company-history { width: 100% !important; max-width: 100% !important; overflow-x: visible; } #container .post_content .wp-block-table.company-info table, #container .post_content .wp-block-table.company-history table { width: 100% !important; min-width: 0 !important; max-width: 100% !important; table-layout: auto !important; } #container .post_content .wp-block-table.company-info td, #container .post_content .wp-block-table.company-info th, #container .post_content .wp-block-table.company-history td, #container .post_content .wp-block-table.company-history th { white-space: normal !important; overflow-wrap: anywhere !important; word-break: break-word !important; } /* 採用 recruit 直下ページの本文テーブル（募集要項の company-info 型） */ body.neotec-under-recruit-page #container #article .post_content .wp-block-table:not(.company-info):not(.company-history), body.neotec-under-recruit-page #container #main_col .post_content .wp-block-table:not(.company-info):not(.company-history), body.neotec-under-recruit-page #container #one_col .post_content .wp-block-table:not(.company-info):not(.company-history), body.neotec-under-recruit-page #container .post_content .wp-block-table:not(.company-info):not(.company-history) { width: 100% !important; max-width: 100% !important; overflow-x: visible; } body.neotec-under-recruit-page #container #article .post_content .wp-block-table:not(.company-info):not(.company-history) table, body.neotec-under-recruit-page #container #main_col .post_content .wp-block-table:not(.company-info):not(.company-history) table, body.neotec-under-recruit-page #container #one_col .post_content .wp-block-table:not(.company-info):not(.company-history) table, body.neotec-under-recruit-page #container .post_content .wp-block-table:not(.company-info):not(.company-history) table { width: 100% !important; min-width: 0 !important; max-width: 100% !important; table-layout: auto !important; } body.neotec-under-recruit-page #container #article .post_content .wp-block-table:not(.company-info):not(.company-history) td, body.neotec-under-recruit-page #container #article .post_content .wp-block-table:not(.company-info):not(.company-history) th, body.neotec-under-recruit-page #container #main_col .post_content .wp-block-table:not(.company-info):not(.company-history) td, body.neotec-under-recruit-page #container #main_col .post_content .wp-block-table:not(.company-info):not(.company-history) th, body.neotec-under-recruit-page #container #one_col .post_content .wp-block-table:not(.company-info):not(.company-history) td, body.neotec-under-recruit-page #container #one_col .post_content .wp-block-table:not(.company-info):not(.company-history) th, body.neotec-under-recruit-page #container .post_content .wp-block-table:not(.company-info):not(.company-history) td, body.neotec-under-recruit-page #container .post_content .wp-block-table:not(.company-info):not(.company-history) th { white-space: normal !important; overflow-wrap: anywhere !important; word-break: break-word !important; } #container .post_content .s_table { width: 100%; max-width: 100%; margin-bottom: 2em; white-space: normal; } #container .post_content .s_table table { width: max-content !important; min-width: 100%; table-layout: auto !important; } #container .post_content .s_table td, #container .post_content .s_table th { white-space: nowrap; overflow-wrap: normal; word-break: keep-all; } } /*コンテナ調整*/ #container { position: relative; height: 100%; overflow: hidden; margin-left: 0; } /*投稿(開発事例)ページのフォーマット*/ #main_contents { max-width: 1400px; padding: 0 60px 150px; } #main_contents, #main_contents:before { background: none; } #main_col { width: calc(100% - 350px); z-index: 2; position: relative; padding: 50px 50px 0px 0px; box-sizing: border-box; } /* 2カラム（.pin-wrap ありの記事・固定ページ）：ヘッダー直下の空きが大きすぎる対策 - #main_col の上 padding を抑える - .pin-wrap 内の #side_col.neo-sidebar .widget_content にも responsive の上余白が乗るため、先頭だけ詰める */ #main_contents:has(.pin-wrap) #main_col { padding-top: 28px; } #main_contents:has(.pin-wrap) .pin-wrap #side_col.neo-sidebar .widget_content { margin-top: 0; margin-bottom: 28px; padding-top: 0; padding-bottom: 28px; } #main_contents:has(.pin-wrap) .pin-wrap #side_col.neo-sidebar .widget_content:first-of-type { padding-top: 28px; } #main_contents:has(.pin-wrap) .pin-wrap #side_col.neo-sidebar .widget_content:last-of-type { margin-bottom: 0; } /* ハンバーガー帯（TCD responsive.css と同じ max-width:1201px）ではサイドバー非表示。 親 #main_contents は display:flex + space-between のため、.pin-wrap を消しただけだと #main_col が狭いまま・余白が片寄ることがある → flex を解除し本文を確実に全幅にする。 :has() に頼らず body.single / body.page で指定（詳細度・互換のため）。 */ @media screen and (max-width: 1201px) { body.single #main_contents, body.page #main_contents { display: block !important; justify-content: flex-start !important; flex-wrap: wrap !important; } body.single #main_contents .pin-wrap, body.page #main_contents .pin-wrap { display: none !important; } body.single #main_contents > #side_col.neo-sidebar, body.page #main_contents > #side_col.neo-sidebar { display: none !important; } body.single #main_contents #main_col, body.page #main_contents #main_col { /* width: 100% !important; max-width: 100% !important; */ flex: none !important; /* min-width: 0 !important; */ box-sizing: border-box !important; /* デスクトップ用 padding: 50px 50px 0 0（右寄せ）が残ると狭い幅で左に空白が大きく見える → 左右 0、縦は従来の :has 上詰めに近い値 */ padding: 28px 0 50px !important; } } @media screen and (max-width: 750px) { body.single #main_contents #main_col, body.page #main_contents #main_col { padding: 20px 0 40px !important; } } /* ===================================================== トップページ ===================================================== */ /*ファーストビューのスライダー*/ #header_slider_wrap { position: relative; overflow: hidden; } #header_slider { overflow: hidden; position: relative; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } #header_slider .item { position: relative; } #header_slider .progress_bar { height: 6px; width: 100%; position: absolute; bottom: 180px; left: 0px; z-index: 5; background: rgba(255, 255, 255, 0); overflow: hidden; } /* 記事スライダー ------------------------------------------------ */ #header_slider_wrap #header_slider .progress_bar .bar.active { left: 0%; } #header_slider_wrap #header_slider .post_item .image_wrap { height: 100%; display: block; position: relative; overflow: hidden; } #header_slider .post_item .image_wrap .bg_image { position: absolute; top: 0px; left: 0px; z-index: 1; } #header_slider .post_item .content { width: 100%; height: 180px; background: rgba(0, 0, 0, 0.5); position: absolute; bottom: 0; z-index: 10; -webkit-box-sizing: border-box; box-sizing: border-box; } #header_slider .post_item .content .category { color: #fff; } #header_slider .post_item .content .title a { color: #fff; } #header_slider .post_item .content .date { color: #fff; } #header_slider .post_item .content_inner { width: calc(50% - 160px); padding: 0 60px; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-box-sizing: border-box; box-sizing: border-box; } #header_slider .post_item .content.no_author .content_inner { width: 100%; } /*お知らせ一覧*/ .news_list { display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin: 0 auto; max-width: 1000px; } .news_archive_item_content { padding: 30px 50px; } /* お知らせ一覧：SP 1カラム時、.item と .item a の左右 border が重なり線が太く見えるのを解消（親 responsive より後で上書き） */ @media screen and (max-width: 767px) { #news_archive .news_list > .item, .cb_news_list .news_list > .item { border-left-width: 0 !important; border-right-width: 0 !important; } #news_archive .news_list > .item:nth-of-type(2n + 1), #news_archive .news_list > .item:nth-of-type(2n), .cb_news_list .news_list > .item:nth-of-type(2n + 1), .cb_news_list .news_list > .item:nth-of-type(2n) { border-left-width: 0 !important; border-right-width: 0 !important; } /* 親の「1件目・2件目に両方 top」が縦積みで二重になるのをやめる */ #news_archive .news_list > .item:nth-of-type(n + 2), .cb_news_list .news_list > .item:nth-of-type(n + 2) { border-top-width: 0 !important; } #news_archive .news_list > .item:nth-of-type(1), .cb_news_list .news_list > .item:nth-of-type(1) { border-top-width: 1px !important; } #news_archive .news_list .item a, .cb_news_list .news_list .item a { border: 0 !important; } } /* ===================================================== サイドバー #side_col.neo-sidebar … 見た目の共通フック（#side_col に class="neo-sidebar"） .pin-wrap … 右列外枠。.pin-area を GSAP でピン留め（#container overflow では sticky が効きにくい） ※ css/responsive.css の単体 #side_col より詳細度を上げるため、レイアウトも #side_col.neo-sidebar に書く ===================================================== */ #side_col.neo-sidebar, .widget_nav_menu { width: 300px; max-width: 100%; box-sizing: border-box; z-index: 2; position: relative; padding-top: 0px; margin: 0; display: block; flex-wrap: unset; } @media screen and (max-width: 850px) { #side_col.neo-sidebar { width: auto; margin: -50px 30px 0; padding-top: 0; padding-bottom: 0; } } @media screen and (max-width: 750px) { #side_col.neo-sidebar { margin: -40px 20px 0; padding: 0 0 40px 0; } } html.pc body .widget_content.active { position: fixed; top: 64px; width: 350px; } /* .pin-wrap 内は GSAP が .pin-area ごとピン留め。親テーマ head.php（目次あり時）が 最後の .widget_content に .active（fixed / width:350px）を付けると二重固定になり、 load や refresh 後にサイドバーが一変する → ピン内では TCD の追従を打ち消す */ html.pc body .pin-wrap .widget_content.active, html.pc body .pin-wrap .widget_content.active_off { position: relative; top: auto !important; bottom: auto !important; width: auto !important; max-width: 100%; } /* =====================================================   ウィジェット（サイドバー外のデフォルト） ===================================================== */ .widget_content { width: 100%; margin-right: 0; margin-top: 14px; } /* ===================================================== サイドバー内ウィジェット統一（目次 INDEX ウィジェット準拠） - 見出し：下線 #1e73be - リスト：番号なし、区切り線 #ddd - 親テーマの .widget_content:after（白線）はサイドバーでは非表示 ===================================================== */ /* responsive.css の .widget_content の margin-top は付けず、上余白は padding-top: 50px のみ */ #side_col.neo-sidebar .widget_content { margin-top: 0; margin-bottom: 28px; padding-top: 50px; padding-bottom: 28px; } #side_col.neo-sidebar .widget_content:last-of-type { margin-bottom: 0; padding-bottom: 0; } #side_col.neo-sidebar .widget_content::after { display: none; } /* タイトル（TCD 標準の div / 目次の h3 / ブロックウィジェット見出し） */ #side_col.neo-sidebar .widget_content .widget_headline { border-bottom: 1px solid #1e73be; margin: 0 0 12px; padding-bottom: 10px; } #side_col.neo-sidebar .widget_content .widget_headline span { font-weight: 600; font-size: 24px; line-height: 1.4; color: #333; } #side_col.neo-sidebar .toc_widget_wrap h3.widget_headline { border-bottom: 1px solid #1e73be; margin: 0 0 12px; padding-bottom: 10px; font-weight: 600; font-size: 24px; line-height: 1.4; color: #333; } #side_col.neo-sidebar .widget_block .wp-block-heading { border-bottom: 1px solid #1e73be; margin: 0 0 12px; padding-bottom: 10px; font-weight: 600; font-size: 16px; line-height: 1.4; color: #333; } /* リスト系ウィジェット共通（ランキング・バナー・スライダーはレイアウト優先で除外） */ #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) ul, #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) ol { list-style: none; margin: 0; padding: 0; } #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) li { border-bottom: 1px solid #dddddd; padding-top: 16px; padding-bottom: 10px; margin: 0; line-height: 1.5; } #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) li:last-child { border-bottom: 1px solid #dddddd; } /* 目次の階層（h3 以下は子 ul）— TCD .toc_widget_wrap.styled と同趣旨 */ #side_col.neo-sidebar .toc_widget_wrap .toc_wrap.child { margin-left: 1.4em; margin-top: -0.2em; } /* 目次リストは親 TCD の .toc_item 余白（line-height:1）を優先。.styled 無し（テーマスタイル使用時）も同じ見た目に */ #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) .toc_widget_wrap .toc_item { padding-top: 16px; padding-bottom: 10px; line-height: 1; border-bottom: 1px solid #dddddd; } #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) .toc_widget_wrap .toc_item:last-child { border-bottom: 1px solid #dddddd; } #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) a { color: #000; text-decoration: none; font-weight: 600; } #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) a:hover { color: #176092; } /* ホバー下線：TCD 同様 grunge 画像 + 下地 #1e73be + color-dodge（親 .toc_link と同じ考え方） */ #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) a:not(.toc_link) { display: inline-block; font-size: 16px; line-height: 1.4; margin: 0 0 2px -8px; padding: 0 8px; position: relative; z-index: 2; vertical-align: top; } #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) a:not(.toc_link)::after { transition: width 0.2s ease; content: ""; width: 0; display: block; position: relative; left: -8px; z-index: -1; height: 4px; top: -6px; border-radius: 4px; background-color: #1e73be; background-image: url(../code_tcd090/img/common/grunge_bg.png); background-blend-mode: color-dodge; filter: blur(1px); mask-image: url(../code_tcd090/img/common/grunge_bg_shape_small.png); -webkit-mask-image: url(../code_tcd090/img/common/grunge_bg_shape_small.png); } #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) a:not(.toc_link):hover { color: #1e73be; } #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) a:not(.toc_link):hover::after { width: calc(100% + 16px); } #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) .sub-menu a:not(.toc_link) { font-size: 14px; margin: 0 0 2px -8px; padding: 0 8px; } /* ドロップダウン内は区切りを弱く */ #side_col.neo-sidebar .widget_content:not(.ranking_post_list_widget):not(.tcd_banner_widget):not(.post_slider_widget) .sub-menu li { border-bottom: none; padding-top: 6px; padding-bottom: 6px; padding-left: 12px; font-size: 14px; } /* 目次リンク：.styled 付き／テーマオプション「目次にテーマスタイルを使用」ON（.styled 無し）の両方 */ #side_col.neo-sidebar .toc_widget_wrap .toc_link { display: inline-block; font-size: 16px; line-height: 1.4; margin: 0 0 2px -8px; padding: 0 8px; position: relative; z-index: 2; color: #000; text-decoration: none; vertical-align: top; } #side_col.neo-sidebar .toc_widget_wrap .toc_link:hover { color: #176092; } #side_col.neo-sidebar .toc_widget_wrap .toc_link::after { display:none; /* transition: width 0.2s ease; content: ""; width: 0; display: block; position: relative; left: -8px; z-index: -1; height: 4px; top: -6px; border-radius: 4px; background-color: #1e73be; background-image: url(../code_tcd090/img/common/grunge_bg.png); background-blend-mode: color-dodge; filter: blur(1px); mask-image: url(../code_tcd090/img/common/grunge_bg_shape_small.png); -webkit-mask-image: url(../code_tcd090/img/common/grunge_bg_shape_small.png);*/ } #side_col.neo-sidebar .toc_widget_wrap .toc_link:hover::after { width: calc(100% + 16px); } #side_col.neo-sidebar .tcd_toc_widget.no_underline .toc_widget_wrap .toc_link::after { display: none; } #side_col.neo-sidebar .tcd_toc_widget.no_underline .toc_widget_wrap .toc_link:hover { color: #f00; } /* =====================================================   フッター ===================================================== */ #footer { padding-top: 100px; background: #176092; } #footer_top { padding: 0; } body #footer #footer_menu, body #footer #footer_menu a, body #footer #footer_menu a:visited { color: #fff; } body #footer #footer_menu a { font-weight: 700; } body #footer #footer_menu ul { margin: 0; padding: 0; list-style: none; } body #footer #footer_menu ul li { margin: 0; } @media screen and (min-width: 951px) { body #footer #footer_menu ul { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; } body #footer #footer_menu ul li { display: inline-flex; align-items: center; } body #footer #footer_menu ul li + li::before { content: '|'; color: #fff; font-weight: 400; margin: 0 1.5em; line-height: 1; font-size: 1em; } } @media screen and (max-width: 950px) { #footer { padding-top: 40px; } #footer_menu { margin-top: 60px; } body #footer #footer_menu ul li { margin: 24px 0; font-size: 16px; } } body #footer #footer_menu_bottom { background-color: #176092; color: #fff; font-size: 12px; } body #footer #footer_menu_bottom a, body #footer #footer_menu_bottom a:visited { color: #fff; font-size: 12px; } body #footer .rss a::before { color: #ffffff; } #footer #copyright { color: #ffffff; } /* ===================================================== 固定ページ INDEX（CC Child Pages等） ===================================================== */ #one_col { margin: 0 auto; padding: 100px 30px 150px; max-width: 1230px; width:95% /*!important*/; } .company_aside-content { position: fixed; top: 110px; right: 0; width: 280px; } @media (max-width: 850px) { .company_aside-content { display: none; } } /* #side_col.neo-sidebar 外の CC Child Pages（本文カラム・Elementor 等）— サイドバーと同じトーン */ body .elementor-widget-wp-widget-ccchildpages_widget h5 { border-bottom: 1px solid #1e73be; margin-bottom: 0; padding-bottom: 10px; font-weight: 600; font-size: 16px; color: #333; } body .elementor-widget-wp-widget-ccchildpages_widget ul { list-style: none; margin-left: 0; padding-left: 0; } body .elementor-widget-wp-widget-ccchildpages_widget li { border-bottom: 1px solid #dddddd; padding-top: 10px; padding-bottom: 10px; } /* 子ページカード一覧：本文が空のとき、フル高さヘッダー用 #one_col アンカーだけ残す場合に親テーマの余白を付けない */ body.page-template-page-child-cards-php #one_col.page-child-cards--anchor-only { padding: 0 !important; margin: 0 !important; min-height: 0; height: 0; overflow: hidden; border: 0; width: 0 !important; max-width: none !important; } /* ===================================================== 働く人一覧：アーカイブページ用 #page_header は archive-news と同型（archive_team_header_*／未設定時はフォールバック画像） ===================================================== */ body.post-type-archive-team .nami_custom_container { max-width: 1230px; margin: 0 auto; padding:50px 30px; } /* 一覧ページは3カラム */ body.post-type-archive-team .team_list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 60px 30px; padding: 0; } .workrs_bg{ background-size: cover; background-position: center 58%; } @media (max-width: 800px) { body.post-type-archive-team .team_list { grid-template-columns: 1fr; padding: 40px 0; } .workrs_bg{ background-size: 195%; background-position: center bottom; } } /* カードデザイン（アーカイブ + チーム詳細内の .team_list） */ body.post-type-archive-team .team_list .item .content, body.single-team .team_article_body .team_list .item .content, body.single-team #single_other_staff .team_list .item .content { background: #fff; padding: 25px 20px; margin: -45px 15px 0 15px; position: relative; box-shadow: 0 12px 25px rgba(0, 0, 0, 0.08); z-index: 10; min-height: 165px; display: flex; flex-direction: column; } body.post-type-archive-team .team_list .staff_itv_num, body.single-team .team_list .staff_itv_num { font-size: 13px; color: #005192; font-weight: 500; margin: 0 0 10px 0; } /* カード内タイトル：18px */ body.post-type-archive-team .team_list .item .title, body.single-team .team_article_body .team_list .item .title, body.single-team #single_other_staff .team_list .item .title { font-size: 18px; font-weight: 600; margin: 0 0 15px 0; line-height: 1.6; color: #333; flex-grow: 1; } /* スマホ対応：カードタイトルを少し小さくして16pxに */ @media (max-width: 800px) { body.post-type-archive-team .team_list .item .title, body.single-team .team_article_body .team_list .item .title, body.single-team #single_other_staff .team_list .item .title { font-size: 16px; } } body.post-type-archive-team .team_list .staff_meta, body.single-team .team_list .staff_meta { font-size: 13px; color: #888; text-align: right; font-weight: 500; margin-top: auto; } body.post-type-archive-team .team_list .item .thumb img, body.single-team .team_list .item .thumb img { width: 100%; height: auto; display: block; } /* -------------------------------------------------- チーム詳細（single-team） レイアウトは page-2columns と同様 #main_contents + #main_col + .pin-wrap（親テーマ flex） -------------------------------------------------- */ /*インタビューNo.*/ .staff_itv_num{ color:#1e73be; font-weight:600; font-size:16px; } /* メインタイトル：33px */ body.single-team .single_title { font-size: 33px; font-weight: 700; line-height: 1.6; color: #000; margin-top: 10px; margin-bottom: 25px; } .catch_view{ position:relative; } p.meta_row2 > span.name{ color:#fff; font-size:1.7rem } body.single-team .team_profile_meta { font-size: 18px; font-weight: 600; color:#fff; margin-bottom: 0px; line-height: 1.8; position: absolute; bottom: 0px; background: linear-gradient( to right, rgba(0, 102, 204, 0.6) 0%, rgba(0, 102, 204, 0) 100% ); background-blend-mode: multiply; width: 100%; padding: 2em; } body.single-team .team_profile_meta .name { font-size: 1.8rem; color: #fff margin-right: 10px; } /* スマホ対応：詳細タイトルのフォントサイズを縮小 (22px) */ @media (max-width: 800px) { body.single-team .single_title { font-size: 22px; margin-top: 20px; } } body.single-team .team_profile_meta .name { font-size: 24px; margin-right: 10px; } /* 詳細内H2見出し（本文 .post_content と固定ページの h2 トーンを揃える） */ body.single-team #container .post_content h2, body.single-team .team_article_body .post_content h2 { font-size: 24px; font-weight: 700; color: #000; line-height: 1.4; padding-bottom: 12px !important; border-bottom: 2px solid #eeeeee; } /* 詳細内H3（固定ページの .post_content h3 と同型） */ body.single-team #container .post_content h3, body.single-team .team_article_body .post_content h3 { padding: 12px 20px !important; background-color: #f5f5f5; } @media screen and (max-width: 767px) { body.single-team #container .post_content h3, body.single-team .team_article_body .post_content h3 { margin-top: 24px !important; } } /* スマホ対応：詳細内のH2を20pxに */ @media (max-width: 800px) { body.single-team #container .post_content h2, body.single-team .team_article_body .post_content h2 { font-size: 20px; margin: 30px 0 20px 0; } } /* --------------------------- サイドバー（Index）— #side_col.neo-sidebar 共通トーン（チームは .widget_content ではなく独自マークアップ） --------------------------- */ body.single-team #side_col.neo-sidebar .index_headline { font-size: 24px; font-weight: 600; line-height: 1.4; color: #333; margin: 0 0 12px; padding-bottom: 10px; border-bottom: 1px solid #1e73be; letter-spacing: 0.05em; } body.single-team #side_col.neo-sidebar .side_team_list { list-style: none; margin: 0; padding: 0; } body.single-team #side_col.neo-sidebar .side_team_list li { border-bottom: 1px solid #dddddd; padding-top: 1em; padding-bottom: 1em; margin: 0; line-height: 1.5; } body.single-team #side_col.neo-sidebar .side_team_list li:last-child { border-bottom: 1px solid #dddddd; } body.single-team #side_col.neo-sidebar .side_team_list li a { display: block; position: relative; z-index: 2; margin: 0 0 2px -8px; padding: 0 8px; text-decoration: none; color: #000; } body.single-team #side_col.neo-sidebar .side_team_list li a::after { display:none; /* transition: width 0.2s ease; content: ""; width: 0; display: block; position: absolute; left: 0; bottom: 0; z-index: -1; height: 4px; border-radius: 4px; background-color: #1e73be; background-image: url(../code_tcd090/img/common/grunge_bg.png); background-blend-mode: color-dodge; filter: blur(1px); mask-image: url(../code_tcd090/img/common/grunge_bg_shape_small.png); -webkit-mask-image: url(../code_tcd090/img/common/grunge_bg_shape_small.png);*/ } body.single-team #side_col.neo-sidebar .side_team_list li a:hover::after { width: 100%; } body.single-team #side_col.neo-sidebar .side_team_list li a:hover .s_title { color: #1e73be; } body.single-team #side_col.neo-sidebar .side_team_list .s_num { display: block; color: #1e73be; font-size: 14px; font-weight: 500; margin-bottom: 2px; position: relative; z-index: 1; font-weight:600; } body.single-team #side_col.neo-sidebar .side_team_list .s_title { display: block; font-size: 16px; font-weight: 600; line-height: 1.5; color: #333; margin-top:0.5em; margin-bottom: 2px; position: relative; z-index: 1; transition: color 0.2s ease; } body.single-team #side_col.neo-sidebar .side_team_list .s_meta { display: block; font-size: 14px; color: #777; text-align: left; position: relative; z-index: 1; margin-top:0.5em; } body.single-team #side_col.neo-sidebar .sidebar_inner { position: sticky; top: 20px; } @media (max-width: 900px) { body.single-team .pin-wrap { display: none; } body.single-team #main_col { /* width: 100%; */ } } /* ------------------------ 詳細ページの記事下（2列） ------------------------ */ #single_other_staff { margin-top: 120px; } @media (max-width: 800px) { #single_other_staff { margin-top: 60px; } } body.single-team #single_other_staff .team_list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px 30px; padding: 20px 0; max-width: 100%; } @media (max-width: 800px) { body.single-team #single_other_staff .team_list { grid-template-columns: 1fr; } } .post_carousel .title_area { min-height: auto; } /* 親 TCD：.featured_post .title_area の min-height: 100px を打ち消す */ .featured_post .title_area { min-height: unset !important; } .featured_post .content { background: #fff; } /* 親 TCD：.featured_post:after の白い下線装飾を出さない */ .featured_post:after { content: none !important; display: none !important; width: 0 !important; height: 0 !important; } /* タブ記事／お知らせ一覧：見出し上の .h2_deco（共通 .h2_deco の負マージンはここでは使わない） */ #index_content_builder .cb_featured .headline_area p.h2_deco, #index_content_builder .cb_news_list .headline_area p.h2_deco { margin-top: 0 !important; margin-bottom: 0.65em !important; text-align: center; letter-spacing: 0.14em; text-transform: none; } /* 親 TCD responsive.css（media max-width:1201px）と同じ入れ子で、見出しエリア下マージンを詰める */ @media screen and (max-width: 1201px) { @media screen and (max-width: 650px) { .cb_featured.featured_content .headline_area { margin: 0 0 24px 0 !important; } } @media screen and (max-width: 750px) { .cb_news_list .headline_area { margin-bottom: 24px !important; } } } /* 親 TCD responsive（max-width:1201px 内の max-width:750px 等）で付く padding-bottom:0 を打ち消す */ @media screen and (max-width: 750px) { .cb_featured.featured_content, .cb_featured.featured_content.cb_content:last-of-type { padding-bottom: 50px !important; } } @media screen and (max-width: 950px) { .featured_post .content.no_date { padding-bottom: 20px !important; margin-bottom: 30px !important; } } .smf-action{ text-align: center; margin-top: 32px; } .smf-action .smf-button-control__control[data-action="confirm"], .smf-action .smf-button-control__control[data-action="complete"] { background: #1e73be; color:white; border-radius: 100px; border:none; padding:16px 80px; width: 100%; max-width: 240px; } /* ---------------------------------------------------------------------- TCD Classic Editor（tcd-classic-editor）の見出し h2 は :is(.tcdce-body, .editor-styles-wrapper) 内にだけ当たる。 トップのコンテンツビルダー等は .tcdce-body の外なので同じ指定を複製。 --tcdce-h2-* はプラグイン editor.css の :root（＋インライン上書き）で定義済み。 ---------------------------------------------------------------------- */ #index_content_builder { container: tcdce / inline-size; } /* TOP（featured 等）：タブ切り替え用のボタン行を非表示 */ #index_content_builder .button_list_wrap { display: none !important; } #index_content_builder h2, #container h2.custom_h2 { position: relative; font-size: var(--tcdce-h2-font-size-pc); font-weight: var(--tcdce-h2-font-weight); line-height: var(--tcdce-h2-line-height); text-align: var(--tcdce-h2-text-align); color: var(--tcdce-h2-font-color); font-family: var(--tcdce-h2-font-family); width: var(--tcdce-h2-content-width); --tcdce-h2-background-gradation1: linear-gradient( 90deg, var(--tcdce-h2-background-gradation-color1) 0%, var(--tcdce-h2-background-gradation-color2) 100% ); --tcdce-h2-background-gradation2: linear-gradient( 180deg, var(--tcdce-h2-background-gradation-color1) 0%, var(--tcdce-h2-background-gradation-color2) 100% ); background: var(--tcdce-h2-background); --tcdce-h2-border-position1: var(--tcdce-h2-border-width) 0 0 0; --tcdce-h2-border-position2: 0 0 0 var(--tcdce-h2-border-width); --tcdce-h2-border-position3: 0 0 var(--tcdce-h2-border-width) 0; --tcdce-h2-border-position4: var(--tcdce-h2-border-width) 0; --tcdce-h2-border-gradation1: linear-gradient( 90deg, var(--tcdce-h2-border-gradation-color1) 0%, var(--tcdce-h2-border-gradation-color2) 100% ); --tcdce-h2-border-gradation2: linear-gradient( 180deg, var(--tcdce-h2-border-gradation-color1) 0%, var(--tcdce-h2-border-gradation-color2) 100% ); border: var(--tcdce-h2-border-style) var(--tcdce-h2-border-color); border-width: var(--tcdce-h2-border-position); border-image: var(--tcdce-h2-border-style) 1; border-image-width: var(--tcdce-h2-border-position); --tcdce-h2-element-gradation1: linear-gradient( 90deg, var(--tcdce-h2-element-gradation-color1) 0%, var(--tcdce-h2-element-gradation-color2) 100% ); --tcdce-h2-element-gradation2: linear-gradient( 180deg, var(--tcdce-h2-element-gradation-color1) 0%, var(--tcdce-h2-element-gradation-color2) 100% ); padding: var(--tcdce-h2-padding-pc); margin-inline: auto; box-sizing: border-box; } #index_content_builder * + h2, #container * + h2.custom_h2 { margin-top: var(--tcdce-h2-margin-top-pc); } #index_content_builder h2:has(+ *), #container h2.custom_h2:has(+ *) { margin-bottom: var(--tcdce-h2-margin-bottom-pc); } #index_content_builder h2::before, #container h2.custom_h2::before { content: ""; display: block; width: var(--tcdce-h2-element-size-w-pc); height: var(--tcdce-h2-element-size-h-pc); background: var(--tcdce-h2-element-background); background-size: contain; background-repeat: no-repeat; background-position: center; position: absolute; inset-block: var(--tcdce-h2-element-inset-block); inset-inline: var(--tcdce-h2-element-inset-inline); margin: auto; } @container tcdce (max-width: 600px) { #index_content_builder h2 { font-size: var(--tcdce-h2-font-size-sp); padding: var(--tcdce-h2-padding-sp); } #index_content_builder h2::before { width: var(--tcdce-h2-element-size-w-sp); height: var(--tcdce-h2-element-size-h-sp); } #index_content_builder * + h2 { margin-top: var(--tcdce-h2-margin-top-sp); } #index_content_builder h2:has(+ *) { margin-bottom: var(--tcdce-h2-margin-bottom-sp); } } @media (max-width: 600px) { #container h2.custom_h2 { font-size: var(--tcdce-h2-font-size-sp); padding: var(--tcdce-h2-padding-sp); } #container h2.custom_h2::before { width: var(--tcdce-h2-element-size-w-sp); height: var(--tcdce-h2-element-size-h-sp); } #container * + h2.custom_h2 { margin-top: var(--tcdce-h2-margin-top-sp); } #container h2.custom_h2:has(+ *) { margin-bottom: var(--tcdce-h2-margin-bottom-sp); } } /* ---------------------------------------------------------------------- TOP フリースペース（TCD コンテンツビルダー → フリースペースの HTML） 例:

…

＋中央寄せ

＋ q_custom_button .headline_area h2（カルーセル等）も同じ見た目 ※ 上の #index_content_builder h2（TCD 変数）より詳細度で上書き ---------------------------------------------------------------------- */ #index_content_builder h2.styled_h2, #index_content_builder .headline_area h2 { background: none !important; border: none !important; border-image: none !important; padding: 0em 1rem 0em !important; margin-left: auto; margin-right: auto; margin-top: 0; margin-bottom: 1.25em !important; max-width: 100%; width: 100%; box-sizing: border-box; font-size: clamp(1.35rem, 3.5vw, 2rem); font-weight: 700; line-height: 1.5; letter-spacing: 0.04em; color: #1a1a1a; text-align: center !important; font-family: inherit; position: relative; } #index_content_builder h2.styled_h2::before, #index_content_builder .headline_area h2::before { content: none !important; display: none !important; width: 0 !important; height: 0 !important; background: none !important; } #index_content_builder h2.styled_h2 + p, #index_content_builder h2.styled_h2 ~ p { text-align: center; margin-left: auto; margin-right: auto; margin-top: 0; margin-bottom: 3em; max-width: 100%; line-height: 1.95; color: #454545; font-size: clamp(0.9rem, 2.1vw, 1.02rem); } #index_content_builder h2.styled_h2 ~ p:last-of-type { margin-bottom: 0; } #index_content_builder h2.styled_h2 ~ p:has(.q_custom_button) { margin-top: 1.35rem; margin-bottom: 0; text-align: center; } /* styled_h2 付きフリースペース：ボタン行を中央（Quicktags の p + a と同型） */ #index_content_builder .cb_free_space:has(h2.styled_h2) p:has(.q_custom_button) { text-align: center; } /* フリースペース内の CTA（白地＋#176092 枠・角なし 240×60） */ #index_content_builder h2.styled_h2 ~ p a.q_custom_button, #index_content_builder .cb_free_space:has(h2.styled_h2) a.q_custom_button { box-sizing: border-box; display: inline-flex !important; align-items: center; justify-content: center; width: min(100%, 240px) !important; max-width: 240px !important; height: 60px !important; min-height: 0 !important; padding: 0 1.25em !important; border: 1px solid rgba(23, 96, 146, 1) !important; border-radius: 0; background: #ffffff; color: #176092 !important; font-size: 18px; font-weight: 600; letter-spacing: 0.06em; text-decoration: none; position: relative; z-index: 2; overflow: hidden; transition: background 0.2s ease, border-color 0.2s ease; border-radius: 5px; } .q_custom_button1 { border-radius: 5px; } #index_content_builder h2.styled_h2 ~ p a.q_custom_button:hover, #index_content_builder h2.styled_h2 ~ p a.q_custom_button:focus-visible, #index_content_builder .cb_free_space:has(h2.styled_h2) a.q_custom_button:hover, #index_content_builder .cb_free_space:has(h2.styled_h2) a.q_custom_button:focus-visible { background: rgba(23, 96, 146, 1); border-color: rgba(23, 96, 146, 1) !important; color: #fff !important; } #index_content_builder h2.styled_h2 ~ p a.q_custom_button .label, #index_content_builder .cb_free_space:has(h2.styled_h2) a.q_custom_button .label { display: inline !important; font-weight: 600; } @container tcdce (max-width: 600px) { #index_content_builder h2.styled_h2, #index_content_builder .headline_area h2 { font-size: clamp(1.15rem, 5vw, 1.55rem); max-width: none; padding-inline: 0.5rem !important; margin-bottom: 24px !important; } #index_content_builder h2.styled_h2 + p, #index_content_builder h2.styled_h2 ~ p { padding-inline: 0.25rem; } #index_content_builder .post_row > .post_col.post_col-2:last-child h2.styled_h2 { padding-inline: 0 !important; } } /* ---------------------------------------------------------------------- TOP：2カラム .post_row + .post_col-2（フリースペースの Staff Interview 等） 親テーマ Quicktags の margin/float を整え、右カラムは左揃え ---------------------------------------------------------------------- */ #index_content_builder .post_row { display: flex; flex-wrap: wrap; align-items: flex-start; gap: clamp(28px, 5vw, 64px); max-width: 1180px; margin-left: auto; margin-right: auto; padding: clamp(20px, 4vw, 56px) clamp(12px, 3vw, 24px); line-height: 1.75; box-sizing: border-box; } #index_content_builder .post_row > .post_col.post_col-2 { float: none; flex: 1 1 calc(50% - clamp(14px, 2.5vw, 32px)); min-width: 0; margin: 0 !important; margin-bottom: 0 !important; padding: 0; width: auto; box-sizing: border-box; } #index_content_builder .post_row > .post_col.post_col-2:first-child { flex: 0 1 46%; max-width: 560px; } #index_content_builder .post_row > .post_col.post_col-2:last-child { flex: 1 1 min(0, 46%); } #index_content_builder .post_row > .post_col.post_col-2:first-child img { display: block; width: 100%; height: auto; box-shadow: 0 18px 48px rgba(15, 23, 42, 0.1); vertical-align: bottom; } /* 右カラム：左揃え（styled_h2 / 後続 p は上のセンター指定より詳細度で上書き） */ #index_content_builder .post_row > .post_col.post_col-2:last-child h2.styled_h2, #index_content_builder .post_row > .post_col.post_col-2:last-child .headline_area h2 { text-align: left !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; max-width: none; width: 100%; } #index_content_builder .post_row > .post_col.post_col-2:last-child h2.styled_h2 + p, #index_content_builder .post_row > .post_col.post_col-2:last-child h2.styled_h2 ~ p { text-align: left !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 40em; padding-inline: 0 !important; } #index_content_builder .post_row > .post_col.post_col-2:last-child .q_button_wrap { text-align: left; margin: 1.5rem 0 0; } #index_content_builder .post_row a.q_custom_button { width: min(100%, 260px) !important; height: 54px !important; min-height: 48px; padding: 0 26px !important; border: 2px solid #1e73be !important; border-radius: 999px; background: #1e73be; color: #fff !important; font-size: 15px; font-weight: 600; letter-spacing: 0.05em; text-decoration: none; transition: background 0.2s ease, border-color 0.2s ease; } #index_content_builder .post_row a.q_custom_button:hover, #index_content_builder .post_row a.q_custom_button:focus-visible { background: #185f9e; border-color: #185f9e !important; color: #fff !important; } #index_content_builder .post_row a.q_custom_button .label { display: inline !important; font-weight: 600; } @media screen and (max-width: 900px) { #index_content_builder .post_row { flex-direction: column; align-items: stretch; gap: 28px; padding-top: 16px; padding-bottom: 40px; } #index_content_builder .post_row > .post_col.post_col-2, #index_content_builder .post_row > .post_col.post_col-2:first-child, #index_content_builder .post_row > .post_col.post_col-2:last-child { flex: 1 1 100%; max-width: none; } /* Staff Interview テキスト列：スマホは中央揃え */ #index_content_builder .post_row > .post_col.post_col-2:last-child p.h2_deco, #index_content_builder .post_row > .post_col.post_col-2:last-child .headline_area p.h2_deco { text-align: center !important; margin-left: auto !important; margin-right: auto !important; } #index_content_builder .post_row > .post_col.post_col-2:last-child h2.styled_h2, #index_content_builder .post_row > .post_col.post_col-2:last-child .headline_area h2 { font-size: 24px !important; text-align: center !important; margin-left: auto !important; margin-right: auto !important; margin-bottom: 24px !important; } #index_content_builder .post_row > .post_col.post_col-2:last-child h2.styled_h2 + p, #index_content_builder .post_row > .post_col.post_col-2:last-child h2.styled_h2 ~ p { text-align: center !important; margin-left: auto !important; margin-right: auto !important; max-width: 36em; } #index_content_builder .post_row > .post_col.post_col-2:last-child .q_button_wrap { text-align: center; } } /*ボタンのフォントウェイト変更*/ .q_custom_button span{ font-weight:600; } /*投稿ページタイトル調整*/ #post_title { margin-bottom: 30px; } /*投稿ページのタグ*/ .tag_zone { margin: 10px 0 0 0; } .single_tags { display:inline-block; margin: 0 10px 6px 0; padding: 0; font-size: 14px; line-height:2; } .single_tags a { display: block; background: #eee; padding: 4px 20px; border-radius: 5px; } @media screen and (max-width:750px) { .single_tags a { padding: 2px 10px; } } .single_tags a:hover{ background: #ddd; color: #000; } /*スマホ表示で出てしまうtopのスライダーの不要項目*/ #header_slider .date, #header_slider .update, #header_slider .author { display: none !important; }