@charset "utf-8";

/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, a,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video, textarea, button, input {
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    box-sizing: border-box;
    outline: 0;
    font-size  : 14px;
    color      : var(--dark-color);
    line-height: 1.5;
    vertical-align: baseline;
}
body {
    background-color: var(--background-color);
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display: block;
}
ul,
ol {
    list-style: none;
}
blockquote,
q {
    quotes:none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}
a {
    background: transparent;
    vertical-align: baseline;
    text-decoration: none;
}
a:hover,
button:hover {
    transition: 0.4s;
    opacity: .7;
}
img {
    max-width: 100%;
    height: auto;
    vertical-align: top;
}
ins {
    background-color: #ff9;
    color: var(--text-color);
    text-decoration: none;
}
mark {
    background-color: #ff9;
    font-style: italic;
    font-weight: bold;
}
del {
    text-decoration:  line-through;
}
abbr[title],
dfn[title]{
    border-bottom: 1px dotted;
    cursor: help;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
}
hr {
    display: block;
    height: 1px;
    border: 0;  
    border-top: 1px solid #cccccc;
    margin: 1em 0;
    padding: 0;
}
input,
select {
    vertical-align: middle;
}
button {
    padding: 0;
    background: none;
    border: none;
    cursor: pointer;
    vertical-align: top;
}
summary {
    display: block;
    cursor: pointer;
}
summary::-webkit-details-marker  {
    display: none;
}
svg {
    fill: var(--dark-color);
    speak: none;
}
.ui-datepicker-prev svg,
.ui-datepicker-next svg {
    min-width: 10px;
    width: 10px;
    height: 24px;
    margin-left: 7px;
}
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
         -o-box-sizing: border-box;
            box-sizing: border-box;
}
::placeholder {
    color: var(--gray-text);
}
.clearfix {
    display: block;
}
.clearfix:after {
    content: url(/images/clearfix.gif);
    display: block;
    clear: both;
    height: 0;
}
/*-------------------------------------------------------------------------
共通 UI MD
-------------------------------------------------------------------------*/

:root {
    --screen-size: 1140px;
    --full-screen: calc(50% - max(50%, 50vw));
    --main-color: #1B9D57;
    --main-blur-cover-color: rgb(27 157 87 / 40%);
    --main-light-color: rgba(27, 157, 87, .1);
    --sub-color: #1E7ABC;
    --sub-light-color: rgba(30, 122, 188, .1);
    --point-color: #EF7B50;
    --border-color: #CFD8DC;
    --dark-border-color: #78909C;
    --dark-color: #263238;
    --bg-light-gray: #ECEFF1;
    --bg-dark-transparent: rgba(38, 50, 56, .9);
    --strong-color: #EF5350;
    --gray-text: #78909C;
    --light-text-color: #455A64;
    --more-light-text-color: #78909C;
    --box-shadow: 0 3px 6px rgba(38,50,56,.18);
    --rank1: #9D8E30;
    --rank2: #5F89B8;
    --rank3: #9A7A56;
    --rank-under: #78909C;
    --white:#ffffff;
    --text-color:#333333;
    --text-subcolor:#707070;
    --sns-line: #06C755;
}

/*-------------------------------------------------------------------------
フォントサイズ
-------------------------------------------------------------------------*/

:root{
    --content-ttl:30px;
    --strong-text:25px;
    --title-large:20px;
    --default-txt:16px;
    --midium-txt:14px;
    --small-txt:13px;
}

/*-------------------------------------------------------------------------
装飾
-------------------------------------------------------------------------*/

:root {
    --content_shadow: 0px 0px 8px rgba(0, 0, 0, .16);
    --icon_shadow: 0px 2px 3px rgba(0, 0, 0, .16);
}

.is-center {
    text-align: center;
}
.ui-arw {
    width: 8px;
    height: 8px;
    fill: var(--light-text-color);
}

/* 画像
--------------------------- */
.ui-fit-img,
.ui-radius-img,
.ui-circle-img {
    overflow: hidden;
}
.ui-fit-img img,
.ui-radius-img img,
.ui-circle-img img {
    width: 100%;
    height: 100%;
    object-fit     : cover;
    object-position: center;
}
 .ui-contain-img img {
     overflow: hidden;
     background-color: #eceff1;
     width: 100%;
     height: 100%;
     object-fit: contain;
     object-position: center;
 }
.ui-radius-img { border-radius: 8px;}
.ui-circle-img { border-radius: 50%;}

.ui-contain-img {
    background-color: var(--bg-light-gray);
}
.ui-blur-img {
    position: relative;
}
.ui-blur-img:after {
    content: "";
    width: 100%;
    height: 100%;
    backdrop-filter: blur(30px);
    position: absolute;
    top     : 0;
    left    : 0;
    z-index : 0;
}
    .ui-blur-img img {
        position: relative;
        z-index : 1;
    }

/* LAYOUT
--------------------------- */
.ui-full-screen {
    margin-inline: var(--full-screen);
    margin-bottom: 80px;
}
.ui-freehtml {
    margin: 0 auto;
}
.ui-fit-img.ui-full-screen {
    position: relative;
}
.ui-fit-img.ui-full-screen img.cover_img {
    object-fit: contain;
    position: absolute;
    top: 0;
    left: 0;
}
.ui-fit-img.ui-full-screen img.fit_img {
    filter: blur(9px);
}
.ui-section {
    margin-block: 80px;
}
.ui-section:first-child {
    margin-block-start: 0;
}
.ui-narrow-section {
    width: 800px;
    margin-inline: auto;
}
.ui-heading {
    background-color: #fff;
    padding: 40px 0 0;
    position: relative;
}
.ui-fixed-bottom {
    position: sticky;
    bottom: 0;
}
.ui-scroll {
    scrollbar-width: none;    
}
.ui-scroll::-webkit-scrollbar { 
    display: none;
}

/* 見出し
--------------------------- */
[class*="ui-title--"]{
    margin: 0 0 10px;
    font-weight: bold;
}
.ui-title--center {
    font-size: 26px;
    text-align: center;
}
.ui-title--center.is-small {
    font-size: 18px;
}
.ui-title--left {
    font-size: 18px;
}

/* BUTTON
--------------------------- */
[class*="ui-btn--"],
[class*="ui-sub-btn--"],
[class*="ui-tag-btn--"]{
    display    : flex;
    align-items: center;
    border-radius: 6px;
    line-height: 1.1;
}
[class*="ui-btn--"]{
    font-weight: bold;
    color      : #fff;
}
[class*="ui-btn--"]:disabled {
    opacity: .3;
}
[class*="ui-btn--"].is-center {
    justify-content: center;
}
[class*="ui-sub-btn--"]{
    border: 1px solid var(--border-color);
    min-height: 34px;
    justify-content: center;
    padding: 12px 0 10px;
    font-size: 14px;
    background-color: #fff;
}
[class*="ui-tag-btn--"]{
    border: 1px solid var(--border-color);
    min-height: 34px;
    justify-content: center;
    padding: 9px 12px;
    font-size: 13px;
    background-color: #fff;
}
.ui-btn--round,
.ui-sub-btn--round {
    border-radius: 50px;
}
.ui-btn--material,
.ui-sub-btn--material {
    border-radius: 4px;
    box-shadow: 0 4px 5px rgba(38,50,56,.15);
}
.ui-section-btn {
    width: 200px;
    margin: 0 auto;
    padding-left : 16px;
    padding-right: 16px;
    color: var(--light-text-color);
}
.ui-contact-line-btn {
    background-color: #06C755;
    margin-bottom: 10px;
    display        : flex;
    gap            : 5px;
    align-items    : center;
    justify-content: center;
    height: 44px;
    font-size  : 15px;
    font-weight: bold;
    color      : #fff;
    line-height: 1;
}
.ui-contact-btn {
    background-color: var(--point-color);
    display        : flex;
    gap            : 5px;
    align-items    : center;
    justify-content: center;
    height: 44px;
    font-size  : 15px;
    font-weight: bold;
    color      : #fff;
    line-height: 1;
}
.ui-contact-apply-btn {
    background-color: var(--main-color);
    margin-top: 10px;
    display: flex;
    gap: 5px;
    align-items: center;
    justify-content: center;
    height: 44px;
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    line-height: 1;
}
    [class*="ui-contact-btn--"] span {
        background-color: rgba(38, 50, 56, .2);
        border-radius: 50px;
        margin: 0 3px 0 0;
        padding: 2px 10px;
        font-size: 10px;
        color    : #fff;
    }
    [class*="ui-contact-btn--"] svg {
        width: 16px;
        height: 16px;
        fill: #fff;
    }

/* お気に入りボタン  */
.ui-favorite-btn svg {
    width: 32px;
    height: 30px;
    fill: var(--border-color);
    stroke-width: 1px;
    stroke: var(--light-text-color);
    stroke-linecap: round;
    stroke-opacity: .5;
    paint-order: stroke;
}
.ui-favorite-btn.is-checked svg {
    fill: var(--strong-color);
}

/* 新着のNEW  */
.ui-new {
    text-transform: uppercase;
    font-size  : 15px;
    font-weight: bold;
    color      : var(--strong-color);
}


/* ログインボタン  */
.ui-login-regist-btn {
    background-color: var(--point-color);
    height: 54px;
}
    .ui-login-regist-btn span {
        font-weight: normal;
        color      : inherit;
    }

/* TEXT
--------------------------- */
.ui-discription {
    margin: 0 0 10px;
    text-align: center;
}
.ui-small-text {
    font-size: 13px;
}
.ui-most-small-text {
    font-size: 10px;
}
.is-center {
    text-align: center;
}
.ui-bkn-label {
    background-color: #fff;
    border-radius: 50px;
    border: 1px solid var(--border-color);
    padding: 3px 7px 1px;
    font-size: 10px;
    color    : #78909C;
    line-height: 1;
}
.ui-category {
    background-color: var(--bg-light-gray);
    display: inline-block;
    padding: 1px 6px;
    font-size: 13px;
    color    : var(--gray-text);
}
.blog-mv__category.ui-category {
    padding: 2px 6px;
    color: #fff;
    background-color: var(--dark-color);
}

/* #
--------------------------- */
.ui-overlay {
    width: 100%;
    height: 100%;
    background-color: var(--bg-dark-transparent);
    position: fixed;
    top     : 0;
    left    : 0;
    z-index: 9;
    opacity: 0;
    visibility: hidden;
    backdrop-filter: blur(10px);
}
.ui-overlay.is-show {
    opacity: 1;
    visibility: visible;
}


/* TAB
--------------------------- */
.md-tab {
    display        : flex;
    align-items: center;
    justify-content: center;
    padding: 0px 20px 0;
    box-shadow: 0 4px 5px rgba(38,50,56,.15);
}
    .md-tab__items {
        width: 168px;
        padding: 10px 0 10px;
        position: relative;
        font-size  : 15px;
        font-weight: bold;
        color      : var(--light-text-color);
        text-align: center;
    }
    .md-tab__items[aria-selected=true]:after {
        content: "";
        width: 100%;
        height: 3px;
        background-color: var(--main-color);
        position: absolute;
        bottom  : 0;
        left    : 0;
    }
    .md-tab__items[aria-selected=true][data-tab="rent"]:after {
        background-color: var(--sub-color);
    }
    .search__rent .md-tab__items[aria-selected=true]:after{
        background-color: var(--sub-color);
    }

/* 検索窓
--------------------------- */
.md-freeword {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px 0;
    margin-bottom: 20px;
}
.md-freeword-search-style {
    background-color: #fff;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    display: flex;
    padding: 0;
    margin-bottom: 0;
}
.md-freeword-rent-color {
    background-color: var(--sub-color);
}
.md-freeword-buy-color {
    background-color: var(--main-color);
}
    .search_txt{
        color: #fff;
        font-size: 15px;
        font-weight: bold;
        margin-right: 23px;
    }
    .search__freeword{
        width: 624px;
        display: flex;
        align-items: center;
        background-color: #fff;
        border: 1px solid var(--border-color);
        border-radius: 4px;
    }
    .md-freeword__switch {
        padding: 0 15px;
        display    : flex;
        gap        : 4px;
        align-items: center;
        background-color: var(--bg-light-gray);
        height: 43px;
    }
        .md-freeword__switch svg {
            width: 8px;
            height: 8px;
            fill: var(--dark-color);
        }
    .md-freeword input[type="text"] {
        height: 44px;
        border: none;
        flex: 1;
    }
        .md-freeword__submit svg {
            width: 20px;
            height: 20px;
            fill: var(--dark-color);
        }
    .md-freeword__submit {
        padding: 0 10px;
    }

/* 物件
--------------------------- */
.md-bkn-wide {
    display        : flex;
    gap            : 30px;
    align-items    : center;
    justify-content: center;
}
    .md-bkn-wide__items {
        width: 204px;
        counter-increment: rank;
        position: relative;
    }
        .md-bkn-wide__img {
            height: 153px;
            margin: 0 0 6px;
        }
        .md-bkn-wide__text {
            text-overflow: ellipsis;
            overflow     : hidden;
            white-space  : nowrap;
        }

/* LIST
--------------------------- */
.md-info__items {
    width: 160px;
    padding: 0 15px;
    text-align: center;
}
.md-info__items > * + * {
    margin: 8px 0 0;
}
    .md-info__img {
        display: block;
        width: 130px;
        height: 130px;
        box-shadow: var(--box-shadow);
    }
    .md-info__text {
        font-size: 16px;
    }
    .md-info-staff__text {
        font-size: 12px;
        color: var(--light-text-color);
    }
.md-info .slick-arrow {
    top: 59px;
}
.md-info .slick-prev {left: -13px;}
.md-info .slick-next {right: -13px;}

    .md-info .slick-arrow svg {
        width: 13px;
        height: 13px;
        fill: var(--dark-color);
    }
.md-info + .ui-section-btn {
    margin-top: 27px;
}

/* SPEC
--------------------------- */
.md-spec {
    display: grid;
    gap    : 10px;
    grid-template-columns: 1fr 1fr;
}
    .md-spec__side {
        display       : grid;
        gap           : 6px;
        grid-auto-rows: min-content;
    }
        .md-spec__list {
            display: flex;
            align-items: center;
            gap    : 8px;
        }
            .md-spec__ttl {
                min-width: 120px;
                min-height: 25px;
                height: 100%;
                background-color: var(--bg-light-gray);
                display        : flex;
                align-items    : center;
                justify-content: center;
                font-size: 13px;
            }
            .md-spec__text .price {
                font-weight: bold;
                color: #e00f32;
            }
            .md-spec__text .kanrihi {
                font-weight: bold;
            }
                .md-spec__text a {
                    font-weight: bold;
                }
.md-spec__summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.md-spec__summary__side {
    display: grid;
    grid-auto-rows: min-content;
}
.md-spec__summary_long {
    border-top: 1px solid var(--border-color);
    margin-top: -0.5px
}
.md-spec__summary__list {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* 物件の設備
--------------------------- */
.md-facility {
    display  : flex;
    gap      : 12px;
    flex-wrap: wrap;
}
    .md-facility__icn {
        width: 56px;
        height: 56px;
        margin: 0 auto 2px;
        position: relative;
        background-color: var(--main-light-color);
        border-radius: 6px;
        display        : flex;
        align-items    : center;
        justify-content: center;
    }
    .is-none .md-facility__icn {
        background-color: var(--bg-light-gray);
    }
    .is-none .md-facility__icn:before {
        content: "";
        width: 2px;
        height: 66px;
        background-color: #CFD8DC;
        transform: rotate(45deg);
        transform-origin: 0 0;
        position: absolute;
        top     : 0;
        right   : 0;
    }
        .md-facility__icn svg {
            width: 35px;
            height: 35px;
            fill: var(--main-color);
        }
        .is-none .md-facility__icn svg {
            fill: #CFD8DC;
        }
    .md-facility__note {
        width: 56px;
        font-size: 10px;
        text-align: center;
        line-height: 1.1;
    }
    .is-none .md-facility__note {
        color: #B0BEC5;
    }
.md-tag-facility {
    display  : flex;
    gap      : 6px;
    flex-wrap: wrap;
}
    .md-tag-facility__items {
        border: 1px solid #78909C;
        border-radius: 3px;
        padding: 1px 8px;
        font-size: 13px;
        color    : #78909C;
    }

/* PAGER
--------------------------- */
.md-pager {
    margin: 30px 0 0;
    display        : flex;
    align-items    : center;
    justify-content: center;
}
    .md-pager__btn,
    .md-pager__link {
        width: 30px;
        height: 30px;
        display        : flex;
        align-items    : center;
        justify-content: center;
    }
    .md-pager__list {
        display: flex;
    }
        .md-pager__link {
            border-radius: 50%;
            font-size: 13px;
        }
        span.md-pager__link {
            background-color: var(--sub-light-color);
        }
        .md-pager__link svg {
            width: 10px;
            height: 10px;
            fill: var(--dark-color);
        }
        .md-pager__link.is-no-link svg {
            fill: #B9BDBE;
        }

/* モーダル
--------------------------- */
.md-modal {
    background-color: #fff;
    width: 640px;
    position : fixed;
    top      : 50%;
    left     : 50%;
    z-index  : 100;
    transform: translate(-50%, -50%);
    visibility: hidden;
    opacity: 0;
}
.md-modal[aria-hidden="false"]{
    opacity: 1;
    visibility: visible;
}
    .md-modal__ttl {
        padding: 15px 0 12px;
        border-bottom: 1px solid var(--border-color);
        font-size  : 15px;
        font-weight: bold;
        text-align: center;
        width: 100%;
    }
    .md-modal__body {
        padding: 30px;
        overflow-y: auto;
        max-height: 60vh;
    }
    .simulation-area {
        padding: 30px;
        overflow-y: auto;
    }


/* SNS
--------------------------- */
.md-sns {
    display        : flex;
    gap            : 16px;
    flex-wrap      : wrap;
    align-items    : center;
    justify-content: center;
}

/* 会員限定
--------------------------- */
.md-members-only-img,
.md-members-only-info {
    display: grid;
}
.md-members-only-img > *,
.md-members-only-info > * {
    grid-area: 1 / 1;
}
.md-members-only-img__center {
    width: 100%;
    height: 100%;
    display        : flex;
    gap            : 4px;
    align-items    : center;
    flex-direction : column;
    justify-content: center;
    z-index: 1;
}
.md-bkn__link .md-members-only-img__center {
    width: 246px;
}
.md-members-only-img__center svg {
    fill: #fff;
}
.result-list__img .md-members-only-img__center svg {
    width: 56px;
    height: 60px;
}
:is(.md-bkn-card, .result-card__img, .md-bkn__img, .popular__items) .md-members-only-img__center svg {
    width: 79px;
    height: 85px;
}
.md-members-only-img img {
    height: inherit;
}
.md-members-only-img__text {
    font-weight: 700;
    color      : #fff;
}
.result-list__img .md-members-only-img__text {
    font-size: 22px;
}
:is(.md-bkn-card, .result-card, .md-bkn__link, .popular__items) .md-members-only-img__text {
    font-size: 30px;
}
.md-members-only-img__blur {
    width: 100%;
    height: 100%;
    background: var(--main-blur-cover-color);
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
}
.popular__items .md-members-only-img__blur{
    height: 153px;
}
.popular__items .md-members-only-img__blur{
    height: 153px;
}
.md-members-only-info {
    flex: 1;
}
.md-members-only-info__text {
    order: 1;
    display    : grid;
    place-items: center;
    font-size  : 18px;
    font-weight: 700;
}
.popular__list .md-members-only-info__text {
    font-size: 14px;
}
.md-members-only-info-btn {
    background-color: var(--main-color);
    color: #ffffff;
    margin: auto;
    position: relative;
    font-weight: bold;
}
.md-members-only-info .md-main-btn {
    width: 272px;
    height: 39px;
    font-size: 18px;
    padding-left: 10px;
}
.md-members-only-info .md-list-ridge-btn {
    width: 252px;
    height: 27px;
    font-size: 16px;
    padding-left: 10px;
}
.md-members-only-info .md-card-ridge-btn {
    width: 189px;
    height: 29px;
    font-size: 12px;
    padding: 10px;
}
.md-members-only-info .md-card-room-btn {
    width: 272px;
    height: 39px;
    font-size: 17px;
    padding-left: 10px;
}

/* 閉じるボタン
--------------------------- */
.ui-close-btn {
    position: absolute;
    right   : 0;
    bottom  : calc(100% + 9px);
    width: 30px;
    height: 30px;
}
.ui-close-btn:before,
.ui-close-btn:after {
    content: "";
    width: 100%;
    height: 1px;
    background-color: #fff;
    position: absolute;
    inset   : 0;
    margin  : auto;
}
.ui-close-btn:before { transform: rotate(45deg);}
.ui-close-btn:after  { transform: rotate(-45deg);}


/* 物件関連の次に来る物件じゃないコンテンツ
--------------------------- */
/*.is-bkn + .is-nobkn {
    margin-top: 48px;
}
.feature + .is-nobkn {
    margin-top: 48px;
}*/

/* スライダー
--------------------------- */
.slick-slide {
    height: auto!important;
}
.slick-slide img {
    display: inline!important;
}
.slick-dots {
    display        : flex;
    gap            : 10px;
    justify-content: center;
    margin: 10px 0 0;
    height: 10px;
}
    .slick-dots button {
        width: 10px;
        height: 10px;
        background-color: #A6A6A6;
        border-radius: 50%;
        font-size: 0;
        color    : transparent;
    }
        .slick-dots .slick-active button {
        background-color: var(--dark-color);
    }
.slick-arrow {
    position: absolute;
    z-index : 1;
    width: 20px;
    height: 20px;
    display        : flex;
    align-items    : center;
    justify-content: center;
}
.slick-arrow svg {
    width: 13px;
    height: 13px;
    fill: var(--dark-color);
}

/*-------------------------------------------------------------------------
全体LAYOUT
-------------------------------------------------------------------------*/

.l-wrapper {
    min-width: var(--screen-size);
}
.l-contents:has(.ui-full-screen, .md-mv-heading){/* firefoxがhasに対応してない為、個別のcssファイルで指定してください。いずれ対応するのでそれまで我慢 */
    overflow: hidden;
}
.l-main {
    width: var(--screen-size);
    margin: auto;
    padding: 0 0 96px;
}

/* パンくず
--------------------------- */
.breadcrumbs {
    width: var(--screen-size);
    margin: 0 auto;
    padding: 16px 0 14px;
    position: relative;
    z-index : 1;
}
    .breadcrumbs__list {
        display  : flex;
        gap      : 3px;
        flex-wrap: wrap;
    }
        .breadcrumbs__link span {
            font-size: 13px;
            color    : #78909C;
        }
        strong.breadcrumbs__link {
            font-weight: normal;
        }
            .breadcrumbs__link svg {
                width: 8px;
                height: 8px;
                fill: #78909C;
            }

/*-------------------------------------------------------------------------
HEADER 共通
-------------------------------------------------------------------------*/

/* 共通
--------------------------- */
.header__holiday {
    font-size: 13px;
    color    : #78909C;
}
.ui-hd-pattern__inner {
    width: var(--screen-size);
    margin: auto;
}

/* TEL
--------------------------- */
.md-tel-list {
    display    : flex;
    gap        : 8px;
    align-items: center;
}
.md-tel-list__ttl {
    font-size: 14px;
}
.md-tel-list__item {
    font-size: 18px;
    font-weight: 700;
}

.hd-pattern2 .md-tel-list__ttl {
    white-space: nowrap;
    font-size: 13px;
    line-height: 10px;
}

.hd-pattern2 .md-tel-list  {
    display    : flex;
    gap        : 8px;
    align-items: center;
    flex-direction: column;
}

/*
--------------------------- */
.hd-common-bottom {
    background-color: var(--bg-light-gray);
}
.hd-common-bottom__inner {
    display        : flex;
    gap            : 25px;
    align-items    : center;
    justify-content: center;
    padding: 8px 41px 13px 0;
    position: relative;
}
.hd-common-bottom__inner .header-service {
    height: fit-content;
    position: absolute;
    top     : 0;
    bottom  : 0;
    right: 0;
    margin  : auto;
}
.hd-pattern4 .hd-common-bottom {
    background-color: var(--main-color);
}

/* 検索ボタン
--------------------------- */
.hd-common-search-list {
    display: flex;
    gap    : 8px;
}
.hd-common-search-list__items {
    position: relative;
}
.hd-common-search-list__btn {
    width: 144px;
    height: 43px;
    background-color: #fff;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    padding: 0 10px 0 14px;
    font-size  : 18px;
    font-weight: 700;
}
.hd-common-search-list__btn svg {
    width: 10px;
    height: 10px;
}

/* PULL DOWN  */
.header-pulldown {
    position: absolute;
    top     : 100%;
    left    : 0;
}
.header-pulldown__wrap {
    width: 300px;
}
.header-pulldown__list {
    width: 220px;
    background-color: rgba(38, 50, 56, .9);
    position: absolute;
    top     : 0;
    left    : 0;
    opacity: 0;
    visibility: hidden;
    transition: .2s ease;
    z-index: 10;
}
.header-pulldown__list.is-show {
    opacity: 1;
    visibility: visible;
}
.header-pulldown__list.is-hide {
    opacity: 0;
    visibility: hidden;
}
.header-pulldown__items:not(:last-child){
    border-bottom: 1px solid var(--dark-color);
}
.header-pulldown__link {
    width: 100%;
    height: 49px;
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    padding: 0 10px 0 15px;
    font-size  : 14px;
    color      : #fff;
    transition: .2s ease-in;
}
.next-pulldown .header-pulldown__link {
    transform: translateX(-10px);
}
.next-pulldown.is-show .header-pulldown__link {
    transform: translateX(0);
}
.header-pulldown__link svg {
    width: 13px;
    height: 13px;
    fill: #fff;
}

/*-------------------------------------------------------------------------
HEADER PATTERN1

/* LAYOUT
--------------------------- */
.l-header {
    width: 100%;
    background-color: #fff;
    z-index: 2;
    position: sticky;
    top: 0;
}
    .header__inner {
        width: var(--screen-size);
        margin: auto;
        display        : flex;
        justify-content: space-between;
    }
        .header__left {
            display    : flex;
            gap        : 30px;
            align-items: center;
        }
            .header__logo {
                display : flex;
                align-items : center;
            }
                .header__logo img {
                    max-width: 200px;
                    max-height: 80px;
                }
                .hd-pattern3__top .header__logo img,
                .hd-pattern4__top .header__logo img {
                    max-width: 380px;
                    max-height: 80px;
                }
                .hd-pattern4__top .header__logo {
                    width: 380px;
                }
        .header__right {
            display    : flex;
            gap        : 20px;
            align-items: center;
        }

/* 検索ボタン
--------------------------- */
.header-search {
    display: flex;
    border-left : 1px solid #fff;
    border-right: 1px solid #fff;
}
    .header-search__items {
        position: relative;
    }
    .header-search__items:not(:last-child){
        border-right: 1px solid #fff;
    }
    .header-search__items:hover {
        cursor: pointer;
    }
        /* ボタン  */
        .header-search__btn {
            width: 123px;
            height: 80px;
            background-color: var(--main-heighlight-color);
            display        : flex;
            gap            : 6px;
            align-items    : center;
            justify-content: center;
            color: var(--main-color);
            font-size  : 16px;
            font-weight: bold;
        }
            .header-search__btn svg {
                width: 12px;
                height: 12px;
                fill: var(--main-color);
            }

/* ナビゲーション
--------------------------- */
.header-nav__list {
    display: flex;
    gap: 6px;
}
.header-service {
    display: flex;
    gap: 12px;
}
    .header-nav__link {
        white-space: nowrap;
        font-weight: bold;
    }
        .header-nav__link:hover {
            color: var(--main-color);
            opacity: 1;
        }

/* サービス
--------------------------- */
.header-service li {
    width: 40px;
    height: 40px;
    background: var(--main-heighlight-color);
    border-radius: 100vw;
    display: flex;
    justify-content: center;
    align-items: center;
}
.header-service li:hover {
    background: var(--main-light-color);
}
[class*="header-service__link"]{
    position: relative;
}
[class*="header-service__link"]:hover {
    opacity: 1;
}
.header-service__link--member,
.header-service__link--favorite {
    display: flex;
    align-items: center;
    flex-direction: column;
    font-size: 10px;
    white-space: nowrap;
}
    .header-service__link--member svg {
        width: 19px;
        height: 20px;
    }
    .header-service__link--favorite svg {
        width: 19px;
        height: 20px;
    }
        .header-service__badge {
        width: 17px;
        height: 17px;
        background-color: var(--dark-color);
        border-radius: 50%;
        display        : flex;
        align-items    : center;
        justify-content: center;
        position: absolute;
        top     : -1px;
        right   : 5px;
        font-size  : 10px;
        font-weight: bold;
        color      : #fff;
    }

/* お問い合わせ
--------------------------- */
.header-contact {
    position: relative;
    z-index: 1;
}
    .header-contact__trigger {
        width: 138px;
        height: 39px;
        background-color: var(--main-color);
        position: relative;
        padding: 0 9px 0 0;
    }
        .header-contact__trigger svg {
            width: 8px;
            height: 8px;
            fill: #fff;
            position: absolute;
            top     : 0;
            bottom  : 0;
            right   : 12px;
            margin  : auto;
        }
    .header-contact__pulldown {
        width: 100%;
        background-color: #fff;
        box-shadow: var(--box-shadow);
        position: absolute;
        top     : 40px;
        left    : 0;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-10px);
        transition: .1s ease;
    }
    .header-contact__pulldown[aria-hidden="false"]{
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }
        .header-contact__btn {
            display        : flex;
            gap            : 5px;
            align-items    : center;
            justify-content: center;
            padding: 8px 0;
            font-size  : 14px;
            font-weight: bold;
            text-align: center;
            border-bottom: solid 1px var(--bg-light-gray);
        }
            .header-contact__btn svg {
                width: 15px;
                height: 15px;
            }

/* #
--------------------------- */
.header-menu__trigger {
    padding: 10px;
}
    .header-menu__trigger svg {
        width: 19px;
        height: 19px;
        fill: var(--main-color);
    }
    .header__btn {
        width: auto;
        height: 31px;
        padding: 5px 10px 0;
        font-size  : 11px;
        font-weight: bold;
        white-space: nowrap;
    }
    .header__link {
        width: 50px;
        height: 50px;
        display    : grid;
        place-items: center;
        position: relative;
    }
        .header__link svg {
            width: 25px;
            height: 25px;
        }
        .header__badge {
            width: 17px; 
            height: 17px;
            background-color: var(--dark-color);
            border-radius: 50%;
            display    : grid;
            place-items: center;
            position: absolute;
            right   : 10px;
            bottom  : 10px;
            font-size  : 10px;
            font-weight: bold;
            color      : #fff;
        }
    .header__menu,
    .menu__btn {
        width: 50px;
        height: 50px;
    }
    .header__menu {
        background-color: var(--main-color);
        display        : flex;
        align-items    : center;
        flex-direction : column;
        justify-content: center;
    }
        .header__menu svg {
            width: 18px;
            height: 16px;
            fill: #fff;
        }
/*-------------------------------------------------------------------------
HEADER PATTERN2
-------------------------------------------------------------------------*/

/* LAYOUT
--------------------------- */
.l-header.hd-pattern2 {
    border-top: 3px solid var(--main-color);
    position: unset;
}
.hd-pattern2__top {
    display        : flex;
    align-items    : flex-start;
    justify-content: flex-end;
}
.hd-pattern2__logo {
    max-width: 160px;
    height: 118px;
    display        : flex;
    align-items    : center;
    justify-content: center;
    position: absolute;
    top     : 28px;
    left    : 0;
    right   : 0;
    margin  : auto;
}
.hd-pattern2__logo img {
    max-width: 255%;
    max-height: 118px;
}
.hd-pattern2__right {
    padding: 9px 0 0;
    display        : flex;
    gap            : 16px;
    align-items    : center;
    justify-content: flex-end;
}
.hd-pattern2__middle {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin: 0 auto;
    margin-top: 3px;
}

/*-------------------------------------------------------------------------
HEADER PATTERN3
-------------------------------------------------------------------------*/

.hd-pattern3 {
    height: 94px;
}
    .header-pattern3_wrap {
        border-bottom: 2px solid var(--main-color);
        position: fixed;
        top: 0;
        z-index: 10;
        background: #fff;
        width: 100%;
    }
        .header-pattern3_inner {
            display: flex;
            justify-content: space-between;
            align-items: center;
            width: 1139px;
            margin: 0 auto;
        }
            .header-pattern3_right {
                display: flex;
                flex-direction: column;
                align-items: flex-end;
                padding-bottom: 3px;
            }
                .header-pattern3_info {
                    display: flex;
                    flex-direction: row;
                }
                    .company_info {
                        display: flex;
                        flex-direction: column;
                        align-items: flex-end;
                        padding: 5px 10px 3px 0;
                    }
                        .tell_item .hd-pattern3__tel {
                            text-align: right;
                            margin: 2px 0 0;
                            font-family: Arial;
                            font-size: 28px;
                            font-weight: bold;
                            color: var(--point-color);
                            line-height: 1;
                        }

                        .eigyo_time {
                            text-align: right;
                            font-size: 13px;
                            margin-top: 3px;
                            font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;
                        }
                    .header-pattern3_info .header-service {
                        position: relative;
                        padding: 17px 0 3px 20px;
                        text-align: right;
                    }

                    .hd-pattern3 .header-service::before {
                        content: '';
                        position: absolute;
                        left: 0;
                        top: 10%;
                        bottom: 10%;
                        border-left: 1px solid #B0BEC5;
                        width: 0;
                    }

                .header-pattern3_navi {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                }
                    .navi_item:not(:last-child) {
                        margin-right: 10px;
                    }

                    .navi_item a:hover {
                        opacity: 1;
                    }

                    .hd-pattern3__link {
                        display: block;
                        font-size: 16px;
                        font-weight: bold;
                        padding: 2px 0;
                        color: var(--dark-color);
                    }
                    .hd-pattern3__link .separator {
                        color: var(--dark-color);
                    }

                    .hd-pattern3__link:hover {
                        color: var(--main-color);
                    }
                .header-pattern3_navi svg:last-child {
                    display: none;
                }

.hd-pattern3__tel svg {
    margin: 0 4px 0 0;
    width: 21px;
    height: 21px;
    fill: var(--point-color);
}

/*
--------------------------- */
.hd-service-line {
    display    : flex;
    gap        : 15px;
    align-items: center;
}
.hd-service-line__link {
    display    : flex;
    gap: 7px;
    align-items: center;
    font-size  : 11px;
    color      : #fff;
}
.hd-service-line__link svg {
    width: 20px;
    height: 20px;
    fill: #fff;
}
.hd-pattern3__top .header-menu__trigger svg {
    fill: #fff;
}

/* TEL
--------------------------- */
.hd-pattern3__tel-list {
    display: flex;
    gap    : 8px;
}

/*-------------------------------------------------------------------------
HEADER PATTERN4
-------------------------------------------------------------------------*/

.hd-pattern4 {
    border-top: 3px solid var(--main-color);
}
.hd-pattern4__top {
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    padding: 16px 0;
}
.hd-pattern4__top-right {
    display    : flex;
    gap        : 26px;
    align-items: center;
}
.hd-pattern4__time {
    border-right: 1px solid #B0BEC5;
    padding: 8px 20px 3px 0;
    text-align: right;
}

.hd-pattern4__tel {
    margin: 2px 0 0;
    font-family: Arial;
    font-size  : 32px;
    font-weight: bold;
    color      : var(--point-color);
    line-height: 1;
}
.hd-pattern4__tel svg {
    margin: 0 4px 0 0;
    width: 23px;
    height: 23px;
    fill: var(--point-color);
}
.hd-pattern4__bottom-inner {
    display        : flex;
    align-items    : center;
    justify-content: space-between;
}
.hd-pattern4__nav {
    flex: 1;
}
.hd-pattern4__list {
    display: flex;
    justify-content: space-evenly;
    text-align: center;
}
.hd-pattern4__list li {
    flex: 1;
}
.hd-pattern4__list li {
    box-sizing: border-box;
    border-right: 2px solid #fff;
}
.hd-pattern4__list li:first-child {
    border-left: 2px solid #fff;
}
.hd-pattern4__link {
    display: block;
    padding: 17px 0 11px;
    font-size  : 18px;
    font-weight: bold;
    color: #fff;
}
.hd-pattern4__list li:hover {
    background-color: #fff;
    opacity: 0.8;
}
.hd-pattern4__link:hover {
    color: var(--main-color);
}
.hd-pattern4__bottom-inner .header-menu {
    background-color: rgb(255 255 255 / 39%);
    padding: 10px;
    margin-left: 15px;
}

/*-------------------------------------------------------------------------
MENU
-------------------------------------------------------------------------*/

/* LAYOUT
--------------------------- */
.menu {
    width: 100%;
    background-color: #fff;
    transition: .2s ease;
    position: absolute;
    left    : 0;
    z-index : 2000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: .2s ease;
}
.hd-pattern3 .menu {
    top: 39px;
}
.menu[aria-hidden="false"] {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
    .menu__inner {
        max-width: 1200px;
        margin: auto;
        padding: 30px 30px 20px;
        display              : grid;
        gap                  : 60px 30px;
        grid-template-columns: 1fr 360px;
    }
        .menu__between {
            display: grid;
            gap    : 30px;
            margin-top: 10px;
            grid-template-columns: 1fr 1fr;
        }
            .menu__section {
                margin: 0 0 24px;
                flex: 1;
            }
            .menu__section:last-child {
                margin: 0;
            }
                .menu__ttl {
                    margin: 0 0 6px;
                    font-size  : 18px;
                    font-weight: bold;
                }
        .menu__bottom {
            grid-column: 1 / span 2;
            display: flex;
            justify-content: flex-end;
        }
    .menu__close {
        width: 50px;
        height: 50px;
        background-color: #78909C;
        position: absolute;
        top     : 0;
        right   : 0;
    }
        .menu__close svg {
            width: 10px;
            height: 10px;
            fill: #fff;
        }

/* お問い合わせ
--------------------------- */
.menu__contact {
    display: flex;
    justify-content: space-between;
}
    .menu__contact-list {
        display: flex;
        gap    : 8px;
    }
        [class*="menu__contact-btn--"]{
            width: 176px;
            height: 44px;
            gap: 5px;
        }
            [class*="menu__contact-btn--"] svg {
                width: 16px;
                height: 16px;
            }
            .menu__contact-btn--mail {
                font-size  : 15px;
                font-weight: bold;
            }

    .menu__member {
        display    : flex;
        gap        : 8px;
        align-items: center;
    }
        .menu__member-ttl {
            font-size  : 16px;
            font-weight: bold;
            color      : var(--sub-color);
        }
        .menu__login,
        .menu__register {
            background-color: var(--sub-color);
            align-items    : center;
            justify-content: center;
            width: 176px;
            height: 44px;
            font-size  : 14px;
            font-weight: bold;
        }
        .menu__mypage,
        .menu__logout {
            background-color: var(--sub-color);
            align-items    : center;
            justify-content: center;
            width: 175px;
            height: 44px;
            font-size  : 14px;
            font-weight: bold;
        }

        .menu__login span {
            font-size  : 13px;
            font-weight: normal;
            color      : inherit;
        }

/* 検索窓
--------------------------- */
.md-search {
    background-color: #fff;
    border-radius: 4px;
    border: 1px solid var(--border-color);
    display: flex;
}
    .md-search__switch {
        width: 110px;
        position: relative;
    }
        .md-search__switch svg {
            width: 10px;
            height: 10px;
        }
    .md-search__input {
        flex: 1;
        border: none;
        height: 44px;
    }
    .md-search__submit {
        width: 44px;
    }
        .md-search__submit svg {
            width: 18px;
            height: 18px;
            fill: var(--dark-color);
        }

/* LIST
--------------------------- */
.menu__link {
    display        : flex;
    gap            : 10px;
    align-items    : center;
    padding: 15px 10px 14px 0;
    justify-content: space-between;
    border-bottom: 1px solid var(--border-color);
}
    :is(.menu__link, .menu__rule-link) svg {
        width: 8px;
        height: 8px;
    }
.menu__rule {
    display: flex;
    gap    : 16px;
}
    .menu__rule-link {
        display    : flex;
        gap        : 3px;
        align-items: center;
        font-size: 13px;
    }

/*-------------------------------------------------------------------------
お問い合わせカード
-------------------------------------------------------------------------*/

.contactus {
    background-color: #fff;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    padding: 24px;
    display: flex;
    gap    : 17px;
}
    .contactus__thum {
        min-width: 130px;
        width: 130px;
        height: 130px;
    }
    .contactus__link {
        margin: 0 0 4px;
        font-size  : 18px;
        font-weight: bold;
        text-decoration: underline;
    }
    .contactus__add {
        margin: 0 0 4px;
        color: var(--light-text-color);
    }
    .contact__info {
        display: flex;
        gap: 16px;
        margin-block: 0 8px;
    }
        .contactus__info-list {
            display        : flex;
            gap            : 10px;
            justify-content: center;
            margin: 0 0 2px;
        }
            .contactus__info-ttl {
                font-size  : 13px;
                font-weight: bold;
                color: var(--light-text-color);
            }
            .contactus__info-text {
                font-size: 13px;
                color: var(--light-text-color);
            }
    .contactus__list {
        display    : flex;
        gap        : 12px;
        align-items: center;
        margin: 0 0 16px;
    }
        .contactus__tel {
            display    : flex;
            gap        : 3px;
            align-items: center;
            font-size  : 18px;
            font-weight: bold;
        }
            .contactus__tel svg {
                width: 20px;
                height: 20px;
            }
        .contactus__btn {
            background-color: var(--sub-color);
            width: 200px;
            height: 34px;
            gap: 5px;
            font-size  : 15px;
            font-weight: bold;
        }
            .contactus__btn svg {
                width: 16px;
                height: 16px;
                fill: #fff;
            }

/*-------------------------------------------------------------------------
footerの上にあるリンクのレイアウト
-------------------------------------------------------------------------*/

.searchlink {
    background: #eee;
    padding: 15px 0;
}
    .searchlink__inner {
        width: var(--screen-size);
        margin: 0 auto;
    }
    .searchlink__inner > * + * {
        margin: 10px 0 0;
    }
        .searchlink__section {
            display: flex;
        }
            .searchlink__ttl {
                min-width: 140px;
                font-weight: bold;
                color      : #737373;
            }
                .searchlink__list {
                    display  : flex;
                    gap      : 5px;
                    flex-wrap: wrap;
                }
                    .searchlink__items:not(:last-child):after {
                        content: "/";
                    }

/*-------------------------------------------------------------------------
FOOTER
-------------------------------------------------------------------------*/

.l-footer * {
    color: #fff;
}

/* LAYOUT
--------------------------- */
.l-footer {
    background-color: var(--main-color);
    padding: 40px 0 20px;
}
    .footer__inner {
        width: var(--screen-size);
        margin: auto;
        display              : grid;
        gap                  : 80px 40px;
        grid-template-columns: 1fr 1fr;
    }
        .footer__bottom {
            grid-column: 1 / span 2;
        }

/* 情報
--------------------------- */
.footer__info {
    margin: 0 0 20px;
}
    .footer__name {
        font-size  : 18px;
        font-weight: bold;
    }
    .footer__info-right {
        display: grid;
        gap    : 4px;
    }
        .footer__info-list {
            display: flex;
            white-space: nowrap;
        }
            .footer__info-list :is(dt, dd){
                font-size: 13px;
            }
.footer__bnr {
    margin-block: 20px;
}
/* お問い合わせ
--------------------------- */
.footer__contact {
    display: grid;
    gap    : 10px;
    grid-template-columns: 1fr 1fr;
}
    [class*="footer__contact-btn--"]{
        background-color: #fff;
        border-radius: 6px;
        display        : flex;
        gap            : 5px;
        align-items    : center;
        justify-content: center;
        height: 44px;
        color: var(--dark-color);
    }
    .footer__contact-btn--tel {
        font-size: 13px;
    }
    .footer__contact-btn--mail {
        font-size  : 15px;
        font-weight: bold;
    }
        [class*="footer__contact-btn--"] svg {
            width: 16px;
            height: 16px;
            fill: var(--dark-color);
        }
.footer__linebnr {
    margin: 15px 0;
}
.footer__snslink {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 20px;
    padding: 10px;
    width: fit-content;
    background-color: #f5f5f5;
}
.footer__snslink div {
    padding: 0 13px 0;
}
.fotter__line img {
    margin: 20px 0;
}
/* リスト
--------------------------- */
.footer__list-link {
    display        : flex;
    gap            : 10px;
    align-items    : center;
    justify-content: space-between;
    border-bottom: 1px solid #fff;
    padding: 13px 20px 14px 0;
}
    .footer__list-link svg {
        width: 21px;
        height: 21px;
        fill: #fff;
    }

/* メニュー
--------------------------- */
.footer__menu {
    display        : flex;
    gap            : 6px 16px;
    flex-wrap      : wrap;
    justify-content: center;
    margin: 0 0 32px;
}
    .footer__menu-link {
        display    : flex;
        gap        : 5px;
        align-items: center;
        font-size: 13px;
    }
        .footer__menu-link svg {
            width: 8px;
            height: 8px;
            fill: #fff;
        }

/* #
--------------------------- */
.footer__copy {
    font-size: 13px;
    text-align: center;
}

.ft-slogan__txt {
    border-top: 1px solid #ccc;
    margin-top: 20px;
    text-align: center;
    padding: 10px 0;
}
.ft-slogan__txt p {
    font-size: 13px;
}

/* 予約ボタン
--------------------------- */
.gotop-btn {
    width: 56px;
    height: 56px;
    background-color: var(--sub-color);
    border-radius: 50%;
    box-shadow: var(--box-shadow);
    display        : flex;
    align-items    : center;
    justify-content: center;
    position: fixed;
    bottom  : 10px;
    right   : 10px;
    z-index : 10;
}
    .gotop-btn svg {
        width: 20px;
        height: 20px;
        fill: #fff;
    }
.reservation-side-link {
    width: 69px;
    height: 220px;
    background-color: var(--sub-color);
    border-bottom-left-radius: 8px;
    box-shadow: var(--box-shadow);
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 200px;
    right: 1px;
    z-index: 10;
}
.reservation-side-link svg {
    width: 20px;
    height: 20px;
    fill: #fff;
    position: absolute;
    top: 25px;
}
.reservation-side-link-text {
    position: absolute;
    writing-mode: vertical-rl;
    font-size: 20px;
    font-weight: bold;
    letter-spacing: 13px;
    bottom: 25px;
    color: #fff;
}
.reservation-side-link-text:before {
    content: "";
    display: inline-block;
    height: 14px;
    width: 69px;
    position: relative;
    background-color: rgba(236, 239, 241, .5);
    bottom: 49px;
}

/*-------------------------------------------------------------------------
下層共通
-------------------------------------------------------------------------*/

.page__header {
    margin: 0 0 60px;
}
    .page__headline {
        font-size  : 22px;
        font-weight: bold;
    }

/* 横画面サイズフルサイズの大見出し
--------------------------- */
.md-mv-heading {
    height: 200px;
    display    : grid;
    place-items: center;
    background-color: rgb(38, 50, 56);
    margin-block: -51px 0;
    margin-inline: var(--full-screen);
}
    .md-mv-heading__headline {
        grid-area: 1 / 1;
        position: relative;
        z-index : 1;
        font-size  : 22px;
        font-weight: bold;
        color      : #fff;
    }
    .md-mv-heading__img {
        width: 100%;
        height: inherit;
        grid-area: 1 / 1;
        object-fit     : cover;
        object-position: center;
        position: relative;
        z-index : 0;
        opacity: .6;
    }

/* 一枚表示のスライダー
--------------------------- */
.md-photo-slider {
    position: relative;
}
    .md-photo-slider__counter {
        background-color: var(--bg-dark-transparent);
        border-radius: 50px;
        padding: 3px 12px;
        position: absolute;
        top     : 10px;
        left    : 10px;
        font-size: 13px;
        color    : #fff;
    }
        .md-photo-slider__counter span {
            font-size: inherit;
            color    : inherit;
        }
.md-photo-slider .slick-arrow {
    position: absolute;
    top     : -20px;/* ページャーの分  */
    bottom  : 0;
    margin  : auto;
}
.md-photo-slider .slick-prev {
    left: 0;
}
.md-photo-slider .slick-next {
    right: 0;
}

/* 問答
--------------------------- */
.md-faq {
    display: grid;
    gap    : 8px;
}
    .md-faq__items {
        background-color: var(--main-light-color);
        border-radius: 8px;
        padding: 16px;
    }
        .md-faq__question {
            margin: 0 0 8px;
            font-size  : 15px;
            font-weight: bold;
        }

/*.ui-fixed-bottom [class*="ui-contact-btn--"]{
    margin-top: 0;
}
*/

/*-------------------------------
まとめてお問い合わせ
--------------------------------*/
.float_box {
    position: fixed;
    bottom: 0;
    display: none;
    width: 100%;
    box-sizing: border-box;
    padding: 8px 40px;
    justify-content: center;
    background: rgba(236, 239, 241, .5);
    z-index: 1002;
}

.float_box.show {
    display: flex;
    gap: 20px;
}

.float_item a {
    display: flex;
    background: var(--point-color);
    text-align: center;
    justify-content: center;
    align-items: center;
    font-size: 15px;
    font-weight: 700;
    width: 240px;
    height: 44px;
    color: #fff;
}
.float_item .favorite {
    background-color: var(--main-color);
}

/*-------------------------------
フリーワード検索 サジェスト
--------------------------------*/
#suggestion-box {
    border: 1px solid #ddd;
    background-color: #fff;
    position: absolute;
    top: 100%;
    left: 0;
    width: 629px;
    z-index: 1000;
}
.suggestion-item {
    padding: 10px;
    cursor: pointer;
}
.suggestion-item:hover {
    background-color: #f0f0f0;
}
.hidden {
    display: none;
}

/*-------------------------------------------------------------------------
お客様の声パターン2
パターン１はトップページ用？
パターン2もトップページで使う
パターン2は下層でも使う
-------------------------------------------------------------------------*/

.md-voice2 {
    display              : grid;
    gap                  : 40px 30px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0 0 58px;
}
.md-voice2 li {
    display: flex;
    gap: 12px;
    flex-direction: column;
}
.md-voice2.is-line4 {
    gap                  : 20px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
    .md-voice2__items {
        display           : grid;
        row-gap           : 15px;
        grid-row          : span 2;
        grid-template-rows: subgrid;
    }
    .is-line4 .md-voice2__items {
        row-gap: 5px;
    }
        .md-voice2__img {
            height: 260px;
        }
        .is-line4 .md-voice2__img {
            height: 106px;
        }
        .md-voice2__info {
            min-width: 0;
            background-color: var(--main-light-color);
            border-radius: 8px;
            display: block;
            padding: 20px 30px 20px 20px;
            position: relative;
        }
        .is-line4 .md-voice2__info {
            padding: 10px 20px 10px 10px;
        }
            .md-voice2__name {
                 margin-bottom: 3px;
                 font-size: 16px;
                 font-weight: 700;
                 color      : var(--light-text-color);
                 white-space  : nowrap;
                 overflow     : hidden;
                 text-overflow: ellipsis;
             }
            .md-voice2__text {
                overflow          : hidden;
                display           : -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 6;
                text-overflow     : ellipsis;
                height            : 124px;
            }
            .is-line4 .md-voice2__text {
                -webkit-line-clamp: 2;
            }
                .md-voice2__arw {
                    min-width: 13px;
                    width: 13px;
                    height: 13px;
                    fill: var(--main-color);
                    position: absolute;
                    top     : 0;
                    bottom  : 0;
                    right   : 10px;
                    margin  : auto;
                }
                .is-line4 .md-voice2__arw {
                    right: 5px;
                }