@charset "UTF-8";
/********** 取り込み時に消えることがあるので、同じものをコメントアウトしておく **********/
@import url("https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,700;1,400;1,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Hina+Mincho&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Beth+Ellen&display=swap");

/* font file */
@font-face {
    font-family: "antrovectra";
    src: url('/import/tenant_1/160.16.150.91/html/css/Antro_Vectra_Bolder.woff') format("woff"),
        url('/import/tenant_1/160.16.150.91/html/css/Antro_Vectra_Bolder.otf') format("otf"),
        url('/import/tenant_1/160.16.150.91/html/css/Antro_Vectra_Bolder.ttf') format("truetype");
    font-weight: bold;
    font-style: normal;
}

/*===================================
  基本設定
===================================*/
.color01 {
    color: #4f2f27;
}

.color02 {
    color: #333;
}

.color03 {
    color: #333;
}

.color04 {
    color: #333;
}

.bgcolor01 {
    background-color: #fff;
    /*background-color: #f2e2cb;*/
}

.bgcolor02 {
    background-color: #f3efe9;
    /*background-color: #f5eadb;*/
}

.bgcolor03 {
    background-color: #f3efe9;
}

.bgcolor04 {
    background-color: #333;
}

.pic img {
    width: 100%;
}

/* 余白をemで指定 */
.mbem1 {
    margin-bottom: 1em;
}

.mbem2 {
    margin-bottom: 2em;
}

.mbem2to1 {
    margin-bottom: 2em;
}

.mbem2to10 {
    margin-bottom: 2em;
}

@media (max-width: 599px) {
    .mbem2to1 {
        margin-bottom: 1em;
    }

    .mbem2to10 {
        margin-bottom: 10em;
    }
}

/* 共通要素読み込みコメント（取り込み後削除） */
[class*="load-"] {
    min-height: 50px;
    border: 3px solid #00bcd4;
    position: relative;
}

[class*="load-"]:before {
    content: "共通要素";
    display: block;
    font-weight: 650;
    color: #ff0;
    text-align: center;
    background: #00bcd4;
    position: absolute;
    z-index: 100;
}

/*===================================
  共通リスト　list-cmn
==================================*/

.drawer-active header,
.drawer-active .header-logo,
.drawer-active main,
.drawer-active footer {
    -webkit-filter: blur(8px);
    filter: blur(8px);
}

body.drawer-active {
    overflow: hidden;

    -ms-touch-action: none;
    touch-action: none;
}

.section-padding {
    padding-top: clamp(3.75rem, 3.182rem + 2.42vw, 5rem);
    padding-bottom: clamp(3.75rem, 3.182rem + 2.42vw, 5rem);
}

.section-padding.-only-top {
    padding-bottom: 0;
}

.section-padding.-only-bottom {
    padding-top: 0;
}

/*===================================
  共通ボタン btn-cmn
===================================*/
/*ボタン、ホバー時の装飾*/
.hmore {
    width: 240px;
    margin: 50px auto 0;
}

.hmore a {
    width: 100%;
    max-width: 240px;
    display: inline-block !important;
    padding: 15px 25px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    /*font-family: "Lora", "YuMincho", "Yu Mincho", "游明朝体", "ヒラギノ明朝 ProN",
    "Hiragino Mincho ProN", serif;*/
    font-family: "游ゴシック", YuGothic, Hiragino Sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    /*font-weight: 600;*/
    font-size: 16px;
    font-style: italic;
    text-align: center;
    border: 1px solid #ddd;
    background: #fff;
    position: relative;
}

.hmore span,
.MoveBtn span {
    display: inline-block;
    padding-right: 1em;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    position: relative;
}

.hmore span::after,
.MoveBtn span::after {
    content: "\f054";
    display: block;
    font-family: "Font Awesome 5 Free";
    /*font-weight: 900;*/
    font-style: normal;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    top: 50%;
    right: -10px;
}

.hmore:hover span,
.MoveBtn:hover span {
    padding: 0 0.5em;
}

.hmore:hover span::after,
.MoveBtn:hover span::after {
    opacity: 0;
    right: 0;
}

/*ボタン、ホバー時の装飾(バック)*/
.MoveBackBtn {
    width: 240px;
}

.MoveBackBtn span {
    padding-left: 1em;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    position: relative;
}

.MoveBackBtn span::after {
    content: "\f053";
    margin-top: -6px;
    font-family: "Font Awesome 5 Free";
    /*font-weight: 900;*/
    font-style: normal;
    border: 7px solid transparent;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    position: absolute;
    left: -12px;
}

.MoveBackBtn:hover span {
    padding: 0 0.5em;
}

.MoveBackBtn:hover span::after {
    opacity: 0;
    right: 0;
}

/* 共通ボタン１ */
.btn-cmn01 {
    max-width: 250px;
    margin-top: 30px;
    margin-left: auto;
    margin-right: auto;
}

.btn-cmn01 a {
    display: block;
    padding: 10px 20px;
    color: #fff;
    text-align: center;
    background: #4f2f27;
    font-size: 16px;
}

/*===================================
  他共通エレメント -cmn
===================================*/
/*===================================
  共通要素
===================================*/
/* タイトル */
.title01 {
    /*font-family: "Hina Mincho", serif;*/
    /*font-family:  "Lora", "YuMincho", "Yu Mincho", "游明朝体", "ヒラギノ明朝 ProN",
    "Hiragino Mincho ProN", serif;*/
    font-family: "游ゴシック", YuGothic, Hiragino Sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    font-weight: 600;
    font-size: clamp(1.4rem, 1.3rem + 1.1vw, 2.4rem);
    /*font-size: clamp(2rem, 1.602rem + 1.7vw, 2.875rem);*/
    color: #4f2f27;
    line-height: 1.5;
    letter-spacing: 0.13em;
}

/*h1ページタイトル */
.pagettl {
    display: none;
}

/**
ヘッダー
header
*/
.header {
    height: 1px;
    margin-top: -1px;
    text-indent: -9999px;
}



/* 下部固定コンテンツ */
.fix-bottom {
    display: none;
}

@media (max-width: 1024px) {
    .fix-bottom {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 250;
    }

    .fix-bottom .item {
        width: 50%;
        text-align: center;
    }

    .fix-bottom a {
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        -ms-flex-align: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding: 10px 5px;
    }

    .fix-bottom .tel {
        color: #fff;
        background: #333;
    }

    .fix-bottom .tel a:before {
        content: "\f879";
        margin-right: 5px;
        font-family: "Font Awesome 5 Free";
        /*font-weight: 600;*/
    }

    .fix-bottom .contact {
        color: #333;
        background: #eee;
    }

    .fix-bottom .contact a:before {
        content: "\f0e0";
        margin-right: 5px;
        font-family: "Font Awesome 5 Free";
        /*font-weight: 600;*/
    }
}

/**
グローバルナビ
gnav
*/
.overlay {
    width: 100%;
    height: 100%;
    display: none;
    overflow: hidden;
    background-color: rgba(79, 47, 39, 0.4);
    position: fixed;
    top: 0;
    right: 0;
    z-index: 20;

    -ms-touch-action: none;
    touch-action: none;
}

.drawer-active .overlay {
    display: block;
}

#gnav {
    width: 35%;
    max-width: 80%;
    height: 100%;
    display: block;
    overflow: hidden;
    padding: 0;
    border: none;
    background: none;
    -webkit-transition: ease 0.5s;
    transition: ease 0.5s;
    -webkit-transform: translate(100%, 0);
    transform: translate(100%, 0);
    position: fixed;
    top: 0;
    right: 0;
    z-index: 251;
}

#gnav .in {
    width: 100%;
    height: 100vh;
    overflow-y: scroll;
    padding: 0.5em;
    background: rgba(255, 255, 255, 0.8);
    position: relative;
}

.drawer-active #gnav {
    -webkit-box-shadow: -2px 0px 15px -5px #000;
    box-shadow: -2px 0px 15px -5px #000;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}

.nav-list {
    width: 500px;
    max-width: 100%;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    margin: 50px auto;
}

.nav-list li a {
    display: block;
    padding: 0.25em 0.25em 0.25em 2em;
    /*font-family: "Hina Mincho", serif;*/
    font-family: "游ゴシック", YuGothic, Hiragino Sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    color: #4f2f27;
    letter-spacing: 0.1em;
    position: relative;
}

.nav-list li a::before {
    content: "";
    width: 1.5em;
    height: 1.5em;
    display: block;
    background-image: url(/upload/tenant_1/leaf.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    top: 0.25em;
    left: 0;
}

.nav-list li+li {
    margin-top: 0.75em;
}

#gnav .logo {
    width: 400px;
    max-width: 80%;
    margin-left: auto;
    margin-right: auto;
    padding: 75px 30px 20px 30px;
}

.nav-info .tel {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0.25em auto;
}

.nav-info .tel a {
    display: block;
    padding: 0.25em 2em;
    font-size: clamp(1.5rem, 1.33rem + 0.73vw, 1.875rem);
    color: white;
    letter-spacing: 0.1em;
    border-radius: 0.1em;
    background-color: #4f2f27;
}

.nav-info .address {
    margin: 0.5em 0;
    color: #4f2f27;
    text-align: center;
}

@media (max-width: 1024px) {
    #gnav {
        width: 65%;
    }
}

@media (max-width: 599px) {
    #gnav {
        width: 85%;
    }
}

/* ハンバーガーメニュー  */
.toggle {
    width: 60px;
    height: 60px;
    background: #fff;
    opacity: 0.8;
    cursor: pointer;
    position: fixed !important;
    top: 20px;
    right: 20px;
    z-index: 251;
}

.toggle .bar {
    width: 28px;
    height: 4px;
    display: block;
    margin-top: -1px;
    padding: 0;
    text-indent: 9999px;
    background: #333;
    -webkit-transition: ease 0.4s;
    transition: ease 0.4s;
    position: absolute;
    top: 50%;
    left: 16px;
}

.toggle .bar:before,
.toggle .bar:after {
    content: "";
    width: 28px;
    height: 4px;
    display: block;
    background: #333;
    position: absolute;
    left: 0;
}

.toggle .bar:before {
    top: -10px;
}

.toggle .bar:after {
    top: 10px;
}

.drawer-active .toggle .bar {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.drawer-active .toggle .bar:after,
.drawer-active .toggle .bar:before {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    top: 0;
    left: 0;
}

.header-logo {
    max-width: 150px;
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 1;
}

@media (max-width: 599px) {
    .header-logo {
        max-width: 100px;
    }
}

/*トップへ戻る*/
.totop {
    width: 68px;
    height: 68px;
    font-size: 30px;
    color: #fff;
    line-height: 68px;
    text-align: center;
    background: #3d4070;
    cursor: pointer;
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 200;
}

.totop:before {
    content: "\f077";
    font-family: "Font Awesome 5 Free";
    /*font-weight: bold;*/
}

@media (max-width: 1024px) {
    .totop {
        bottom: 50px;
        right: 10px;
    }
}

/* 電話番号のデザイン */
.tel a {
    display: block;
    padding: 0.5em;
    font-size: 16px;
    color: #fff;
    text-align: center;
    background: #4f2f27;
}

/**
フッター
footer
*/
.footer {
    border-top: #eee 1px solid;
}

.footer .footnav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    /*font-family: "Hina Mincho", serif;*/
    font-family: "游ゴシック", YuGothic, Hiragino Sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    font-weight: bold;
    color: #4f2f27;
}

.footer .footnav li {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}


.footer .copy {
    padding: 20px 0 20px 0;
    font-family: "Lora", serif;
    font-size: 12px;
    font-style: italic;
    text-align: center;
}

.footer .foot-logo {
    max-width: 150px;
    margin: 30px auto 10px;
}

.instagram {
    margin-right: 0.5em;
}

.instagram a::before {
    content: "\f16d";
    font-family: "Font Awesome 5 Brands";
    font-weight: 400;
    font-size: 1.5em;
    color: #4f2f27;
    line-height: 1;
}

.facebook a::before {
    content: "\f082";
    font-family: "Font Awesome 5 Brands";
    font-weight: 400;
    font-size: 1.5em;
    color: #4f2f27;
    line-height: 1;
}

@media (max-width: 1024px) {
    .footer .copy {
        padding-bottom: 50px;
    }
}

@media (max-width: 599px) {
    .footer .footinfo {
        width: 100%;
        padding: 0 0 30px 0;
        text-align: center;
    }

    .footer .footinfo .in {
        display: block !important;
    }

    .footer .footnav {
        width: 100%;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        font-size: 12px;
    }

    .footer .footnav li {
        width: 48%;
        margin-bottom: 1em;
    }

    .footer .footnav .flex {
        padding: 0 5%;
    }

    .footer .footinfo li .st {
        width: 100%;
    }
}


/*===================================
  各個別コンテンツ
===================================*/
/*トップ*/
/*ホームビジュアル（トップ）*/
.homevisual {
    position: relative;
}

.homevisual .img {
    width: 100%;
    display: block;
    position: relative;
}

.homevisual .img::after {
    content: "";
    display: block;
    padding-top: 100vh;
}

.homevisual .img img {
    width: 100%;
    height: 100% !important;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    position: absolute;
    top: 0;
    left: 0;
}

.homevisual .copy {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-align: start;
    align-items: flex-start;
    -ms-flex-align: start;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    top: 50%;
    right: calc(50% - 500px);
    z-index: 1;
}

.homevisual .copy .copy01,
.homevisual .copy .copy02 {
    display: inline-block;
    margin: 0.25em;
    padding: 0.3em 0.5em 0.2em 0.4em;
    /*font-family: "Hina Mincho", serif;*/
    /*font-family:  "Lora", "YuMincho", "Yu Mincho", "游明朝体", "ヒラギノ明朝 ProN",
    "Hiragino Mincho ProN", serif;*/
    font-family: "游ゴシック", YuGothic, Hiragino Sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    font-weight: 650;
    /*font-size: clamp(2rem, 1.545rem + 1.94vw, 3rem);*/
    font-size: clamp(1.6rem, 1.245rem + 1.54vw, 2.6rem);
    color: #4f2f27;
    line-height: 1;
    /*letter-spacing: 0.1em;*/
    letter-spacing: 0.2em;
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    background: #fff;
    opacity: 0.8;
}

.homevisual .copy .copy02 {
    margin-top: 1.8em;
    /*letter-spacing: 0.18em;*/
    letter-spacing: 0.2em;
}

@media (max-width: 1024px) {
    .homevisual .img::after {
        padding-top: 80vh;
    }

    .homevisual .copy {
        right: 5%;
    }
}

/*IE対策*/
.homevisual .head {
    font-weight: bold;
    font-size: 40px;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute !important;
    top: 50%;
    left: 50%;
}

@media (max-width: 599px) {
    .homevisual .head {
        font-size: 28px;
    }
}

/* A-BiSUスライダー用 */
.mainimg {
    overflow: hidden;
    position: relative;
}

.mainimg img {
    width: 100%;
}

.mainimg .uk-slidenav-position {
    min-height: 300px;
    overflow: hidden;
    position: relative;
}

.mainimg .uk-slidenav-position:after {
    content: "";
    display: block;
    padding-top: 50%;
}

.mainimg .uk-slideshow {
    height: 100% !important;
    position: absolute;
    top: 0;
}

.mainimg .uk-slideshow li {
    height: 100% !important;
}

.mainimg .uk-slideshow .uk-flex {
    height: 100%;
}

.mainimg .uk-slideshow img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    /*IE対策*/
    font-family: "object-fit: cover; object-position: 50% 50%;";
}

/* home02 */

.home02 .img-wrap01 {
    width: 25%;
    position: absolute;
    top: 25%;
    left: 1%;
}

.home02 .img-wrap02 {
    width: 25%;
    position: absolute;
    top: 25%;
    right: 1%;
}

@media (max-width: 599px) {
    .home02 .img-wrap01 {
        top: auto;
        width: 35%;
        bottom: -30%;
        left: 15%;
    }

    .home02 .img-wrap02 {
        top: auto;
        bottom: -30%;
        right: 15%;
    }
}

/* home03 */

.imgfit img {
    width: 100%;
    height: 100% !important;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    font-family: "object-fit: cover; object-position: center center;";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.clearfix {
    display: block;
}

.clearfix:before {
    content: "";
    display: block;
    clear: both;
}

.clearfix:after {
    content: "";
    display: block;
    clear: both;
}

/* ##### cross ##### */
.cross-wrap .cross+.cross {
    margin-top: 60px;
}

.cross {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.cross-img {
    width: 35%;
    margin-top: 60px;
    margin-bottom: 60px;
    margin-right: -10%;
    position: relative;
    z-index: 1;
}

.cross-content {
    width: 75%;
    padding: 3em 3em 3em calc(3em + 10%);
    background-color: white;
}

.cross-content .noinner {
    width: 100%;
    max-width: 600px;
    margin-left: 0;
    margin-right: auto;
    padding: 1em;
}

@media (max-width: 1024px) {
    .cross-img {
        width: 80%;
        margin: 0 auto;
    }

    .cross-content {
        width: 100%;
        margin-top: -2em;
        padding: 4em 2em 2em;
    }
}

@media (max-width: 599px) {
    .cross-img {
        width: 90%;

    }
}

/* ##### cross02 ##### */
.cross02-wrap .cross02+.cross02 {
    margin-top: 60px;
}

.cross02 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.cross02-img {
    width: 35%;
    margin-top: 60px;
    margin-bottom: 60px;
    margin-right: -10%;
    position: relative;
    z-index: 1;
}

.cross02-content {
    width: 75%;
    padding: 3em 3em 3em calc(3em + 10%);
    background-color: white;
}

.list-cross dt {
    margin-bottom: 0.5em;
    padding-left: 2em;
    position: relative;
    font-weight: 600;
    letter-spacing: 0.1em
}

.list-cross dt {
    font-size: 18px;
}

.list-cross dt .mark {
    width: 1.5em;
    height: 1.5em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    /*font-family: "Hina Mincho", serif;*/
    font-family: "游ゴシック", YuGothic, Hiragino Sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    font-weight: 600;
    line-height: 1;
    border-radius: 100%;
    background-color: #f5eadb;
    position: absolute;
    top: 0;
    left: 0;
}

.list-cross dd {
    padding-left: 2em;
}

@media (max-width: 599px) {
    .cross02-img {
        width: 75%;
        margin: 0 auto 0 1em;
    }

    .cross02-content {
        width: 100%;
        margin-top: -2em;
        padding: 4em 1.5em 2em;
    }
}

/* home04*/
/* 背景に画像 */
.bg-parent {
    position: relative;
}

.bg-content {
    position: relative;
    z-index: 1;
}

.bg-image {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.bg-image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    opacity: 0.5;
}

.kirari-fukidashi {
    padding-bottom: 50px;
    /*font-family: "Beth Ellen", cursive;*/
    /*font-family: "Hina Mincho", serif;*/
    font-family: "游ゴシック", YuGothic, Hiragino Sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    /*font-weight: 600;*/
    font-size: 36px;
    color: #4f2f27;
    position: relative;
}

.kirari-fukidashi::after {
    content: url("/import/tenant_1/www.h-smile.info/html/images/ballon01.png");
    -webkit-transform: translate(-50%, 0);
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
    position: absolute;
    bottom: 0;
}

/* home05 */
.img-big-box,
.img-small-box {
    width: calc(50% - 2px);
    margin: 1px;
}

/* home06 */
.home06 .cross {
    min-height: 300px;
}

.home06 .cross .box01 {
    width: 70%;
}

.home06 .cross .box01 .title {
    font-size: 1em;
}

.home06 .cross .box02 {
    width: calc(35% - 40px);
}

.home06 .crossbg {
    width: 75%;
}

@media(max-width:1024px) {
    .home06 .cross .box01 {
        width: 50%;
    }
}

@media(max-width:599px) {
    .home06 .cross {
        min-height: 400px;
    }

    .home06 .cross .box01 {
        width: 70%;
    }

    .home06 .cross .box02 {
        width: calc(100% - 40px);
    }

    .home06 .crossbg {
        width: 88%;
    }
    .madori {
      display: block;
    }
    .madori li {
      width: 100%;
    }
}

/* home08 */
.access-map {
    position: relative;
}

.access-map::before {
    content: "";
    display: block;
    padding-top: 70%;
}

.access-map iframe {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

/* home09 */
/* お問い合わせフォーム */

.form-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0.75em 0.25em;
}

.form dl {
    padding: 20px 0;
}

.form dt {
    width: 25%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    align-items: flex-start;
    -ms-flex-align: start;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding: 0.5em 0;
    font-weight: bold;
}

.form-list dt .must {
    display: inline-block;
    margin-left: 1em;
    padding: 0.35em 1em 0.2em 1em;
    font-size: 14px;
    color: white;
    line-height: 1;
    border: none;
    border-radius: 2px;
    background-color: #945141;
}

.form-list dd {
    width: 10%;
    width: 100%;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin-left: 5em;
    background-color: white;
}

.form-list dd input,
.form-list dd textarea {
    width: 100%;
    padding: 1em;
    border: 1px solid #945141;
    border-radius: 0.5em;
}

.btn {
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.btn__square {
    width: 220px;
    max-width: 90%;
    height: 45px;
}

.btn__square a,
.btn__square button {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 10px 20px;
    color: white;
    border: 1px solid #4f2f27;
    background-color: #4f2f27;
    position: relative;
}

.btn__square a::after,
.btn__square button::after {
    content: "\f105";
    display: inline-block;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: inherit;
    line-height: 100%;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    top: 50%;
    right: 5px;
    z-index: 1;
}

.btn__square a:hover,
.btn__square button:hover {
    color: #2c4668;
    background-color: white;
    opacity: 1;
}

.btn__square.__back a::after,
.btn__square.__back button::after {
    content: "\f104";
    left: 5px;
    right: auto;
}

.mbem2-10 {
  margin-bottom: 2em;
}
@media(max-width:599px) {
    .form-list {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .form dt {
        width: 100%;
    }

    .form-list dt .must {
        margin-top: 0;
    }

    .form-list dd {
      margin-left: 0.5em;
        /*padding: 0.1em;*/
    }
    .sp-tac {
      text-align: center;
    }
    .mbem2-10 {
      margin-bottom: 10em;
    }
}

[data-element-id] .pagettl {
    display: none;
}

[data-element-id] #header {
    height: auto;
    margin-top: 0;
    margin-left: 7%;
    text-indent: inherit;
}

[data-element-id] .gnav.fixed {
    position: relative;
}

[data-element-id] #gnav .in {
    height: auto;
}

[data-element-id] #gnav {
    max-width: 500px;
    height: auto;
    min-height: 50%;
    margin-left: auto;
    padding: 2em 1em 1em;
    border: 2px solid green;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    position: static;
}

[data-element-id] #gnav::before {
    content: "ナビゲーションです";
    width: 100%;
    display: block;
    padding: 0.5em;
    font-size: 10px;
    color: white;
    line-height: 1.2;
    text-align: center;
    background-color: green;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

[data-element-id] .up-d-none:after {
    content: "公開画面では表示されない";
    display: block;
    padding: 5px;
    font-weight: 700;
    font-size: 16px;
    color: #fff;
    text-align: center;
    background: green;
}

/* 2024/03/04 追記 */

 #kinari-lp .form-list .input-w-auto input{
  width: auto;
}

 #kinari-lp .form-list .input-mr-5 input {
    margin-right: 5px;
    position: relative;
    top: 2px;
}

@media screen and (max-width:599px) {
 #kinari-lp .form-list .input-w-8 input{
 width: 15px !important; 
}

 #kinari-lp .form-list .ai-c{
  align-items: center;
}

 #kinari-lp .form-list .d-flex{
 display: flex; 
}

 #kinari-lp .form-list .mb-8{
  margin-bottom: 8px;
}
}

/* 2024/03/05 */

#kinari-lp .copy .noto{
  font-family: iroha-26tubaki-stdn,sans-serif;
  font-weight: 400;
  font-style: normal;
}

#kinari-lp .paris {
    font-family: "antrovectra";
    color: #8b4049 /*#D89C7E*/;
    font-size: 62px;
    margin: -50px auto auto;
    position: relative;
    width: fit-content;
    white-space: nowrap;
    margin-top: -50px;
    opacity: .5;
    transform: rotate(-15deg);
}

#kinari-lp .paris::after {
    width: 110%;
    height: 2px;
    content: "";
    display: inline-block;
    position: absolute;
    bottom: 30px;
    left: 0;
    background-color: #8b4049 /*#D89C7E*/;
}

#kinari-lp .title-box-main{
  position: relative;
}

@media screen and (max-width:599px) {
 #kinari-lp .fix-content{
       position: fixed;
    bottom: 0px;
    right: 0;
    color: #fff;
    width: 60vw;
    background: #bfa574;
    height: 50px;
    display: flex;
    align-items: center;
    border-radius: 30px 0 0 30px;
    z-index: 9999;
 }
 
 #kinari-lp .fix-content div.header-btn{
   margin-left: 25px;
    font-weight: bold;
    letter-spacing: 0.15em;
 }
 
#kinari-lp .fix-content div.header-btn a{
    position: relative;
  }
 
#kinari-lp .fix-content div.header-btn a::before {
    background-image: url(https://h-smile.info/upload/tenant_1/スタンダードな家アイコン.png);
    display: inline-block;
    height: 20px;
    width: 20px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    content: "";
    position: relative;
    top: 3px;
}

  #kinari-lp .fix-content div.header-btn span{
    margin-left: 10px;
  }
 
}

#kinari-lp #homevisual02 .copy{
  position: absolute;
    writing-mode: initial;
    right: initial;
    left: inherit;
    text-align: left;
    display: block;
    top: 60%;
    transform: initial;
    left: 5%;
}

#kinari-lp #homevisual02 .copy01{
  writing-mode: horizontal-tb;
    display: block;
    width: fit-content;
    background: transparent;
    color: #fff;
    padding-left: 0px;
    font-size: 46px;
}

#kinari-lp #homevisual02 .copy02{
    writing-mode: horizontal-tb;
    display: block;
    width: fit-content;
    color: #fff;
    background: transparent;
    line-height: 5rem;
    padding-left: 0px;
}

@media screen and (max-width:599px) {
 
#kinari-lp #homevisual02 .copy01{
    font-size: 32px;
    margin-left: 0px;
}

#kinari-lp #homevisual02 .copy02{
    font-size: 18px;
    line-height: inherit;
    margin-left: 0px;
}
}

#kinari-lp .mt-100{
  margin-top: 100px;
}

@media screen and (max-width:1024px) {
 #kinari-lp .form-list .d-flex {
    display: block;
}
}

#kinari-lp .noto, * {
    font-family: iroha-26tubaki-stdn, sans-serif;
    font-weight: 400;
    font-style: normal;
}

/* 04/11 追記 */

#kinari-lp .nav-list li a{
  font-family: iroha-26tubaki-stdn,sans-serif !important;
  font-weight: 400 !important;
  font-style: normal !important;
}

#kinari-lp .nav-info .address{
  font-family: iroha-26tubaki-stdn,sans-serif !important;
  font-weight: 400 !important;
  font-style: normal !important;
}
