@charset "utf-8"; /* Theme Name: isyadoko-cms-C Theme URI: https://koike-ladies-clinic.com/ Author: トスメディカル株式会社 Description: NEW医者どこCMS専用の子テーマ。Twenty Twenty-Five ベース。 Template: twentytwentyfive Version: 1.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: koike-ladies-clinic.com */ /* ============================= theme.json管理すべきスタイル ============================= */ :root { --color_base: #333; --color_second: #83bffc; --color_second_dark: #7bafe4; --color_primary: #6372ce; --color_primary_light: #899cd7; --color_primary_hover:#4356cb; --font_main: "Noto Serif JP", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Yu Mincho", YuMincho, "MS PMincho", serif; --content-width: 1000px; --outer-width: 1200px; --padding-width: 5.4%; --custom-transition: 0.2s ease-in-out 0s; --color_white: #fff; --color_blue: #282ec9; --color_gray:#999; --color_orange: #fc9400; --color_back_gray:#f9f9f9; } @media screen and (max-width: 768px) { :root { --content-width: 96%; --outer-width: 100%; } } /* に出力する contain-intrinsic-size を書き換えるコード 　　変化なし（一旦保留　2025/07/10) */ img.lazyload:is([sizes="auto" i], [sizes^="auto," i]) { contain-intrinsic-size: 800px 600px!important; } .has-small-font-size { font-size: clamp(14px, 1.1111vw, 16px); } .has-medium-font-size { font-size: clamp(16px, 1.3889vw, 20px); } .has-large-font-size { font-size: clamp(28px, 2.5vw, 32px); } @media screen and (min-width: 769px) { .has-xl-font-size { font-size: clamp(18px, 1.6667vw, 21px) !important; } } .has-text-color {color: var(--color_base);} .has-link-color {color: var(--color_primary);} .has-gray-color {color: var(--color_base);} .alignwide { max-width: 1200px; margin-left: auto!important; margin-right: auto!important; max-width: 90%; text-align: center; } @media screen and (max-width: 768px) { .alignwide { width: 96%; } } .alignfull { width: 100%; margin-left: 0; margin-right: 0; } /* ============================= 基本スタイル ============================= */ body { color: var(--color_base)!important; font-family: var(--font_main); line-height: 1.6; letter-spacing: 0.1em; } html{ font-size: 16px; } a { color: var(--color_primary); transition: var(--custom-transition); } .wp-block-navigation__container { display: flex; justify-content: center; align-items: center; flex-direction: row; } /* ============================= 投稿ページ・固定ページ　スタイル ================================ */ .custom-entry-content { min-height: 500px; margin: 1.5rem 0; max-width: var(--content-width); text-align: left; } @media screen and (min-width: 1440px) { .custom-entry-content { margin: 3.5rem 0; } } /* テキスト ------------------- */ .custom-entry-content h1, .custom-entry-content h2, .custom-entry-content h3, .custom-entry-content h4, .custom-entry-content h5, .custom-entry-content h6 { font-weight: 500; line-height: 1.4; margin-top: 1.5em; margin-bottom: 0.4em; text-align: left; } .custom-entry-content h1 { font-size: clamp(1.75rem, 2.6vw, 2.125rem); } .custom-entry-content h2 { font-size: clamp(1.4rem, 2.2vw, 1.7rem); } .custom-entry-content h3 { font-size: clamp(1.375rem, 2vw, 1.65rem); } .custom-entry-content h4 { font-size: clamp(1.25rem, 1.8vw, 1.5rem); } .custom-entry-content h5 { font-size: clamp(1.2rem, 1.8vw, 1.4rem); } .custom-entry-content h6 { font-size: clamp(1.1rem, 1.5vw, 1.25rem); } .custom-entry-content p { font-size: clamp(0.9rem, 1.1vw, 1.1rem); line-height: 1.6; margin-top: 0.3em; margin-bottom: 1em; text-align: left; } .custom-entry-content ol, .custom-entry-content ul{ padding-left: 1.7rem; margin-top: 0.5rem; margin-bottom: 0.5rem; text-align: left; } .custom-entry-content ul { list-style: disc; } .custom-entry-content ol{ list-style: decimal; } .custom-entry-content li { font-size: clamp(0.9rem, 1.1vw, 1.1rem); margin-bottom: 0.37em; margin-top: 0.37em; } .custom-entry-content ol li::marker, .custom-entry-content ul li::marker { color: var(--color_primary); font-weight: 700; } .custom-entry-content dl{ margin-top: 1.8rem; margin-bottom: 1.8rem; text-align: left; } .custom-entry-content dt { margin-top: 1.1rem; font-size: clamp(1.1rem, 1.5vw, 1.2rem); margin-bottom: 0.3rem; line-height:1.4; font-weight: 600; } .custom-entry-content dd { margin-top: 0; margin-bottom: 1.2rem; line-height:1.4; font-size: clamp(0.9rem, 1.1vw, 1.1rem); } /* リンク ------------------- */ .custom-entry-content a { color: var(--color_primary); font-weight: 600; text-decoration:underline; } .custom-entry-content a:hover, .custom-entry-content a:active { color: var(--color_second_dark); text-decoration: none; } .custom-entry-content a:visited { color: var(--color_primary_hover); text-decoration: none; } /* テキストcolor */ .fc-primary {color: var(--color_primary)!important;} .fc-second_dark {color: var(--color_second_dark)!important;} .fc-white {color: var(--color_white)!important;} /* 固定ページ ページ分割されている場合のナビゲーション */ .custom-page-links { } /* アクセサリー */ .custom-entry-header, .custom-entry-meta { max-width: var(--content-width); margin: 0.5rem auto; text-align: left; } .custom-entry-category { text-align: left; } .custom-entry-footer { text-align: right; } .custom-custom-tag-links { text-align: right; } /* 画像 ------------------- */ .custom-entry-content img { max-width: 100%; height: auto; margin: 1.5em 0; } /* 表 ------------------- */ .custom-entry-content table.base { width: 100%; margin: 2em 0 0.5em 0; font-size: 0.95rem; border: 1px solid var(--color_gray); border-collapse: collapse; background-color: var(--color_white); } .custom-entry-content table.base th, .custom-entry-content table.base td { padding: 0.75em; text-align: left; border: 1px solid var(--color_gray); vertical-align: middle; } .custom-entry-content table.base th { font-weight: 600; background-color: var(--color_back_gray); } .custom-entry-content table.base td.custom-on { color: var(--color_second); } /* 2列のテーブルで、左側に幅が狭いTHの場合 */ .custom-entry-content table.base2 { width: 100%; margin: 2em 0 0.5em 0; font-size: 0.95rem; border: 1px solid var(--color_gray); border-collapse: collapse; background-color: var(--color_white); } .custom-entry-content table.base2 th, .custom-entry-content table.base2 td { padding: 0.75em; text-align: left; border: 1px solid var(--color_gray); vertical-align: middle; } .custom-entry-content table.base2 th { font-weight: 600; background-color: var(--color_back_gray); width: 120px; } .custom-entry-content table.base2 td.custom-on { color: var(--color_second); } /* 引用 ------------------- */ .custom-entry-content blockquote { margin: 1.5em 0; padding: 1em 1.5em; background-color: #f9f9f9; border-left: 5px solid var(--color_base); font-style: italic; } /* 水平線 ------------------- */ .custom-entry-content hr { border: none; border-top: 1px solid var(--color_primary_light); margin: 2em 0; } .custom-entry-content hr.dot { border: none; border-top: 1px dotted var(--color_gray); margin: 2em 0; } /* コード ------------------- */ .custom-entry-content pre { background-color: #f5f5f5; padding: 1em; overflow-x: auto; } .custom-entry-content code { font-family: monospace; background-color: #eef; padding: 0.2em 0.4em; border-radius: 3px; } /* 強調 ------------------- */ .custom-entry-content strong { font-weight: 600; } .custom-entry-content em { font-style: italic; } /* その他 ------------------- */ .custom-entry-content figure { margin: 1.5em 0; text-align: center; } .custom-entry-content figcaption { font-size: 0.875rem; color: #666; margin-top: 0.5em; } /* ブロックエディタ対応 ------------------- */ .wp-block-image img { height: auto; } .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background-color: #f9f9f9; } /* ============================= ボタン ============================= */ .custom-btn { display: inline-block; padding: 0.6rem 2rem; border-radius: 1.4rem; border: 2px solid transparent; font-size: 1rem; line-height: 1.5; text-align: center; text-decoration: none; font-weight: 500; cursor: pointer; transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease; } .custom-btn:hover { opacity: 0.85; color: var(--color_white); } /* ============================= フォームスタイル ============================= */ /* 入力欄・テキストエリア・セレクトのみを対象に */ input[type="text"], input[type="email"], input[type="url"], input[type="tel"], input[type="number"], input[type="search"], input[type="password"], textarea, select { font-size: 1rem; border: 1px solid var(--color_base); border-radius: 4px; background-color: var(--color_white); color: var(--color_base); width: 100%; max-width: 100%; box-sizing: border-box; margin-bottom: 1em; appearance: none; margin: 0; padding: 0; } /* フォーカス時の共通スタイル */ input:focus, textarea:focus, select:focus { outline: none; border-color: var(--color_primary_light); box-shadow: 0 0 0 2px rgba(0, 115, 170, 0.2); } /* ============================= チェックボックスとラジオボタン ============================= */ /* ラベルと並べるときに余白調整 */ input[type="checkbox"], input[type="radio"] { width: auto; margin-right: 0.5em; vertical-align: middle; } /* ============================= セレクトボックス ============================= */ select { background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='30,50 70,90 110,50' stroke='%23555' stroke-width='14' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.8em center; background-size: 1em; padding-right: 2.5em; } /* ============================= テキストエリア ============================= */ textarea { min-height: 8em; resize: vertical; } /* ============================= 検索フォーム ============================= */ form.search-form { display: flex; align-items: stretch; /* ← 高さを揃える */ width: 100%; max-width: 300px; margin: 1rem auto; background-color: var(--color_white); border-radius: 4px; overflow: hidden; box-shadow: 0 0 4px rgba(0, 0, 0, 0.08); } /* 入力フィールド */ form.search-form label { flex: 1; display: flex; /* ← 追加 */ align-items: center; /* ← 縦中央に揃える */ border: none; outline: none; margin: 0; padding:0; } form.search-form input.search-field { border: none; margin: 0; padding: 0.4rem 0.6rem; font-size: 1rem; outline: none; width: 100%; line-height: 1; } /* 送信ボタン テキスト（検索） form.search-form input.search-submit { background-color: #2a2a2a; color: #fff; padding: 0.6rem 0.6rem; border: none; font-size: 1rem; cursor: pointer; transition: background-color 0.3s ease; }*/ form.search-form .search-submit { border: 1px solid var(--color_primary); margin: 0; padding: 0.6rem 1rem; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background-color 0.3s ease; height: 100%; background-color: var(--color_primary); } /* ボタンホバー テキスト（検索） form.search-form input.search-submit:hover { background-color: #444; }*/ form.search-form .search-submit:hover { background-color: var(--color_primary_hover); } /* 虫眼鏡アイコン */ form.search-form .search-submit svg { display: block; width: 1.2rem; height: 1.2rem; fill: var(--color_white); } /* テキスト：検索を非表示に */ form.search-form .screen-reader-text { display: none; } /* ============================= フレックス基本レイアウト 　　・２つのボックスを並列 　　・高さを揃える　 ============================= */ /*
画像や見出しなど
説明テキストが入ります。長文でも高さは揃います。
*/ .custom-flex { display: flex; gap: 20px; align-items: stretch; /* 高さ揃え */ } /* よく使うオプション（ 上記の外枠のdivに指定　*/ .custom-flex--center { align-items: center; } /* 垂直中央 */ .custom-flex--between { justify-content: space-between; } .custom-flex--wrap { flex-wrap: wrap; } /* はみ出し防止に */ /* 均等に分配 */ .custom-flex__equal { flex: 1; /* 均等に分配 */ min-width: 0; /* はみ出し防止 */ } /* 比率（例：4:5） */ .custom-flex__4 { flex: 4 1 0; min-width: 0; } .custom-flex__5 { flex: 5 1 0; min-width: 0; } /* 比率（例：3:2） */ .custom-flex__3 { flex: 3 1 0; min-width: 0; } .custom-flex__2 { flex: 2 1 0; min-width: 0; } /* 比率（例：3:1） */ .custom-flex__3 { flex: 3 1 0; min-width: 0; } .custom-flex__1 { flex: 1 1 0; min-width: 0;} .custom-flex__1 img { display: block; /* inline要素特有の余白を消す */ margin-top: 0; /* 念のため明示 */ vertical-align: top; /* 上端に揃える */ } @media (max-width: 768px) { .custom-flex { flex-direction: column; } } /* 記事中での画像ははみ出し防止 */ .custom-flex img { max-width: 100%; height: auto; display: block; margin: auto;} /* スマホサイズ以下では縦並び */ @media (max-width: 768px) { .flex-container { flex-direction: column; } .custom-flex img { max-width: 60%;} } /*--------------------------------------- スマフォでテーブルを横にスライド可能にする　 ※テーブルタグを囲む　 ------------------------------------------*/ @media (max-width: 768px) { .table-responsive { overflow-x: scroll; padding: 0; margin: 0; } .table-responsive table { width: 100%; padding: 0; margin: 0; min-width: 600px; } .table-responsive table th, .table-responsive table td { border: 2px solid var(--color-gray-light); min-width: 160px!important; } } /*--------------------------------------- スマフォのテーブル表示 　thとtdを縦並びにする ------------------------------------------*/ @media all and (max-width: 767px) { table.res { margin:0 auto; width: 98%; border-width:0; border-top-width:1px; } table.res thead { display: none; } table.res tr { width: 100%; border-width:0; display: block; } table.res td, table.res th { width: 100%; display: block; border-top:none; } } /* ========================================================================== Module: テキスト選択ポリシー & タッチナビ保護 Name : Selectability & Touch Nav Guard Ver : 1.0 (2025-08-29) 目的 : 本文は常に選択/コピー可。タッチ端末ではナビ周りの誤選択を防止。 範囲 : 本文(main / .wp-site-blocks / .entry-content / .custom-entry-content) ヘッダーナビ(header .wp-block-navigation …) とその操作UI 注意 : reset.css で body{user-select:none} は禁止。必要箇所だけ .no-select を使用。 -------------------------------------------------------------------------- */ /* 1) 本文は常に選択/コピー可（全テンプレートをカバー） */ :where(main, .wp-site-blocks, .entry-content, .custom-entry-content), :where(main, .wp-site-blocks, .entry-content, .custom-entry-content) * { -webkit-user-select: text !important; -ms-user-select: text !important; user-select: text !important; } /* 2) ハンバーガー等の“操作UI”は常に選択不可（長押しメニューも抑止） */ header .wp-block-navigation__responsive-container-open, header .wp-block-navigation__responsive-container-close, header .wp-block-navigation .menu-toggle, header .hamburger, header .nav-overlay { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; } /* 3) タッチ端末のときだけ、ナビ領域全体を選択不可（誤選択防止） */ @media (hover: none), (pointer: coarse) { header .wp-block-navigation, header .wp-block-navigation * { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; } } /* 4) マウス主体の環境ではナビも選択可（副作用回避の明示） */ @media (hover: hover) and (pointer: fine) { header .wp-block-navigation, header .wp-block-navigation * { -webkit-user-select: auto; user-select: auto; -webkit-touch-callout: default; } } /* 5) 閉じているオーバーレイは本文に干渉させない（素通り） */ header .nav-overlay[hidden], header .nav-overlay[aria-hidden="true"] { pointer-events: none; } /* 6) ユーティリティ（局所的に選択禁止/長押し抑止を付けたい時に使用） */ .no-select { -webkit-user-select: none !important; user-select: none !important; } .no-touch-callout { -webkit-touch-callout: none !important; } /*--------------------------------------- プリント時のみ、フッターにロゴを小さく表示する ------------------------------------------*/ .print-footer-logo { display: none; }