/* --- 1. Reset Base --- */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

* {
    box-sizing: border-box;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
nav,
section,
summary {
    display: block;
}

ol,
ul {
    list-style: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

/* --- 2. Global Styles --- */
html {
    scroll-behavior: smooth;
    overflow-y: scroll;
    -webkit-text-size-adjust: 100%;
}

body {
    color: #141412;
    line-height: 1.6;
    margin: 0;
    font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Meiryo", "Helvetica Neue", Arial, sans-serif;
    transition: opacity 0.8s;
}

/* Links */
a {
    color: #03C;
    text-decoration: none;
}

a:visited {
    color: #03C;
}

a:hover {
    color: #ea9629;
    text-decoration: underline;
}

/* Typography */
h1,
h2,
h3,
h4,
h5,
h6 {
    clear: both;
    line-height: 1.3;
}

h1 {
    font-size: 48px;
    margin: 33px 0;
}

h2 {
    font-size: 30px;
    margin: 25px 0;
}

h3 {
    font-size: 22px;
    margin: 20px 0 10px;
}

h4 {
    font-size: 20px;
    margin: 25px 0;
}

h5 {
    font-size: 18px;
    margin: 30px 0;
}

h6 {
    font-size: 16px;
    margin: 36px 0;
}

p {
    margin: 0 0 24px;
}

b,
strong {
    font-weight: bold;
}

/* Quotes & Code */
blockquote {
    font-size: 18px;
    font-style: italic;
    font-weight: 300;
    margin: 24px 40px;
}

pre {
    background: #f5f5f5;
    color: #666;
    font-family: monospace;
    font-size: 14px;
    margin: 20px 0;
    padding: 20px;
    overflow: auto;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/* Form Elements */
button,
input,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    margin: 0;
    max-width: 100%;
}

button,
input[type="button"],
input[type="submit"] {
    cursor: pointer;
}

/* Tables */
table {
    border-bottom: 1px solid #ededed;
    font-size: 14px;
    line-height: 2;
    margin: 0 0 20px;
    width: 100%;
}

td {
    border-top: 1px solid #ededed;
    padding: 6px 10px 6px 0;
}

th {
    font-weight: bold;
    text-align: left;
    text-transform: uppercase;
}

/* Horizontal Rule */
hr {
    border: 0;
    border-top: 1px dotted #ccc;
    height: 1px;
    margin: 0 0 24px;
}

/* --- Clearing floats (Clearfix) --- */
.clear::after,
.entry-content::after,
.site-footer::after,
.navigation::after,
.clearfix::after {
    content: "";
    display: table;
    clear: both;
}


/* Assistive text */
.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
    position: absolute !important;
    height: 1px;
    width: 1px;
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-weight: bold;
    height: auto;
    line-height: normal;
    padding: 15px 23px 14px;
    position: absolute;
    left: 5px;
    top: 5px;
    text-decoration: none;
    width: auto;
    z-index: 100000;
    /* Above WP toolbar */
}

/* Form fields, general styles first. */
button,
input,
textarea {
    border: 1px solid #9CC;
    font-family: inherit;
    padding: 3px;
}

input,
textarea {
    color: #000;
}

input:focus,
textarea:focus {
    border: 1px solid #9CC;
    background: #FFFFF5;
    outline: 0;
}

/* Buttons */
button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
    font-size: 16px;
    font-family: Arial;
    font-weight: normal;
    border: 1px solid #dcdcdc;
    padding: 9px 18px;
    text-decoration: none;
    background: -moz-linear-gradient(center top, #f9f9f9 5%, #e9e9e9 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9');
    background-color: #f9f9f9;
    color: #000;
    display: inline-block;
    text-shadow: 1px 1px 0px #ffffff;
    box-shadow: inset 1px 1px 0px 0px #ffffff;
}

button:hover,
button:focus,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:focus,
input[type="button"]:focus,
input[type="reset"]:focus {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9');
    background-color: #e9e9e9;
}

button:active,
input[type="submit"]:active,
input[type="button"]:active,
input[type="reset"]:active {
    position: relative;
    top: 1px;
}

.post-password-required input[type="submit"] {
    padding: 7px 24px 4px;
    vertical-align: bottom;
}

.post-password-required input[type="submit"]:active {
    padding: 5px 24px 6px;
}

/* * Responsive images * * Fluid images for posts, comments, and widgets */
.entry-content img,
.entry-summary img,
.comment-content img,
.widget img,
.wp-caption {
    max-width: 100%;
}

/* Make sure images with WordPress-added height and width attributes are scaled correctly. */
.entry-content img,
.entry-summary img,
.comment-content img[height],
img[class*="align"],
img[class*="wp-image-"],
img[class*="attachment-"] {
    height: auto;
}

img.size-full,
img.size-large,
img.wp-post-image {
    height: auto;
    max-width: 100%;
}

/* Make sure videos and embeds fit their containers. */
embed,
iframe,
object,
video {
    max-width: 100%;
}

/* Override the Twitter embed fixed width. */
.entry-content .twitter-tweet-rendered {
    max-width: 100% !important;
}

/* Images */
.alignleft {
    float: left;
}

.alignright {
    float: right;
}

.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

figure.wp-caption.alignleft,
img.alignleft {
    margin: 5px 20px 5px 0;
}

.wp-caption.alignleft {
    margin: 5px 10px 5px 0;
}

figure.wp-caption.alignright,
img.alignright {
    margin: 5px 0 5px 20px;
}

.wp-caption.alignright {
    margin: 5px 0 5px 10px;
}

img.aligncenter {
    margin: 5px auto;
}

img.alignnone {
    margin: 5px 0;
}

.wp-caption .wp-caption-text,
.entry-caption,
.gallery-caption {
    color: #220e10;
    font-size: 18px;
    font-style: italic;
    font-weight: 300;
    margin: 0 0 24px;
}

div.wp-caption.alignright img[class*="wp-image-"] {
    float: right;
}

div.wp-caption.alignright .wp-caption-text {
    padding-left: 10px;
}

img.wp-smiley,
.rsswidget img {
    border: 0;
    border-radius: 0;
    box-shadow: none;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0;
}

.wp-caption.alignleft+ul,
.wp-caption.alignleft+ol {
    list-style-position: inside;
}

/** * 3.0 Basic Structure * ---------------------------------------------------------------------------- */
.site {
    background-color: #fff;
    border-left: 1px solid #f2f2f2;
    border-right: 1px solid #f2f2f2;
    margin: 0 auto;
    max-width: 1600px;
    width: 100%;
}

.site-main {
    position: relative;
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {
    display: inline-table;
}

/** * 4.0 Header * ---------------------------------------------------------------------------- */
/** --- 4.1 Site Header --- */
/** --- 4.1 Site Header (Restored) --- */
.site-header {
    position: sticky;
    top: 0;
    background-color: #fff;
    z-index: 100;
    border-bottom: 1px solid #f0f0f0;
}

/* 親コンテナ：Flexboxを適用 */
.site-header #hset {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 auto;
    max-width: 1080px;
    /* 左右のパディングを少し削ると、さらに端まで寄ります */
    padding: 10px 15px;
    width: 100%;
}

/* 左側：ロゴエリア (#hleft を明示的に指定) */
.site-header #hleft {
    flex: 0 1 auto;
    /* コンテンツ量に応じて伸縮を許可 */
    margin: 0;
}

.site-header .home-link {
    display: block;
    text-decoration: none;
    color: #007550;
}

.site-header .home-link p {
    font-size: 11px;
    color: #096;
    margin: 0 0 2px 0;
}

.site-title {
    margin: 0;
    line-height: 1;
}

/* ロゴ画像：サイズ調整 */
.site-title img {
    display: block;
    max-width: 100%;
    width: 500px;
    height: auto;
}

/* 右側：連絡先エリア (#hright を明示的に指定) */
.site-header #hright {
    flex: 0 0 auto;
    text-align: right;
    /* margin-left は auto にしておくと、左側（ロゴ）を押し返して右端を維持します */
    margin-left: 160px;
}

/* 電話番号のアイコンと数字の並びを微調整 */
.site-header #hright .tel div {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    /* アイコンごと右寄せ */
    gap: 8px;
    /* アイコンと番号の間隔 */
}

.site-header #hright dl {
    color: #666;
    margin: 0;
    padding: 0;
}

.site-header #hright dt {
    font-size: 12px;
    line-height: 1.4;
    font-weight: normal;
}

.site-header #hright .tel {
    font-size: 26px;
    /* 電話番号を強調 */
    font-weight: bold;
    line-height: 1.1;
    color: #096;
    display: block;
}

.site-header #hright .exp {
    display: block;
    font-size: 11px;
    font-weight: normal;
    color: #096;
}

/** * 4.2 Navigation * ---------------------------------------------------------------------------- */
/** --- Main Navigation --- */
.main-navigation {
    margin: 0 auto;
    max-width: 1080px;
    min-height: 45px;
    position: relative;
    /* clear: both; は親でFlexを使っているなら不要ですが、念のため残すか迷う所 */
}

/* メニューのリストコンテナ */
ul.nav-menu,
div.nav-menu>ul {
    margin: 0;
    padding: 0;
    display: flex;
    /* 横並びをFlexboxで制御 */
    justify-content: center;
}

.nav-menu li {
    position: relative;
    list-style: none;
    flex: 1;
    /* 均等に横幅を割り振る */
}

.nav-menu li a {
    color: #fff;
    display: block;
    font-size: 15px;
    line-height: 1;
    padding: 15px 10px;
    text-decoration: none;
    text-align: center;
    /* 画像を廃止し、CSSのボーダーで区切り線を表現（軽量化） */
    border-left: 1px solid rgba(255, 255, 255, 0.3);
}

/* 最初の項目の左線は消す */
.nav-menu li:first-child a {
    border-left: none;
}

.nav-menu li:hover>a,
.nav-menu li a:hover {
    color: #ffffcc;
    background-color: rgba(255, 255, 255, 0.1);
    /* ホバー時の視認性向上 */
}

/* サブメニュー（ドロップダウン） */
.nav-menu .sub-menu,
.nav-menu .children {
    background-color: #009966;
    position: absolute;
    z-index: 99999;
    opacity: 0;
    /* 最初は透明に */
    visibility: hidden;
    /* 存在を隠す（clipより軽量） */
    transition: opacity 0.2s ease;
    width: 200px;
    /* サブメニューの幅を固定 */
    top: 100%;
    /* 親メニューの真下に配置 */
    left: 0;
    padding: 0;
}

/* 親メニューホバーでサブメニューを表示 */
.nav-menu li:hover>ul,
.nav-menu li.focus>ul {
    opacity: 0.95;
    visibility: visible;
}

.nav-menu .sub-menu a {
    border-left: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    text-align: left;
    padding: 12px 15px;
}

.nav-menu .sub-menu a:hover {
    background-color: #006633;
}

/* 現在のページ */
.nav-menu .current_page_item>a,
.nav-menu .current-menu-item>a {
    font-weight: bold;
    background-color: rgba(0, 0, 0, 0.1);
}

/* モバイル用非表示設定 */
.menu-toggle,
.smt {
    display: none;
}

/** --- 5.0 Content / Navbar --- */

/* 検索フォーム：フォーカス時に伸びるアニメーションを維持しつつ整理 */
.site-header .search-form {
    position: absolute;
    right: 20px;
    top: 5px;
}

.site-header .search-field {
    background: transparent url(images/search-icon.png) no-repeat 5px center / 20px 20px;
    border: none;
    cursor: pointer;
    height: 37px;
    padding: 0 0 0 30px;
    transition: width 400ms ease, background 400ms ease;
    width: 0;
    /* 最初はアイコンのみに見える状態 */
}

.site-header .search-field:focus {
    background-color: #fff;
    border: 1px solid #ccc;
    cursor: text;
    outline: 0;
    width: 200px;
    /* 適切な幅に調整 */
}

/* Page Top (Go to top) */
.pagetop a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #009966;
    border: 1px solid #fff;
    color: #fff;
    text-decoration: none;
    position: fixed;
    right: 20px;
    bottom: 40px;
    z-index: 100;
    transition: 0.3s;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.pagetop a:hover {
    background: #007550;
    opacity: 0.9;
    transform: translateY(-3px);
    /* 少し浮く演出 */
}

/* Content Area */
.hentry {
    padding: 20px 0 40px;
}

.entry-header,
.entry-content,
.entry-summary,
.entry-meta {
    margin: 0 auto;
    max-width: 1080px;
    /* 全体の最大幅を統一 */
    width: 100%;
}

/* サイドバーがある時の余白設定（※実情に合わせて調整が必要です） */
/* 376pxもの巨大な右パディングを、現実的な数値（サイドバーの幅+α）に修正 */
.sidebar .entry-header,
.sidebar .entry-content,
.sidebar .entry-summary,
.sidebar .entry-meta {
    padding: 0 20px;
    /* 一旦リセット。実際のサイドバー配置はFloatやFlexで制御が理想 */
}

/** --- 5.1 Entry Header --- */
.entry-header {
    margin-bottom: 30px;
}

.entry-title {
    font-weight: bold;
    margin: 0 0 10px;
    padding: 8px 0;
    border-top: #009966 2px solid;
    border-bottom: #009966 1px solid;
}

h1.entry-title {
    font-size: 26px;
    /* 少しだけコンパクトに */
    color: #159867;
    line-height: 1.5;
    margin: 10px 0;
}

.entry-title a {
    color: #159867;
    text-decoration: none;
}

.entry-title a:hover {
    color: #ea9629;
}

.entry-thumbnail img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto 15px;
}


/* 1. 親の箱を物理的に無視して、背景を画面の端から端まで広げる */
#houyugroup {
    background: #f7f5f2 !important;
    background-color: #f7f5f2 !important;
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    padding: 60px 0 !important;
    display: block !important;
    clear: both !important;
    overflow: hidden !important;
}

/* 2. テーマの「白い箱」と「影」を完全に殺す（透過処理） */
#houyugroup .entry-content,
#houyugroup .post-content {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
    width: 100% !important;
    float: none !important;
}

/* 3. リスト全体のズレを防止 */
#houyugroup ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 1100px !important;
    display: block !important;
    overflow: hidden !important;
}

/* 4. PC：3列横並びを完全に固定 */
@media screen and (min-width: 769px) {
    #houyugroup li {
        float: left !important;
        width: 31% !important;
        margin: 0 1% 25px !important;
        padding: 15px 10px 15px 85px !important;
        min-height: 85px !important;
        background-repeat: no-repeat !important;
        background-position: left center !important;
        background-size: 70px auto !important;
        box-sizing: border-box !important;
        display: block !important;
    }
}

/* 5. 画像パス：絶対URLで固定（表示を死守） */
#houyugroup li {
    background-position:left 7px !important;
    background-repeat: no-repeat; /* 繰り返しを防ぐ場合 */
    background-size: cover;      /* 必要に応じて調整してください */
}
#houyugroup li.ebara {
    background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_ebara.png) !important;
}

#houyugroup li.asuka {
    background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_asukav2.png) !important;
}

#houyugroup li.nousinkei {
    background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_sinkei.png) !important;
}

#houyugroup li.kanwa {
    background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_kanwa.png) !important;
}

#houyugroup li.gastro {
    background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_gastro.png) !important;
}

#houyugroup li.hihu {
    background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_noimage.png) !important;
}

#houyugroup li.yuketu {
    background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/ryouhou_yuketu.png) !important;
}

#houyugroup li.sangen {
    background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_sangen.png) !important;
}

#houyugroup li.hotto {
    background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_hotto.png) !important;
}



/** --- 5.2 Entry Meta (No Icons / Extra Lightweight) --- */
.entry-meta {
    clear: both;
    font-size: 13px;
    color: #666;
    margin: 10px 0;
    line-height: 1.6;
}

.entry-meta a {
    color: #039;
    text-decoration: none;
    transition: color 0.2s;
}

.entry-meta a:hover {
    color: #ea9629;
    text-decoration: underline;
}

/* 各情報の塊（日付、カテゴリー等）の間隔 */
.entry-meta>span {
    display: inline-block;
    margin-right: 15px;
}

/* 最後の項目は右余白なし */
.entry-meta>span:last-child {
    margin-right: 0;
}

/* カテゴリーやタグが複数ある場合のリンク間の調整 */
.categories-links a,
.tags-links a {
    margin-right: 5px;
}

/* 管理者用の編集リンクを目立たせる */
.edit-link a {
    color: #c00;
    font-weight: bold;
    border: 1px solid #c00;
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 11px;
}

.edit-link a:hover {
    background-color: #c00;
    color: #fff;
}

/* 特定の条件下での非表示設定 */
.single-author .entry-meta .author,
.sticky.format-standard .entry-meta .date {
    display: none;
}

/** --- 5.3 Entry Content --- */
.entry-content {
    word-wrap: break-word;
    line-height: 1.8;
    /* 文章の読みやすさを向上 */
}

/* 見出し：h2（下線あり） / h3（シンプル） */
.entry-content h2 {
    margin: 30px 0 20px;
    padding: 8px 0;
    font-size: 22px;
    border-bottom: 2px solid #009966;
    color: #007550;
}

.entry-content h3 {
    margin: 25px 0 15px;
    font-size: 19px;
    color: #007550;
    border-left: 4px solid #009966;
    /* ワンポイント追加で読みやすく */
    padding-left: 10px;
}

/* リスト・定義リスト */
.entry-content dl {
    margin: 0 0 20px;
}

/* 特殊な定義リスト（shotiクラス） */
.entry-content dl.shoti {
    background: #EBFFDE;
    border: 1px solid #ccc;
    padding: 15px;
    margin-bottom: 20px;
}

.entry-content dl.shoti dt,
.entry-content dl.shoti ul {
    margin: 5px 0;
    line-height: 1.5;
    display: block;
}

/* リンク色：共通設定を継承しつつシンプルに */
.entry-content a {
    color: #039;
    text-decoration: underline;
}

.entry-content a:hover {
    color: #ea9629;
}

/* 引用ブロック */
.entry-content blockquote {
    font-size: 18px;
    /* 24pxは大きすぎるので調整 */
    border-left: 4px solid #ccc;
    padding: 10px 20px;
    color: #666;
    margin: 20px 40px;
}

/* 画像の配置設定 */
.entry-content .alignleft {
    margin: 0 20px 20px 0;
}

.entry-content .alignright {
    margin: 0 0 20px 20px;
}

.entry-content .aligncenter {
    display: block;
    margin: 0 auto 20px;
}

/* ページリンク（記事が分割された時用） */
.page-links {
    clear: both;
    margin: 20px 0;
}

.page-links a,
.page-links>span {
    display: inline-block;
    padding: 5px 12px;
    margin: 0 2px;
    border: 1px solid #009966;
    text-decoration: none;
    font-size: 14px;
}

.page-links a {
    background: #009966;
    color: #fff;
}

.page-links a:hover {
    background: #fff;
    color: #009966;
}

/* フッターメタ情報の余白 */
footer.entry-meta {
    margin-top: 30px;
}

/** --- 5.4 Galleries (Optimized with Flexbox) --- */
.gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    /* 画像同士の隙間を簡単に設定 */
    margin-bottom: 20px;
}

.gallery-item {
    flex: 1 1 auto;
    /* 自動で適切な幅に調整 */
    overflow: hidden;
    position: relative;
    text-align: center;
}

/* カラム数に応じた幅の制御（よく使う範囲に限定） */
.gallery-columns-2 .gallery-item {
    width: calc(50% - 10px);
}

.gallery-columns-3 .gallery-item {
    width: calc(33.33% - 10px);
}

.gallery-columns-4 .gallery-item {
    width: calc(25% - 10px);
}

/* 画像自体のサイズ調整 */
.gallery-item img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
}

/* ギャラリーのキャプション（ホバーで表示） */
.gallery-caption {
    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
    font-size: 12px;
    line-height: 1.3;
    padding: 8px;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
    /* キャプションがリンククリックを邪魔しないように */
}

.gallery-item:hover .gallery-caption {
    opacity: 1;
}

/* スマホではキャプションを最初から出す、または非表示にする等の調整がしやすい */
@media (max-width: 600px) {
    .gallery-item {
        width: calc(50% - 10px) !important;
    }

    /* スマホは一律2列など */
}

/** --- 5.5 Post Formats (Minimal Standard) --- */

/* 1. 標準的な動画・音声プレーヤーの余白設定（これだけ残せばOK） */
.format-standard .wp-video,
.format-standard .wp-audio-shortcode,
.wp-audio-shortcode {
    margin: 20px 0 24px;
    max-width: 100% !important;
}

/* 2. 引用（Quote）の基本デザイン */
/* どんな投稿フォーマットでも「引用ブロック」を使った時に適用されるスタイル */
blockquote {
    font-style: italic;
    font-weight: 300;
    padding-left: 20px;
    border-left: 4px solid #009966;
    margin: 20px 0;
    color: #666;
}

/** --- 5.6 Attachments (Optimized) --- */
.attachment .hentry {
    background-color: #fff;
    /* 特殊な背景色を白にしてスッキリさせる */
    margin: 0;
    padding: 0;
}

.attachment .entry-header {
    margin: 0 auto;
    max-width: 1040px;
    padding: 20px;
    text-align: center;
    /* タイトルを中央に */
}

.attachment .entry-title {
    font-size: 24px;
    font-weight: bold;
    color: #007550;
    margin-bottom: 10px;
}

/* アイコンフォント(Genericons)関連の疑似要素はすべてカット */

.attachment .entry-meta {
    font-size: 13px;
    color: #666;
    margin-bottom: 20px;
}

.attachment .entry-content {
    padding: 20px 0;
}

/* 画像ナビゲーション（前後の画像へ移動） */
.image-navigation {
    display: flex;
    justify-content: space-between;
    margin: 20px auto;
    max-width: 1040px;
    padding: 0 20px;
}

.image-navigation a {
    text-decoration: none;
    color: #039;
    font-weight: bold;
}

/* 添付ファイル（画像）本体の表示 */
.attachment .entry-attachment {
    margin: 0 auto;
    max-width: 100%;
    text-align: center;
}

.attachment .entry-attachment img {
    height: auto;
    max-width: 100%;
}

.attachment .entry-caption {
    margin-top: 10px;
    font-size: 14px;
    color: #444;
}

/* サイドバーは不要なので非表示を維持 */
.attachment .sidebar-container {
    display: none;
}

/** --- 5.7 Post/Paging Navigation (Modern & Clean) --- */

/* 全体のコンテナ：Flexboxで左右に振り分けます */
.navigation .nav-links {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 30px auto;
    max-width: 1080px;
    width: 100%;
    padding: 0 20px;
    /* 巨大な数値を現実的な余白に修正 */
}

/* リンク自体の共通設定 */
.navigation a {
    color: #009966;
    /* 緑色ベースに変更 */
    text-decoration: none;
    font-size: 18px;
    font-weight: bold;
    transition: 0.2s;
}

.navigation a:hover {
    color: #ea9629;
    /* ホバー時はオレンジに */
}

/* 矢印や丸いアイコン部分の設定 */
.paging-navigation .meta-nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #009966;
    color: #fff;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    font-size: 20px;
    margin: 0 10px;
    font-style: normal;
    /* 斜体解除 */
}

.paging-navigation a:hover .meta-nav {
    background-color: #ea9629;
}

/* 個別の配置設定 */
.nav-previous {
    text-align: left;
}

.nav-next {
    text-align: right;
    margin-left: auto;
    /* 右寄せを確実にする */
}

/* 投稿（個別記事）ナビゲーション */
.post-navigation {
    background-color: #f9f9f9;
    /* 少し背景色をつけてエリアを分かりやすく */
    padding: 30px 0;
    margin-top: 40px;
    border-top: 1px solid #eee;
}

/* 以前あった「376px」のパディング指定は、
   レイアウト崩れの原因になるためすべて削除しました。 */

/** --- 5.8 Author Bio (Clean & Professional) --- */
.author-info {
    margin: 40px auto 0;
    padding: 30px 20px;
    background-color: #f9f9f9;
    /* 著者エリアを少し色付けして際立たせる */
    border-radius: 8px;
    max-width: 1080px;
    width: 100%;
    display: flex;
    /* アバターと説明を横並びに */
    gap: 30px;
}

/* 著者アバター */
.author-avatar .avatar {
    border-radius: 50%;
    /* 写真を丸くして現代的に */
    flex-shrink: 0;
}

/* 著者説明エリア */
.author-description {
    flex: 1;
}

.author-description .author-title {
    font-size: 20px;
    font-weight: bold;
    color: #007550;
    margin: 0 0 10px;
}

/* 斜体(italic)を解除し、標準フォントで読みやすく */
.author-description .author-title span {
    font-style: normal;
}

.author-link {
    color: #009966;
    /* 赤から緑へ変更 */
    text-decoration: none;
    font-weight: bold;
    margin-left: 10px;
}

.author-link:hover {
    text-decoration: underline;
    color: #ea9629;
}

/* スマホ対応：横並びを縦並びにする */
@media (max-width: 600px) {
    .author-info {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .author-avatar .avatar {
        margin: 0 0 20px 0;
    }
}

/** --- 5.9 Archives (Optimized) --- */
.archive-header {
    background-color: #fff;
    color: #009966;
    border-bottom: 1px solid #eee;
    margin-bottom: 30px;
}

.archive-title {
    font-size: 28px;
    font-weight: bold;
    margin: 0 auto;
    max-width: 1080px;
    /* 他のエリアと幅を統一 */
    padding: 30px 20px 10px;
    width: 100%;
}

.archive-meta {
    font-size: 15px;
    color: #666;
    margin: 0 auto;
    max-width: 1080px;
    padding: 0 20px 20px;
    width: 100%;
    line-height: 1.6;
}

/** --- 5.10 Search Results / No posts (Clean Style) --- */

/* ページヘッダー：背景色を白にしてスッキリさせる */
.page-header {
    background-color: #fff;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 20px;
}

/* ページタイトル：斜体を解除し、力強い太字へ */
.page-title {
    font-size: 26px;
    font-weight: bold;
    color: #007550;
    /* ブランドカラーの緑 */
    margin: 0 auto;
    max-width: 1080px;
    padding: 30px 20px;
    width: 100%;
}

/* コンテンツエリア */
.page-content {
    margin: 0 auto;
    max-width: 1080px;
    padding: 40px 20px;
    width: 100%;
    line-height: 1.8;
}

/* 検索結果なしの時のテキストなど */
.no-results .page-content {
    text-align: center;
    /* 「見つかりませんでした」を中央に */
    color: #666;
}

}

/** --- 5.11 404 (Ultra Lightweight) --- */

/* 404ページ全体の背景を白にして清潔感を出す */
.error404 .page-wrapper {
    background-color: #fff;
}

/* タイトルエリア：巨大な数字やアイコンを廃止 */
.error404 .page-header {
    background-color: #fff;
    margin: 0 auto;
    max-width: 1080px;
    padding: 60px 20px;
    text-align: center;
}

.error404 .page-title {
    font-size: 32px;
    font-weight: bold;
    color: #007550;
    /* 鳳優会様のブランドカラー */
    margin: 0;
    line-height: 1.4;
}

/* 「964px」のアイコン指定などはすべて削除しました */

/* コンテンツエリア：検索窓などを中央に配置しやすく */
.error404 .page-content {
    margin: 0 auto;
    max-width: 1080px;
    padding: 20px 20px 80px;
    width: 100%;
    text-align: center;
}

/* 404ページのメッセージ */
.error404 .page-content p {
    font-size: 16px;
    color: #666;
    margin-bottom: 30px;
}




/** --- 5.14 Top Button (Modern Flexbox - Overlap & Tablet Fix) --- */
#shortcutBtn ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0 0 1.5em;
    padding: 0;
    list-style: none;
    border-top: #009966 3px solid;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

#shortcutBtn li {
    flex: 1 1 33.333%;
    /* 基本3列 */
    background: #fff;
    border: 1px solid #f1f1f1;
    box-sizing: border-box;
    transition: background-color 0.2s;
}

#shortcutBtn a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 15px 10px 15px 75px;
    /* PCでの左余白 */
    color: #009966;
    text-decoration: none !important;
    min-height: 90px;
    background-size: 45px auto !important;
    background-position: 15px center !important;
    background-repeat: no-repeat !important;
}

#shortcutBtn a span,
#shortcutBtn a div,
#shortcutBtn a strong {
    display: block;
    width: 100%;
}

#shortcutBtn a span,
#shortcutBtn a div {
    font-size: 11px;
    line-height: 1.3;
    color: #666;
}

#shortcutBtn strong {
    font-size: 17px;
    font-weight: bold;
    line-height: 1.2;
}

/* 各アイコン設定 */
#shortcutBtn .b1 a {
    background-image: url(../images/contents/btnicon-zaitaku.png);
}

#shortcutBtn .b2 a {
    background-image: url(../images/contents/btnicon-area.png);
}

#shortcutBtn .b3 a {
    background-image: url(../images/contents/btnicon-doctor.png);
}

#shortcutBtn .b4 a {
    background-image: url(../images/contents/btnicon-shoti.png);
}

#shortcutBtn .b5 a {
    background-image: url(../images/contents/btnicon-faq.png);
}

#shortcutBtn .b6 a {
    background-image: url(../images/contents/btnicon-tel.png);
}

/** --- レスポンシブ調整 --- **/

/* 1024px以下：アイコンを少し小さくして粘る */
@media (max-width: 1024px) {
    #shortcutBtn a {
        padding-left: 65px;
        background-size: 40px auto !important;
        background-position: 10px center !important;
    }

    #shortcutBtn strong {
        font-size: 15px;
    }
}

/* ★768px付近：ここがポイント。重なる前に「アイコン上・中央揃え」に切り替える */
@media (max-width: 850px) {
    #shortcutBtn a {
        align-items: center;
        text-align: center;
        padding: 60px 5px 15px !important;
        /* 上にアイコン分の余白 */
        background-position: center 12px !important;
        /* アイコンを上中央へ */
    }
}

/* 600px以下：スマホ2列 */
@media (max-width: 600px) {
    #shortcutBtn li {
        flex: 1 1 50%;
    }
}

/** --- 5.15 News list (Balanced Inline & List Version) --- */
#news-list {
    margin: 0 0 30px;
    padding: 0;
    list-style: none;
    border-top: 1px solid #eee;
}

#news-list li {
    font-size: 14px;
    line-height: 1.6;
    padding: 12px 10px;
    border-bottom: 1px solid #eee;
    background: #fff;
    /* ★重要：デフォルトを inline-block にして、中身が詰まれば1行に収まるようにする */
    display: block;
}

/* 認定施設などのテキストとリンクを横に繋げる */
#news-list li a,
#news-list li span,
#news-list li h3 {
    display: inline !important;
    /* 強制改行をすべて解除 */
    vertical-align: baseline;
    margin: 0;
    padding: 0;
}

/* 外部リンクアイコンの調整 */
#news-list img {
    vertical-align: middle;
    margin: 0 2px;
    display: inline !important;
}

/* ニュース記事の日付とカテゴリだけ、少しだけ隙間を作る */
#news-list .ymd {
    color: #888;
    margin-right: 10px;
}

#news-list .catname {
    background: #009966;
    color: #fff;
    padding: 1px 6px;
    font-size: 11px;
    border-radius: 3px;
    margin-right: 10px;
    display: inline-block !important;
    /* ラベルは崩れないよう inline-block */
    line-height: 1.4;
}

/* ニュースタイトルの【 】部分 */
#news-list h3 a {
    font-weight: bold;
    color: #007550;
}

/** --- レスポンシブ --- **/
@media (max-width: 768px) {
    #news-list li {
        padding: 10px 5px;
        font-size: 13px;
    }
}

/*education info*/
 /* リスト全体のコンテナ */
  .shozokulist {
    margin: 20px 0;
    padding: 20px;
    border: 2px solid #eef2f1;
    border-radius: 8px;
    background-color: #ffffff;
  }

  .shozokulist dl {
    margin: 0;
    padding: 0;
  }

  /* 認定タイトル (dt) */
  .shozokulist dt.tit {
    font-size: 18px;
    font-weight: bold;
    color: #007550;
    border-bottom: 2px solid #007550;
    padding-bottom: 8px;
    margin-bottom: 15px;
    display: block;
  }

  /* 説明文とリンク (dd) */
  .shozokulist dd {
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    /* ボタンを横に並べる */
    gap: 8px;
    /* ボタン同士の隙間 */
  }

  /* 教育機関 aタグのデザイン：落ち着きつつ目立つラベル風 */
  .shozokulist dd a {
    display: inline-flex;
    align-items: center;
    text-decoration: none !important;

    /* 背景と文字色：薄い緑背景に濃い緑文字 */
    background-color: #f0f7f5;
    color: #007550 !important;

    /* 枠線：少しだけ濃くして立体感を出す */
    border: 1px solid #cddbd8;
    border-radius: 4px;

    /* サイズ感：13.5pxから15pxに調整し、読みやすさと目立ちを両立 */
    font-size: 15px;
    font-weight: 600;
    padding: 20px;
    line-height: 1.2;
    transition: all 0.2s ease;

    /* 影：ほんの少しだけ浮かせて「押せる感」を出す */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  }

  /* ホバー時：色が反転して「選んでいる」ことを強調 */
  .shozokulist dd a:hover {
    background-color: #007550;
    color: #ffffff !important;
    border-color: #007550;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
    transform: translateY(-1px);
  }

  /* アイコン：ホバー時に白抜きになるように設定 */
  .shozokulist dd a img {
    width: 13px;
    height: 13px;
    margin-right: 8px;
    transition: filter 0.2s ease;
  }

  .shozokulist dd a:hover img {
    filter: brightness(0) invert(1);
  }

  /* スマホ表示では横幅いっぱいにする */
  @media screen and (max-width: 640px) {
    .shozokulist dd a {
      width: 100%;
      justify-content: center;
      font-size: 14px;
    }
  }


/** --- 5.17 Top clinic info (Modern & Robust - Final) --- */
ul.topclinicinfo {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    /* ％指定から固定pxに変更して計算を安定化 */
    padding: 10px 0;
    width: 100%;
    list-style: none;
    margin: 0;
    box-sizing: border-box;
}

.topclinicinfo li {
    flex: 1 1 calc(50% - 10px);
list-style: none;
    /* 2列並び */
    padding: 25px;
    border: 1px #e0e0e0 solid;
    /* 横の線は少し優しく */
    border-top: 4px #009966 solid;
    /* 鳳優会カラーを強調 */
    background-color: #fff;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    margin: 0 !important;
    /* 以前のmarginをリセット */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* 訪問エリア：画像が文字に被らないよう「右配置」に統一 */
.topclinicinfo li.myarea {
    background-image: url(../images/contents/topbanner/map.png);
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
    /* 右端に配置 */
    background-size: 150px auto !important;
    padding-right: 170px !important;
    /* 右側に絶対的なガードを置く */
    padding-left: 25px !important;
    /* 左は通常の余白に */
}

.topclinicinfo dl {
    margin: 0;
}

.topclinicinfo dt {
    color: #007550;
    font-size: 19px;
    font-weight: bold;
    margin-bottom: 0.8em;
    display: flex;
    align-items: center;
}

/* デザインのアクセント：見出し横のドット */
.topclinicinfo dt::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    background-color: #009966;
    margin-right: 10px;
    border-radius: 50%;
}

.topclinicinfo dd {
    font-size: 15px;
    line-height: 1.7;
    margin: 0;
    color: #444;
}


/** --- レスポンシブ：上書きと重複を考慮 --- **/

/* タブレット：1024px?850px付近の重なり対策 */
@media (max-width: 1024px) {
    .topclinicinfo li.myarea {
        background-size: 120px auto !important;
        padding-right: 140px !important;
    }
}



/** --- 5.20 初診flow (Clean & Modern Flow) --- */
.myflow {
    width: 100%;
    background: #fff;
    padding: 0;
    /* 余白は内側の要素で制御 */
    position: relative;
    border: 1px solid #eee;
    /* 線を少し薄くして上品に */
    margin-bottom: 60px;
    /* 矢印のスペースを確保 */
}

.myflow .child1 {
    background: #fff;
    position: relative;
    padding: 20px;
}

/* 矢印部分：borderによる三角形 */
.myflow .child1:after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    /* 47%から50%に変更 */
    transform: translateX(-50%);
    /* 確実に中央配置 */
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 20px 0 20px;
    border-color: #eee transparent transparent transparent;
    /* 親の枠線色と合わせる */
    z-index: 1;
}

.myflow h2 {
    font-size: 20px;
    font-weight: bold;
    color: #009966;
    /* 鳳優会カラー */
    margin: 0 0 15px;
    padding: 0;
    border-bottom: 2px solid #009966;
    display: inline-block;
}

.myflow p {
    font-size: 15px;
    line-height: 1.7;
    margin: 0 0 15px;
    padding: 0;
}

.myflow ul {
    font-size: 15px;
    padding-left: 1.2em;
    /* リストらしい余白 */
    margin: 0;
}

.myflow li {
    padding-bottom: 8px;
    list-style-type: disc;
    /* 標準的なリストマークを表示 */
}

/* 最後の項目の矢印を消す（もし連続して使う場合） */
.myflow:last-of-type {
    margin-bottom: 30px;
}

.myflow:last-of-type .child1:after {
    display: none;
}

/** --- 5.21 鳳優会について (History List) --- */

.history_set {
    display: flex;
    align-items: flex-start;
    padding: 18px 0;
    border-bottom: 1px solid #eee;
    /* 日付と内容の間の隙間を少し詰め、日付側のスペースを最大化 */
    gap: 15px;
}

/* 日付部分：20文字分を確保 */
.history_set p.day {
    flex: 0 0 15em !important;
    /* 20文字分まで広げる */
    width: 15em !important;
    white-space: nowrap !important;
    /* 物理的に1行を強制 */
    overflow: visible !important;
    /* 万が一はみ出しても隠さない */
    margin: 0;
    font-weight: bold;
    color: #555;
    line-height: 1.5;
    font-size: 15px;
    letter-spacing: -0.03em;
    /* わずかに詰めて収まりを極限まで高める */
}

/* 内容部分 */
.history_set p.history {
    flex: 1;
    margin: 0;
    line-height: 1.6;
    color: #333;
    font-size: 15px;
    /* 内容側が日付に押し潰されないように最小幅を設定 */
    min-width: 0;
}

/* --- スマホ表示（768px以下） --- */
@media (max-width: 768px) {
    .history_set {
        flex-direction: column;
        gap: 5px;
    }

    .history_set p.day {
        flex: none !important;
        width: 100% !important;
        white-space: normal !important;
        /* スマホでは自然に改行 */
        font-size: 14px;
        color: #888;
        letter-spacing: normal;
    }
}

/** --- 5.22 クリニック紹介 & 医師紹介 (Modern Layout) --- */
#clinic {
    width: 100%;
    margin-bottom: 40px;
}

#clinic h2 {
    font-size: 18px;
    font-weight: bold;
    color: #009966;
    margin-bottom: 1em;
    border-bottom: 2px solid #009966;
    display: inline-block;
}

#clinic li {
    list-style: none;
    padding: 10px 10px 10px 90px;
    /* アイコン用の余白 */
    margin-bottom: 20px;
    min-height: 80px;
    background-size: 75px auto !important;
    background-position: left center !important;
    background-repeat: no-repeat;
}

/* 各クリニックアイコン（と共通なら統合も可能ですが、個別管理用に維持） */
#clinic li.ebara {
    background-image: url(../images/contents/topbanner/clinic_ebara.png);
}

#clinic li.jhonan {
    background-image: url(../images/contents/topbanner/clinic_jhonan.png);
}

#clinic li.asuka {
    background-image: url(../images/contents/topbanner/clinic_asukav2.png);
}

#clinic li.hinyou {
    background-image: url(../images/contents/topbanner/clinic_hinyou.png);
}

#clinic li.nousinkei {
    background-image: url(../images/contents/topbanner/clinic_sinkei.png);
}

#clinic li.kanwa {
    background-image: url(../images/contents/topbanner/clinic_kanwa.png);
}

#clinic li.sangen {
    background-image: url(../images/contents/topbanner/clinic_sangen.png);
}

#clinic li.kokyu {
    background-image: url(../images/contents/topbanner/clinic_kokyu.png);
}

#clinic li.riumati {
    background-image: url(../images/contents/topbanner/clinic_riumati.png);
}

#clinic li.gastro {
    background-image: url(../images/contents/topbanner/clinic_gastro.png);
}

#clinic li.hihu {
    background-image: url(../images/contents/topbanner/clinic_noimage.png);
}

#clinic li.hotto {
    background-image: url(../images/contents/topbanner/clinic_hotto.png);
}

/** --- 医師紹介エリア (Dr. Profile Layout) --- */
.drinfo {
    display: flex;
    flex-wrap: wrap;
gap: 0 30px; /* 上下を0、左右を30pxに指定 */
    margin-bottom: 3em;
}


.drinfo dt.tit {
    width: 100%;
    color: #007550;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 0.5em;
    border-bottom: 1px solid #eee;
    padding-bottom: 5px;
}

/* 写真部分 */
.drinfo dd.photo {
    flex: 0 0 200px;
    /* 写真の幅を固定 */
    margin: 0;
}

.drinfo dd.photo img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    /* 少し大きめの角丸で親しみやすく */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
    /* 軽い影で浮き上がらせる */
}

/* 経歴・紹介文テキスト */
.drinfo dd.text {
    flex: 1;
    /* テキストは残りの幅をすべて使う */
    min-width: 280px;
    /* スマホで狭くなりすぎないように */
    margin: 0;
    line-height: 1.8;
}

/* スマホ対応：中央揃えに切り替え */
@media (max-width: 600px) {
    .drinfo {
        flex-direction: column;
        align-items: center;
        /* 写真を中央に */
        gap: 20px;
    }

    .drinfo dt.tit {
        text-align: center;
    }

    .drinfo dd.text {
        min-width: 100%;
    }
}

/* 経歴リスト */
.drinfo ul.keireki {
    padding: 0;
    margin: 10px 0;
    list-style: none;
}

.drinfo ul.keireki li {
    font-size: 14px;
    line-height: 1.6;
    padding: 5px 0;
    border-bottom: 1px dotted #ccc;
    color: #555;
}

/* スマホ対応 */
@media (max-width: 600px) {
    .drinfo {
        flex-direction: column;
        align-items: center;
    }

    .drinfo dd.text {
        width: 100%;
    }
}

/** --- youtube動画 ------ **/
  /* クリニックエリアのデザインと統一 */
  .youtube-container {
    margin: 40px 0;
    padding: 25px;
    border: 2px solid #eef2f1;
    border-radius: 8px;
    background-color: #ffffff;
  }

  .youtube-title {
    font-size: 18px;
    font-weight: bold;
    color: #007550;
    border-bottom: 2px solid #007550;
    padding-bottom: 8px;
    margin-bottom: 15px;
    display: block;
  }

  /* 動画のレスポンシブ枠 */
  .youtube-wrapper {
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9比率 */
    background-color: #000;
    cursor: pointer;
    overflow: hidden;
    border-radius: 4px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
  }

  /* サムネイル画像 */
  .youtube-wrapper img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s, opacity 0.3s;
    opacity: 0.9;
  }

  .youtube-wrapper:hover img {
    opacity: 1;
    transform: scale(1.02); /* ホバー時に少しズーム */
  }

  /* 再生ボタン（自作） */
  .play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 68px;
    height: 48px;
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
    z-index: 2;
  }

  /* 再生ボタンの三角部分 */
  .play-button::before {
    content: "";
    border-style: solid;
    border-width: 12px 0 12px 20px;
    border-color: transparent transparent transparent #fff;
    margin-left: 4px;
  }

  .youtube-wrapper:hover .play-button {
    background-color: #ff0000; /* YouTubeらしい赤に変化 */
    transform: translate(-50%, -50%) scale(1.1);
  }

  .youtube-caption {
    font-size: 12px;
    color: #666;
    margin-top: 10px;
    text-align: right;
  }


/** --- よくある質問 (FAQ & Contact) --- */
dl#faq {
    border: 2px solid #ade2ad;
    /* 枠線を少し太くして安定感を */
    padding: 25px;
    background-color: #f4faf4;
    /* 画像の代わりに清潔感のある薄緑の背景色 */
    border-radius: 8px;
    margin-bottom: 30px;
}

#faq .tel {
    display: block;
    padding: 10px 0;
}

/* 電話番号部分：可読性とインパクトを重視 */
#faq dd.tel {
    /* 画面幅に合わせて最小24px?最大36pxの間で自動調整 */
    font-size: clamp(24px, 5vw, 36px);
    font-weight: bold;
    color: #007550;
    /* 鳳優会カラー */
    line-height: 1.2;
    margin: 10px 0;
}

#faq dd.tel .exp {
    display: block;
    font-size: 14px;
    font-weight: normal;
    color: #666;
    margin-bottom: 5px;
}

/* スマホ対応：さらに微調整 */
@media (max-width: 600px) {
    dl#faq {
        padding: 20px 15px;
        /* 上下は少し広げ、左右を絞る */
    }

    #faq dd.tel {
        letter-spacing: -1px;
        /* 文字間を詰め、スマホ1行での収まりを良くする */
        margin: 5px 0;
    }

    #faq dd.tel .exp {
        font-size: 13px;
        /* 注釈をわずかに小さく */
    }
}

/** --- 5.23 お問い合わせフォーム (Modern & Clean) --- */
#contact {
    max-width: 800px;
    /* フォームが広がりすぎないように制限 */
    margin: 0 auto;
}

#contact dt {
    font-weight: bold;
    color: #007550;
    /* 鳳優会グリーンの濃いめ */
    margin-bottom: 8px;
    display: flex;
    align-items: center;
}

/* 「必須」ラベルの装飾 */
#contact .hissu {
    background-color: #e63f2a;
    /* 注意を促すアクセントカラー */
    color: #fff;
    font-size: 11px;
    padding: 2px 6px;
    border-radius: 3px;
    margin-left: 8px;
    line-height: 1;
}

/* フォーム入力欄の共通設定 */
#contact input[type="text"],
#contact input[type="email"],
#contact input[type="tel"],
#contact textarea {
    width: 100%;
    max-width: 100%;
    padding: 12px;
    /* 少し広げて入力しやすく */
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    /* paddingを含めた幅計算 */
    font-size: 16px;
    /* iPhoneでの勝手なズームを防止 */
    background-color: #fff;
    transition: border-color 0.2s;
}

/* 入力中（フォーカス時）の演出 */
#contact input:focus,
#contact textarea:focus {
    border-color: #009966;
    outline: none;
    box-shadow: 0 0 0 2px rgba(0, 153, 102, 0.1);
}

#contact dd {
    margin: 0 0 25px 0;
    /* 項目間の余白をしっかり取る */
}

/* --- スマホ対応（透明なゴミを排除したクリーン版） --- */
@media screen and (max-width: 600px) {
    body #contact dt {
        font-size: 15px !important;
    }
}

/** --- 5.24 お知らせ・ブログ --- */
body #infoblog {
    margin-bottom: 40px !important;
}

#infoblog ul {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    /* 項目間の隙間を一括制御 */
    margin: 0;
    padding: 0;
    list-style: none;
}

#infoblog li {
    /* 画面幅に応じて300pxを下回ると自動で1列に、余れば均等に広がる */
    flex: 1 1 300px;
    padding: 0;
    box-sizing: border-box;
}

/* 記事コンテンツ（抜粋など）の基本設定 */
article {
    padding-bottom: 30px;
    border-bottom: 1px solid #eee;
    margin-bottom: 30px;
}

/* 最後の記事は余白と線を消してスッキリさせる */
article:last-of-type {
    border-bottom: none;
    margin-bottom: 0;
}

/* リンク付きタイトルのホバー演出 */
#infoblog li a {
    text-decoration: none;
    color: #333;
    transition: color 0.2s;
}

#infoblog li a:hover {
    color: #009966;
    /* 鳳優会カラー */
}


/* ============================================================
   トップページ/ブログ：Topicsメニュー（さっぱり・洗練デザイン）
   ============================================================ */

.myindexTopicsmenu {
    list-style: none;
    padding: 0;
    margin: 30px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    /* 隙間を広めにとってゆとりを出す */
}

.myindexTopicsmenu li {
    width: calc(50% - 10px);
    /* 2列 */
    margin: 0;
}

.myindexTopicsmenu li a {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 70px;
    padding: 10px 20px;
    text-decoration: none !important;

    /* さっぱりポイント：背景は薄いグレー、文字は鳳優会グリーン */
    background: #f9f9f9;
    color: #007550 !important;

    /* 縁（ボーダー）を細くして柔らかい印象に */
    border: 1px solid #e0e0e0;
    border-left: 5px solid #007550;
    /* 左側に太めの緑を入れてアクセントに */

    border-radius: 4px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
}

/* ホバー時：少し浮き上がるような清潔感のある動き */
.myindexTopicsmenu li a:hover {
    background: #ffffff;
    border-color: #007550;
    /* ホバーした時だけ縁を緑に */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
    /* 軽い影で浮かせる */
    transform: translateY(-2px);
}

/* --- スマホ対応 --- */
@media screen and (max-width: 768px) {
    .myindexTopicsmenu {
        gap: 12px;
    }

    .myindexTopicsmenu li {
        width: 100%;
        /* 1列 */
    }

    .myindexTopicsmenu li a {
        min-height: 60px;
        font-size: 15px;
    }
}



/** --- 5.25 川口先生の勉強部屋 (Column Style) --- */

/* 質問（Question） */
p.myQ {
    font-weight: bold;
    color: #009966;
    /* 鳳優会グリーン */
    font-size: 18px;
    margin-bottom: 15px;
    display: flex;
    align-items: flex-start;
}

p.myQ:before {
    content: 'Q.';
    margin-right: 10px;
    color: #ea9629;
    /* アクセントにオレンジ */
}

/* 回答（Answer） */
div.myA {
    padding: 15px 20px 15px 50px;
    /* 左側に画像用のスペースを確保 */
    margin-bottom: 2em;
    line-height: 1.8;
    color: #006666;
    background: url(../images/contents/blog/zaitaku-study/answer.png) no-repeat left 10px top 15px;
    background-size: 30px auto;
    /* 画像サイズを固定して安定させる */
}

/* リスト設定 */
div.myA ul,
div.myA ol {
    padding: 0;
    margin: 10px 0;
}

div.myA ul li {
    list-style: none;
}

div.myA ol li {
    list-style: decimal-leading-zero;
    margin-left: 2em;
}

/* 重要ポイント（Point/Check） */
.mypoint {
    padding: 15px 20px 15px 50px;
    margin-bottom: 2em;
    line-height: 1.8;
    color: #F60;
    /* オレンジ系 */
    font-weight: bold;
    background: url(../images/contents/blog/zaitaku-study/check.png) no-repeat left 10px top 15px;
    background-size: 30px auto;
    border: 1px dashed #F60;
    /* 枠線をつけてポイント箇所を強調 */
    border-radius: 5px;
}


/** --- 6.1 Widgets (Modern & Efficient) --- */

/* ウィジェット全体の箱 */
.widget {
    background-color: #f9f8f4;
    /* 透過を廃止し、安定した背景色へ */
    font-size: 14px;
    margin-bottom: 30px;
    word-wrap: break-word;
}

/* サイドバー独自メニュー (#mymenu) */
#mymenu h3 {
    margin: 0;
    padding: 0;
}

#mymenu h3 a {
    display: flex;
    align-items: center;
    padding: 12px 15px 12px 50px;
    background-color: #e4f8e6;
    color: #007550;
    text-decoration: none;
    border-top: 1px solid #fff;
    background-repeat: no-repeat;
    background-position: 8px center;
    background-size: 32px auto;
    transition: 0.3s;
}

/* ホバー時とアクティブ時の一括設定 */
#mymenu h3 a:hover,
#mymenu h3.act a {
    background-color: #009966;
    color: #fff !important;
}

/* アイコン画像の一括適用 */
#mymenu h3.about-houyu a {
    background-image: url("../images/menu/about-houyu_2.png");
}

#mymenu h3.company a {
    background-image: url("../images/menu/company_2.png");
}

#mymenu h3.about-zaitaku a {
    background-image: url("../images/menu/about-zaitaku_2.png");
}

#mymenu h3.blog a {
    background-image: url("../images/menu/blog_2.png");
}

#mymenu h3.recruit a {
    background-image: url("../images/menu/recruit_2.png");
}

/* 一般的なウィジェットリスト (カテゴリー、最新の投稿など) */
.widget ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.widget li {
    background: #fff;
    border-bottom: 1px solid #eee;
}

.widget li a {
    display: block;
    padding: 12px 15px;
    color: #333;
    text-decoration: none;
}

.widget li a:hover {
    background-color: #f0fdf4;
    color: #009966;
}

/* 階層構造（子カテゴリーなど） */
.widget li ul li {
    background: #fafafa;
    border-top: 1px dotted #e2ddc0;
    padding-left: 1.5em;
}

/* カレンダーウィジェット */
.widget_calendar table {
    width: 100%;
    border-collapse: collapse;
}

.widget_calendar th,
.widget_calendar td {
    padding: 8px 0;
    text-align: center;
}

.widget_calendar caption {
    padding: 10px;
    font-weight: bold;
    color: #007550;
}

.widget_calendar tbody td {
    background-color: #fff;
    border: 1px solid #eee;
}

/* 検索フォームの送信ボタンを隠す（虫眼鏡アイコンなどを使っている場合用） */
.search-form .search-submit {
    display: none;
}

/** --- 7.0 Footer (Modern & Stable) --- */

.site-footer {
    background-color: #009966;
    /* 鳳優会カラー */
    color: #fff;
    font-size: 14px;
    padding: 40px 0 0;
    clear: both;
    /* 回り込みを確実に解除 */
}

/* フッター内のウィジェットエリア */
.site-footer .widget-area {
    margin: 0 auto;
    max-width: 1080px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    padding: 0 20px;
    box-sizing: border-box;
}

/* 個別ウィジェット */
.site-footer .widget {
    /* 画面幅に応じて最小240px、最大は柔軟に広がる */
    flex: 1 1 240px;
    background: transparent;
    color: #fff;
    margin: 0 0 30px;
}

.site-footer .widget-title,
.site-footer .widget-title a {
    color: #fff;
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 15px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    padding-bottom: 8px;
    display: block;
}

/* フッター内のリンク色 */
.site-footer a {
    color: #fff;
    text-decoration: none;
    transition: opacity 0.2s;
}

.site-footer a:hover {
    text-decoration: underline;
    opacity: 0.8;
}

/* コピーライト表示エリア */
.site-info {
    margin-top: 20px;
    padding: 25px 0;
    background-color: rgba(0, 0, 0, 0.15);
    /* 区切りを明確にするための微調整 */
    text-align: center;
    width: 100%;
    color: #fff;
    font-size: 12px;
    letter-spacing: 0.05em;
}

/* スマホ対応：中央揃えに切り替え */
@media (max-width: 600px) {
    .site-footer .widget-area {
        flex-direction: column;
        text-align: center;
    }

    .site-footer .widget-title {
        border-bottom: none;
        /* スマホでは線を消してスッキリさせる選択肢もアリ */
    }
}


/** --- Footer Optimization & Mobile Layout --- */

/* 統計用隠し要素（Jetpack等の不要なアイコン）を完全に排除 */
#wpstats {
    display: none !important;
}

/* スマホ対応：フッターウィジェットの最適化（600px以下） */
@media (max-width: 600px) {
    .site-footer {
        padding: 30px 0 0;
        /* スマホでは少し上の余白を絞る */
    }

    .site-footer .widget-area {
        flex-direction: column;
        /* 縦並びへ変更 */
        gap: 25px;
        /* 項目間の距離を適切に確保 */
        text-align: center;
        /* モバイルでは中央揃えが一般的で美しい */
    }

    .site-footer .widget {
        flex: 1 1 100%;
        /* 横幅いっぱいに広げる */
        margin-bottom: 10px;
        /* 下方向への余白 */
    }

    .site-footer .widget-title {
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
        /* スマホでも区切りを薄く残す */
        display: inline-block;
        /* 中央揃え時に線が広がりすぎないように */
        padding-bottom: 5px;
    }
}




/** --- パンくずリスト (Breadcrumbs) --- */
.breadcrumbs {
    padding: 15px 0 10px;
    color: #666;
    font-size: 13px;
    line-height: 1.5;
    /* 親要素の幅に合わせるための指定（念のため） */
    width: 100%;
    box-sizing: border-box;
}

.breadcrumbs a {
    color: #007550;
    /* 鳳優会グリーン（濃いめ） */
    text-decoration: none;
    transition: color 0.2s, opacity 0.2s;
}

.breadcrumbs a:hover {
    color: #ea9629;
    /* ホバー時はオレンジ（アクセントカラー） */
    text-decoration: underline;
    opacity: 0.8;
}

/* 区切り文字（ > や / など） */
.breadcrumbs span,
.breadcrumbs .separator {
    margin: 0 8px;
    /* 5pxから少し広げてゆとりを */
    color: #ccc;
    font-family: sans-serif;
    /* 記号が崩れないように設定 */
}

/* 現在地の表示（リンクになっていない最後の項目） */
.breadcrumbs .current,
.breadcrumbs b {
    color: #333;
    font-weight: normal;
}

/* スマホ対応：文字が溢れた場合に折り返す設定 */
@media (max-width: 600px) {
    .breadcrumbs {
        font-size: 12px;
        padding: 10px 0;
    }
}

/** --- アコーディオンメニュー (FAQ Slide) --- */

/* 親要素 */
#acMenu {
    margin-bottom: 2em;
}

/* 質問部分 (クリックする場所) */
#acMenu dt.acMenu {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 12px 15px 12px 40px;
    /* 左にアイコン分の余白 */
    font-weight: bold;
    color: #007550;
    /* 鳳優会グリーンの濃いめ */
    border-bottom: 1px dotted #ccc;
    background-repeat: no-repeat;
    background-position: 10px center;
    background-size: 20px auto;
    transition: background-color 0.2s;
}

/* FAQ用のアイコン（Qマーク） */
#acMenu dt.acMenu.faq {
    background-image: url(../images/contents/houyu-info/icon_q.png);
}

#acMenu dt.acMenu:hover {
    background-color: #f9fdfa;
    /* 触った時に少し色を変える */
}

/* 回答部分 (初期状態は非表示) */
#acMenu dd.acMenu {
    display: none;
    /* JavaScript等で制御 */
    background-color: #fdfaf5;
    /* 優しいクリーム系の色に変更 */
    padding: 20px 20px 20px 40px;
    margin: 0;
    line-height: 1.8;
    color: #444;
}

/* FAQ用の回答背景 */
#acMenu dd.acMenu.faq {
    background-color: #fff9f9;
    /* FAQ回答は少し暖色系に */
    border-left: 3px solid #fcc;
    /* 左端にアクセントの線を入れて読みやすく */
}

.acMenu .exp {
    font-size: 15px;
    font-weight: normal;
}

/** --- 汎用クラス & ニュースタイトル --- */

/* 注釈・補足（小さめの文字） */
.expfont {
    font-size: 0.85em;
    /* 80%よりわずかに大きくして可読性を確保 */
    line-height: 1.5;
}

/* メインコンテンツエリアの最小高（フッター浮き防止） */
#content {
    min-height: 550px;
    /* 現代の大きな画面に合わせて少しだけ高く */
}

/* ニュース一覧のカテゴリータイトル */
.category-news h1.ctlist {
    background: none;
    font-size: 20px;
    font-weight: bold;
    color: #007550;
    /* 鳳優会グリーンの濃いめ */
    border-bottom: 2px dotted #009966;
    /* 線を少し太くして視認性アップ */
    padding-bottom: 10px;
    margin-bottom: 25px;
}

/** --- Postカテゴリメニュー (Modern Chip Style) --- */
ul.cat-item {
    display: flex;
    flex-wrap: wrap;
    /* カテゴリーが増えても自動で折り返し */
    gap: 8px;
    /* 項目間の隙間を一括制御 */
    padding: 10px 0 !important;
    margin: 0;
    width: 100%;
    list-style: none;
    border-bottom: 2px dotted #009966;
    /* 鳳優会グリーンで区切りを明確に */
}

li.cat-item {
    margin: 0;
    padding: 0;
}

li.cat-item a {
    display: block;
    padding: 5px 12px;
    background: #f0fdf4;
    /* 非常に薄い緑（清潔感） */
    color: #007550;
    text-decoration: none;
    border-radius: 20px;
    /* 角を丸くしてボタン（チップ）状に */
    font-size: 13px;
    transition: all 0.2s;
    border: 1px solid #e0f2e1;
}

li.cat-item a:hover {
    background: #e8f5e9;
    color: #009966;
    border-color: #009966;
}

/* 現在表示中のカテゴリー強調 */
li.current-cat a {
    background: #009966 !important;
    /* 鳳優会グリーン */
    color: #fff !important;
    border-color: #009966;
    font-weight: bold;
}

/* 「すべて（all）」などの特殊クラス用（必要に応じて） */
li.all a {
    border-style: dashed;
}

/** --- トップページ看取り実績 (Modern Table & Layout) --- */
.mitoriset {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
}

.mitori {
    flex: 1 1 calc(50% - 10px);
    /* 2カラム並び（隙間を考慮） */
    box-sizing: border-box;
}

/* テーブル自体の装飾 */
.topmitori {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    border: 1px solid #f0e6cc;
}

.topmitori th {
    padding: 10px 5px;
    text-align: center;
    background-color: #fdf8e6;
    /* 柔らかいクリーム色 */
    color: #856404;
    /* 文字も茶系にして可読性アップ */
    border: 1px solid #eee;
}

.topmitori td {
    padding: 10px 5px;
    text-align: center;
    background-color: #fff;
    /* データ部分は白にして清潔感を */
    border: 1px solid #eee;
    font-weight: bold;
    color: #333;
}

/* スマホ対応：1列に切り替え */
@media (max-width: 768px) {
    .mitori {
        flex: 1 1 100%;
    }
}

/** * トップドクター写真 * ---------------------------------------------------------------------------- */
#topclinicphoto {
    width: 100%;
    padding: 5px 5px 15px 5px;
}

#topclinicphoto .topphoto {
    float: left;
    width: 50%;
}

#topclinicphoto .topphoto a {
    display: block;
}

#topclinicphoto .topphoto a:hover {
    opacity: 0.8;
}

/** --- 専門センター共通デザイン (Urology, Neurology, Palliative) --- */

/* タイトルのキャッチコピー */
.center-page h2 span.catch {
    font-size: 13px;
    color: #FF6000;
    font-weight: bold;
    display: block;
}

/* 共通テーブル設定 */
.center-page table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 2em;
}

.center-page th,
.center-page td {
    padding: 12px;
    border: 1px solid #eee;
}

.center-page th {
    background: #f8f8f8;
    width: 25%;
    text-align: left;
}

.center-page th.caption {
    background: #fffcf8;
    width: auto;
}

/* インデックス・フッターインデックス (Flexboxで整列) */
/* インデックス・フッターインデックス (Flexboxで整列) */
/* インデックス・フッターインデックス共通設定 */
/* インデックス・フッター共通設定 */
/* インデックス・共通設定 */
#index ul,
#footer-index ul,
.stent ul {
    display: flex;
    flex-wrap: wrap;
    gap: 15px; /* 隙間を15pxに固定 */
    margin: 0;
    padding: 0 0 40px 0;
    list-style: none;
}

/* 3列を強制し、画像がはみ出さないようにする設定 */
#index li,
.stent li {
    /* 隙間(15px * 2)を引いて3分割 */
    flex: 0 0 calc((100% - 30px) / 3);
    max-width: calc((100% - 30px) / 3);
    font-size: 14px;
    list-style: none;
    box-sizing: border-box;
    line-height: 1.4;
}

/* 【重要】画像が枠（li）からはみ出さないように制限 */
#index li img,
.stent li img {
    max-width: 100%; /* 親の幅（1/3）以上に広がらない */
    height: auto;    /* 比率は維持 */
    display: block;
    margin-bottom: 8px;
}

/* フッター用の個別調整（ここは要素が多い場合があるのでflex-growを維持） */
#footer-index li {
    flex: 1 1 170px;
    max-width: 200px;
    font-size: 14px;
    min-height: 120px;
}

/* スマホでは1列（または2列）に切り替え */
@media screen and (max-width: 768px) {
    #index li,
    .stent li {
        flex: 1 1 calc((100% - 15px) / 2); /* スマホは2列 */
        max-width: calc((100% - 15px) / 2);
    }
}

@media screen and (max-width: 480px) {
    #index li,
    .stent li {
        flex: 1 1 100%; /* 非常に狭い時は1列 */
        max-width: 100%;
    }
}

/* お問い合わせ（黄色背景のボックス） */
.center-page .inq {
    width: 100%;
    border: 1px solid #ade2ad;
    padding: 25px;
    background-color: #f4faf4;
    /* 画像を廃止し軽量化 */
    border-radius: 8px;
    box-sizing: border-box;
}

.center-page .inq h2 {
    border: none;
    font-weight: bold;
    color: #FF6000;
    background: #ffffcc;
    /* 目立つように薄い黄色 */
    padding: 5px 10px;
    display: inline-block;
}

/* サブナビゲーション（タブ風デザイン） */
.center-page #subnavi ul {
    display: flex;
    border-bottom: 2px #007550 solid;
    margin: 1em 0 2em 0;
    padding: 0;
    list-style: none;
}

.center-page #subnavi li.list200 a {
    display: block;
    border: 2px #007550 solid;
    border-bottom: none;
    margin-right: 5px;
    padding: 15px 20px;
    color: #007550;
    text-decoration: none;
    font-weight: bold;
    border-radius: 8px 8px 0 0;
}

.center-page li.act a {
    background: #FFFBC0;
    /* 現在地 */
}

/* マンガ・画像エリア */
.center-page #manga {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.center-page #manga img {
    width: calc(50% - 10px);
    border: 1px solid #000;
    height: auto;
}

/* スマホ対応 */
@media (max-width: 600px) {
    .center-page th {
        width: 35%;
        font-size: 13px;
    }

    .center-page #manga img {
        width: 100%;
    }

    .center-page #subnavi ul {
        flex-direction: column;
        border-bottom: none;
    }

    .center-page #subnavi li.list200 a {
        border-bottom: 2px solid #007550;
        margin-bottom: 5px;
    }
}

/** --- もっと医師を知りたい (Doctor Interview Section) --- */
#moredctor {
    background-color: #fff;
    /* ドット柄の背景デザインを継承（リピート設定） */
    background-image:
        radial-gradient(#dce0bb 15%, transparent 15%),
        radial-gradient(#009966 15%, transparent 15%);
    background-size: 20px 20px;
    background-position: 0 0, 10px 10px;
    margin-top: 20px;
    padding: 60px 20px 40px;
    /* 写真の飛び出し分、上に余白を確保 */
    border-radius: 12px;
}

/* 医師の名前プレート（右寄せの付箋風デザイン） */
.namepate {
    background: #e3f8e8;
    border: dashed 2px #fff;
    box-shadow: 0 0 0 5px #e3f8e8;
    padding: 0.5em 1em;
    text-align: right;
    font-weight: bold;
    color: #007550;
    margin-bottom: 20px;
    position: relative;
    z-index: 1;
}

/* レイアウトのコンテナ（Flexbox） */
.dr-flex-container {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 30px;
}

/* 医師の画像（飛び出し演出） */
.drimage {
    flex: 0 0 35%;
    /* PCでは横幅35% */
    margin-top: -80px;
    /* 背景から上に飛び出させる */
    position: relative;
    z-index: 2;
}

.drimage img {
    width: 100%;
    height: auto;
    filter: drop-shadow(0 10px 15px rgba(0, 0, 0, 0.1));
    /* 写真を浮かせる */
}

/* プロフィール本文 */
.drprofile {
    flex: 1;
    /* 残りのスペースを埋める */
    color: #007550;
    line-height: 1.8;
    min-width: 280px;
}

/* インタビュー形式のQ&A */
.drinterview {
    line-height: 1.8;
    margin-top: 30px;
    clear: both;
}

.drinterview dt {
    color: #009966;
    font-size: 1.1em;
    font-weight: bold;
    margin-bottom: 5px;
}

.drinterview dd {
    margin-bottom: 1.5em;
    color: #444;
    /* 回答は少し落ち着いた色で読みやすく */
}

/* スマホ対応：1列に積み上げ */
@media (max-width: 768px) {
    #moredctor {
        padding-top: 100px;
        /* スマホでは飛び出しをさらに考慮 */
    }

    .drimage {
        flex: 0 0 60%;
        /* スマホでは少し大きく中央寄りに */
        margin: -110px auto 20px;
        float: none;
    }

    .drprofile {
        width: 100%;
        text-align: center;
    }

    .namepate {
        text-align: center;
    }
}

/** * SHORTCODE ULTIMATE プラグインのスタイル変更 * ---------------------------------------------------------------------------- */
.su-tabs {
    margin: 1em;
    border-radius: 0 !important;
    box-sizing: 0px;
    background: #ececec !important;
}

/** --- List Category Posts プラグインの最適化 --- */
.lcp_catlist {
    position: relative;
    padding: 0;
    margin: 0;
    list-style: none;
}

.lcp_catlist li {
    display: flex;
    /* 写真とテキストを横並びにする */
    align-items: flex-start;
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 1px dotted #eee;
    /* 記事ごとの区切り線 */
}

.lcp_catlist li:last-child {
    border-bottom: none;
}

/* 記事タイトル */
.lcp_catlist li h3 {
    margin: 0 0 5px 0;
    font-size: 16px;
    line-height: 1.4;
}

.lcp_catlist a {
    text-decoration: none;
    color: #007550;
    /* 鳳優会グリーン */
    font-weight: bold;
    transition: color 0.2s;
}

.lcp_catlist a:hover {
    color: #ea9629;
    /* ホバー時はアクセントカラー */
    text-decoration: underline;
}

/* サムネイル画像 */
.lcp_catlist li img {
    flex: 0 0 100px;
    /* 画像の幅を100pxに固定 */
    height: 70px;
    object-fit: cover;
    /* 画像を歪ませずにトリミング */
    margin-right: 15px;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* ページネーション（ページ送り） */
.lcp_paginator {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 2em 0;
    list-style: none;
}

.lcp_paginator li {
    border: 1px solid #ccc !important;
    border-radius: 4px;
    padding: 5px 10px;
    background: #fff;
}

.lcp_paginator li a {
    color: #666;
}

/* フッターの不自然な余白（50em）を解消するための代替案 */
/* 50em（巨大な余白）を消し、コンテンツの最小高さを設定するのが安全です */
#content {
    min-height: 60vh;
    /* 画面の高さの60%を最低保証（フッター浮き防止） */
}

/* スマホ対応 */
@media screen and (max-width: 600px) {
    .lcp_catlist li {
        flex-direction: column;
        /* スマホでは画像の下にタイトル */
    }

    .lcp_catlist li img {
        width: 100%;
        height: auto;
        margin-bottom: 10px;
    }
}

/** --- 汎用パーツ：見出し付きリストボックス (Clean Box Style) --- */

.list-008 {
    position: relative;
    padding: 1.8em 1.2em 1.2em;
    /* 上の余白を見出しに合わせて微調整 */
    border: 2px solid #009966;
    /* 鳳優会カラー */
    border-radius: 8px;
    /* 角を少し丸めて柔らかい印象に */
    margin: 2em 1em 1em;
    /* 見出しが上の要素とぶつからないよう余裕を持たせる */
    background-color: #fff;
}

/* 枠線の上に乗るタイトル部分 */
.list-008>div {
    position: absolute;
    top: -0.9em;
    /* 枠線の真上に配置 */
    left: 1em;
    padding: 0 0.8em;
    background-color: #fff;
    color: #007550;
    /* 少し濃いめの緑で可読性アップ */
    font-weight: bold;
    font-size: 1.1em;
}

/* リスト部分の設定 */
.list-008 ul {
    list-style-type: none;
    /* デフォルトの丸を消してカスタマイズ */
    margin: 0;
    padding: 0;
}

.list-008 li {
    position: relative;
    padding: 0.5em 0 0.5em 1.5em;
    /* 文頭の記号分、左を空ける */
    line-height: 1.6;
    border-bottom: 1px dotted #eee;
    /* 項目間に薄い区切り線を追加（任意） */
}

.list-008 li:last-child {
    border-bottom: none;
}

/* 文頭の記号を疑似要素で作成（ズレ防止） */
.list-008 li::before {
    content: "●";
    position: absolute;
    left: 0;
    color: #009966;
    font-size: 0.8em;
    top: 0.6em;
}

/* スマホ対応 */
@media (max-width: 600px) {
    .list-008 {
        margin: 2em 0.5em 1em;
        padding: 1.5em 1em 1em;
    }

    .list-008>div {
        font-size: 1em;
        left: 0.5em;
    }
}


/** --- 診療体制・クリニック案内 --- */
.sinryouerea {
    display: flex;
    flex-wrap: wrap;
    gap: 4%;
    margin-bottom: 3em;
    width: 100%;
}

.sinryoutaisei_img,
.sinryoutaisei_txt {
    flex: 1 1 48%;
    /* PCでは約半分 */
    min-width: 300px;
    /* スマホで1列に落ちる基準点 */
}

.sinryoutaisei_img img {
    width: 100%;
    height: auto;
    border-radius: 8px;
}

/* スマホ対応 */
@media (max-width: 700px) {
    .sinryouerea {
        flex-direction: column;
    }

    .sinryoutaisei_img,
    .sinryoutaisei_txt {
        width: 100%;
    }
}

/** --- 7.0 Responsive Design (Modern Cleanup) --- */

/* 1. 共通設定：1599px以下 */
@media (max-width: 1599px) {
    .site {
        border: 0;
    }
}

/* 2. タブレット・中間サイズ：1069px以下 */
@media (max-width: 1069px) {

    /* 左右の余白を一括制御（メンテナンス性アップ） */
    .archive-header,
    .search .page-header,
    .archive .page-header,
    .blog .page-header,
    .error404 .page-content,
    .search .page-content,
    .archive .page-content,
    .attachment .entry-header,
    .attachment .entry-content,
    .post-navigation .nav-links,
    .sidebar .site-info,
    .site-footer .widget-area {
        padding-left: 20px;
        padding-right: 20px;
    }

    /* 404エラーページの過剰な数値を適正化 */
    .error404 .page-title {
        font-size: 28px;
        padding: 60px 20px;
        /* 180pxは広すぎたため調整 */
        text-align: center;
    }

    .error404 .page-title:before {
        font-size: 120px;
        /* 554pxは画面を突き抜けるため現実的なサイズに */
        display: block;
        opacity: 0.1;
    }

    .site-main .widget-area {
        margin-right: 20px;
    }
}

/* 3. モバイル・スマホ：999px以下 */
@media (max-width: 999px) {

    /* PC/スマホ要素の切り替え */
    .pc {
        display: none !important;
    }

    .smt {
        display: block !important;
    }

    /* ヘッダー・ロゴのレスポンシブ化 */
    .site-header .home-link {
        width: 100%;
        text-align: center;
    }

    .site-header .home-link img {
        width: 100%;
        /* 固定幅を解除し、画面幅に追従させる */
        max-width: 400px;
        /* 必要以上に大きくならないようガード */
        height: auto;
    }

    .site-header .site-description {
        margin-bottom: 15px;
        font-size: 13px;
    }

    /* ナビゲーションバーの高さリセット */
    .navbar {
        height: auto;
        padding: 10px 0;
        border-bottom: 3px solid #f1f1f1;
    }

    /* ショートカットボタン（電話・予約など） */
    #shortcutBtn a {
        border: 1px solid #ccc;
        color: #009966;
        display: block;
        padding: 20px 20px 20px 70px;
        /* 余白を微調整 */
        text-shadow: none;
        background-color: #fff;
        border-radius: 8px;
        margin: 10px;
    }
}


/** --- 5.20 Lower Page Index Menu (Modern Flexbox Version) --- */
ul.myindexmenu {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    /* 縦横の隙間 */
    padding: 0;
    margin: 20px 0;
    list-style: none;
    list-style-type: none !important;
    /* 既存の点を確実に消す */
}

/* リンク要素（箱の全体制御） */
ul.myindexmenu a {
    display: block;
    flex: 1 1 calc(50% - 10px);
    /* ★PC・タブレットで2列並び */
    text-decoration: none !important;
    transition: transform 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
}

ul.myindexmenu a:hover {
    transform: translateY(-3px);
    opacity: 0.9;
}

/* リスト項目（中身の装飾） */
ul.myindexmenu li {
    height: 100%;
    /* aタグの高さに合わせる */
    padding: 20px;
    border: 1px solid #eee;
    border-left: 5px solid #009966;
    /* 鳳優会カラーのアクセント */
    background: #fff;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    box-sizing: border-box;
    margin: 0 !important;
    /* 既存の余白をリセット */
}

/* 見出し (h2) */
ul.myindexmenu h2 {
    font-size: 18px;
    font-weight: bold;
    color: #007550;
    margin: 0 0 10px 0;
    display: flex;
    align-items: center;
}

/* アイコン (i) */
ul.myindexmenu h2 i {
    margin-right: 8px;
    color: #009966;
    font-size: 1.1em;
}

/* 説明文 (p) */
ul.myindexmenu p {
    font-size: 14px;
    line-height: 1.6;
    color: #555;
    margin: 0;
}

/** --- レスポンシブ対応 --- **/

/* 768px未満：スマホ用1列表示 */
@media (max-width: 767px) {
    ul.myindexmenu {
        gap: 15px;
        /* スマホでは隙間を少し詰める */
    }

    ul.myindexmenu a {
        flex: 1 1 100%;
        /* ★1列表示 */
    }

    ul.myindexmenu li {
        padding: 15px;
    }

    ul.myindexmenu h2 {
        font-size: 16px;
    }
}



/** --- 7.1 Responsive Components (Maintenance & Sidebar) --- */



@media (max-width: 999px) {



    /* --- 5.17 Top clinic info (エリアマップ等) --- */

    ul.topclinicinfo {

        padding: 0 0 30px 0;

        width: 100%;

        list-style: none;

    }

    .topclinicinfo li {

        margin-bottom: 10px;

        width: 100%;

        float: none;
        /* float解除 */

        min-height: 0;

    }

    .topclinicinfo li.myarea {

        /* 背景画像の配置をスマホ向けに微調整 */

        background: url(../images/contents/topbanner/map.png) no-repeat -10px -10px;

        background-size: 140px auto;
        /* 画像がはみ出さないようサイズ指定 */

        padding-left: 140px;

        min-height: 100px;

        display: flex;

        align-items: center;

    }


    /** --- 5.19 鳳優会グループセクション（絶縁・完全復元版） --- */

    /* 1. 親の幅制限を無視し、画面の端から端までベージュを突き抜けさせる */
    #houyugroup {
        background-color: #f7f5f2 !important;
        background: #f7f5f2 !important;
        width: 100vw !important;
        position: relative;
        left: 50%;
        right: 50%;
        margin-left: -50vw !important;
        margin-right: -50vw !important;
        padding: 50px 0 !important;
        margin-top: 40px !important;
        margin-bottom: 40px !important;
        display: block !important;
        clear: both !important;
        /* 回り込みを完全に遮断 */
    }

    /* 2. 中身のコンテンツだけを中央に配置（テーマの白背景を無効化） */
    #houyugroup .entry-content {
        max-width: 1100px !important;
        margin: 0 auto !important;
        padding: 0 20px !important;
        background: transparent !important;
        /* 絶対に白を出さない */
        box-shadow: none !important;
        float: none !important;
    }

    /* 3. リスト構造（大画面で3列、スマホで1列） */
    #houyugroup ul {
        display: block !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }

    /* 4. 【重要】アイコン画像をフルパスで固定（絶対に消えません） */
    #houyugroup li {
        background-repeat: no-repeat !important;
        background-position: left center !important;
        background-size: 70px auto !important;
        min-height: 85px !important;
        box-sizing: border-box !important;
    }

    /* アイコン画像をサーバーの絶対URLで指定 */
    #houyugroup li.ebara {
        background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_ebara.png) !important;
    }

    #houyugroup li.asuka {
        background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_asukav2.png) !important;
    }

    #houyugroup li.nousinkei {
        background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_sinkei.png) !important;
    }

    #houyugroup li.kanwa {
        background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_kanwa.png) !important;
    }

    #houyugroup li.gastro {
        background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_gastro.png) !important;
    }

    #houyugroup li.hihu {
        background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_noimage.png) !important;
    }

    #houyugroup li.yuketu {
        background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/ryouhou_yuketu.png) !important;
    }

    #houyugroup li.sangen {
        background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_sangen.png) !important;
    }

    #houyugroup li.hotto {
        background-image: url(/wp-content/themes/homecare02/images/contents/topbanner/clinic_hotto.png) !important;
    }

    /* PC用の配置（769px以上） */
    @media (min-width: 769px) {
        #houyugroup li {
            float: left !important;
            width: 31% !important;
            margin: 0 1% 25px 1% !important;
            padding: 10px 10px 10px 85px !important;
            display: block !important;
        }
    }

    /* スマホ用の配置（768px以下） */
    @media (max-width: 768px) {
        #houyugroup li {
            width: 100% !important;
            float: none !important;
            padding-left: 80px !important;
            margin-bottom: 20px !important;
            background-size: 65px auto !important;
        }
    }

    /* 見出しとテキスト */
    #houyugroup h2 {
        font-size: 19px !important;
        color: #009966 !important;
        border-bottom: 2px solid #009966 !important;
        margin: 0 0 20px 0 !important;
        display: inline-block !important;
    }

    #houyugroup dt {
        font-weight: bold !important;
        color: #007550 !important;
        font-size: 16px !important;
        margin: 0 !important;
    }

    #houyugroup dd {
        font-size: 13px !important;
        color: #444 !important;
        margin: 0 !important;
        line-height: 1.5 !important;
    }



    /** --- 7.3 Extreme Mobile & Global Fine-tuning (375px以下・パーツ調整) --- */

    /* 1. 超小型デバイス用調整 (375px以下) */
    @media (max-width: 375px) {
        #topmainbnr {
            margin-top: -20px !important;
            padding: 0;
        }

        /* 鳳優会グリーンのドット配置を極小画面向けに上書き */
        .topclinicinfo li.myarea {
            background-position: -80px -10px;
            padding-left: 95px;
            /* 地図と文字が被りすぎないよう調整 */
        }
    }

    /* 2. さらに小さなデバイス用 (359px以下) */
    @media (max-width: 359px) {
        ul {
            padding-left: 1.2em;
            /* リストが画面端に寄るのを防ぐ */
        }

        .acMenu {
            font-size: 14px;
        }

        .site-title {
            font-weight: normal;
        }

        /* 説明文を画面外に隠しつつSEO効果を残す（clipの現代版） */
        .site-description {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            border: 0;
        }
    }

    /* 3. 共通パーツのフォント・レイアウト強化 */
    .entry-title,
    .entry-content h2 {
        font-weight: bold;
    }

    div#houyugroup {
        padding: 10px 0;
    }

    .topbaner li {
        font-size: 12px;
    }

    /* 診療の流れ (myflow) */
    .myflow h2 {
        margin: 0 10px;
        padding: 0;
    }

    .myflow ul {
        padding: 0 5px;
        list-style: none;
    }

    /* 電話番号・FAQリンク */
    #faq dl.tel dd a {
        font-size: 14px;
        font-weight: bold;
        color: #009966;
    }

    /* 医師・スタッフ紹介 */
    .drinfo dd.text {
        width: 100%;
        line-height: 1.7;
    }

    /* 4. スライダー調整：操作ドットを非表示（シンプル化） */
    .slick-dots {
        display: none !important;
    }

    /* 5. WordPress標準ギャラリーのレスポンシブ化 */
    .gallery {
        margin: 0 auto;
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        /* 隙間を固定 */
    }

    .gallery .gallery-item {
        flex: 1 1 calc(50% - 4px);
        /* 常に2枚並び */
        margin: 0 !important;
        max-width: none;
        text-align: center;
    }

    .gallery-columns-1 .gallery-item {
        flex: 1 1 100%;
        /* 1段の場合は全幅 */
    }

    .gallery br {
        display: none;
    }

    .gallery-caption {
        font-size: 11px;
        margin-top: 5px;
    }

    /* 6. コメント欄の最適化 */
    .comment-author {
        margin: 0 0 10px;
        max-width: 100%;
        display: flex;
        align-items: center;
    }

    .comment-author .avatar {
        margin: 0 10px 0 0;
        border-radius: 50%;
        /* アイコンを丸く */
        width: 32px;
        height: 32px;
    }

    .comment-metadata,
    .comment-content,
    .comment-list .reply {
        width: 100%;
        box-sizing: border-box;
        padding: 5px 0;
    }

    /** --- 5.30 各専門センター個別設定 (Urology / Neurology / Palliative) --- */

    /* 泌尿器・脳神経・緩和ケア 共通スタイル */
    #urology #footer-index li,
    #neurology #footer-index li,
    #palliative #footer-index li {
        font-size: 13px;
        min-height: 130px;
        /* height を min-height に変更して文字溢れを防止 */
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        padding: 10px;
        box-sizing: border-box;
        line-height: 1.4;
    }

    /* スマホ表示では高さ固定を解除して自然な長さに */
    @media (max-width: 768px) {

        #urology #footer-index li,
        #neurology #footer-index li,
        #palliative #footer-index li {
            min-height: 0;
            height: auto;
            padding: 15px 10px;
            border-bottom: 1px dotted #ccc;
        }
    }


    /** --- 8. Responsive & Refined Optimization (Global) --- */

    @viewport {
        width: device-width;
    }

    /* 1. PC?タブレット表示の微調整 */
    @media (max-width: 1599px) {
        .site {
            border: 0;
        }
    }

    @media (max-width: 1069px) {


        /* 余白の一括制御 */
        .archive-header,
        .search .page-header,
        .archive .page-header,
        .blog .page-header,
        .error404 .page-content,
        .search .page-content,
        .archive .page-content,
        .attachment .entry-header,
        .attachment .entry-content,
        .post-navigation .nav-links {
            padding-left: 20px;
            padding-right: 20px;
        }

        /* 404エラーページの最適化 */
        .error404 .page-title {
            font-size: 24px;
            padding: 60px 20px;
            /* 過剰な180pxパディングを修正 */
        }
    }

    /* 2. スマホ・タブレット表示 (999px以下) */
    @media (max-width: 999px) {
        .pc {
            display: none !important;
        }

        .smt {
            display: block !important;
        }

        .site-header .home-link,
        .site-header .home-link img {
            width: 100%;
            height: auto;
        }

        .navbar {
            height: auto;
            border-bottom: #f1f1f1 solid 3px;
            padding: 5px;
        }

        /* クリニック情報リスト */
        ul.topclinicinfo {
            padding: 0 0 30px 0;
            width: 100%;
        }

        /* 履歴表示 */
        .history_set p.day,
        .history_set p.history {
            clear: both;
            width: 100%;
            display: block;
        }

        /* インデックスメニュー */
        .myindexmenu li,
        .myindexTopicsmenu li {
            width: 100%;
            float: none;
            min-height: inherit;
        }
    }

    /* 3. モバイル表示 (767px以下) */
    @media (max-width: 767px) {
        .site-title {
            font-size: 30px;
            padding: 0px 10px;
        }



        .entry-content img {
            max-width: 100%;
            height: auto;
        }

        /* 診療体制セクション */
        .sinryoutaisei_img {
            width: 100%;
            text-align: center;
            margin: 0 auto;
        }

        .sinryoutaisei_img img {
            width: 90%;
        }

        .sinryouerea {
            width: 100%;
        }

        /* ショートカットボタン(旧コードの整理) */
        #shortcutBtn li a {
            padding: 15px;
            height: auto;
            display: flex;
            align-items: center;
            justify-content: center;
        }
    }

    /* 4. 極小画面・特定パーツ (643px以下) */
    @media (max-width: 643px) {

        body,
        p,
        li,
        td,
        th {
            font-size: 14px;
        }

        /* 12pxは小さすぎるため14pxを推奨 */

        /* 記事タイトルのサイズ適正化 */
        .entry-title,
        .format-chat .entry-title,
        .format-image .entry-title {
            font-size: 20px !important;
            font-weight: bold;
        }

        .entry-content h2 {
            font-size: 18px !important;
            font-weight: bold;
        }

        /* ボタンメニューをアイコンスタイルへ */
        #shortcutBtn {
            display: flex;
            flex-wrap: wrap;
        }

        #shortcutBtn li {
            width: 33.33%;
            box-sizing: border-box;
        }

        #shortcutBtn li a {
            padding: 60px 5px 10px;
            background-size: 40px auto !important;
            font-size: 11px;
        }
    }

    /* 5. 最終微調整 (375px以下) */
    @media (max-width: 375px) {
        #topmainbnr {
            margin-top: -20px !important;
            width: 100%;
        }
    }

    /* 6. グローバル共通設定（!importantの整理） */
    .slick-dots {
        display: none !important;
    }

    .gallery {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
    }

    .gallery-item {
        flex: 1 1 calc(50% - 4px);
        margin: 0 !important;
    }

    #faq dl.tel dd a {
        font-size: 16px;
        font-weight: bold;
    }

    .drinfo dd.text {
        width: 100%;
        line-height: 1.6;
    }

    /* センターページ共通 */
    #urology #footer-index li,
    #neurology #footer-index li,
    #palliative #footer-index li {
        font-size: 13px;
        min-height: 130px;
    }