/*
///////////////////////////////////////////
    Base Structure
/////////////////////////////////////////*/
html {
    width: 100%;
	height: 100%;
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
}
body {
    margin: 0;
    padding: 0;
    font-size: 16px;
    color: #000;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    font-style: normal;
    background-color: #fff;
    overflow-x: hidden;
}
/*===========================================================
	Base
============================================================*/
* {
	box-sizing: border-box;
		-moz-box-sizing: border-box;
	min-height:0;
	min-width : 0;
 }
 a:hover img { opacity: 0.6; }

 table,
 table tr th,
 table tr td {
    border: none;
 }
 .wp-block-table,
 .wp-block-table tr th,
 .wp-block-table tr td {
    border: none;
 }
/*----------------------------------------------------------
    Fonts//Base
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
    margin: 0;
    padding: 0;
    font-weight: 700;
    font-style: normal;
}
h1 { font-size: 175%; }
h2 { font-size: 150%; }
h3 { font-size: 125%; }
h4, h5, h6 { font-size: 100%; }
.mincho {
    font-family: "Noto Sans JP", sans-serif;
    font-style: normal;
}

/* メンテナンス時に表示する画面用 */
.wp-block-heading {
    padding: 2em 0 1em 0;
}
/*----------------------------------------------------------
    Fonts//Color
----------------------------------------------------------*/
.navy { color: #134097; }
.sky { color:#28a8df; }
.blue { color:#123f96; }
.white { color:#fff }

/*----------------------------------------------------------
    Fonts Custom//Base
----------------------------------------------------------*/
h1 span {
    font-size: 70%;
    margin-right: 0.5em;
}
h1.corp-name {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
}

    #hours-area h2,
    #notice-area h2,
    #medi-info h2,
    #greeting h2 {
        text-align: center;
        line-height: 90%;
        margin-bottom: 1em;
    }
    #hours-area h2 span,
    #notice-area h2 span,
    #medi-info h2 span,
    #greeting h2 span {
        display: block;
        font-size: 50%;
        font-weight: normal;
        color: #b1b1b1;
    }
    footer h2 span {
        display: block;
        font-size: 50%;
    }
/*===========================================================
	Header
============================================================*/
header.index {
    border-bottom: #eee 1px solid;
}
/*===========================================================
	Navigation
============================================================*/
.head-menu ul,
.foot-menu ul {
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
    .head-menu ul li {
        font-size: 90%;
    }
/*----------------------------------------------------------
    Header//Home
----------------------------------------------------------*/
.head-menu ul li {
    margin: 0;
    font-weight: 500;
    text-align: center;
}
.head-menu ul li a {
    position: relative;
    display: block;
    text-decoration: none;
}
    .head-menu ul li a:hover::after {
        position: absolute;
        bottom: -10px;
        left: 50%;
        transform: translateX(-50%);
        content: '\f0dd';
        font-family: 'Font Awesome 6 Free';
        font-weight: 700;
    }
/*----------------------------------------------------------
    Header//Lower
----------------------------------------------------------*/
.foot-menu {
    margin: 0 auto;
    margin-top: 1em;
    font-weight: 700;
}
    .foot-menu ul {
    justify-content: center;
}
.foot-menu ul li {
    padding: 0.5em 1em;
}
/*===========================================================
	Main Visual
============================================================*/
#main-head {
    position: relative;
    overflow: hidden;
}
    /* MetaSlider on FlexSlider */
    .metaslider .flex-viewport { overflow: visible !important; }
    .flexslider .slides img{ padding:0 0 !important; }
    .metaslider ul li.flex-active-slide { opacity: 1; }

    @media screen and (max-width:1199px) {
        .metaslider .flex-viewport { overflow-x:hidden !important; } /* PC以下の端末でのはみ出し修正 */
    }
    #metaslider-id-72 {
        z-index: 1;
        position: relative;
    }
    .main-txt {
        z-index: 5;
        position: absolute;
        color: #fff;
    }
.corp-name {
    z-index: 7;
}
.head-menu {
    z-index: 6;
}
/*===========================================================
	Main//Index
============================================================*/
main {
    margin: 0 auto;
    box-sizing: border-box;
}
#exterior-works-area,
#gaikou-area,
#gaiheki-area {
    position: relative;
    padding: 1em;
    margin: 2em 0;
}
#exterior-works-area {
    border: #bbbcb8 1px solid;
}
.grid-box {
    text-align: center;
    display: grid;
    gap: 0.5em;
    grid-template-columns: 1fr minmax(35px, 50px) 1fr;
    grid-template-rows: 30px repeat(2,1fr);
    align-items: center;
}
    .grid-box img {
        width: 100%;
        height: auto;
        object-fit: cover;
    }
    .grid-box div:nth-child(1) {
        grid-column: 1 / 2;
        grid-row: 1 / 2;
        background-color: #ede8e7;/*#b1b1b1;*/
    }
    .grid-box div:nth-child(2) {
        grid-column: 2 / 3;
        grid-row: 1 / 2;
    }
    .grid-box div:nth-child(3) {
        grid-column: 3 / 4;
        grid-row: 1 / 2;
        background-color: #ede8e7;/*#b1b1b1;*/
    }


#insta-feed-area {
    margin: 2em 0;
}
    #insta-feed-area a {
        text-decoration: none;
    }
    #sb_instagram.sbi_fixed_height {
        max-height: 570px;
        height: 100%;
    }

    .button-ins {
        display: block;
        text-align: center;
        padding: 1em;
        box-sizing: border-box;
        margin: 1em auto;
        border: #000 3px solid;
        color: #000;
    }
        .button-ins:hover {
            color: #fff;
            background-color: #8c8c8c;
        }
    .title-ext,
    .title-other,
    .title-greeting,
    .title-flow,
    .title-contact {
        position: relative;
        font-size: 110%;
        text-align: center;
        color: #332f2e;
        margin: 0 0.5em;
    }
        .title-ext span,
        .title-other span,
        .title-greeting span,
        .title-flow span {
            display: block;
            font-size: 60%;
            font-weight: normal;
            color: #b3b3b3;
            margin: 0.5em 0 1em 0;
        }
        .title-contact span {
            display: block;
            font-size: 80%;
            font-weight: normal;
            color: #fff;
            margin: 0.5em 0 1em 0;
        }
        .title-area a {
            text-decoration: none;
        }
        .title-area a:hover .title-ext::after {
            position: absolute;
            right: -50px;
            top: 40%;
            content: '＞';
            font-size: 200%;
            font-weight: 300;
            text-decoration: none;
        }
#others-works-area {
    position: relative;
    width: 100%;
    margin: 0 auto 2em auto;
    text-align: center;
}
    #others-works-area a img {
        width: 100%;
        height: auto;
    }
#greeting-area {
    position: relative;
    margin-top: 2em;
    margin-bottom: 2em;
    padding: 1em;
    background-color: #FBF9F6;
    background-image: url('../images/greeting-back.png');
    /* background-size: contain; */
    background-repeat: repeat-x;
    background-position: bottom center;
}
    .title-area {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .greeting-txt {
        position: absolute;
        box-sizing: border-box;
        /* background-color: #8c8c8c; */
    }
        .greeting-txt p {
            display:inline;
            line-height: 1.8;
            color: #000;/*#fff;*/
            font-weight: 500;
        }

#flow-area {
    min-height: 300px;
    margin-bottom: 2em;
}
    .list-flow {
        margin: 0;
        list-style: none;
    }
        .list-flow li {
            padding: 0.5em;
            border-bottom: #eee 1px solid;
            display: flex;
            align-items: center;
        }
        .list-flow li span.circle {
            position: relative;
            display: block;
            width: 50px;
            height: 50px;
            font-size: 130%;
            font-weight: normal;
            text-align: center;
            line-height: 50px;
            margin-right: 1em;
            background-color: #9de8d2;/*#eee;*/
            border-radius: 50%;
        }
            .list-flow li span.circle::after {
                content: '';
                border-left: #000 1px solid;
                position: absolute;
                top: 50px;
                left: 25px;
                width: 50px;
            }
            .list-flow li:last-child span.circle::after {
                content: none;
            }
        .list-flow .flow-flex {
            display: flex;
            align-items: center;
        }
        .list-flow h3 {
            display: block;
            font-size: 110%;
            margin-right: 1em;
        }
/*----------------------------------------------------------
    Contact Form
----------------------------------------------------------*/
#contact-area {
    box-sizing: border-box;
    margin: 0;
    background-color: #e4dedd;/*#ccc;*/
}
    .inner {
        margin: 0 auto;
        text-align: center;
    }
        .contact-phone {
            display: block;
            font-size: 150%;
            font-weight: 700;
            color: #cc0000;
            margin: 1em auto;
        }
    .contactform {
        position: relative;
        width: 80%;
        text-align: left;
        margin: 1em auto 0 auto;
        padding: 2em 0;
    }
        .contactform .contact-label {
            display: inline-block;
            margin: 1em 0 0.5em 0;
            text-align: left;
        }
        .required {
            font-size: 80%;
            padding: 0 0.5em;
            margin-left: 0.5em;
            background-color: #cc0000;
            color: #fff;
        }
        .contactform .wpcf7-form-control-wrap {
            margin-bottom: 1em;
        }
            .contactform .wpcf7-form-control-wrap input[type=text],
            .contactform .wpcf7-form-control-wrap input[type=email],
            .contactform .wpcf7-form-control-wrap input[type=tel],
            .contactform .wpcf7-form-control-wrap textarea {
                width: 100%;
                padding: 1em 1.5em;
                box-sizing: border-box;
                background-color: #e4dedd;/*#ccc;*/
                border-top: none;
                border-bottom: #fff 1px solid;
                border-left: none;
                border-right: none;
            }
            .wpcf7-radio {
                display: block;
                width: 100%;
                padding: 1em 1.5em;
                box-sizing: border-box;
                border-bottom: #fff 1px solid;
            }
                input[type=radio] {
                    width: 16px;
                    height: 16px;
                    padding: 0.5em;
                }
            input[type=submit] {
                position: absolute;
                right: 0;
                margin: 1em 0;
                padding: 0.5em 1em;
                color: #fff;
                background-color: #332f2e;
                border: #332f2e 2px solid;
            }
                input[type=submit]:hover {
                    color: #332f2e;
                    background-color: #fff;/*#ccc;*/
                    border: #332f2e 2px solid;
                }

    #notice-area {
        position: relative;
        background-color: #eee;
        border: #eee 1px solid;
        margin: 2em 0;
        display: flex;
    }
        #notice-area .btn-news {
            padding: 1em;
            box-sizing: border-box;
            margin-right: 1em;
            text-align: center;
            color: #fff;
            background-color: #000;
            border: #000 1px solid;
            text-decoration: none;
        }
            #notice-area .btn-news:hover {
                color: #000;
                background-color: #fff;
            }
            #notice-area .btn-news h3 {
                font-size: 100%;
                font-weight: 400;
            }

/*===========================================================
	Footer
============================================================*/
a.totop {
    position: fixed;
    z-index: 90;
    text-align: center;
    padding: 1em;
    color: #ffffff;
    background-color: #332f2e;/*#000000;*/
    border:#332f2e 1px solid;
}
    a.totop:hover {
        color: #332f2e;
        text-decoration: none;
        background-color: #fff;
        border: #332f2e 1px solid;
    }
    footer {
        position: relative;
        width: 100vw;
        margin: 0 auto;
        color: #000;
        text-align: center;
        background-color: #ccc1c0;
        background-image: url('../images/foot-back.jpg');
        background-size: cover;
        box-sizing: border-box;
    }
    footer a {
        color: #000;
        text-decoration: none;
    }
        footer a:hover {
            color: #000;
            text-decoration: underline;
        }
        footer #map {
            height: 320px;
        }
            footer #map iframe {
                width: 100%;
                height: 320px;
                margin: 0;
                padding: 0;
            }
/*----------------------------------------------------------
    Copyright//Footer
----------------------------------------------------------*/
        #copyright {
            position: absolute;
            bottom: 0;
            width: 100%;
            height: 45px;
            margin: 0;
            padding: 1em 0;
            font-size: 80%;
            text-align: center;
            color: #fff;
            background-color: #332f2e/*#000;*/
        }

/*===========================================================
	Lower
============================================================*/
/*----------------------------------------------------------
    Header//Lower
----------------------------------------------------------*/
.lower-header {
    position: relative;
    width: 100%;
    margin: 0;
    background-color: #332f2e;/*#000;*/
}
    .lower-header h2 {
        max-width: 32em; /* 32文字辺りで強制改行 */
        margin: 0 auto;
        color: #ffffff;
        text-align: center;
    }
        .lower-header h2 span {
            font-size: 80%;
        }
/*----------------------------------------------------------
    Navigation//Lower
----------------------------------------------------------*/
#lower-nav-area {
    list-style: none;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
}
        #lower-nav-area li a {
            color: #666666;
            text-decoration: none;
        }
        #lower-nav-area li a:hover {
            text-decoration: underline;
        }
/*----------------------------------------------------------
    Breadcrumb//Lower
----------------------------------------------------------*/
    #breadcrumb-area {
        font-size: 80%;
        margin: 0;
        padding: 0;
    }
        .breadcrumb {
            list-style: none;
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: flex-start;
            align-items: center;
        }
            .breadcrumb li {
                padding: 0 0.5em 0 0;
            }
            .breadcrumb li img {
                width: 10px;
                height: 10px;
            }
            .breadcrumb a {
                color: #134097;
                text-decoration: none;
            }
            .breadcrumb a:hover {
                text-decoration: underline;
            }
/*----------------------------------------------------------
    Main//Lower
----------------------------------------------------------*/
body#lower main {
    padding: 0;
    margin: 1em auto 2em auto;
}
    .contents {
        margin: 0 auto;
        padding: 0 0 2em 0;
        line-height: 1.8;
    }
/*----------------------------------------------------------
    Content//Lower
----------------------------------------------------------*/
.lower-subtitle {
    position: relative;
    padding-left: 30px;
    margin-top: 1.5em;
    color: #009145;
}
    .lower-subtitle::before {
        position: absolute;
        top: 5px;
        left: 0;
        content: '';
        width: 30px;
        height: 27px;
        background: url("../images/square.svg") no-repeat;
    }
/*===========================================================
	Archive
============================================================*/
.arch-list-news {
    list-style: none;
    margin: 0;
    padding: 0;
}
    .arch-list-news li {
        margin-bottom: 1em;
        padding: 0.5em 0.5em 0.5em 1em;
        border-left: #000 5px solid;
        background-color: #eee;
    }
    .arch-list-news li a {
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }
        .arch-list-news li a h3 {
            margin-right: 1em;
        }
.arch-list-works {
    list-style: none;
    margin: 0;
    padding: 0;
}
    .arch-list-works li {
        padding: 0.5em 1em;
        border-left: #000 5px solid;
        background-color: #eee;
    }
    .arch-list-news a,
    .arch-list-works a {
        color: #000;
        text-decoration: none;
    }
        .arch-list-news a:hover,
        .arch-list-works a:hover {
            text-decoration: underline;
        }
/*----------------------------------------------------------
    Pager//Archive
----------------------------------------------------------*/
.pager {
    height: 50px;
    padding: 1em 3em;
    background-color: #ffffff;
    clip-path: polygon(0 0, 95% 0, 100% 100%, 5% 100%);
}
    .nav-links {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: center;
    }
    .nav-links span,
    .nav-links a {
        display: block;
        text-align: center;
        width: 72px;
        padding: 0 1em;
        color: #666666;
        text-decoration: none;
    }
        .nav-links a:hover {
            background-color: #b1b1b1;
        }
    .nav-links img {
        width: 10px;
        height: 10px;
    }
    .nav-links a.next {
        margin-left: auto;
    }