@charset "utf-8";
/*
Theme Name: 近森病院テーマ（classic）
Author: BASARA
Version: 1.0
*/

/* Optimaフォントの読み込み */
@font-face { /* regular */
    font-family:"Optima";
    src:url('assets/font/Optima_Regular.TTF') format('truetype'); /* ファイルの場所 */
    font-weight:400;
    font-style:normal;
}
@font-face { /* medium */
    font-family:"Optima";
    src:url('assets/font/Optima_Medium.ttf') format('truetype'); /* ファイルの場所 */
    font-weight:500;
    font-style:normal;
}
@font-face { /* bold */
    font-family:"Optima";
    src:url('assets/font/Optima_Bold.TTF') format('truetype'); /* ファイルの場所 */
    font-weight:700;
    font-style:normal;
}

*,
*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    backface-visibility: hidden;
}
*:before,
*:after {
    pointer-events: none;
}
:root {
    --color-base-font: #3a3a3a;
    --color-main: #0a61b8;
    --color-main-dark:#004780;
    --color-light-green: #edf3f4;
    --color-deep-green: #014867;
    --color-attention: crimson;
    --color-silver:#bababa;
    --color-gray: #cdd6dd;
    --color-khaki:#C5AB57;
    --contents-width-small: 865px;
    --contents-width-main: 1200px;
    --contents-width-large: 1680px;
    --weight-light:300;
    --weight-regular:400;
    --weight-medium:500;
    --weight-semibold:600;
    --weight-bold:700;
    --weight-black:900;
    --border-radius:3px; /* 共通のborder-radius値 */

    --font-ibm:"IBM Plex Sans JP", sans-serif;  /* 300,400,500,600,700 */
    --font-zen-old:"Zen Old Mincho", serif;     /* 400,500,600,700,900 */
    --font-optima:"Optima", "serif";            /* 400,500,700 */
    --header-height:115px;  /* headerの高さ */
    --page-top-size:50px;   /* #page-topの幅・高さ */
    --page-top-z-index:99;  /* #page-topのz-index */
    --trans:0.3s ease;      /* 標準的なtransition設定 */

    /* ノイズ背景 */
    --bg-noise:url(/wp-content/themes/ckmr_hos/assets/images/common/bg_noise.webp);
}
html {
    margin: 0;
    padding: 0;
    overscroll-behavior:none;/* 領域外へスクロールしようとした際のバウンスを無効化 */
}
body {
    font-family:var(--font-ibm);
    color: var(--color-base-font);
    font-size:clamp(0.875rem, calc(0.77rem + 0.449vw), 1rem); /* vp:375-820px 14-16px */
    font-weight: var(--weight-regular);
    line-height: 1.8;
    background: #fff;
    overflow-wrap: anywhere; /* 収まらない場合に折り返す */
    word-break: normal; /* 単語の分割はデフォルトに依存 */
    line-break: strict; /* 禁則処理を厳格に適用 */
    text-align: justify;
    text-justify: inter-ideograph;
    min-width: 375px;
    margin: 0;
    padding:0;
}

div,
p,
ul,
ul li,
dl,
dt,
dd,
address {
    font-size: 1em;
    font-style: normal;
    list-style: none;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
img,
video,
object {
    max-width: 100%;
    height: auto;
    border: none;
}
iframe {
    width:100%;
    height:auto;
    aspect-ratio:16/9;
}
img {
    display: inline-block;
    vertical-align: bottom; /* 隙間を解消 */
    image-rendering: -webkit-optimize-contrast !important;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-size:1rem;
    text-align: left;
    line-height: 1.5;
    letter-spacing: 0;
    padding: 0;
    margin: 0;
}
button {
    color:inherit;
}

/* ========== aタグ ========== */
a {
    color: var(--color-main);
    text-decoration: none;
    transition: all ease 0.3s;
}
a:hover {
    opacity: 0.7;
    text-decoration: underline;
}
a[href^="tel:"] {
    color: var(--color-base-font) !important;
    text-decoration: none !important;
    pointer-events: none;
    text-emphasis: none !important;
}
a[href^="fax:"] {
    color: var(--color-base-font) !important;
    text-decoration: none !important;
    pointer-events: none;
}

a[target="_blank"],
a[href$=".pdf"],
a[href$=".xlsx"],
a[href$=".xlsm"],
a[href$=".xlsb"],
a[href$=".xls"],
a[href$=".docx"],
a[href$=".doc"],
a[href$=".docm"],
a[href$=".dotx"]{
    &::after {
        content:"";
        display:inline-block;
        margin-left:0.25em;
        aspect-ratio:1;
        background-color:currentColor;
        mask:no-repeat center / contain;
        vertical-align:middle;
    }
}
/* 別タブアイコン */
a[target="_blank"]::after {
    width:0.9em;
    mask-image:url(assets/images/common/icon_link.svg);
}
/* PDFアイコン */
a[href$=".pdf"]::after {
    width:1em;
    mask-image:url(assets/images/common/icon_pdf.svg);
}
/* Excelアイコン */
a:is([href$=".xlsx"], [href$=".xlsm"], [href$=".xlsb"], [href$=".xls"])::after {
    width:1em;
    mask-image:url(assets/images/common/icon_excel.svg);
}
/* Wordアイコン */
a:is([href$=".docx"], [href$=".doc"], [href$=".docm"], [href$=".dotx"])::after{
    width:1em;
    mask-image:url(assets/images/common/icon_word.svg);
}
/* アイコン非表示用クラス */
a.no-icon::after {
    content:none;
}

@media only screen and (max-width:1200px) {
    :root {
        --header-height:90px;
    }
}
@media only screen and (max-width: 820px) { }
@media only screen and (max-width: 468px) {
    :root {
        --header-height:75px;   /* headerの高さ */
        --page-top-size:65px;   /* #page-topの幅・高さ */
    }
    a[href^="tel:"] {
        pointer-events: all;
    }
}
@media print {
    .masked-element {
        /* 必須：印刷時にCSSの画像や背景を強制的に表示させる */
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}

/* ========== dialog（モーダル） ========== */
dialog {
    inset:0;
    margin:auto;
    border:none;
}
dialog iframe {
    vertical-align:bottom;/* dialog内にiframeを入れると下に余白が生まれるため */
}
dialog::backdrop {
    background-color:rgb(0 0 0 / 0.6);
}
/* モーダル展開時、背景スクロールを無効化 */
/* html:has(dialog[open]) {
    height:100vh;
    overflow:hidden;
} */


/* カスタム改行 */
.all,
.pc,
.pc-only {
    display: inline;
}
.mb,
.sp-only {
    display: none;
}
/* 820px以下のとき（タブレット以下） */
@media screen and (max-width: 820px) {
    .pc,
    .pc-only {
        display: none;
    }
    .mb,
    .sp-only {
        display: inline;
    }
}

/* =========================================================================================
Header
=========================================================================================*/
#header {
    width: 100%;
    height:var(--header-height);
    background-color:#fff;
    padding: 0;
    margin: 0;
    position: fixed;
    inset:0 auto auto 0;
    z-index:9999;

    &::before {
        content:"";
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        height:100%;
        background:linear-gradient(0deg, rgb(213 238 255 / 0.00) 6.76%, rgb(213 238 255 / 0.40) 95.34%);
        z-index:-1;
    }

    & .spOnly { display:none;}
    & .inner {
        width: 100%;
        max-width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        padding:0 50px;
        padding:0px clamp(1.25rem, calc(-1.875rem + 4.167vw), 3.125rem);/* vp:1200-1920px 20-50px */
        position: relative;
        z-index: 1;
    }
    & a { color:inherit;}
    & a:hover { text-decoration:none;}
    & h1 { font-size: 1em; line-height: 1;}
}
#header .logo {
    display:flex;
    align-items:center;
    gap:clamp(1rem, calc(0.167rem + 1.111vw), 1.5rem);/* vp:1200-1920px 16-24px */
    transition: 0.5s 0.25s;

    /* & svg { width: 100%; display: block;}
    & svg .cls-1 { fill: #0093d0;}
    & svg .cls-2 { fill: #5f5f5f;} */
    & a { display: block; width:230px;}
    & a.toppage-logo { width:390px;}
    & a:hover { opacity: 1;}
    & .logo_80th { width:4em;}

}
/* スマホ時メニュー用のロゴ群 */
#header .sp-fixed-content { display:none;}

/* groupbtn & openbtn ---------------------------------------------------------*/
#header :is(.groupbtn, .openbtn) { display:none;}

/* g-navi-area ---------------------------------------------------------*/
#g-navi-area { flex-shrink:0;}

/* headerの右側上部 --------------- */
#g-navi-area .g-navi-top {
    font-size:0.875em;
    font-weight:var(--weight-medium);
    display:flex;
    align-items:center;
    justify-content:end;
    gap:0.75em;
    margin-top:1em;

    & a[target="_blank"]::after { content:none;}

    /* ----- 検索フォーム ----- */
    & .search-wrap {
        display:flex;
        align-items:center;
        gap:1.4em;
    }
    & .search-area {
        opacity:0;
        visibility:hidden;
        transition:opacity 0.3s, visibility 0.3s;
    }
    & #sitesearch {
        display:flex;
    }
    & .search-input {
        width:250px;
        padding:0.25em 0.75em;
        border:solid 1px var(--color-main);
        background-color:#fff;
    }
    & .btn-submit {
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        width:2.5em;
        aspect-ratio:1;
        background-color:var(--color-main);
    }
    & .btn-submit::before {
        content:"";
        display:block;
        width:60%;
        aspect-ratio:1;
        background-color:#fff;
        mask:url(assets/images/common/icon_search.svg) no-repeat center / contain;
    }
    & .btn-submit span { display:none;}
    /* 検索フォーム展開時処理 */
    & .search-wrap.panelactive .search-area {
        opacity:1;
        visibility:visible;
    }

    /* ----- 検索 ----- */
    & .search-open {
        position:relative;
        display:block;
        padding-left:1.25em;
        color:var(--color-main);
    }
    & .search-open::before,
    & .search-open::after {
        content:"";
        position:absolute;
        inset:50% auto auto 0;
        translate:0 -50%;
        display:block;
        width:1em;
        height:1lh;
        background-color:currentColor;
        mask:no-repeat center / contain;
    }
    & .search-open::before {
        mask-image:url(assets/images/common/icon_search.svg);
        opacity:1;
        transition:opacity 0.3s;
    }
    & .search-open::after {
        mask-image:url(assets/images/common/icon_close.svg);
        opacity:0;
        transition:opacity 0.3s;
    }

    /* 検索フォーム展開時処理 */
    & .search-open.btnactive::before { opacity:0;}
    & .search-open.btnactive::after { opacity:1;}

    /* アクセス */
    & .g-navi-access {
        display:flex;
        align-items:center;
        gap:0.25em;
        color:var(--color-main);
    }
    & .g-navi-access::before {
        content:"";
        display:block;
        width:1em;
        height:1lh;
        background-color:currentColor;
        mask:url(assets/images/common/icon_map.svg) no-repeat center / contain;
        transition:mask-image 0.3s;
    }
    

    /* ----- 近森会グループTOP、お問い合わせ ----- */
    & :is(.g-navi-group, .g-navi-contact) {
        display:flex;
        align-items:center;
        gap:0.25em;
        padding:0.25em 0.75em;
        border-radius:var(--border-radius);
    }
    & .g-navi-group {
        color:var(--color-main-dark);
        background-color:#fff;
        border:solid 1px #90BDE1;
    }
    & .g-navi-contact {
        display:flex;
        align-items:center;
        gap:0.25em;
        color:#fff;
        background-color:var(--color-main);
    }
    & .g-navi-contact::before {
        content:"";
        display:block;
        width:1.15em;
        aspect-ratio:1;
        background-color:currentColor;
        mask:url(assets/images/common/icon_mail.svg) no-repeat center / contain;
    }
}

/* headerの右側下部 --------------- */
#g-navi-area .g-navi-bottomWrap { display:contents;}
#g-navi-area .g-navi-bottom {
    font-weight:var(--weight-medium);
    display:flex;
    align-items:baseline;
    gap:0 clamp(1rem, calc(-0.25rem + 1.667vw), 1.75rem);/* vp:1200-1920px 16-28px */
    margin-top:0.75em;

    /* メガメニュー展開時の透過背景 */
    &::before {
        content:"";
        position:absolute;
        inset:var(--header-height) auto auto 0;
        width:100%;
        height:calc(100vh - var(--header-height));
        background-color:rgb(6 41 70 / 0.6);
        backdrop-filter:blur(4.75px);
        opacity:0;
        visibility:hidden;
        pointer-events:auto;
        z-index:-1;
        transition:opacity var(--trans), visibility var(--trans);
    }
    &:has(button.active)::before {
        opacity:1;
        visibility:visible;
    }
    /* メガメニュー展開用ボタン（クリックで.active） */
    & button {
        display:flex;
        align-items:center;
        gap:0.25em;
        padding-bottom:1em;
    }
    & button svg:has(use) {
        --circle-color:var(--color-main-dark);
        --arrow-color:var(--color-main-dark);

        width:1em;
        aspect-ratio:1;
        transition:rotate var(--trans);
    }
    /* メガメニュー */
    & .g-navi-megamenu {
        position:absolute;
        inset:var(--header-height) auto auto 0;
        width:100%;
        background-color:var(--color-main);
        color:#fff;
        opacity:0;
        visibility:hidden;
        transition:opacity var(--trans), visibility var(--trans);
    }
    & .g-navi-inner {
        display:grid;
        grid-template:
            "img title" auto
            "img links" 1fr / auto 1fr;
        gap:0 3em;
        width:min(95%, 1280px);
        margin-inline:auto;
        padding-block:3em;

        & .g-navi-thumbnail { grid-area:img;}
        & .g-navi-title { grid-area:title;}
        & .g-navi-megamenuLinks { grid-area:links;}
    }
    /* メガメニューのサムネイル画像 */
    & .g-navi-thumbnail img {
        width:230px;
        aspect-ratio:230/193;
        object-fit:cover;
    }
    /* メガメニューの見出し */
    & .g-navi-title { 
        font-size:23px;
        margin-bottom:1em;
        padding-bottom:1em;
        border-bottom:solid 1px rgb(255 255 255 / 0.5);
    }
    /* メガメニュ―内のリンク集 */
    & .g-navi-megamenuLinks {
        container-type:inline-size;/* .g-navi-megamenuLinks-sub にて使用 */
        align-self:start;
        display:flex;
        flex-wrap:wrap;
        gap:1em 3em;
        font-weight:var(--weight-regular);
    }
    & .g-navi-megamenuLinks a {
        display:flex;
        gap:1em;
    }
    .g-navi-megamenuLinks a::after {
        content:"";
        display:block;
        width:0.5em;
        height:1lh;
        background-color:currentColor;
        mask:url(assets/images/common/arrow.svg) no-repeat center / contain;
    }
    & .g-navi-megamenuLinks-sub {
        font-size:15px;
        display:flex;
        flex-wrap:wrap;
        gap:0.75em 2.6666em;
        width:100cqw;
        margin-block:0.5em;
    }
    & .g-navi-megamenuLinks-sub a {
        display:flex;
        gap:0.5em;
    }
    & .g-navi-megamenuLinks-sub a::before {
        content:"";
        flex-shrink:0;
        display:block;
        width:1em;
        height:1lh;
        background-color:var(--color-khaki);
        clip-path:circle(0.25em at 50% 50%);
    }
    & .g-navi-megamenuLinks-sub a::after {
        content:none;
    }

}
/* メガメニュー展開 */
#g-navi-area .g-navi-bottom button.active {
    & svg:has(use) { rotate:0.5turn;}

    & + .g-navi-megamenu {
        opacity:1;
        visibility:visible;
    }
}
/* ==================================================
メニュー切り替え
================================================== */
@media screen and (max-width:1200px) {
    #header {
        --inner-padding:1rem;/* .innerのpadding値。 .groupbtn, .openbtnにて使用 */
        --btn-size:calc(var(--header-height) - var(--inner-padding) * 2);/* .groupbtn, .openbtnのサイズ */
        --btn-z-index:10;/* .groupbtn, .openbtnのz-index値 */

        & .spOnly { display:block;}
    }
    
    #header .inner {
        position:relative;
        padding:var(--inner-padding);
        height:var(--header-height);
        transition:background-color var(--trans);
    }

    /* logo ---------------------------------------------------------*/
    #header .logo { position:absolute; gap:1em; z-index:var(--btn-z-index);}
    #header .logo a { width:140px;}
    #header .logo a.toppage-logo { width:220px;}
    #header .logo .logo_80th { width:3em;}

    /* groupbtn & openbtn ---------------------------------------------------------*/
    /* 共通部分 --------------- */
    #header :is(.groupbtn, .openbtn) {
        font-weight:var(--weight-bold);
        text-align:center;
        line-height:1.2;
        color:var(--color-main-dark);
        position:absolute;
        inset-block:var(--inner-padding) 0;
        height:var(--btn-size);
        aspect-ratio:1;
        border-radius:var(--border-radius);
        z-index:var(--btn-z-index);
    }
    /* グループTOPボタン --------------- */
    #header .groupbtn {
        font-size:11px;
        inset-inline:auto calc(var(--btn-size) + var(--inner-padding) * 2);
        display:grid;
        place-items:center;
        padding:0px;
        background-color:#fff;
        border:solid 1px #90BDE1;
    }
    #header .groupbtn::after { content:none;}
    /* メニューボタン --------------- */
    #header .openbtn {
        font-size:10px;
        inset-inline:auto var(--inner-padding);
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:0.6em;
        color:#fff;
        background:linear-gradient(to bottom, #1478DC 35%, #004891 100%);
        box-shadow:inset 0px 0px 0.5rem var(--color-main-dark);

        /* 三本線部分 */
        & .openbtn-lineWrap {
            --line-height:2px; /* 線の高さ */
            --gap:round(down, 0.5em, 1px); /* 線間の幅 */
            --rotate:-45deg; /* メニュー展開時の角度 */
            position:relative;
            display:block;
            width:calc(100% - 3.5em);
            height:calc(var(--line-height) * 3 + var(--gap) * 2);

            & span {
                position:absolute;
                inset-inline:0 auto;
                display:block;
                width:100%;
                height:var(--line-height);
                background-color:currentColor;
                border-radius:var(--border-radius);
                transition:all var(--trans);
            }
            & span:nth-of-type(1) { inset-block:0 auto;}
            & span:nth-of-type(2) { inset-block:50% auto; translate:0 -50%;}
            & span:nth-of-type(3) { inset-block:auto 0;}
        }
        /* テキスト部分 */
        & .openbtn-textWrap {
            display:grid;

            & p { grid-area:1/1/1/1; transition:opacity var(--trans);}
            & p:nth-of-type(2) { opacity:0;}
        }
    }
    /* メニュー展開時処理（#g-navi-area.active） --------------- */
    #header .openbtn:has(+ #g-navi-area.active) {
        /* 三本線 */
        & .openbtn-lineWrap {
            & span:nth-of-type(1) {
                inset-block:50% auto;
                translate:0 -50%;
                rotate:var(--rotate);
            }
            & span:nth-of-type(2) { opacity:0;}
            & span:nth-of-type(3) {
                inset-block:auto 50%;
                translate:0 50%;
                rotate:abs(var(--rotate));
            }
        }

        /* テキスト部分 */
        & .openbtn-textWrap {
            & p:nth-of-type(1) { opacity:0;}
            & p:nth-of-type(2) { opacity:1;}
        }
    }

    /* g-navi-area ---------------------------------------------------------*/
    #g-navi-area {
        position:absolute;
        inset:0 0 auto auto;
        padding:calc(var(--header-height) + 2rem) 2rem 0;
        height:100dvh;
        background-color:#fff;
        translate:100% 0%;
        z-index:calc(var(--btn-z-index) - 1);

        transition:translate var(--trans);
    }
    #g-navi-list {
        display:grid;
        grid-template-rows:auto 1fr;
        gap:1.5em 0;
        max-height:100%;
    }
    /* メニュー展開時処理（#g-navi-area.active） --------------- */
    #g-navi-area.active {
        translate:0% 0%;
    }

    /* g-navi-top ---------------------------------------------------------*/
    #g-navi-area .g-navi-top {
        justify-content:center;
        margin-block:0;

        & li:not([class]) { display:none;}
        & .search-area { opacity:1; visibility:visible;}
        & .btn-submit { width:3.2em;}
        & .btn-submit::before { width:45%;}
        & .btn-submit span {
            font-size:11px;
            display:block;
            line-height:1.2;
            color:#fff;
        }
        & .search-open { display:none;}
    }

    /* g-navi-bottom ---------------------------------------------------------*/
    #g-navi-area .g-navi-bottomWrap {
        display:block;
        max-height:100%;
        padding-bottom:2em;
        overflow-y:auto;
        scrollbar-width:thin;
        overscroll-behavior:none;
    }
    #g-navi-area .g-navi-bottom {
        --accent-color-20:rgb(0 75 107 / 0.2);
        --accent-color-40:color-mix(in sRGB, var(--color-main-dark) 60%, transparent 40%);
        flex-direction:column;
        margin-top:0;

        &::before { content:none;}
        & > li { /*font-size:1.2em;*/ width:100%; padding-block:1em;}
        & > li > :is(a, button) { font-size:1.2em;}
        & > li:has(button) { padding-bottom:0px;}
        & > li + li { border-top:solid 1px var(--accent-color-20);}
        & > li:last-of-type { border-bottom:solid 1px var(--accent-color-20);}
        & button {
            justify-content:space-between;
            width:100%;
        }
        & button::after {
            flex-shrink:0;
            width:1.5em;
            background-color:var(--accent-color-40);
        }

        /* メガメニュー */
        & .g-navi-megamenu {
            position:static;
            display:grid;
            grid-template-rows:0fr;
            background-color:transparent;
            overflow:hidden;
            color:inherit;
            opacity:1;
            visibility:visible;
            transition:grid-template-rows var(--trans);
        }
        & .g-navi-inner {
            display:block;
            width:100%;
            padding-block:0px;
            overflow:hidden;
        }

        /* メガメニュー：サムネイル画像・タイトル */
        & :is(.g-navi-thumbnail, .g-navi-title) { display:none;}

        /* メガメニュー：リンク部分 */
        & .g-navi-megamenuLinks {
            row-gap:0px;
            padding-inline:1em;
            font-weight:var(--weight-regular);

            & > li { width:100%;}
            & > li + li { border-top:dashed 1px color-mix(in sRGB, #000 30%, #fff 70%);}
            & > li > :is(a, div) { padding-block:1em; line-height:1.5;}
            & > li:first-of-type > :is(a, div) { padding-top:0;}
            & > li > a { justify-content:space-between; align-items:center;}
            & > li > :is(a, div):has(+ .g-navi-megamenuLinks-sub) { padding-bottom:0px;}
            & > li > a::after { flex-shrink:0; background-color:var(--accent-color-40);}
        }
        & .g-navi-megamenuLinks-sub {
            flex-direction:column;
            row-gap:0px;

            & a { padding-block:.5em;}
            & a::before { background-color:#0092D1;}
        }
        /* メガメニュー展開時処理 */
        & button.active + .g-navi-megamenu {
            grid-template-rows:1fr;
        }
    }

    /* g-navi-other ---------------------------------------------------------*/
    #g-navi-area .g-navi-other {
        display:flex;
        flex-direction:column;
        gap:0.75em 0;
        padding:1em;

        & a:not([class]) {
            display:flex;
            align-items:center;
            gap:0.25em;
        }
        & a:not([class])::before {
            content:"";
            display:block;
            width:1.1em;
            aspect-ratio:1;
            background:url(assets/images/common/arrow_circle_blue.svg) no-repeat center / contain;
        }
        & a:not([class])::after {
            position:static;
            translate:unset;
            background-color:color-mix(in sRGB, var(--color-base-font), var(--color-gray));
        }
        & .g-navi-contact-sp {
            font-size:1.07em;
            font-weight:var(--weight-bold);
            text-align:center;
            display:grid;
            grid-template-columns:0.75em 1fr 0.75em;
            align-items:center;
            gap:1em;
            padding:1em 1.5em;
            background-image:
                linear-gradient(#fff, #fff),
                linear-gradient(
                    to right bottom,
                    color-mix(in sRGB, var(--color-main-dark) 50%, transparent 50%),
                    color-mix(in sRGB, var(--color-main-dark) 20%, transparent 80%),
                    color-mix(in sRGB, var(--color-main-dark) 50%, transparent 50%)
                );
            background-origin:border-box;
            background-clip:padding-box, border-box;
            border:solid 2px transparent;
            border-radius:var(--border-radius);
            box-shadow:2px 2px 6px rgb(0 0 0 / 0.15);
        }
        & .g-navi-contact-sp::before,
        & .g-navi-contact-sp::after { content:"";}
        & .g-navi-contact-sp::after {
            content:"";
            display:block;
            width:100%;
            aspect-ratio:1;
            background-color:#004B6B;
            mask:url(assets/images/common/arrow_solf.svg) no-repeat center / contain;
        }
    }

}
@media screen and (max-width:468px) {
    /* ==================================================
    スマホ時のみの特別仕様
        ・スマホメニューアイコンのみ追従
        ・メニュー展開はスライドインからフェードインへ変更
    ================================================== */
    #header {
        --inner-padding:0.5rem;
        position:absolute;
    }
    #header .openbtn,
    #header .sp-fixed-content,
    #g-navi-area {
        position:fixed;
    }

    /* .sp-fixed-contentでない要素のz-indexを減少 */
    #header :is(.logo, .groupbtn):not(.sp-fixed-content) {
        z-index:calc(var(--btn-z-index) - 1);
    }

    #header .sp-fixed-content {
        opacity:0;
        visibility:hidden;
        transition:opacity var(--trans), visibility var(--trans);
    }
    #header .logo.sp-fixed-content {
        display:flex;
    }
    #g-navi-area {
        width:100%;
        translate:0 0;
        opacity:0;
        visibility:hidden;
        transition:opacity var(--trans), visibility var(--trans);
    }

    /* メニュー展開 */
    #g-navi-area.active {
        opacity:1;
        visibility:visible;
    }
    #header .sp-fixed-content:has(~ #g-navi-area.active) {
        opacity:1;
        visibility:visible;
    }
}


/* 印刷用に調整 */
@media print {
    #header {
        position: absolute;
    }
}



/* =========================================================================================
Footer
=========================================================================================*/
#footer {
    position:relative;
    color:#fff;
    text-align:start;

    background:var(--color-main-dark) var(--bg-noise) no-repeat center / cover;
    background-blend-mode:multiply;
    z-index:1;

    &::after {
        content:"";
        position:absolute;
        inset:0 auto auto 0;
        display:block;
        width:100%;
        height:100%;
        background:radial-gradient(88.45% 63.35% at 50% -4.71%, #86C0D8 0%, #1478DC 25%, transparent 100%) no-repeat center / cover;
        z-index:-1;
    }

    & a { color:inherit;}
    & a:hover { text-decoration:none;}
    & a[href^="tel"] {
        display:flex;
        gap:0.25em;
        color:inherit!important;

        &::before {
            content:"";
            display:block;
            width:1em;
            height:1lh;
            background-color:currentColor;
            mask:url(assets/images/common/icon_tel.svg) no-repeat center/ contain;
        }
    }
    & .inner {
        display:flex;
        justify-content:space-between;
        gap:0 clamp(1.5rem, -2.591rem + 10.909vi, 3rem);/* viewport:600-820px 24-48px */
        padding-block:3em 4.375em;
    }

    /* .footer-left */
    & .footer-left-wrap { display:contents;}
    & .footer-info { margin-top:2em;}
    & .footer-info-address {
        font-size:0.875em;
        display:flex;
        flex-wrap:wrap;
        gap:0 1em;
    }
    & .footer-info-address .postcode {
        white-space:nowrap;
        text-align:center;
    }
    & .footer-info-hours {
        font-size:1.125em;
        display:flex;
        align-items:baseline;
        gap:0.5em;
        margin-top:1em;
    }
    & .footer-info-hours span {
        font-size:0.7777em;
        flex-shrink:0;
        display:inline-block;
        padding-inline:0.5em;
        border:solid 1px;
    }
    & .footer-info-other {
        display:flex;
        align-items:center;
        flex-wrap:wrap;
        gap:0.5em;
        margin-top:1em;
    }
    & .footer-info-other p:nth-of-type(1) {
        font-size:0.9875em;
        position:relative;
        padding-inline:0.5em;
        z-index:0;

        &::before {
            content:"";
            position:absolute;
            inset:0;
            margin:auto;
            display:block;
            width:100%;
            height:100%;
            background-color:rgb(0 0 0 / 0.2);
            z-index:-1;
        }
    }
    & .footer-info-other p:nth-of-type(2) { font-size:0.8125em;}
    & .footer-info-other p:nth-of-type(2) a { text-decoration:underline;}
    & .copyright {
        font-size:0.75em;
        display:flex;
        flex-wrap:wrap;
        gap:0 1em;
        margin-top:4em;
        color:rgb(255 255 255 / 0.7);
    }

    /* .footer-right */
    & .footer-right { flex-shrink:0;}
    & .footer-contact {
        font-size:0.9375em;
        display:grid;
        grid-template-columns:0.5em 1fr 0.5em;
        align-items:center;
        gap:0.5em;
        width:23.5em;
        margin-inline:auto 0;
        padding:1em;
        border:solid 1px #fff;
        border-radius:var(--border-radius);
        text-align:center;
        transition:color var(--trans), background-color var(--trans);

        &::before,
        &::after { content:"";}
        &::after {
            display:block;
            width:100%;
            height:1lh;
            background-color:currentColor;
            mask:url(assets/images/common/arrow.svg) no-repeat center / contain;
        }

        /* hover */
        &:hover {
            opacity:1;
            color:var(--color-main);
            background-color:rgb(255 255 255 / 0.7);
        }
    }
    & .footer-navi1 {
        display:grid;
        grid-template-columns:1fr auto;
        gap:0.75em 1em;
        margin-block:1.5em;

        & a {
            font-size:0.875em;
            display:flex;
            align-items:start;
            gap:0.25em;
        }
        & a::before {
            content:"";
            display:block;
            width:1.25em;
            height:1lh;
            background:url(assets/images/common/arrow_circle_white.png) no-repeat center / contain;
        }
        & a::after {
            width:1em;
            height:1lh;
            aspect-ratio:unset;
            vertical-align:unset;
        }
    }
    & .footer-other {
        display:flex;
        justify-content:end;
        gap:0.5em;
    }
    & .footer-other a {
        font-size:0.75em;
        font-weight:var(--weight-medium);
        display:flex;
        align-items:center;
        gap:0.5em;
        padding:0.75em 1.25em;
        background-color:#fff;
        border-radius:var(--border-radius);
        color:#3B3B3B;
        text-align:center;
        line-height:1.2;
    }
    & .footer-other .footer-other-images {
        display:flex;
        gap:0.5em;
    }
    & .footer-navi2 {
        font-size:0.8125em;
        font-weight:var(--weight-light);
        display:flex;
        justify-content:end;
        flex-wrap:wrap;
        gap:0 1em;
        margin-top:4em;
    }
    & .footer-navi2 a {
        text-decoration:underline;
    }
}
@media only screen and (max-width: 820px) {
    #footer {

        & .footer-left { display:contents;}
        & .footer-left-wrap { display:block;}
        & .inner {
            display:grid;
            grid-template:
                "left right" auto
                "copy copy" 1fr / 1fr 1fr;
            gap:1em 3em;
            padding-block:4em 3em;
        }
        /* 配置変更 */
        & .footer-left-wrap { grid-area:left;}
        & .footer-right { grid-area:right;}
        & .copyright { grid-area:copy;}
        
        /* .footer-left */
        & .footer-info-address {
            flex-direction:column;
            align-items:center;
        }
        & .footer-info-hours {
            font-size:0.875em;
            flex-direction:column;
            align-items:center;
            margin-top:2em;
            white-space:nowrap;
            text-align:center;
        }
        & .footer-info-hours span {
            font-size:1.15em;
            display:grid;
            grid-template-columns:1fr auto 1fr;
            align-items:center;
            gap:0.5em;
            width:100%;
            border:none;
            padding:0px;
    
            &::before,
            &::after {
                content:"";
                display:block;
                width:100%;
                height:1px;
                background-color:currentColor;
            }
        }
        & .footer-info-other { flex-direction:column; font-size:0.9em;}
        & .footer-info-other p:nth-of-type(1) {
            font-size:1em;
            font-weight:var(--weight-regular);
            padding:0.25em 1em;
        }
        & .footer-info-other p:nth-of-type(2) { font-size:0.85em;}
        & .copyright {
            font-size:0.8em;
            flex-direction:column;
            align-items:center;
            margin-top:2.5em;
        }

        /* .footer-right */
        & .footer-contact { width:100%;}
        & .footer-other { gap:1em;}
        & .footer-other a {
            font-size:0.85em;
            flex-direction:column;
            justify-content:end;
            row-gap:0.5em;
            padding-inline:0.8em;
        }
        & .footer-other a:nth-of-type(1) img { width:3.4em;}
        & .footer-other a:nth-of-type(2) { row-gap:1em;}
        & .footer-other a:nth-of-type(2) img {
            width:clamp(1.25rem, -2.159rem + 9.091vi, 2.5rem);/* viewport:468-820px 20-40px */
        }
        & .footer-other .footer-other-images { gap:0.75em;}
        & .footer-navi1 a { font-size:0.8em;}
        & .footer-navi2 { margin-top:2em;}
    }
}
@media only screen and (max-width:600px) {
    #footer {
        
        & :is(.footer-left, .footer-left-wrap, .footer-right) { display:contents;}
        
        & .inner {
            display:flex;
            flex-direction:column;
            align-items:center;
            gap:0px;
            padding-block:5em 7em;
        }
        /* 順番変更 */
        & .logo { order:1;}
        & .footer-info { order:2;}
        & .footer-contact { order:3;}
        & .footer-navi1 { order:4;}
        & .footer-other { order:5;}
        & .footer-navi2 { order:6;}
        & .copyright { order:7;}
    
        /* .footer-left */
        & .logo { width:18em;}
        & .footer-info { margin-top:3em;}
        & .footer-info-address { font-size:0.8125rem;}
        & .footer-info-hours { font-size:1em; margin-top:1em;}
        & .footer-info-other { font-size:1em;}
        & .copyright { font-size:0.875em;}
    
        /* .footer-right */
        & .footer-contact { font-size:1.0714em; width:min(13em, 100%); margin:2.5em auto;}
        & .footer-other a { font-size:0.875em;}
        & .footer-other a:nth-of-type(2) img { width:3em;}
        & .footer-navi1 { column-gap:2em; margin-block:0 2em;}
        & .footer-navi1 a { font-size:0.9285em;}
        & .footer-navi2 { font-size:0.9285em; margin-top:2em;}
    }
}
/* =========================================================================================
.sp-bottom-menu（sbm）
    .sbm-slim  ... 展開前のボトムメニュー
    .sbm-thick ... 展開後のボトムメニュー
=========================================================================================*/
/* =============== 共通部分 =============== */
.sp-bottom-menu {
    display:none; /* PC画面では非表示 */
    position:fixed;
    inset:auto auto 0 0;
    background:var(--color-main) var(--bg-noise) no-repeat center / cover;
    background-blend-mode:multiply;
    color:#fff;

    /* ========== キャッチ部分 ========== */
    & .sbm-catch {
        font-size:16px;
        font-family:var(--font-zen-old);
        line-height:1.35;
        text-align:center;
    }
    & .sbm-catch .large {
        font-size:1.25em;
        letter-spacing:0.05em;
    }

    /* ========== 開閉ボタン ========== */
    & .sbm-button {
        font-size:13px;
        font-weight:var(--weight-bold);
        color:var(--color-base-font);
        display:flex;
        justify-content:center;
        align-items:center;
        gap:0.25em;
        padding-inline:0.5em;
        background-color:#fff;
    }
    & .sbm-button::after {
        content:"";
        display:block;
        width:0.75em;
        aspect-ratio:1;
        background-color:currentColor;
        mask:url(assets/images/common/arrow.svg) no-repeat center / contain;
        rotate:-90deg;
    }
}

/* =============== .sbm-slim（展開前） =============== */
.sbm-slim {
    width:calc(100% - var(--page-top-size));
    height:var(--page-top-size);
    opacity:0;
    visibility:hidden;
    transition:opacity var(--trans), visibility var(--trans);
    z-index:calc(var(--page-top-z-index) - 1);

    & .sbm-catch-wrap {
        display:flex;
        justify-content:space-evenly;
        align-items:center;
        height:100%;
    }
    & .sbm-button { height:calc(100% - 2em);}
    &:has(~ #page-top.active) {
        opacity:1;
        visibility:visible;
    }
}

/* =============== .sbm-thick（展開後） =============== */
.sbm-thick {
    width:100%;
    translate:0 100%;
    transition:translate var(--trans);
    z-index:calc(var(--page-top-z-index) + 1);

    & .sbm-inner {
        display:grid;
        grid-template-rows:auto 1fr;
        gap:0.75rem;
        max-height:calc(100svh - var(--header-height));
        padding:20px;
    }
    & .sbm-catch-wrap {
        display:grid;
        grid-template-columns:1fr auto;
        align-items:start;
    }
    & .sbm-catch { font-size:20px;}
    & .sbm-button {
        font-weight:var(--weight-medium);
        display:grid;
        grid-template-columns:1fr auto;
        gap:0px;
        padding-block:0.25em;
        width:100px;
        border-radius:var(--border-radius);
    }
    & .sbm-button::after { rotate:90deg;}
    & .sbm-scroll-wrap { overflow-y:auto;}

    /* ========== 症状 ========== */
    & .sbm-case {
        padding:1rem 1.25rem;
        background-color:#003C78;
    }
    & .sbm-case + .sbm-case { margin-top:0.75rem;}
    & .sbm-case dt { font-size:15px; text-align:center;}
    & .sbm-case dd { font-size:13px;}
    & .sbm-case .large { font-size:1.2em; color:#FFF600;}

    /* ========== その他リンクボタン ========== */
    & .sbm-links {
        display:grid;
        grid-template-columns:repeat(3, 1fr);
        gap:1rem;
        margin-top:1rem;
    }
    & .sbm-links figure {
        font-size:15px;
        font-weight:var(--weight-medium);
        color:var(--color-base-font);
        display:flex;
        flex-direction:column;
        justify-content:center;
        align-items:center;
        gap:0.5em;
        aspect-ratio:107/99;
        border-radius:var(--border-radius);
        background-color:#fff;

        &.sbm-link-red {
            background-color:#FB3022;
            color:#fff;
        }
    }
    & .sbm-links li:nth-of-type(1) img { width:44.5898%; aspect-ratio:48/51;}
    & .sbm-links li:nth-of-type(2) img { width:40.1869%; aspect-ratio:43/41;}
    & .sbm-links li:nth-of-type(3) img { width:49.5327%; aspect-ratio:53/36;}
}

/* =============== .sbm-thick.active（展開時処理） =============== */
.sbm-thick.active {
    translate:0 0%;
}

@media only screen and (max-width:468px){
    .sbm-slim { display:block;}
    .sbm-thick { display:block;}
}



/* =========================================================================================
Page Top
=========================================================================================*/
#page-top {
    display:block;
    position: fixed;
    inset:auto 10px 10px auto;
    opacity:0;
    visibility:hidden;
    transition:opacity var(--trans), visibility var(--trans);
    z-index:var(--page-top-z-index);

    &.active { opacity:1; visibility:visible;}
}
#page-top a {
    color:#fff;
    font-size:12px;
    line-height: 1;
    text-decoration: none;
    font-weight: var(--weight-bold);
    width:var(--page-top-size);
    aspect-ratio: 1 / 1;
    display: flex;
    flex-direction:column;
    align-items: center;
    justify-content: center;
    gap:0.5em;
    background-color:#003C78;

    &::before {
        content:"";
        display:block;
        width:1.1em;
        aspect-ratio:1;
        background-color:currentColor;
        mask:url(assets/images/common/arrow_line.svg) no-repeat center / contain;
        rotate:-90deg;
    }
}
@media only screen and (max-width:468px){
    #page-top {
        inset:auto 0 0 auto;
    }
}
@media print {
    #page-top {
        display: none !important;
    }
}

/* =========================================================================================
Layout
=========================================================================================*/
#wrapper {
    padding: 0;
    margin: 0 auto;
    position: relative;
    /* overflow: hidden; */
}
#contents {
    padding-block:var(--header-height) 0;
    margin: 0 auto;
    position: relative;
}
body.page-template-page-free-edit #contents {
    padding-block: 0;
}
#main {
    margin: 0;
    padding: 0;
}
section {
    position: relative;
    padding-block:60px;
    margin: 0;
}
.inner {
    max-width: var(--contents-width-main);
    width: calc(100% - 40px - 40px); /*左右の余白40pxずつ*/
    margin: 0 auto;
    position: relative;
}
.inner-sub {
    margin-left:2rem;
}
@media only screen and (max-width: 980px) {
    #contents {
        padding-block: 100px 0;
    }
}
@media only screen and (max-width: 820px) {
    #contents {
        padding-block: 0;
    }
    section {
        padding-block:45px;
    }
    .inner {
        width: calc(100% - 20px - 20px);
    }
}
@media only screen and (max-width: 468px) {
    section {
        padding-block:30px;
    }
}

/* iframe ----------------------------------------------------------------------*/
#contents iframe {
    pointer-events: all !important;
}

/* google map -------------------------------------------------------------*/
#contents .map {
    position: relative;
    min-height: 320px;
}
#contents .map iframe {
    width: 100%;
    aspect-ratio: 400 / 260;
    height: auto;
    pointer-events: all;
}
/* 印刷用に調整 */
@media print {
    #contents .map iframe {
        width: auto !important;
        height: auto !important;
    }
}

/*sidebar ----------------------------------------------------------------------*/
#contents .post-content:has(#sidebar) /*#sidebarがあるとき*/ {
    width: calc(100% - 40px - 40px);
    max-width: var(--contents-width-main);
    display: grid;
    grid-template-columns: 3fr minmax(250px, 1fr);
    align-items: start;
    gap: 6.5%;
    margin-inline: auto;
}
#contents .post-content:has(#sidebar) .post-content-main {
    width: 100%;
}
#contents .post-content:has(#sidebar) .post-content-main section {
    padding-block: 0;
}
#contents .post-content:has(#sidebar) .post-content-main .inner {
    width: 100%;
}
/* aside ------------------------------------- */
#sidebar {
    padding: 0;
    margin: 0;
}
#sidebar .box + .box {
    margin-top: 50px;
}
#sidebar .side-title {
    color: var(--color-main);
    font-family: "Shippori Mincho", serif;
    font-size: clamp(1.125rem, calc(0.704rem + 1.798vw), 1.625rem); /* min: 18px, max: 26px */
    font-weight: var(--weight-semibold);
    line-height: 1.4;
    width: 100%;
    margin-bottom: 1em;
}
#sidebar .side-nav ul {
    line-height: 1.4;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.1em;
}
#sidebar .side-nav ul li a {
    color: var(--color-base-font);
    display: block;
    width: fit-content;
    padding-block: 0.2em 0.3em;
}
#sidebar .side-nav ul li a::before {
    content: "";
    width: 0.6em;
    aspect-ratio: 1 / 1;
    background-color: var(--color-main);
    position: absolute;
    top: 0;
    left: 0.2em;
    z-index: 1;
    -webkit-mask-image: url(assets/images/common/arrow_mask.svg);
    mask-image: url(assets/images/common/arrow_mask.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    translate: 0 0.6em;
    transition: 0.3s;
}
/*1階層*/
#sidebar .side-nav > ul > li {
    padding-block: 0.1em 0.2em;
    padding-left: 1.2em;
    position: relative;
    z-index: 1;
}
#sidebar .side-nav > ul > li > a::before {
    translate: 0 100%;
}
@media only screen and (max-width: 980px) {
    #contents .post-content:has(#sidebar) /*#sidebarがあるとき*/ {
        display: block;
        width: calc(100% - 20px - 20px);
    }
    #contents .post-content:has(#sidebar) .post-content-main {
        width: 100%;
    }
    #sidebar {
        margin-top: 75px;
        margin-inline: auto;
    }
}
@media only screen and (max-width: 468px) {
    #sidebar {
        margin-top: 50px;
        margin-inline: auto;
    }
}


/* =========================================================================================
Post list
=========================================================================================*/
/*common*/
.post-list {
    width: 100%;
    margin: 0;
    padding: 0;
}
.post-list ul {
    width: 100%;
    margin: 0;
    padding: 0;
}
.post-list ul a {
    color: var(--color-base-font);
    text-decoration: none !important;
    display: inline-block;
}
.post-list ul a:hover {
    text-decoration: none;
}
.post-list ul li {
    width: 100%;
}
.post-list .no-post {
    text-align: center;
    display: block;
    padding: 10vh 1em;
}
.post-list .cat {
    font-size: clamp(0.563rem, calc(0.246rem + 1.348vw), 0.938rem); /* min: 9px, max: 15px */
    line-height: 1.2;
    height: auto;
    translate: 0 -10%;
}
.post-list .cat a {
    text-align: center;
    display: block;
    min-width: 130px;
    background: #fff;
    border: 2px solid var(--color-gray);
    border-radius: 50px;
    padding: 0.5em 0.5em 0.25em;
}
.post-list .cat a.cat-obituary {
    background-color: var(--color-gray);
}

/*column ------------------------------------------------------------*/
.post-list.column ul {
    margin-bottom: 50px;
}
.post-list.column ul li {
    background-image: repeating-linear-gradient(90deg, var(--color-gray), var(--color-gray) 2px, transparent 2px, transparent 5px);
    background-position: left bottom;
    background-repeat: repeat-x;
    background-size: 100% 1px;
    padding: 1.5em 0 1.2em;
}
.post-list.column ul li article {
    display: grid;
    grid-template-columns: auto 130px 1fr;
    align-items: start;
    justify-content: left;
    gap: 0 1em;
}
.post-list.column .date {
    color: var(--color-main);
    /*font-size: clamp(0.625rem, calc(0.204rem + 1.798vw), 1.125rem); /* min: 10px, max: 18px */
    font-size: clamp(0.75rem, calc(0.434rem + 1.348vw), 1.125rem); /* min: 12px, max: 18px */
    font-weight: var(--weight-medium);
}
.post-list.column .title {
    font-size: clamp(0.75rem, calc(0.381rem + 1.573vw), 1.188rem); /* min: 12px, max: 19px */
    font-weight: var(--weight-medium);
    line-height: 1.5;
    padding-left: 1em;
}
.post-list.column .title a {
    display: inline-block;
    position: relative;
    z-index: 1;
}
.post-list.column .title a[href*=".pdf"] {
    padding-left: 1.5em;
}
.post-list.column .title a[href*=".pdf"]::before {
    content: "";
    background: var(--color-base-font);
    width: 1.25em;
    aspect-ratio: 1 / 1;
    border-radius: 0;
    position: absolute;
    right: suto;
    left: 0;
    top: 0;
    translate: 0 0.15em;
    z-index: 1;
    -webkit-mask-image: url(assets/images/common/icon_pdf.svg);
    mask-image: url(assets/images/common/icon_pdf.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    transition: 0.3s;
}
.post-list.column .title a:hover {
    color: var(--color-main);
    opacity: 1;
}
.post-list.column .title a[href*=".pdf"]:hover::before {
    background: var(--color-main);
}
@media only screen and (max-width: 820px) {
    .post-list.column ul li article {
        display: grid;
        grid-template-columns: 6em 1fr;
        grid-template-rows: auto 1fr;
        align-items: start;
        gap: 0.25em 5%;
    }
    .post-list.column .date {
        grid-area: 1 / 1 / 2 / 2;
        text-align: center;
        width: auto !important;
    }
    .post-list.column .cat {
        grid-area: 2 / 1 / 3 / 2;
    }
    .post-list .cat a {
        text-align: center;
        min-width: 57px;
        border-width: 1px;
    }
    .post-list.column .title {
        grid-area: 1 / 2 / 3 / 3;
        width: 100% !important;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding-left: 0;
    }
}
@media only screen and (max-width: 468px) {
    .post-list.column ul li article {
        grid-template-columns: 5em 1fr;
    }
    .post-list.column ul {
        margin-bottom: 30px;
    }
    .post-list.column ul li {
        padding: 1.2em 0 1em;
    }
}

/* row ------------------------------------------------------------------------*/
.post-list.row ul {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
    align-items: stretch;
    margin-bottom: 50px;
}
.post-list.row li {
    filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.1));
}
.post-list.row li:only-child {
    max-width: 380px;
}
.post-list.row li article {
    background: #fff;
    height: 100%;
    display: grid;
    grid-template-columns: minmax(200px, 40%) 1fr;
    align-items: stretch;
    border-radius: 20px;
    overflow: hidden;
}
.post-list.row li article a {
    height: 100%;
    display: block;
}
.post-list.row .thumbnail {
    position: relative;
}
.post-list.row .thumbnail img {
    width: 100%;
    height: 100%;
    min-height: 215px;
    display: block;
    object-fit: cover;
    aspect-ratio: 1 / 1;
}
.post-list.row .post-content {
    width: 100%;
    height: fit-content;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1em 1.5em;
    padding: 10%;
    margin: auto;
}
.post-list.row .date {
    color: var(--color-main);
    font-weight: var(--weight-medium);
}
.post-list.row .title {
    font-size: clamp(0.75rem, calc(0.381rem + 1.573vw), 1.188rem); /* min: 12px, max: 19px */
    font-weight: var(--weight-bold);
    line-height: 1.5;
    width: 100%;
}
@media only screen and (max-width: 820px) {
    .post-list.row li {
        filter: none;
    }
    .post-list.row li article {
        background: transparent;
        border-radius: 0;
        grid-template-columns: minmax(125px, 30%) 1fr;
        gap: 20px;
        overflow: visible;
    }
    .post-list.row li article a {
        height: auto;
    }
    .post-list.row .thumbnail img {
        min-height: auto;
        /*aspect-ratio: 124 / 82;*/
    }
    .post-list.row .post-content {
        padding: 0;
    }
    .post-list.row .date {
        color: var(--color-base-font);
    }
}
@media only screen and (max-width: 468px) {
}


/* =========================================================================================
モーダル画面
=========================================================================================*/
/* モーダル背景（オーバーレイ） */
#custom-modal {
    display: none; /* 最初は絶対に表示させない */
}
/* JavaScriptで移動が完了し、かつ非表示クラスがついていない時だけ表示 */
body > #custom-modal:not(.is-hidden) {
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4); /* 背景を暗く */
    display: flex; /* 初期状態から表示 */
    align-items: center;
    justify-content: center;
    position: fixed;
    z-index: 9999; /* WordPressのツールバーより手前に表示 */
    left: 0;
    top: 0;
    backdrop-filter: blur(4px); /* 背景をぼかす（モダンブラウザ用） */
}
/* 非表示にするためのクラス */
#custom-modal .modal-overlay.is-hidden {
    display: none;
}
/* モーダルコンテンツ */
#custom-modal .modal-content {
    padding: 30px;
    width: fit-content;
    max-width: 1000px;
    max-height: 80vh;
    margin: auto;
    position: relative;
    animation: modal-fadein 0.4s ease-out; /* ふわっと表示 */
}
#custom-modal .modal-content img {
    width: auto;
    max-height: 80vh;
}
/* 閉じるボタン（×） */
#custom-modal .modal-close-btn {
    position: absolute;
    top: -20px;
    right: 0;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
    color: #fff;
    transition: 0.3s;
}
#custom-modal .modal-close-btn:hover {
    opacity: 0.7;
}
/* モーダルコンテンツ（テキスト掲載用） */
#custom-modal .modal-content.text {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}
/* 閉じるボタン（テキスト掲載用）（×） */
#custom-modal .modal-content.text .modal-close-btn {
    top: 10px;
    right: 15px;
    font-size: 28px;
    color: #aaa;
    display: inline-block;
}
#custom-modal .modal-content.text .modal-close-btn:hover {
    color: #333;
}
/* 表示用クラス */
#custom-modal .modal-overlay.is-visible {
    display: block;
}
/* モーダル表示中のbody制御 */
body.is-modal-open {
    overflow: hidden; /* スクロールを禁止 */
}
/* モーダル表示中のヘッダー制御 */
body.is-modal-open #header {
    pointer-events: none;
}
/* アニメーション定義 */
@keyframes modal-fadein {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
@media only screen and (max-width: 468px) {
    #custom-modal .modal-content {
        padding: 15px;
    }
    #custom-modal .modal-close-btn {
        position: absolute;
        top: -30px;
        right: 5px;
        font-size: 30px;
        transition: 0.3s;
    }
}


/* =========================================================================================
シェアボタン プラグイン
=========================================================================================*/
.addtoany_content a::before {
    display: none !important;
}