@charset "UTF-8";

:root {
    --cl-main: #53a852;
    --cl-sub1: #4c4948;
    --cl-sub2: rgba(83, 168, 82, 0.1);
    --cl-sub1-soft: rgba(76, 73, 72, 0.1);
    --cl-accent: #dc490b;
    --cl-bg: #f0f0f0;
    --cl-txt: #333;
    --cl-white: #fff;
    --cl-border: #c5c5c5;

    --width-wide: 1024px;
    --width-default: 900px;
    --width-narrow: 800px;

    --space-sec: 120px;
    --space-sec-sp: 60px;
    --space-block: 50px;
    --space-block-sp: 25px;
}

button {
    font: inherit;
}

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,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline;
}

html {
    line-height: 1;
}

ol,
ul {
    list-style: none;
}

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

caption,
th,
td {
    text-align: left;
    font-weight: normal;
    vertical-align: middle;
}

q,
blockquote {
    quotes: none;
}

q:before,
q:after,
blockquote:before,
blockquote:after {
    content: none;
}

a img {
    border: none;
}

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

html,
body {
    font-size: 10px;
}

body {
    font-family: 'Noto Sans JP', sans-serif;
    line-height: 1.7;
    color: var(--cl-txt);
    min-width: 1024px;
}

@media screen and (max-width: 769px) {
    body {
        min-width: inherit;
    }
}

.pc-on {
    display: block;
}

.sp-on {
    display: none;
}

a {
    text-decoration: none;
    transition: all 0.5s;
    color: var(--cl-txt);
}

img {
    height: auto !important;
}

@media screen and (min-width: 770px) {
    a img {
        transition: opacity 0.5s;
        backface-visibility: hidden;
    }

    a:hover {
        opacity: 0.7;
        text-decoration: none;
    }

    a[href^="tel:"] {
        pointer-events: none;
    }

}

@media screen and (max-width: 769px) {
    .pc-on {
        display: none;
    }

    .sp-on {
        display: block;
    }

    img {
        width: 100%;
    }

    input[type="text"],
    input[type="button"],
    input[type="email"],
    input[type="submit"],
    input[type="password"],
    textarea {
        box-sizing: border-box;
        appearance: none;
        -webkit-appearance: none;
        max-width: 100%;
        border-radius: 0;
    }
}

.bl-logo {
    line-height: 1;

    a,
    img {
        display: block;
    }

    img {
        width: 100%;
    }
}

.bl-address {
    font-size: 0;

    dt,
    dd {
        display: inline-block;
        font-size: 1.4rem;
        letter-spacing: 0.16em;
    }

    dt {
        margin-right: 0.5em;
    }

    @media screen and (max-width: 769px) {
        dt,
        dd {
            font-size: 1.2rem;
        }
    }
}

.bl-contact {
    display: flex;
    line-height: 1.4;

    .bl-contact_list {
        display: flex;
        line-height: 1;
    }

    dl {
        margin-right: 1em;
        letter-spacing: 0.16em;

        &:last-child {
            margin-right: 0;
        }
    }

    dt,
    dd {
        display: inline-block;
    }

    dt {
        margin-right: 0.5em;
    }
}

.sec-header {
    position: relative;

    .el-menuBtn {
        display: none;
    }

    .bl-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        max-width: 1024px;
        margin-inline: auto;
        padding-block: 16px;
    }

    .bl-logo {
        width: 320px;
    }

    .st-headerCopy {
        text-align: right;
        font-size: 1.4rem;
        letter-spacing: 0.16em;
    }

    .bl-address {
        text-align: right;
    }

    .bl-contact {
        justify-content: flex-end;
        gap: 10px;
        padding-left: 32px;
        text-align: right;

        .el-contactIcon {
            flex: 0 0 auto;
            width: 22px;

            img {
                display: block;
                width: 100%;
            }
        }

        dt,
        dd {
            font-size: 2.2rem;
        }
    }

    .bl-globalNav {
        border-top: 1px solid var(--cl-border);

        .bl-globalNav_home {
            display: none;
        }

        .bl-globalNav_list {
            display: flex;
            align-items: center;
            justify-content: space-between;
            max-width: 1024px;
            margin-inline: auto;
            text-align: center;
            font-size: 1.8rem;
            line-height: 1.4;
            letter-spacing: 0.08em;
        }

        li {
            width: 25%;
            height: 80px;
            border-left: 1px solid var(--cl-border);

            &:last-child {
                border-right: 1px solid var(--cl-border);
            }
        }

        a {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            height: 80px;

            &:hover,
            &[aria-current="page"] {
                background: var(--cl-main);
                color: var(--cl-white);
            }
        }
    }

    @media screen and (max-width: 769px) {
        .el-menuBtn {
            position: fixed;
            top: 12px;
            right: 12px;
            z-index: 10001;
            display: grid;
            place-items: center;
            box-sizing: border-box;
            width: 48px;
            height: 48px;
            padding: 0;
            border: 1px solid rgb(255 255 255 / 0.55);
            border-radius: 4px;
            background: var(--cl-main);
            box-shadow: 0 2px 8px rgb(0 0 0 / 0.18);
            line-height: 0;
            cursor: pointer;

            .el-menuBtn_icon {
                position: relative;
                display: block;
                width: 24px;
                height: 2px;
                background: var(--cl-white);
                transition: background-color 0.2s;

                &::before,
                &::after {
                    position: absolute;
                    left: 0;
                    width: 100%;
                    height: 2px;
                    background: var(--cl-white);
                    content: "";
                    transition: transform 0.25s;
                }

                &::before {
                    transform: translateY(-7px);
                }

                &::after {
                    transform: translateY(7px);
                }
            }

            &[aria-expanded="true"] {
                box-shadow: none;

                .el-menuBtn_icon {
                    background: transparent;

                    &::before {
                        transform: rotate(45deg);
                    }

                    &::after {
                        transform: rotate(-45deg);
                    }
                }
            }

            &:focus-visible {
                outline: 2px solid var(--cl-white);
                outline-offset: 3px;
            }
        }

        .bl-header {
            flex-direction: column;
            margin-inline: 5%;
            padding: 30px 0 16px;
        }

        .bl-logo {
            width: min(100%, 300px);
            margin-bottom: 16px;
        }

        .st-headerCopy {
            margin-bottom: 8px;
            text-align: center;
            font-size: 1.2rem;
        }

        .bl-address {
            display: flex;
            flex-direction: column;
            text-align: center;
        }

        .bl-contact {
            align-items: center;
            justify-content: center;
            margin-top: 10px;
            padding-left: 0;
            text-align: center;

            .bl-contact_list {
                flex-direction: column;
            }

            dl {
                display: block;
                width: 100%;
            }

            dt,
            dd {
                font-size: 2rem;
            }

            dt {
                text-align: left;
                font-size: 1.8rem;
            }
        }

        .bl-globalNav {
            position: fixed;
            inset: 0;
            z-index: 10000;
            display: grid;
            place-items: center;
            box-sizing: border-box;
            width: 100%;
            min-height: 100dvh;
            padding: 80px 5% 40px;
            overflow-y: auto;
            border: 0;
            background: color-mix(in srgb, var(--cl-main) 92%, transparent);
            visibility: hidden;
            opacity: 0;
            pointer-events: none;
            backdrop-filter: blur(4px);
            transition: opacity 0.3s ease, visibility 0s linear 0.3s;

            &.is-open {
                visibility: visible;
                opacity: 1;
                pointer-events: auto;
                transition-delay: 0s;
            }

            .bl-globalNav_list {
                flex-direction: column;
                width: min(100%, 420px);
                font-size: 1.8rem;
                letter-spacing: 0.12em;
            }

            li {
                box-sizing: border-box;
                width: 100%;
                height: auto;
                border: 0;
                border-bottom: 1px solid rgb(255 255 255 / 0.45);

                &:last-child {
                    width: 100%;
                    border-right: 0;
                    border-bottom: 0;
                }
            }

            .bl-globalNav_home {
                display: block;
            }

            a {
                box-sizing: border-box;
                min-height: 58px;
                height: auto;
                padding: 12px 20px;
                color: var(--cl-white);

                &[aria-current="page"] {
                    background: rgb(255 255 255 / 0.16);
                    color: var(--cl-white);
                }

                &:focus-visible {
                    outline: 2px solid var(--cl-white);
                    outline-offset: -4px;
                }
            }
        }
    }
}

@media screen and (max-width: 769px) {
    body.is-menuOpen {
        overflow: hidden;
    }

    body.admin-bar .sec-header .el-menuBtn {
        top: 58px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sec-header {
        .el-menuBtn_icon,
        .el-menuBtn_icon::before,
        .el-menuBtn_icon::after,
        .bl-globalNav {
            transition: none;
        }
    }
}

.kv,
.bl-kv {
    padding-top: 27%;
    background: url(../img/common/key_visual.jpg) no-repeat center;
    background-size: cover;
}

.bl-inner {
    display: grid;
    gap: 30px;
    width: min(90%, var(--content-width, var(--width-wide)));
    margin-inline: auto;

    @media screen and (max-width: 769px) {
        gap: 15px;
    }
}

main > :where(section[class^="sec-"], section[class*=" sec-"]) {
    padding-block-end: var(--sec-space, var(--space-sec));

    @media screen and (max-width: 769px) {
        padding-block-end: var(--sec-space-sp, var(--space-sec-sp));
    }
}

.content__ttl,
.st-pageTtl {
    text-align: center;
    font-size: 3rem;
    font-weight: normal;
    letter-spacing: 0.12em;
    overflow-wrap: anywhere;
}

.content__ttl {
    padding: 45px 0 30px;
}

.st-pageTtl {
    padding-top: 45px;
}

@media screen and (max-width: 769px) {
    .content__ttl,
    .st-pageTtl {
        font-size: 2rem;
    }

    .content__ttl {
        padding: 15px 0;
    }

    .st-pageTtl {
        padding-top: 15px;
    }

}

.st-secTtl {
    text-align: center;
    font-size: 3rem;
    font-weight: 400;
    letter-spacing: 0.12em;

    @media screen and (max-width: 769px) {
        font-size: 2rem;
    }
}

.st-subTtl {
    color: var(--cl-main);
    font-size: 2.6rem;
    font-weight: 400;

    @media screen and (max-width: 769px) {
        font-size: 1.8rem;
    }
}

.st-txt {
    font-size: 1.8rem;

    @media screen and (max-width: 769px) {
        font-size: 1.4rem;
    }
}

.st-note {
    margin-top: 5px;
    font-size: 1.2rem;
}

.st-empty {
    text-align: center;
    font-size: 1.6rem;

    @media screen and (max-width: 769px) {
        font-size: 1.4rem;
    }
}

.st-postMeta {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px 1em;
    color: var(--cl-sub1);
    font-size: 1.3rem;

    span {
        color: var(--cl-main);
    }
}

.tel-info,
.bl-contactBox {
    box-sizing: border-box;
    width: min(90%, 740px);
    margin-inline: auto;
    padding: 40px 70px;
    border-radius: 7px;
    background: var(--cl-sub2);
    font-size: 5rem;
    line-height: 1.4;

    @media screen and (max-width: 769px) {
        padding: 20px 5%;
        font-size: 3rem;
    }
}

.tel-info__item,
.bl-contactBox dl {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--cl-main);
    text-align: center;

    &:last-child {
        margin-bottom: 0;
        padding-bottom: 0;
        border-bottom: 0;
    }
}

.tel-info__item .note {
    font-size: 1.7rem;

    @media screen and (max-width: 769px) {
        font-size: 1.2rem;
    }
}

.tel-info .item--tel::before,
.tel-info .item--fax::before,
.bl-contactBox dl::before {
    display: block;
    flex: 0 0 auto;
    margin-right: 20px;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
}

.tel-info .item--tel::before,
.bl-contactBox dl:first-of-type::before {
    width: 56px;
    height: 56px;
    background-image: url(../img/common/icon_tel.png);

    @media screen and (max-width: 769px) {
        width: 28px;
        height: 28px;
        margin-right: 5%;
    }
}

.bl-contactBox dl::before {
    margin-right: 30px;
}

.tel-info .item--fax::before,
.bl-contactBox dl:nth-of-type(2)::before {
    width: 56px;
    height: 81px;
    margin-right: 30px;
    background-image: url(../img/common/icon_fax.png);

    @media screen and (max-width: 769px) {
        width: 28px;
        height: 40px;
        margin-right: 5%;
    }
}

.tel-info .item--tel a,
.tel-info .item--fax a,
.tel-info .item--tel a span,
.bl-contactBox a {
    display: block;
}

.tel-info .item--tel a span {
    font-size: 1.2rem;
}

.bl-contactBox dt {
    position: absolute;
    overflow: hidden;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.bl-contactBox > .st-note {
    margin: 0 0 10px;
    text-align: center;
    font-size: 1.7rem;

    @media screen and (max-width: 769px) {
        font-size: 1.2rem;
    }
}

.bl-contactBox dd > .st-note {
    margin: 0;
    font-size: 1.7rem;

    @media screen and (max-width: 769px) {
        font-size: 1.2rem;
    }
}

.bl-contactBox--compact dl:first-of-type::before {
    margin-right: 20px;

    @media screen and (max-width: 769px) {
        margin-right: 5%;
    }
}

.bl-contactBox--spaced {
    margin-bottom: 120px;

    @media screen and (max-width: 769px) {
        margin-bottom: 60px;
    }
}

.bottom-link {
    margin-bottom: 50px;
    padding: 30px 0;
    background: var(--cl-sub2);
}

@media screen and (max-width: 769px) {
    .bottom-link {
        margin-bottom: 25px;
    }
}

.bottom-link__inner {
    max-width: 880px;
    margin: 0 auto;
    display: flex;
    justify-content: space-around;
}

@media screen and (max-width: 769px) {
    .bottom-link__inner {
        margin: 0 5%;
        justify-content: space-between;
    }
}

@media screen and (max-width: 769px) {
    .bottom-link li {
        width: 32%;
    }
}

.bottom-link__item {
    background: var(--cl-white);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    letter-spacing: 0.08em;
}

@media screen and (min-width: 770px) {
    .bottom-link__item {
        width: 250px;
        height: 230px;
        font-size: 2.2rem;
    }
}

@media screen and (max-width: 769px) {
    .bottom-link__item {
        width: 100%;
        height: 100%;
        padding: 10px 5px;
        box-sizing: border-box;
        font-size: 1.2rem;
    }
}

.bottom-link__item img {
    width: 140px;
    margin-bottom: 30px;
}

@media screen and (max-width: 769px) {
    .bottom-link__item img {
        width: 80px;
        margin-bottom: 15px;
    }
}

.el-pageTop {
    position: relative;
    display: block;
    width: 100%;
    padding: 40px 0 20px;
    background: var(--cl-bg);
    text-align: center;
    font-size: 1.8rem;
    letter-spacing: 0.08em;

    &::before {
        position: absolute;
        top: 20px;
        right: 0;
        left: 0;
        display: block;
        width: 28px;
        height: 16px;
        margin: auto;
        background: url(../img/common/icon_up.png) no-repeat center / contain;
        content: "";
    }

    @media screen and (max-width: 769px) {
        padding: 30px 0 5px;
        font-size: 1.4rem;

        &::before {
            top: 10px;
        }
    }
}

.sec-footer {
    .bl-footer {
        max-width: 1024px;
        margin-inline: auto;
        padding: 40px 0 50px;
    }

    .bl-footer_info {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 20px;
        padding-bottom: 30px;
        border-bottom: 1px solid var(--cl-border);
    }

    .bl-logo {
        width: 400px;
    }

    .bl-address {
        text-align: right;
    }

    .bl-contact {
        justify-content: flex-end;
        text-align: right;

        .bl-contact_list {
            justify-content: flex-end;
        }

        dt,
        dd {
            font-size: 1.4rem;
        }
    }

    .bl-footerNav {
        width: 60%;
        margin-bottom: 40px;

        .bl-footerNav_list {
            display: flex;
            flex-wrap: wrap;
        }

        li {
            box-sizing: border-box;
            min-width: 180px;
            margin-bottom: 10px;
            padding-left: 10px;
            font-size: 1.4rem;
        }

        a {
            color: var(--cl-main);

            &[aria-current="page"] {
                font-weight: 700;
                text-decoration: underline;
            }
        }
    }

    .st-copyright {
        text-align: center;
        font-size: 1.3rem;
    }

    @media screen and (max-width: 769px) {
        .bl-footer {
            margin-inline: 5%;
        }

        .bl-footer_info {
            flex-direction: column;
            margin-bottom: 15px;
            padding-bottom: 15px;
        }

        .bl-logo {
            width: 100%;
            margin-bottom: 16px;
        }

        .bl-address,
        .bl-contact {
            justify-content: flex-start;
            text-align: left;
        }

        .bl-contact {
            .bl-contact_list {
                justify-content: flex-start;
            }

            dt,
            dd {
                font-size: 1.2rem;
            }
        }

        .bl-footerNav {
            width: 100%;
            margin-bottom: 20px;

            li {
                width: 100%;
                min-width: 0;
                padding-left: 0;
            }
        }

        .st-copyright {
            font-size: 1.1rem;
        }
    }
}

.page-index {
    .content {
        counter-reset: number;
    }

    .content__ttl {
        margin-bottom: 50px;
        padding: 30px 0 15px;
        border-bottom: 1px solid #ccc;
        font-size: 2.5rem;

        @media screen and (max-width: 769px) {
            margin-bottom: 25px;
            padding: 15px 0 8px;
            font-size: 2rem;
        }
    }

    .wrap {
        width: 880px;
        margin-inline: auto;

        @media screen and (max-width: 769px) {
            width: auto;
            margin-inline: 5%;
        }
    }

    .lead {
        margin-bottom: 100px;
        font-weight: normal;

        @media screen and (max-width: 769px) {
            margin-bottom: 50px;
        }
    }

    .block {
        margin-bottom: 120px;

        @media screen and (max-width: 769px) {
            margin-bottom: 60px;
        }
    }

    .block__ttl {
        margin-bottom: 50px;
        text-align: center;
        font-size: 2.2rem;
        font-weight: normal;
        letter-spacing: 0.12em;

        @media screen and (max-width: 769px) {
            margin-bottom: 25px;
            font-size: 1.8rem;
        }

        &.num::before {
            display: block;
            color: var(--cl-main);
            font-family: lato, sans-serif;
            font-size: 4.5rem;
            line-height: 1;
            content: counter(number, decimal-leading-zero);
            counter-increment: number;

            @media screen and (max-width: 769px) {
                font-size: 2.8rem;
            }
        }
    }

    .block__ttl--2 {
        margin-bottom: 30px;

        @media screen and (max-width: 769px) {
            margin-bottom: 15px;
        }
    }

    .block__list {
        display: flex;
        justify-content: space-between;

        .list-wrap {
            width: 47%;
        }

        .list {
            margin-bottom: 30px;
        }

        .case {
            display: flex;
            align-items: center;
            font-size: 2.7rem;
        }

        .case__img {
            width: 110px;
            margin-right: 16px;

            img {
                display: block;
                width: 100%;
            }
        }

        .ex {
            margin: 24px 0 60px;
            font-size: 2.4rem;

            &::before {
                color: var(--cl-main);
                content: "例：";
            }

            li {
                display: flex;
                align-items: center;
                line-height: 2;

                &::before {
                    margin-right: 1em;
                    color: var(--cl-main);
                    font-size: 1.2rem;
                    content: "■";
                }
            }
        }

        .note {
            color: var(--cl-main);
            text-align: center;
            font-size: 1.8rem;
        }

        @media screen and (max-width: 769px) {
            flex-direction: column;

            .list-wrap {
                width: auto;
                margin-inline: auto;
            }

            .list {
                margin-bottom: 15px;
            }

            .case {
                font-size: 1.6rem;
            }

            .case__img {
                width: 60px;
            }

            .ex {
                margin: 12px 0;
                font-size: 1.4rem;
            }

            .note {
                margin-bottom: 10px;
                font-size: 1.2rem;
            }
        }
    }

    .block__img {
        margin-bottom: 100px;

        &:last-child {
            margin-bottom: 0;
        }

        img {
            display: block;
            width: 100%;
        }

        @media screen and (max-width: 769px) {
            margin-bottom: 50px;
        }
    }

    .block__lead {
        margin-bottom: 15px;
        text-align: center;
        font-size: 1.8rem;

        @media screen and (max-width: 769px) {
            text-align: left;
            font-size: 1.4rem;
        }
    }

    .block__table {
        width: 100%;

        tr:first-child {
            th,
            td {
                border-bottom: 0;
            }
        }

        th,
        td {
            padding: 10px 20px;
            border-right: 1px solid var(--cl-white);
            border-bottom: 1px solid var(--cl-white);
            text-align: center;
            line-height: 1.4;

            @media screen and (max-width: 769px) {
                padding: 10px;
            }
        }

        th {
            font-size: 1.9rem;

            &.bg-light-main {
                color: var(--cl-main);
            }

            @media screen and (max-width: 769px) {
                font-size: 1.4rem;
            }
        }

        td {
            font-size: 1.8rem;

            @media screen and (max-width: 769px) {
                font-size: 1.2rem;
            }
        }

        .bg-main {
            background: var(--cl-main);
            color: var(--cl-white);
        }

        .bg-light-main {
            background: var(--cl-sub2);
        }

        .bg-sub {
            background: var(--cl-sub1);
            color: var(--cl-white);
        }

        .bg-light-sub {
            background: var(--cl-sub1-soft);
        }

        .align-l {
            text-align: left;
        }
    }

    .caretime_bold {
        color: var(--cl-accent);
        font-size: 2.2rem;
        font-weight: bold;
    }

    .tel-info {
        width: 740px;

        .item--tel::before {
            margin-right: 30px;
        }

        @media screen and (max-width: 769px) {
            width: auto;

            .item--tel::before {
                margin-right: 5%;
            }
        }
    }
}

.bl-newsList {
    display: grid;
    gap: 10px;

    li {
        display: flex;
        align-items: center;
        gap: 2em;
    }

    time {
        flex: 0 0 auto;
        font-size: 1.3rem;
    }

    a {
        font-size: 1.6rem;
    }

    @media screen and (max-width: 769px) {
        li {
            display: block;
        }

        time {
            display: block;
            margin-bottom: 2px;
        }

        a {
            font-size: 1.4rem;
            word-break: break-word;
        }
    }
}

.el-moreLink {
    position: relative;
    display: block;
    width: fit-content;
    margin-left: auto;
    padding-right: 12px;
    text-decoration: none;
    font-size: 1.4rem;
}

.el-moreLink::after {
    position: absolute;
    top: 0;
    right: 2px;
    bottom: 0;
    width: 6px;
    height: 6px;
    margin: auto;
    border-top: 2px solid var(--cl-main);
    border-right: 2px solid var(--cl-main);
    content: "";
    transform: rotate(45deg);
}

.un-news,
.un-newsDetail {
    --content-width: var(--width-narrow);
}

.bl-pagination {
    > .page-numbers {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
    }

    a,
    span {
        display: grid;
        place-items: center;
        min-width: 40px;
        min-height: 40px;
        box-sizing: border-box;
        padding: 5px 10px;
        border: 1px solid var(--cl-main);
        border-radius: 4px;
        color: var(--cl-main);
        font-size: 1.4rem;
    }

    .current {
        background: var(--cl-main);
        color: var(--cl-white);
    }

    .dots {
        border-color: transparent;
    }

    @media screen and (max-width: 769px) {
        > .page-numbers {
            gap: 5px;
        }

        a,
        span {
            min-width: 36px;
            min-height: 36px;
            padding-inline: 8px;
            font-size: 1.2rem;
        }
    }
}

.un-about {
    --content-width: var(--width-default);
}

.bl-infoTable {
    width: 100%;
    border: 1px solid var(--cl-main);
    font-size: 1.6rem;

    th,
    td {
        padding: 15px 20px;
    }

    th {
        width: 28%;
        border-bottom: 1px solid var(--cl-white);
        background: var(--cl-main);
        color: var(--cl-white);
    }

    td {
        border-bottom: 1px solid var(--cl-main);

        a {
            color: var(--cl-main);
        }
    }

    tr:last-child {
        th,
        td {
            border-bottom: 0;
        }
    }

    .st-note {
        line-height: 1.6;
    }

    @media screen and (max-width: 769px) {
        font-size: 1.4rem;

        th,
        td {
            padding: 10px;
        }
    }
}

.el-btnLink {
    display: block;
    width: fit-content;
    margin-top: 8px;
    padding: 3px 8px;
    border-radius: 8px;
    background: var(--cl-main);
    color: var(--cl-white) !important;
}

.bl-clinicList {
    display: flex;
    flex-wrap: wrap;
    gap: 0 0.5em;

    li:not(:last-child)::after {
        margin-left: 0.5em;
        content: "/";
    }
}

.un-doctor {
    --content-width: var(--width-default);
}

.bl-doctorList {
    display: grid;
    gap: var(--space-block);
}

.bl-doctorCard {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 30px;

    &.is-noImage {
        grid-template-columns: minmax(0, 1fr);
    }

    > figure {
        width: 150px;
        height: 200px;
        overflow: hidden;

        img {
            width: 100%;
            height: 100% !important;
            object-fit: cover;
        }
    }

    > div {
        display: grid;
        gap: 1.5em;
        min-width: 0;
        font-size: 1.6rem;
        line-height: 1.5;
    }

    header {
        p {
            color: var(--cl-main);
        }

        h2 {
            padding-bottom: 10px;
            border-bottom: 1px solid var(--cl-main);
            font-weight: 400;

            span {
                margin-right: 0.5em;
                font-size: 2rem;
            }

            small {
                font-size: 1em;
            }
        }
    }

    .bl-doctorProfile {
        display: grid;
        gap: 1.5em;

        h3 {
            color: var(--cl-main);
            font-weight: 400;
        }
    }

    @media screen and (max-width: 769px) {
        grid-template-columns: minmax(0, 1fr);
        gap: 15px;

        > figure {
            margin-inline: auto;
        }

        > div {
            font-size: 1.4rem;
        }

        header h2 span {
            font-size: 1.8rem;
        }
    }
}

.un-visitingCare {
    --content-width: var(--width-narrow);
}

.el-txtLink {
    color: var(--cl-main);
    text-decoration: underline;
}

.st-contactGuide {
    width: min(100%, 740px);
    margin: 10px auto;
    text-align: center;
    font-size: 1.4rem;
}

.bl-serviceArea--bordered img {
    border: 1px solid var(--cl-main);
    border-radius: 8px;
}

.bl-featureList {
    display: grid;
    gap: 60px;

    li {
        display: flex;
        gap: 40px;
    }

    li > img {
        display: block;
        flex: 0 0 auto;
        width: 160px;
    }

    li > div {
        display: grid;
        gap: 10px;
        min-width: 0;
        flex: 1;
        margin-top: 10px;
    }

    @media screen and (max-width: 769px) {
        li {
            gap: 20px;
        }

        li > img {
            width: 80px;
        }

        li > div {
            gap: 5px;
            margin-top: 0;
        }
    }
}

.bl-careList {
    display: grid;
    gap: 70px;

    > section {
        width: min(100%, 700px);
        margin-inline: auto;
    }

    .st-subTtl {
        width: 185px;
        margin: 0 auto 30px;
        border-radius: 6px;
        background: var(--cl-main);
        color: var(--cl-white);
        text-align: center;
        font-size: 2rem;
        line-height: 2.2;

        @media screen and (max-width: 769px) {
            font-size: 1.8rem;
        }
    }

    ul {
        box-sizing: border-box;
        display: flex;
        flex-wrap: wrap;
        border: 1px solid var(--cl-main);
    }

    li {
        box-sizing: border-box;
        width: 50%;
        padding: 10px;
        border-bottom: 1px solid var(--cl-main);
        font-size: 1.8rem;

        &:nth-child(odd) {
            border-right: 1px solid var(--cl-main);
        }

        &:nth-child(4n-1),
        &:nth-child(4n) {
            background: var(--cl-sub2);
        }

        &:last-child,
        &:nth-last-child(2) {
            border-bottom: 0;
        }

        @media screen and (max-width: 769px) {
            font-size: 1.4rem;
        }
    }
}

.bl-flow {
    --flow-gap: 102px;
    --flow-arrow-offset: -78px;

    display: grid;
    grid-template-columns: repeat(auto-fit, 180px);
    justify-content: center;
    gap: var(--flow-gap);
    width: min(100%, 745px);
    margin-inline: auto;

    li {
        position: relative;
        width: 180px;

        &::after {
            position: absolute;
            top: 40px;
            right: var(--flow-arrow-offset);
            display: block;
            width: 50px;
            height: 44px;
            background: url(../img/common/icon_arrow.png) no-repeat center / contain;
            content: "";
        }

        &:last-child::after {
            display: none;
        }
    }

    .st-subTtl {
        margin-bottom: 10px;
        color: var(--cl-main);
        text-align: center;
        font-size: 2rem;

        span {
            font-size: 1.6rem;
        }
    }

    img {
        display: block;
        width: 98px;
        margin: 0 auto 10px;
    }

    .st-txt {
        font-size: 1.5rem;
    }

    @media screen and (max-width: 769px) {
        grid-template-columns: minmax(0, 1fr);
        gap: 20px;

        .st-subTtl {
            font-size: 1.8rem;

            span {
                font-size: 1.4rem;
            }
        }

        .st-txt {
            font-size: 1.4rem;
        }

        li {
            width: 100%;
            padding-bottom: 40px;

            &::after {
                top: auto;
                right: 0;
                bottom: 0;
                left: 0;
                width: 25px;
                height: 22px;
                margin: auto;
                transform: rotate(90deg);
            }

            &:last-child {
                padding-bottom: 0;
            }
        }
    }
}

.un-home {
    --content-width: var(--width-narrow);
}

.sec-homeIntro {
    display: grid;
    gap: 40px;

    .st-txt a {
        color: var(--cl-main);
        text-decoration: underline;
    }

    @media screen and (max-width: 769px) {
        gap: 30px;
    }
}

.bl-homeNotice {
    display: grid;
    gap: 8px;
    text-align: center;
    font-size: 1.6rem;
    line-height: 1.8;

    a {
        color: var(--cl-main);
        text-decoration: underline;
        text-decoration-thickness: 1px;
        text-underline-offset: 0.2em;

        &:focus-visible {
            outline: 2px solid var(--cl-main);
            outline-offset: 3px;
        }
    }

    @media screen and (max-width: 769px) {
        gap: 5px;
        font-size: 1.4rem;
    }
}

.sec-homeNews .st-secTtl {
    display: flex;
    align-items: center;
    gap: 20px;

    &::before,
    &::after {
        height: 1px;
        flex: 1;
        background: var(--cl-main);
        content: "";
    }

    @media screen and (max-width: 769px) {
        gap: 10px;
    }
}

.bl-serviceArea {
    display: flex;

    figure {
        flex: 0 0 auto;
        width: 400px;
        margin-right: 30px;
    }

    img {
        display: block;
        width: 100%;
    }

    dl {
        width: calc(100% - 430px);
        margin-bottom: 1.75em;
        font-size: 2.2rem;
        line-height: 1.75;
    }

    dt {
        color: var(--cl-main);
    }

    @media screen and (max-width: 769px) {
        flex-direction: column;

        figure {
            width: 100%;
            margin: 0 0 15px;
        }

        dl {
            width: 100%;
            font-size: 1.6rem;
        }
    }
}

.sec-homeFeature > .bl-inner > .st-txt {
    margin-bottom: 15px;

    @media screen and (max-width: 769px) {
        margin-bottom: 10px;
    }
}

.un-page {
    --content-width: var(--width-default);
}

.un-regulation {
    --content-width: var(--width-default);
}

.bl-regulationList {
    box-sizing: border-box;
    width: min(100%, 600px);
    margin: 0 auto 40px;
    padding-inline: 20px;
    font-size: 1.6rem;
    line-height: 1.75;

    li {
        position: relative;
        padding-left: 14px;

        & + li {
            margin-top: 10px;
        }

        &::before {
            position: absolute;
            top: 0.75em;
            left: 0;
            width: 4px;
            height: 4px;
            border-radius: 50%;
            background: var(--cl-txt);
            content: "";
        }
    }

    a {
        color: var(--cl-main);
        text-decoration: underline;
        text-underline-offset: 0.15em;
    }

    @media screen and (max-width: 769px) {
        padding-inline: 0;
        font-size: 1.4rem;
    }
}

:where(.bl-entry) {
    font-size: 1.6rem;
    line-height: 1.8;
    overflow-wrap: anywhere;

    > * + * {
        margin-top: 1.5em;
    }

    h2 {
        padding-bottom: 8px;
        border-bottom: 2px solid var(--cl-main);
        font-size: 2.4rem;
        font-weight: 500;
    }

    h3 {
        color: var(--cl-main);
        font-size: 2rem;
        font-weight: 500;
    }

    ul,
    ol {
        padding-left: 1.5em;
    }

    ul {
        list-style: disc;
    }

    ol {
        list-style: decimal;
    }

    a {
        color: var(--cl-main);
        text-decoration: underline;
    }

    img {
        max-width: 100%;
    }

    table {
        display: block;
        max-width: 100%;
        overflow-x: auto;
    }

    th,
    td {
        padding: 10px;
        border: 1px solid var(--cl-border);
    }

    blockquote {
        padding: 15px 20px;
        border-left: 4px solid var(--cl-main);
        background: var(--cl-sub2);
    }

    @media screen and (max-width: 769px) {
        font-size: 1.4rem;

        h2 {
            font-size: 2rem;
        }

        h3 {
            font-size: 1.7rem;
        }
    }
}

.bl-post {
    > header {
        text-align: center;
    }

    .st-postMeta {
        margin-block-start: 10px;
    }

    > .bl-entry {
        display: flow-root;
        font-size: 1.6rem;
        line-height: 1.8;
        overflow-wrap: anywhere;
        padding-block-start: 30px;

        > :is(h2, h3, h4) {
            margin-block-start: 2.5em;
        }

        p {
            line-height: 2;
            letter-spacing: 0.03em;
        }

        h4 {
            padding-inline-start: 12px;
            border-inline-start: 4px solid var(--cl-main);
            font-size: 1.8rem;
            font-weight: 500;
        }

        a:not(.wp-block-button__link) {
            text-decoration-thickness: 1px;
            text-underline-offset: 0.25em;

            &:hover {
                background: var(--cl-sub2);
                opacity: 1;
            }

            &:focus-visible {
                outline: 2px solid var(--cl-main);
                outline-offset: 3px;
            }
        }

        strong,
        b {
            font-weight: 700;
        }

        em,
        i {
            font-style: italic;
        }

        mark {
            padding-inline: 0.2em;
            background: var(--cl-sub2);
        }

        li + li {
            margin-block-start: 0.4em;
        }

        li::marker {
            color: var(--cl-main);
            font-weight: 500;
        }

        figure {
            max-width: 100%;
        }

        img {
            display: block;
            margin-inline: auto;
        }

        figcaption {
            margin-block-start: 0.5em;
            color: var(--cl-sub1);
            text-align: center;
            font-size: 1.3rem;
        }

        blockquote {
            border-radius: 0 4px 4px 0;

            > :first-child {
                margin-block-start: 0;
            }

            cite {
                display: block;
                margin-block-start: 0.75em;
                color: var(--cl-sub1);
                font-size: 0.85em;
            }
        }

        table {
            width: 100%;
        }

        caption {
            margin-block-end: 8px;
            font-weight: 500;
        }

        th {
            background: var(--cl-sub2);
            font-weight: 500;
        }

        hr {
            margin-block: 3em;
            border: 0;
            border-top: 1px solid var(--cl-border);
        }

        iframe {
            display: block;
            max-width: 100%;
            margin-inline: auto;
        }

        .wp-block-button__link {
            display: inline-block;
            padding: 12px 24px;
            border: 1px solid var(--cl-main);
            border-radius: 4px;
            background: var(--cl-main);
            color: var(--cl-white);
            text-decoration: none;

            &:hover,
            &:focus-visible {
                background: var(--cl-white);
                color: var(--cl-main);
                opacity: 1;
            }

            &:focus-visible {
                outline: 2px solid var(--cl-main);
                outline-offset: 3px;
            }
        }

        .aligncenter {
            margin-inline: auto;
        }

        .alignleft {
            float: left;
            margin: 0 1.5em 1em 0;
        }

        .alignright {
            float: right;
            margin: 0 0 1em 1.5em;
        }
    }

    @media screen and (max-width: 769px) {
        > .bl-entry {
            font-size: 1.4rem;
            padding-block-start: 20px;

            h4 {
                font-size: 1.6rem;
            }

            figcaption {
                font-size: 1.2rem;
            }

            .alignleft,
            .alignright {
                float: none;
                margin: 0 auto;
            }
        }
    }
}

.un-privacy {
    --content-width: var(--width-default);
}

.bl-policy {
    font-size: 1.5rem;
    line-height: 1.75;
    letter-spacing: 0.04em;
    overflow-wrap: anywhere;

    > section {
        padding-block-end: var(--space-block);

        & + section {
            padding-block-start: var(--space-block);
            border-top: 1px solid var(--cl-border);
        }

        &:last-child {
            padding-block-end: 0;
        }
    }

    section > section {
        padding-block-start: 30px;
    }

    h2 {
        padding-block-end: 10px;
        border-bottom: 2px solid var(--cl-main);
        font-size: 2.4rem;
        font-weight: 500;
    }

    h3 {
        padding-block-end: 8px;
        border-bottom: 1px solid var(--cl-border);
        color: var(--cl-main);
        font-size: 1.8rem;
        font-weight: 500;
    }

    h2 + h3 {
        margin-block-start: 25px;
    }

    h4 {
        margin-block-start: 25px;
        font-size: 1.7rem;
        font-weight: 500;
    }

    h5 {
        margin-block-start: 18px;
        font-size: 1.5rem;
        font-weight: 500;
    }

    p,
    ol,
    ul {
        margin-block-start: 10px;
    }

    ol,
    ul {
        padding-inline-start: 1.5em;
    }

    ol {
        list-style: decimal;
    }

    ul {
        list-style: disc;
    }

    li + li {
        margin-block-start: 8px;
    }

    li > :is(p, ol, ul) {
        margin-block-start: 6px;
    }

    strong {
        display: block;
        font-weight: 500;
    }

    a {
        color: var(--cl-main);
        text-decoration: underline;
    }

    address {
        margin-block-start: 25px;
        padding: 15px 20px;
        border-radius: 6px;
        background: var(--cl-sub2);
        font-style: normal;
    }

    .st-parenList {
        padding-inline-start: 2.2em;
        list-style: none;
        counter-reset: policy-item;

        > li {
            position: relative;
            counter-increment: policy-item;

            &::before {
                position: absolute;
                inset-inline-start: -2.2em;
                content: "(" counter(policy-item) ")";
            }
        }
    }

    .st-noteList {
        margin-block-start: 25px;
        padding-inline-start: 1.3em;
        list-style: none;
        font-size: 1.3rem;

        li {
            position: relative;

            &::before {
                position: absolute;
                inset-inline-start: -1.3em;
                content: "※";
            }
        }
    }

    @media screen and (max-width: 769px) {
        font-size: 1.3rem;
        letter-spacing: 0.02em;

        > section {
            padding-block-end: var(--space-block-sp);

            & + section {
                padding-block-start: var(--space-block-sp);
            }
        }

        section > section {
            padding-block-start: 22px;
        }

        h2 {
            font-size: 2rem;
        }

        h3 {
            font-size: 1.6rem;
        }

        h4 {
            font-size: 1.5rem;
        }

        h5 {
            font-size: 1.4rem;
        }

        address {
            padding: 12px 15px;
        }
    }
}

.sec-recruit {
    --sec-space-sp: 120px;
}

.bl-recruit {
    width: var(--width-wide);
    margin: 30px auto 0;

    @media screen and (max-width: 769px) {
        width: auto;
        margin: 15px 5% 0;
    }
}

.bl-recruitHeading {
    margin-bottom: 30px;
    text-align: center;
    font-size: 2.3rem;

    .bl-recruitHeading_icon {
        width: 60px;
        margin: 0 auto 10px;

        img {
            display: block;
            width: 100%;
        }
    }
}

.el-recruitBtn {
    position: relative;
    display: grid;
    box-sizing: border-box;
    width: fit-content;
    max-width: calc(100% - 40px);
    margin: 20px auto 40px;
    padding: 20px 50px 20px 40px;
    border: 1px solid var(--cl-main);
    border-radius: 8px;
    background-color: var(--cl-main);
    color: var(--cl-white);
    text-align: center;
    font-size: clamp(1.7rem, 2.5vw, 2rem);

    &::after {
        position: absolute;
        right: 20px;
        align-self: center;
        width: 10px;
        height: 10px;
        border-top: 3px solid currentColor;
        border-right: 3px solid currentColor;
        content: "";
        transform: rotate(45deg);
        transition: 0.5s;
    }

    &:hover {
        background-color: var(--cl-white);
        color: var(--cl-main);
        opacity: 1;
    }
}

.sec-404 {
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding: 50px 20px;
    text-align: center;
    font-size: 2rem;
}

.sec-404 h1 {
    font-size: 2.8rem;
    font-weight: 500;
}

.sec-404 a {
    color: var(--cl-main);
    font-weight: bold;
}

.bl-floatingBanner {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 9999;
    width: 220px;

    &.is-hidden {
        display: none;
    }

    .bl-floatingBanner_link {
        display: block;
        line-height: 0;

        img {
            display: block;
            width: 100%;
        }
    }

    .el-floatingBannerClose {
        position: absolute;
        top: -10px;
        left: -10px;
        z-index: 2;
        display: grid;
        place-items: center;
        width: 28px;
        height: 28px;
        padding: 0;
        border: 1px solid #999;
        border-radius: 50%;
        background: var(--cl-white);
        color: var(--cl-txt);
        font-size: 1.8rem;
        line-height: 1;
        cursor: pointer;
    }

    @media screen and (max-width: 769px) {
        right: 12px;
        bottom: 12px;
        width: 150px;

        .el-floatingBannerClose {
            top: -8px;
            left: -8px;
            width: 24px;
            height: 24px;
            font-size: 1.6rem;
        }
    }
}

@media screen and (max-width: 769px) {
    .sec-404 {
        gap: 20px;
        font-size: 1.6rem;
    }

    .sec-404 h1 {
        font-size: 2.2rem;
    }

}
