@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/


/* --------------------------------------------------------
ヘッダーカスタマイズ / 2025.06設定
-------------------------------------------------------- */

/* PCスクロール前
-------------------------- */
@media (min-width: 960px) {
    #header {
        position: relative;
    }
    #header::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        width: 100%;
        height: 5px;
        background: linear-gradient(to right, rgba(241, 238, 194, 1), rgba(217, 236, 223, 1));
    }
    #header::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        display: block;
        width: 100%;
        height: 3.5rem;
        background: linear-gradient(to right, rgba(241, 238, 194, 0.35), rgba(217, 236, 223, 0.35));
    }
    #header .l-header__inner {
        display: flex;
        flex-wrap: wrap;
    }
    #header .l-header__inner .l-header__logo {
        order: 1;
    }
    #header .l-header__inner .w-header.pc_ {
        order: 2;
        flex: 1;
        margin-left: 0;
    }
    #header .l-header__inner .w-header.pc_ .w-header__inner {
        width: 100%;
    }
    #header .l-header__inner .w-header.pc_ .w-header__inner .custom-html-widget {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: #6f4d3e;
    }
    .clinic-address p {
        line-height: 1.5em;
    }
    .clinic-contact {
        display: flex;
        align-items: center;
    }
    .clinic-contact p a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 12em;
        padding: 0.65rem 0;
        border-radius: 3em;
        color: #ffffff;
        background-color: #6f4d3e;
        line-height: 1em;
        transition: .3s;
    }
    .clinic-contact p a:hover {
        background-color: #dd8c2f;
        transition: .3s;
    }
    .clinic-contact p a:before {
        content: "";
        display: block;
        margin-right: 0.25em;
        width: 1.5em;
        height: 1.5em;
        background: url(images/icon/icon-phone.svg) no-repeat center center / contain;
    }
    .clinic-contact p.mail {
        margin-left: 0.5rem;
    }
    .clinic-contact p.mail a:before {
        background: url(images/icon/icon-mail.svg) no-repeat center center / contain;
    }
    #header .l-header__inner .l-header__gnav {
        order: 3;
        width: 100%;
    }
    #header .l-header__inner .l-header__gnav .c-gnav {
        width: 100%;
        justify-content: center;
    }
    #header .l-header__inner .l-header__gnav .c-gnav li {
        position: relative;
        width: calc(100% / 8);
    }
    #header .l-header__inner .l-header__gnav .c-gnav li:before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        display: block;
        width: 2px;
        height: 80%;
        border-left: 2px dotted #e2e2e2;
    }
    #header .l-header__inner .l-header__gnav .c-gnav li:last-child:after {
        content: "";
        position: absolute;
        right: 0;
        top: 0;
        display: block;
        width: 2px;
        height: 80%;
        border-right: 2px dotted #e2e2e2;
    }
    #header .l-header__inner .l-header__gnav .c-gnav li a {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding-bottom: 1rem;
        color: #6f4d3e;
    }
    #header .l-header__inner .l-header__gnav .c-gnav li a:before {
        content: "";
        display: block;
        margin-bottom: 0.5rem;
        width: 3em;
        height: 3em;
        background-image: url(images/icon/icon-01.svg);
        background-repeat: no-repeat;
        background-position: center bottom;
        background-size: contain;
    }
    #header .l-header__inner .l-header__gnav .c-gnav li:nth-child(1) a:before {
        background-image: url(images/icon/icon-01.svg);
    }
    #header .l-header__inner .l-header__gnav .c-gnav li:nth-child(2) a:before {
        background-image: url(images/icon/icon-02.svg);
    }
    #header .l-header__inner .l-header__gnav .c-gnav li:nth-child(3) a:before {
        background-image: url(images/icon/icon-03.svg);
    }
    #header .l-header__inner .l-header__gnav .c-gnav li:nth-child(4) a:before {
        background-image: url(images/icon/icon-04.svg);
    }
    #header .l-header__inner .l-header__gnav .c-gnav li:nth-child(5) a:before {
        background-image: url(images/icon/icon-05.svg);
    }
    #header .l-header__inner .l-header__gnav .c-gnav li:nth-child(6) a:before {
        background-image: url(images/icon/icon-06.svg);
    }
    #header .l-header__inner .l-header__gnav .c-gnav li:nth-child(7) a:before {
        background-image: url(images/icon/icon-07.svg);
    }
    #header .l-header__inner .l-header__gnav .c-gnav li:nth-child(8) a:before {
        width: 4em;
        background-image: url(images/icon/icon-08.svg);
    }
}
@media (min-width: 961px) and (max-width: 1200px) {
    #header .l-header__inner {
        flex-direction: column;
    }
    #header .l-header__inner .l-header__logo {
        margin-right: 0;
        justify-content: center;
    }
    #header .l-header__inner .l-header__gnav {
        margin-top: 2rem;
    }
}

/* PCスクロール後
-------------------------- */
#fix_header {
    background-color: #ffffff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .12);
}
#fix_header::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 5px;
    background: linear-gradient(to right, rgba(241, 238, 194, 1), rgba(217, 236, 223, 1));
}
#fix_header .clinic-address,
#fix_header .clinic-contact p a span {
    display: none;
}
#fix_header .clinic-contact p a {
    width: 3em;
    height: 3em;
    border-radius: 100%;
}
#fix_header .clinic-contact p a:before {
    margin-right: 0;
}
.l-fixHeader .l-fixHeader__gnav {
    margin-left: auto;
}
.l-fixHeader .l-fixHeader__gnav .c-gnav a {
    color: #6f4d3e;
}
@media (min-width: 960px) {
    .-series-left .w-header {
        margin-left: 1rem;
    }
}
@media (min-width: 961px) and (max-width: 1200px) {
    #fix_header .clinic-contact p a {
        width: 2em;
        height: 2em;
        border-radius: 100%;
    }
    .clinic-contact p a:before {
        width: 1em;
        height: 1em;
    }
}


/* スマホ版
-------------------------- */
@media (max-width: 960px) {
    #sp_menu .c-widget__title.-spmenu {
        padding: 0.5em 1.5em;
        border-radius: 3em;
        color: #6f4d3e;
        background: linear-gradient(to right, rgba(241, 238, 194, 1), rgba(217, 236, 223, 1));
    }
    #sp_menu .c-spnav > .menu-item > a {
        padding-left: 3.5em;
        color: #6f4d3e;
    }
    #sp_menu .c-gnav .sub-menu a:before,
    #sp_menu .c-listMenu a:before {
        color: #fcd557;
    }
    #sp_menu .c-spnav > li > a {
        position: relative;
        display: flex;
        align-items: center;
    }
    #sp_menu .c-spnav > li > a::after {
        content: "";
        position: absolute;
        left: 1.5em;
        display: block;
        width: 1.5em;
        height: 1.5em;
        background-image: url(images/icon/icon-01.svg);
        background-repeat: no-repeat;
        background-position: center center;
        background-size: contain;
    }
    #sp_menu .c-spnav > li:nth-of-type(1) > a::after {
        background-image: url(images/icon/icon-01.svg);
    }
    #sp_menu .c-spnav > li:nth-of-type(2) > a::after {
        background-image: url(images/icon/icon-02.svg);
    }
    #sp_menu .c-spnav > li:nth-of-type(3) > a::after {
        background-image: url(images/icon/icon-03.svg);
    }
    #sp_menu .c-spnav > li:nth-of-type(4) > a::after {
        background-image: url(images/icon/icon-04.svg);
    }
    #sp_menu .c-spnav > li:nth-of-type(5) > a::after {
        background-image: url(images/icon/icon-05.svg);
    }
    #sp_menu .c-spnav > li:nth-of-type(6) > a::after {
        background-image: url(images/icon/icon-06.svg);
    }
    #sp_menu .c-spnav > li:nth-of-type(7) > a::after {
        background-image: url(images/icon/icon-07.svg);
    }
    #sp_menu .c-spnav > li:nth-of-type(8) > a::after {
        background-image: url(images/icon/icon-08.svg);
    }
    #sp_menu .c-spnav > li:nth-of-type(9) > a::after {
        background-image: url(images/icon/icon-09.svg);
    }
    #sp_menu .clinic-contact {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    #sp_menu .clinic-contact p a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 12em;
        padding: 0.65rem 0;
        border-radius: 3em;
        color: #ffffff;
        background-color: #6f4d3e;
        line-height: 1em;
        transition: .3s;
    }
    #sp_menu .clinic-contact p a:hover {
        background-color: #dd8c2f;
        transition: .3s;
    }
    #sp_menu .clinic-contact p a:before {
        content: "";
        display: block;
        margin-right: 0.25em;
        width: 1.5em;
        height: 1.5em;
        background: url(images/icon/icon-phone.svg) no-repeat center center / contain;
    }
    #sp_menu .clinic-contact p.mail {
        margin-left: 0.5rem;
    }
    #sp_menu .clinic-contact p.mail a:before {
        background: url(images/icon/icon-mail.svg) no-repeat center center / contain;
    }
}
@media (max-width: 768px) {
    #sp_menu .clinic-address,
    #sp_menu .clinic-contact p a span {
        display: none;
    }
    #sp_menu .clinic-contact p a {
        width: 3em;
        height: 3em;
        border-radius: 100%;
    }
    #sp_menu .clinic-contact p a:before {
        margin-right: 0;
    }
}