/* reset */

@charset "utf-8";

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
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 {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    vertical-align:baseline;
    background:transparent;
}

html {overflow-y: scroll;}

h1, h2, h3, h4, h5, h6{font-size:100%; font-weight:normal;}

body {
    line-height:1;
}

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

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

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

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

em,
strong{
  font-weight:700;
  font-style:normal;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000; 
    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;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

a{color:#333;}

ul, ol{list-style:none;}

ol{
  list-style:decimal;
  padding-left: 1em;
}

img{vertical-align:bottom;}

address{font-style:normal;}

main{display:block;}

input, select{vertical-align:middle;}

input,
textarea,
select,
button{
  font-family:"游ゴシック", YuGothic,"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Verdana, sans-serif;
  font-weight:500;
  margin:0;
  padding:0;
  box-shadow:none;
  border-radius:0;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="button"],
input[type="submit"],
textarea,
button{
    -webkit-appearance: none;
}

/* layout */


html {
    font-size: 62.5%;
    /* rem対策で基準を10pxに　10/16 = 0.625 */
}

body {
    font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Verdana, sans-serif;
    font-size: 1.6rem;
    /* 16px */
    font-weight: 500;
    color: #333333;
    line-height: 1.8;
    -webkit-text-size-adjust: 100%;
    min-width: 1200px;
}

/*
@media all and (-ms-high-contrast:none) {

    body,
    input,
    textarea,
    select,
    button {
        font-family: "メイリオ", Meiryo, "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    }

    .preload * {
        transition: none !important;
    }
}
*/

a[href^="tel:"]:hover {
    opacity: 1;
}

img {
    max-width: 100%;
    width: auto;
    height: auto;
    image-rendering: -webkit-optimize-contrast;
}

img[src$=".svg"] {
    width: 100%;
}

@media (min-width:1024px) {

    a:hover {
        opacity: .7;
    }

    a[href*="tel:"] {
        pointer-events: none;
        cursor: default;
        text-decoration: none;
    }

}

main {
    position: relative;
    z-index: 1;
}


/* グローバルヘッダー
--------------------------------------------------------------- */

#g-header {
    box-sizing: border-box;
    position: relative;
    background: #FFF;
    z-index: 3;
}

#g-header h1 {
    width: 320px;
}

#g-header > .inr {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    width: 1200px;
    height: 80px;
    margin: 0 auto;
}

#g-header .head-info {
    width: 480px;
    white-space: nowrap;
}

#g-header .head-info .head-contact {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 80px;
    height: 100%;
    color: #fff;
    background: #33669B;
}

#g-header .head-info dl {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    line-height: 1;
    margin-bottom: -5px;
}

#g-header .head-info dt {
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 98px;
    font-size: 1.4rem;
    text-align: center;
    color: #fff;
    padding: .3em;
    margin-bottom: 5px;
    background: #003366;
}

#g-header .head-info dt + dd {
    box-sizing: border-box;
    width: calc(100% - 98px);
    padding-left: .5em;
    margin-bottom: 5px;
}

#g-header .head-info dt + dd em {
    font-size: 1.57em;
}

#g-header .head-info dt + dd span {
    font-size: .92em;
    margin-left: .5em;
}


/* グローバルメニュー
--------------------------------------------------------------- */

@media print,
screen and (min-width:1024px) {

    #g-nav {
        display: block !important;
    }

    #g-menu > li:not(:last-child) a:after {
        content: "";
        width: 1px;
        height: 1em;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        background: #33669B;
    }

}

#g-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    height: 40px;
}

#g-menu > li,
#g-menu > li > a {
    box-sizing: border-box;
    height: 100%;
}

#g-menu > li > a {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    font-weight: 700;
    color: #33669B;
    text-decoration: none;
    padding: .7em 2.5em;
    line-height: 1;
}


/* グローバルメニューSP
--------------------------------------------------------------- */

#g-menu-btn {
    display: none;
}


/* 共通 - バナーエリア
--------------------------------------------------------------- */

#bnr-area {
    background: #F7F5EC;
    padding: 50px 30px;
}

.tpl-top #bnr-area {
    background: #fff;
}

#bnr-area ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

#bnr-area ul > li:not(:last-child) {
    margin: 0 30px 0 0;
}

#bnr-area .is-toto {
    width: auto;
    height: 140px;
}


/* グローバルフッター
--------------------------------------------------------------- */

#g-footer {
    color: #fff;
    background: #33669B;
    line-height: 1;
    padding: 30px 30px 20px;
}

#f-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

#f-menu > li,
#f-menu > li > a {
    box-sizing: border-box;
}

#f-menu > li > a {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    font-weight: 700;
    color: #fff;
    text-decoration: none;
    padding: .7em 2.5em;
    line-height: 1;
}

@media print,
screen and (min-width:1024px) {

    #f-menu > li:not(:last-child) a:after {
        content: "";
        width: 1px;
        height: 1em;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        background: #fff;
    }

}

.list-sns {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin: 20px 0 30px;
}

.list-sns img {
    width: auto;
    height: 30px;
}

.list-sns > li {
    margin: 0 10px;
}

#g-footer small {
    display: block;
    text-align: center;
    font-size: 1.6rem;
}


/* 各ページ共通
--------------------------------------------------------------- */

.content-inr {
    width: 1200px;
    margin: 0 auto;
}


/* トップページ - スライダー
--------------------------------------------------------------- */

#main-slider,
#keyslider li {
    box-sizing: border-box;
    position: relative;
    width: 100%;
    height: 700px;
    overflow: hidden;
}

#main-slider img,
#keyslider li img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    font-family: "object-fit:cover;";
}

#main-slider .bx-caption {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    height: 4rem;
    font-size: 4rem;
    font-family: 'Noto Serif JP', serif;
    font-weight: 500;
    text-align: center;
    text-shadow: 0px 0px 6px #000000, 0px 0px 6px #000000, 0px 0px 6px #000000, 0px 0px 6px #000000;
    color: #fff;
    line-height: 1;
}


/* トップページ - キャッチコピー
--------------------------------------------------------------- */

.site-catch {
    font-size: 3.2rem;
    font-weight: 700;
    text-align: center;
    line-height: 1;
    margin: 0 0 150px;
}


/* トップページ - 実績メニュー
--------------------------------------------------------------- */

.section-top-work {
    padding: 80px 0 0;
}

.list-work-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.list-work-menu > li {
    width: 346px;
}

.list-work-menu a {
    display: block;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    background: #034F81;
    transition: .3s;
}

.list-work-menu figure {
    position: relative;
    width: 100%;
    height: 260px;
    overflow: hidden;
}

.list-work-menu figure img {
    transition: .3s;
}

.list-work-menu .ttl {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 110px;
    background: #034F81 url(./usr_img/common/bg_pattern1.png) 0 0 no-repeat;
}

.list-work-menu h3,
.list-work-menu .txt {
    display: block;
    font-weight: 500;
    font-size: 2.4rem;
    line-height: 1.5;
}

.list-work-menu h3 span,
.list-work-menu .txt span {
    display: block;
    font-size: 1.5rem;
}

.list-work-menu h3 span:before,
.list-work-menu h3 span:after,
.list-work-menu .txt span:before,
.list-work-menu .txt span:after {
    content: "-";
    margin: 0 .5em;
}

@media print,
screen and (min-width:1024px) {

    .list-work-menu a:hover {
        opacity: .7;
    }

    .list-work-menu a:hover figure img {
        transform: scale(1.2);
    }

}


/* トップページ - 当社の強み
--------------------------------------------------------------- */

.section-top-strengths {
    margin: 100px 0 0;
}

.section-top-strengths .bg-sts-max {
    box-sizing: border-box;
    position: relative;
    height: 400px;
    background: #F7F5EC;
}

.section-top-strengths h3 {
    font-size: 2.8rem;
    font-weight: 700;
    margin-bottom: .5em;
}

/*
.section-top-strengths p:not(:last-child) {
    margin-bottom: 1em;
}
*/

.block-sts1 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.block-sts1 figure {
    position: relative;
    width: 600px;
}

.block-sts1 figure img {
    position: relative;
    top: -50px;
}

.block-sts1 .txt {
    position: relative;
    top: -1em;
    width: 550px;
}

.block-sts2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.block-sts2 figure {
    position: relative;
    width: 500px;
}

.block-sts2 figure img {
    position: relative;
    top: -60px;
}

.block-sts2 .txt {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: calc(100% - 500px);
}

.block-sts2 .txt .box {
    position: relative;
    width: 500px;
    z-index: 2;
}

.block-sts2 .txt .box:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 250px;
    height: 250px;
    background: #F7F5EC;
    z-index: -1;
}


/* トップページ - サービス案内
--------------------------------------------------------------- */

.section-top-service {
    margin: 50px 0 120px;
}

.list-service-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.tpl-low .list-service-menu {
    margin-bottom: 100px;
}

.list-service-menu > li a {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 290px;
    height: 110px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    background: #33669B url(./usr_img/common/bg_pattern1.png) 0 0 no-repeat;
}

.list-service-menu h3 {
    font-size: 2.4rem;
    line-height: 1.5;
}

.list-service-menu h3 span {
    display: block;
    font-size: 1.5rem;
}

.list-service-menu h3 span:before,
.list-service-menu h3 span:after {
    content: "-";
    margin: 0 .5em;
}


/* トップページ - Instagram
--------------------------------------------------------------- */

.section-instagram {
    padding: 100px 0 50px;
    background: #F7F5EC;
}

.list-insta {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.list-insta > li {
    width: 180px;
}

.list-insta > li a {
    display: block;
    height: 180px;
}

.list-insta img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    font-family: "object-fit:cover;";
}

.section-instagram .h-type1 {
    font-family: arial;
    font-weight: 500;
    margin-bottom: 1em;
}

.section-instagram .h-type1:before {
    position: absolute;
    top: -50px;
    left: 0;
    right: 0;
    margin: auto;
    content: "";
    width: 40px;
    height: 40px;
    background: url(./usr_img/common/sns_insta_c.png) center center / contain no-repeat;
}


/* 下層ページ - 共通
--------------------------------------------------------------- */

.content-low-wrap {
    padding: 50px 0 100px;
}

.section-content + .section-content {
    margin-top: 100px;
}

.box-flex-center {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.box-ex {
    background: ;
    text-align: center;
    padding: 1.5em;
    background: #F7F5EC;
    margin-top: 2em;
    line-height: 1.4;
}

.box-figure {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.box-figure > figure {
    width: 560px;
}

.box-figure > .txt {
    width: 600px;
}

@media print,
screen and (min-width:1024px) {

    .box-figure.is-reverse > figure {
        order: 2;
    }

    .box-figure.is-reverse > .txt {
        order: 1;
    }

}

.box-singl-txt {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.box-middle {
    width: 980px;
    margin: 0 auto;
}


/* 下層ページ - 取扱サービス
--------------------------------------------------------------- */

.block-service-new {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.block-service-new > figure {
    width: 640px;
}

.block-service-new .txt {
    width: 530px;
}

.item-name {
    text-align: center;
    font-size: 3.2rem;
    font-weight: 700;
    margin-bottom: 1em;
}

.item-name .cap {
    display: block;
    font-size: 1.6rem;
    color: #666666;
}

.list-item-about {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    margin-top: 50px;
}

.list-item-about > li {
    width: 280px;
    line-height: 1.4;
}

.list-item-about h3 {
    text-align: center;
    color: #024E80;
    font-weight: 700;
    font-size: 3.2rem;
    padding-bottom: .3em;
    border-bottom: 5px solid #33669B;
    margin-bottom: .6em;
}

.block-modelhouse {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    margin-top: 100px;
    z-index: 2;
}


.block-modelhouse:after {
    content: "";
    position: absolute;
    top: 70px;
    left: 0;
    right: 0;
    width: calc(100vw - 9px);
    height: calc(100% - 130px);
    background: #F7F5EC;
    margin: 0 calc(-50vw + 50%);
    z-index: -1;
}

@media screen and (min-width:1024px) and (max-width:1200px) {
    .block-modelhouse:after {
        margin: 170px calc(-600px + 50%) 0;
        /*1200以下のブレイクポイント用*/
    }
}

.block-modelhouse > figure {
    width: 560px;
}

.block-modelhouse > .box-price {
    width: 600px;
}

.block-modelhouse .list-type1 {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 0;
}

.block-modelhouse .list-type1 > li {
    margin: 0 1em 1em 0;
}

.item-price {
    font-size: 2rem;
    font-weight: 700;
    text-align: right;
    line-height: 1;
}

.item-price em {
    color: #B20000;
    font-size: 1.6em;
    margin: 0 0 0 .1em;
}

.item-price em span {
    font-size: .6em;
}

.list-item-photo {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 1.5em;
}

.list-item-photo > li {
    width: calc(50% - 10px);
}

.list-item-photo > li img {
    width: 100%;
}


/* 下層ページ - 新築実績
--------------------------------------------------------------- */

.box-build {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 1100px;
    margin: 0 auto;
}

.box-build img {
    width: 100%;
}

.box-build figure:nth-of-type(1) {
    width: 100%;
    margin-bottom: 20px;
}

.box-build figure:nth-of-type(2),
.box-build figure:nth-of-type(3) {
    width: calc(50% - 10px);
    height: 405px;
}

.box-build figure:nth-of-type(2) img,
.box-build figure:nth-of-type(3) img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    font-family: "object-fit:cover;";
}

.box-build .txt {
    margin-top: 1em;
    font-size: 1.2em;
}


/* 下層ページ - リフォーム実績
--------------------------------------------------------------- */

.box-reform {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.box-reform img {
    width: 100%;
    height: 430px;
    object-fit: cover;
    object-position: center center;
    font-family: "object-fit:cover;";
}

.box-reform figure {
    position: relative;
    width: calc(50% - 25px);
}

.box-reform figure:nth-of-type(1):after {
    content: "";
    position: absolute;
    top: 0;
    right: calc(-1 * (18px + 15px));
    bottom: 0;
    margin: auto;
    display: block;
    width: 18px;
    height: 32px;
    background: url(./usr_img/common/bg_arrow1.png) center center / contain no-repeat;
}

.box-reform figcaption {
    text-align: center;
    line-height: 1;
    padding: .7em 1em;
    color: #fff;
    font-size: 1.2em;
    font-weight: 500;
    background: #333;
}

.box-reform figure:nth-of-type(1) figcaption {
    background: #666;
}

.box-reform figure:nth-of-type(2) figcaption {
    background: #33669B;
}

.box-reform .txt {
    margin-top: 1em;
    font-size: 1.2em;
}



/* 下層ページ - お問合せ
--------------------------------------------------------------- */

.txt-tel {
    text-align: center;
}

.txt-tel .tel {
    font-weight: 700;
    line-height: 1;
}

.txt-tel .num {
    color: #33669B;
    font-size: 2em;
    margin-left: .2em;
}


/* システム - 入力フォーム
--------------------------------------------------------------- */

.formArea {
    width: 750px;
    margin: 0 auto;
}

.formRow {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.formRow .formItemH,
.formRow .formItemD {
    box-sizing: border-box;
    padding: 1em;
}

.formRow .formItemH {
    width: 30%;
}

.formRow .formItemD {
    width: 70%;
}

.form-req {
    color: #ff0000;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="button"],
input[type="submit"],
textarea,
button {
    font-size: 1.6rem;
    padding: .5em 1em;
    border: 1px solid #666;
}

.form-food {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 2em;
}

.form-food .form-fdl {
    width: 100%;
    text-align: center;
    margin-bottom: 1em;
}

.form-food input[type="submit"],
.form-food input[type="reset"],
.form-food input[type="button"] {
    color: #fff;
    font-size: 2rem;
    font-weight: 500;
    background: #33669B;
    border: 0;
    border-radius: 0;
    padding: .5em 2.5em;
    margin: 0 1em;
    cursor: pointer;
}

.form-food input[type="reset"],
.form-food input[type="button"],
.form-food .form-return input {
    background: #666;
    color: #fff;
}

@media print,
screen and (min-width:1024px) {

    .form-food input[type="submit"]:hover,
    .form-food input[type="reset"]:hover,
    .form-food input[type="button"]:hover {
        opacity: .6;
    }

}


/* 各種パーツ - 見出し
--------------------------------------------------------------- */

.h-type1 {
    position: relative;
    text-align: center;
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 2em;
}

.tpl-low .h-type1 {
    margin-bottom: 1em;
}

.h-type-ttl {
    font-size: 2.8rem;
    font-weight: 700;
    text-align: center;
    color: #fff;
    background: #33669B;
    line-height: 1;
    padding: 1.6em;
}

.h-type2 {
    font-size: 2.8rem;
    font-weight: 700;
    line-height: 1.2;
}

.h-type3 {
    color: #2e669c;
    text-align: center;
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1.2;
    padding-bottom: .5em;
    border-bottom: 1px solid #2e669c;
    margin-bottom: 1.5em;
}


/* 各種パーツ - リスト
--------------------------------------------------------------- */

.list-type1 {
    margin: 1em 0;
}

.list-type1 > li:not(:last-child) {
    margin-bottom: .5em;
}

.list-type1 > li {
    text-indent: -1em;
    padding-left: 1em;
}

.list-type1 > li:before {
    content: "・";
}

.list-type1.is-attention > li:before {
    content: "※";
}

.list-type1.is-disc > li:before {
    content: "●";
    position: relative;
    top: -.2em;
    font-size: .7em;
    margin-right: .35em;
}


/* 各種パーツ - olリスト
--------------------------------------------------------------- */

.ol-type1 {
    margin: 1em 0;
}

.ol-type1 > li:not(:last-child) {
    margin-bottom: .5em;
}


/* 各種パーツ - ボタン
--------------------------------------------------------------- */

.btn-type1 {
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 220px;
    height: 60px;
    text-decoration: none;
    text-align: center;
    color: #034F81;
    font-size: 2rem;
    font-weight: 700;
    background: #fff url(./usr_img/common/bg_arrow1.png) right 15px center / 9px auto no-repeat;
    border: 2px solid #034F81;
    margin: 40px auto 0;
}


/* 各種パーツ - テーブル
--------------------------------------------------------------- */

.tbl-type1 {
    width: 100%;
}

.tbl-type1.is-middle {
    width: 980px;
    margin: 0 auto;
}

.tbl-type1 th,
.tbl-type1 td {
    padding: 1em 2em;
    border: 1px #2e669c solid;
}

.tbl-type1 th {
    box-sizing: border-box;
    width: 200px;
    color: #fff;
    font-weight: 700;
    background: #5f91ca;
    vertical-align: middle;
}


/* 上に戻る
--------------------------------------------------------------- */

#totop {
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 40px;
    z-index: 2;
}


/* object-fit
--------------------------------------------------------------- */

.ofi-block {
    width: 400px;
    height: 400px;
    margin: 0 auto;
}

.ofi {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    font-family: "object-fit:cover;";
}


/* 固定メニュー用 アンカー位置調整
--------------------------------------------------------------- */

.anchor-block {
    margin-top: -10px;
    padding-top: 10px;
}

/* @media screen 1023{ */

@media print,
screen and (max-width:1023px) {

/* layout_sp */

body {
    font-size: 1.4rem;
    color: #333333;
    line-height: 1.8;
    -webkit-text-size-adjust: 100%;
    min-width: 0;
}

img {
    width: 100%;
    height: auto;
}

input,
textarea,
select {
    font-size: 1.6rem;
}


/* グローバルヘッダー
--------------------------------------------------------------- */

#g-header {
    box-sizing: border-box;
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background: #FFF;
    z-index: 3;
}

#g-header h1 {
    width: 180px;
}

#g-header > .inr {
    width: auto;
    height: 100%;
    padding: 0 10px;
}

#g-header .head-info {
    display: none;
}

#g-header .sp-head-telico {
    box-sizing: border-box;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-end;
    right: 70px;
    width: 32px;
    height: 0;
    padding-top: 30px;
    font-size: .5rem;
    font-weight: 700;
    text-decoration: none;
    border: 1px solid #666;
    border-radius: 5px;
    background: url(./usr_img/common/ico_tel.svg) center center / 20px auto no-repeat;
    overflow: hidden;
}


/* SP グローバルメニュー
--------------------------------------------------------------- */

#g-nav {
    box-sizing: border-box;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    background: rgba(0, 0, 0, .9);
    color: #fff;
}

#g-nav > .inr {
    padding: 60px 25px;
}

#g-menu > li:not(:last-child) {
    margin-bottom: 5px;
}


/* SP グローバルメニュー
--------------------------------------------------------------- */

#g-menu {
    display: block;
    height: auto;
}

#g-menu > li,
#g-menu > li > a {
    height: auto;
}

#g-menu > li > a {
    display: block;
    font-size: 1.5rem;
    font-weight: 500;
    color: #fff;
    padding: 1em;
    background: url(./usr_img/common/bg_arrow1_w.png) right 10px center / 6px auto no-repeat;
}

#g-menu > li {
    border-bottom: 1px solid #999;
}

.sp-head-tel {
    text-align: center;
    margin-top: 2em;
}

.sp-head-tel .tel {
    font-size: 2em;
}

.sp-head-tel .tel a {
    color: #fff;
    text-decoration: none;
}


/* グローバルメニューSP
--------------------------------------------------------------- */

#g-menu-btn {
    box-sizing: border-box;
    position: fixed;
    top: 0;
    right: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    margin: auto;
    padding: 0;
    z-index: 3;
    line-height: 1;
    background: rgba(255, 255, 255, .6);
}

#g-menu-btn .btn {
    overflow: hidden;
    display: block;
    position: relative;
    z-index: 0;
    width: 26px;
    height: 18px;
    cursor: pointer;
}

#g-menu-btn .btn span,
#g-menu-btn .btn:before,
#g-menu-btn .btn:after {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 2px;
    margin: auto;
    background: #000;
    border-radius: 1px;
    transition: .3s;
}

#g-menu-btn .btn span {
    overflow: hidden;
    z-index: 1;
    text-indent: -999px;
}

#g-menu-btn .btn:before {
    z-index: 2;
    transform: translate(0, -8px);
    content: "";
}

#g-menu-btn .btn:after {
    z-index: 2;
    transform: translate(0, 8px);
    content: "";
}

#g-menu-btn.on {
    background: none;
}

#g-menu-btn.on .btn span {
    opacity: 0;
}

#g-menu-btn.on .btn:before {
    transform: rotate(45deg);
    background-color: #fff;
}

#g-menu-btn.on .btn:after {
    transform: rotate(-45deg);
    background-color: #fff;
}


/* SP 共通 - バナーエリア
--------------------------------------------------------------- */

#bnr-area {
    padding: 30px 15px;
}

#bnr-area ul {
    justify-content: space-between;
}

#bnr-area ul > li {
    width: calc(50% - 5px);
    text-align: center;
}

#bnr-area ul > li.is-toto {
    width: 100%;
}

#bnr-area ul > li:not(:last-child) {
    margin: 0 0 15px;
}

#bnr-area .is-toto {
    height: 98px;
}


/* SP グローバルフッター
--------------------------------------------------------------- */

#g-footer {
    padding: 30px 10px 15px;
}

#f-menu {
    justify-content: flex-start;
}

#f-menu > li {
    width: 33.33%;
}

#f-menu > li > a {
    display: block;
    font-weight: 500;
    text-align: center;
    padding: .7em .2em;
}

#f-menu > li:not(:nth-of-type(3n)) a:after {
    content: "";
    width: 1px;
    height: 1em;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    background: #fff;
}


.list-sns {
    margin: 20px 0 30px;
}

.list-sns img {
    height: 30px;
}

.list-sns > li {
    margin: 0 10px;
}

#g-footer small {
    font-size: 1.2rem;
}


/* SP 各ページ共通
--------------------------------------------------------------- */

.content-inr {
    width: auto;
    padding: 0 20px;
}


/* SP トップページ - スライダー
--------------------------------------------------------------- */

#main-slider,
#keyslider li {
    width: 100%;
    height: 50vh;
}

#main-slider .bx-caption {
    height: 5.07vw;
    font-size: 5.07vw;
}


/* SP トップページ - キャッチコピー
--------------------------------------------------------------- */

.site-catch {
    font-size: 2.24rem;
    text-align: center;
    line-height: 1.6;
    padding: 0 1em;
    margin: 2em 0 4em;
}


/* SP トップページ - 実績メニュー
--------------------------------------------------------------- */

.section-top-work {
    padding: 40px 0 0;
}

.list-work-menu {
    display: block;
}

.list-work-menu > li {
    width: auto;
}

.list-work-menu > li:not(:last-child) {
    margin-bottom: 30px;
}

.list-work-menu a {
    display: block;
    transition: 0;
}

.list-work-menu figure {
    width: 100%;
    height: 220px;
}

.list-work-menu figure img {
    width: 100%;
    transition: 0;
}

.list-work-menu .ttl {
    height: 88px;
}

.list-work-menu h3,
.list-work-menu .txt {
    font-size: 1.92rem;
    line-height: 1.5;
}


/* SP トップページ - 当社の強み
--------------------------------------------------------------- */

.section-top-strengths {
    margin: 40px 0 0;
}

.section-top-strengths .bg-sts-max {
    height: auto;
    padding-bottom: 0;
}

.section-top-strengths h3 {
    font-size: 2.24rem;
    line-height: 1.4;
    margin-bottom: .5em;
}

.block-sts1 {
    display: block;
    margin-bottom: 30px;
}

.block-sts1 figure {
    width: auto;
}

.block-sts1 figure img {
    top: -50px;
}

.block-sts1 .txt {
    top: -2em;
    width: auto;
}

.block-sts2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.block-sts2 figure {
    width: 100%;
    order: 1;
    margin-bottom: 30px;
    z-index: 2;
}

.block-sts2 figure img {
    top: auto;
}

.block-sts2 .txt {
    order: 2;
    width: auto;
}

.block-sts2 .txt .box {
    width: auto;
    z-index: 2;
}

.block-sts2 .txt .box:before {
    content: none;
}


/* SP トップページ - サービス案内
--------------------------------------------------------------- */

.section-top-service {
    margin: 40px 0;
}

.list-service-menu {}

.tpl-low .list-service-menu {
    margin-bottom: 60px;
}

.list-service-menu > li {
    width: calc(50% - 5px);
    margin-bottom: 10px;
}

.list-service-menu > li a {
    width: auto;
    height: 88px;
    background-size: 20px auto;
}

.list-service-menu h3 {
    font-size: 1.6rem;
}

.list-service-menu h3 span {
    display: block;
    font-size: 1.5rem;
}


/* SP トップページ - Instagram
--------------------------------------------------------------- */

.section-instagram {
    padding: 80px 0 40px;
}

.list-insta {
    margin-bottom: -10px;
}

.list-insta > li {
    width: 43.2vw;
    margin-bottom: 10px;
}

.list-insta > li a {
    height: 43.2vw;
}

.section-instagram .h-type1 {
    font-family: arial;
    font-weight: 500;
    margin-bottom: 1em;
}

.section-instagram .h-type1:before {
    top: -40px;
    width: 32px;
    height: 32px;
}


/* SP 下層ページ - 共通
--------------------------------------------------------------- */

.content-low-wrap {
    padding: 30px 0;
}

.section-content + .section-content {
    margin-top: 70px;
}

.box-flex-center {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.box-ex {
    text-align: left;
    padding: 1.2em;
    margin-top: 1.5em;
}

.box-figure {}

.box-figure > figure {
    width: 100%;
    margin-bottom: 1.5em;
}

.box-figure > .txt {
    width: 100%;
}

.box-singl-txt {
    display: block;
}

.box-middle {
    width: auto;
}


/* SP 下層ページ - 取扱サービス
--------------------------------------------------------------- */

.block-service-new {
    display: block;
}

.block-service-new > figure {
    width: auto;
    margin-bottom: 2em;
}

.block-service-new .txt {
    width: auto;
}

.item-name {
    font-size: 2.56rem;
    margin-bottom: .7em;
}

.item-name .cap {
    font-size: .5em;
}

.list-item-about {
    width: 100%;
    margin-top: 40px;
}

.list-item-about > li {
    width: calc(50% - 10px);
    margin-bottom: 2em;
}

.list-item-about h3 {
    font-size: 5.6vw;
    border-bottom: 2px solid #33669B;
}

.block-modelhouse {
    box-sizing: border-box;
    display: block;
    margin-top: 100px;
    background: #F7F5EC;
    padding: 40px 20px;
    margin: 0 -40px;
}


.block-modelhouse:after {
    content: none;
}


.block-modelhouse > figure {
    width: auto;
    margin-bottom: 2em;
}

.block-modelhouse > .box-price {
    width: auto;
}

.block-modelhouse .list-type1 {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 1.5em;
}

.block-modelhouse .list-type1 > li {
    margin: 0;
}

.item-price {
    font-size: 1.4rem;
    text-align: center;
}

.item-price em {
    font-size: 1.8em;
    margin: 0 0 0 .1em;
}

.item-price em span {
    font-size: .6em;
}

.list-item-photo {
    margin-top: 1.5em;
}

.list-item-photo > li {
    width: calc(50% - 5px);
}


/* SP 下層ページ - 新築実績
--------------------------------------------------------------- */

.box-build {
    display: block;
    width: auto;
}

.box-build figure:nth-of-type(1) {
    margin-bottom: 10px;
}

.box-build figure:nth-of-type(2),
.box-build figure:nth-of-type(3) {
    width: auto;
    height: auto;
    margin-bottom: 10px;
}

.box-build .txt {
    font-size: 1.1em;
}


/* SP 下層ページ - リフォーム実績
--------------------------------------------------------------- */

.box-reform {
    display: block;
}

.box-reform img {
    height: auto;
}

.box-reform figure {
    width: 100%;
}

.box-reform figure:nth-of-type(1):after {
    top: auto;
    left: 0;
    right: 0;
    bottom: -36px;
    width: 18px;
    height: 32px;
    transform: rotate(90deg);
}

.box-reform figure:nth-of-type(1) {
    margin-bottom: 40px;
}

.box-reform figcaption {
    text-align: center;
    line-height: 1;
    padding: .7em 1em;
    color: #fff;
    font-size: 1.2em;
    font-weight: 500;
    background: #333;
}

.box-reform .txt {
    margin-top: 1em;
    font-size: 1.2em;
}


/* システム - 入力フォーム
--------------------------------------------------------------- */

.formArea {
    width: auto;
  margin-top: 1em;
}

.formRow {
    display: block;
}

.formRow .formItemH,
.formRow .formItemD {
    box-sizing: border-box;
    padding: 0 0 2em;
}

.formRow .formItemH {
    width: 100%;
    font-weight: 700;
    padding-bottom: .2em;
}

.formRow .formItemD {
    width: 100%;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="button"],
input[type="submit"],
textarea,
button {
    box-sizing: border-box;
    width: 100% !important;
    padding: .5em 1em;
}

.form-food {
    display: block;
}

.form-food .form-fdl {
    width: 100%;
    margin-bottom: 1em;
}

.form-food input[type="submit"],
.form-food input[type="reset"],
.form-food input[type="button"] {
    box-sizing: border-box;
    display: block;
    width: calc(100% - 50px) !important;
    font-size: 1.8rem;
    padding: .5em 2.5em;
    margin: 0 auto 1.5em;
}


/* SP 各種パーツ - 見出し
--------------------------------------------------------------- */

.h-type1 {
    font-size: 2.56rem;
    line-height: 1.4;
    margin-bottom: 1.2em;
}

.h-type-ttl {
    font-size: 2.24rem;
    padding: 1.2em;
}

.h-type2 {
    font-size: 2.56rem;
    text-align: center;
}

.h-type3 {
    font-size: 2rem;
    padding-bottom: .5em;
    margin-bottom: 1.5em;
}


/* 各種パーツ - ボタン
--------------------------------------------------------------- */

.btn-type1 {
    width: 176px;
    height: 48px;
    font-size: 1.6rem;
    background: #fff url(./usr_img/common/bg_arrow1.png) right 12px center / 7px auto no-repeat;
    margin: 40px auto 0;
}


/* 各種パーツ - テーブル
--------------------------------------------------------------- */

.tbl-type1.is-middle {
    width: 100%;
}

.tbl-type1 th,
.tbl-type1 td {
    display: block;
    padding: 1em 2em;
    border-bottom: 0;
}

.tbl-type1 th {
    width: 100%;
    padding: .6em 2em;
}

.tbl-type1 tr:last-child td {
    border-bottom: 1px solid #2e669c;
}


/* 上に戻る
--------------------------------------------------------------- */

#totop {
    right: 15px;
    bottom: 15px;
    width: 30px;
}


/* 固定メニュー用 アンカー位置調整
--------------------------------------------------------------- */

.anchor-block {
    margin-top: -10px;
    padding-top: 10px;
}

/* } */

}

/* library */

.pc-only-block{display:block;}.pc-only-inline{display:inline;}
.sp-only-block{display:none;}.sp-only-inline{display:none;}

@media screen and (max-width:1024px){
  .pc-only-block{display:none;}.pc-only-inline{display:none;}
  .sp-only-block{display:block;}.sp-only-inline{display:inline;}
}


/* margin
--------------------------------------------------------------- */

.m0{margin:0}.mb0{margin-bottom:0}.mb0x5em{margin-bottom:.5em}.mb1em{margin-bottom:1em}.mb1x5em{margin-bottom:1.5em}.mb2em{margin-bottom:2em}.mb2x5em{margin-bottom:2.5em}.mb3em{margin-bottom:3em}.mtop0{margin-top:0}.mtop0x5em{margin-top:.5em}.mtop1em{margin-top:1em}.mtop1x5em{margin-top:1.5em}.mtop2em{margin-top:2em}.mtop2x5em{margin-top:2.5em}.mtop3em{margin-top:3em}


/* padding
--------------------------------------------------------------- */

.p0{padding:0}.pb0{padding-bottom:0}.pb0x5em{padding-bottom:.5em}.pb1em{padding-bottom:1em}.pb1x5em{padding-bottom:1.5em}.pb2em{padding-bottom:2em}.pb2x5em{padding-bottom:2.5em}.pb3em{padding-bottom:3em}.ptop0{padding-top:0}.ptop0x5em{padding-top:.5em}.ptop1em{padding-top:1em}.ptop1x5em{padding-top:1.5em}.ptop2em{padding-top:2em}.ptop2x5em{padding-top:2.5em}.ptop3em{padding-top:3em}


/* position
--------------------------------------------------------------- */
.txtleft{text-align:left;}.txtcenter{text-align:center;}.txtright{text-align:right;}.fleft{float:left;}.fright{float:right;}.clearfloat{clear:both;}


/* font
--------------------------------------------------------------- */
.bd{font-weight:bold;}.uline{text-decoration:underline;}.col-red{color:#FF0000;}.col-gold{color:#7F7611;}.col-green{color:#046B42;}.fsize0x8em{font-size:.8em}.fsize0x9em{font-size:.9em}.fsize1em{font-size:1em}.fsize1x1em{font-size:1.1em}.fsize1x2em{font-size:1.2em}


/* table
--------------------------------------------------------------- */
.vtop{vertical-align:top;}.vbottom{vertical-align:bottom;}.vmiddle{vertical-align:middle;}


/* clearfix
--------------------------------------------------------------- */
.cf:after{content:"";display:block;clear:both;}

/* エラー */

.error {
  margin: 100px 0 0 0;
  padding: 0;
  width: 500px;
  text-align: right;
}

.error-box {
  margin: 0;
  padding: 15px;
  font-size: 14px;
  text-align: left;
  border: solid 1px #888888;
  background-color: #ffffff;
}