@charset "utf-8";
/*====================================================================================
■01.Content Services PAGE 
====================================================================================*/
.dv_h2.works {
    background: url(../works/images/br.jpg) no-repeat center top;
}

.dv_h2.shop {
    background: url(../shop/images/br.jpg) no-repeat center top;
}

.dv_h2.topics {
    background: url(../topics/images/br.jpg) no-repeat center top;
}

.dv_h2.about {
    background: url(../about/images/br.jpg) no-repeat center top;
}

.dv_h2.renovation {
    background: url(../renovation/images/br.jpg) no-repeat center top;
}

.dv_h2.plan {
    background: url(../plan/images/br.jpg) no-repeat center top;
}

.dv_h2.flow {
    background: url(../flow/images/br.jpg) no-repeat center top;
}

.dv_h2.cost {
    background: url(../cost/images/br.jpg) no-repeat center top;
}

.dv_h2.company {
    background: url(../company/images/br.jpg) no-repeat center top;
}

.dv_h2.contact {
    background: url(../contact/images/br.jpg) no-repeat center top;
}

.dv_h2.matching {
    background: url(../matching/images/br.jpg) no-repeat center top;
}

.dv_h2 {
    height: 300px;
}

.box_h2 {
    width: 100%;
    display: table;
    height: 200px;
}

    .box_h2 h2 {
        display: table-cell;
        text-align: center;
        vertical-align: middle;
    }

.content_page {
    margin-top: -100px;
    background: #fff;
    position: relative;
    z-index: 999;
    background: url(../common_img/br.jpg);
}

.content_1100 {
    width: 1100px;
    margin: 0 auto;
}
.content_1000 {
    margin: 0 auto;
    padding: 50px 0;
    width: 1000px;
}

.bcr {
    padding: 30px;
    font-size: 11px;
}

    .bcr a {
        text-decoration: none;
    }

.h3_work {
    font-size: 34px;
    font-weight: normal;
    text-align: center;
}

.a_works {
    display: inline-block;
    margin: 40px 0;
}

    .a_works li {
        margin: 0 5px;
        float: left;
        border-radius: 5px;
        background: url(../works/images/arrow.png) no-repeat center right #3c3b38;
        padding: 9px 0;
        width: 180px;
        position: relative;
        text-align: center;
    }

        .a_works li a {
            font-size: 12px;
            color: #fff;
            text-decoration: none;
        }

        .a_works li span {
            position: relative;
            z-index: 9;
        }

        .a_works li a:before {
            content: '';
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 9999;
            position: absolute;
        }

        .a_works li:before {
            content: '';
            position: absolute;
            top: 0;
            right: 0;
            width: 0;
            height: 100%;
            background: url(../works/images/arrow.png) no-repeat center right #054a5c;
            border-radius: 5px;
        }

        .a_works li:hover:before {
            width: 100%;
            transition: .3s;
        }

    .a_works.a_2 li {
        background: url(../works/images/arrow.png) no-repeat center right #376e7d;
        width: 260px;
    }

    .a_works.a_3 li {
        background: url(../works/images/arrow.png) no-repeat center right #827f49;
        width: 260px;
    }

    .a_works.a_4 li {
        background: url(../works/images/arrow.png) no-repeat center right #7e791e;
    }

    .a_works.a_5 li {
        width: 260px;
    }

.h3_line {
    text-align: center;
    font-size: 24px;
    color: #212120;
}

    .h3_line span {
        background: url(../works/images/line.png) repeat-x center bottom;
    }

.list_works {
    width: 1014px;
}

    .list_works li {
        float: left;
        margin-top: 40px;
    }

        .list_works li div.img {
            width: 320px;
            height: 220px;
            display: table;
            border: 2px solid #e6e0cd;
        }

            .list_works li div.img p {
                display: table-cell;
                vertical-align: middle;
                text-align: center;
            }

                .list_works li div.img p img {
                    max-width: 320px;
                    max-height: 220px;
                }

    .list_works li {
        margin-right: 18px;
        width: 320px;
    }

        .list_works li div.clearfix {
            margin-top: 25px;
        }

        .list_works li .tag {
            float: right;
            padding: 5px 0;
            text-align: center;
            font-size: 11px;
            color: #fff;
            width: 90px;
            background: #3c3b38;
        }

        .list_works li .time {
            padding-top: 5px;
        }

        .list_works li h4 {
            padding-top: 5px;
        }

        .list_works li p.center a img {
            margin-top: 15px;
        }

.bnt_work {
    text-align: center;
    position: relative;
    margin-top: 60px;
    min-height: 72px;
}

    .bnt_work .back {
        position: absolute;
        top: 0;
        left: calc(50% - 25px);
        margin: 0;
    }

    .bnt_work a:first-child img {
        margin-left: 395px;
        float: left;
    }

    .bnt_work a:last-child img {
        margin-right: 395px;
        float: right;
    }

    .bnt_work a img:hover {
        opacity: 0.5;
    }

.dt_work {
    width: 940px;
    margin: 0 auto;
    margin-bottom: 70px;
}

    .dt_work .photo {
        width: 940px;
        height: 500px;
        display: table;
        border: 2px solid #e6e0cd;
        background: #fff;
        position: relative;
        margin-top: 45px;
        margin-bottom: 20px;
    }

        .dt_work .photo .zoom {
            position: absolute;
            bottom: 5px;
            right: 5px;
        }

        .dt_work .photo a {
            display: table-cell;
            vertical-align: middle;
            text-align: center;
        }

            .dt_work .photo a img {
                max-height: 495px;
                max-width: 935px;
            }

    .dt_work .thumbnail {
        text-align: center;
    }

        .dt_work .thumbnail ul {
            display: inline-block;
        }

        .dt_work .thumbnail li {
            float: left;
            padding: 0 10px;
        }

            .dt_work .thumbnail li p {
                width: 110px;
                height: 75px;
                display: table;
                border: 1px solid #e6e0cd;
                background: #fff;
            }

            .dt_work .thumbnail li a {
                display: table-cell;
                vertical-align: middle;
                text-align: center;
            }

                .dt_work .thumbnail li a img {
                    max-width: 108px;
                    max-height: 73px;
                }

.dv_spec {
    padding: 30px;
    border: 1px solid #e6e0cd;
    float: right;
    width: 265px;
    margin-left: 45px;
}

    .dv_spec table {
        margin-top: 15px;
    }

        .dv_spec table th {
            width: 100px;
            text-align: left;
        }

        .dv_spec table th, .dv_spec table td {
            padding: 10px 0;
        }

.f20 {
    font-size: 20px;
}

.f22 {
    font-size: 22px;
}

.f24 {
    font-size: 24px;
}

.f26 {
    font-size: 26px;
}

.f29 {
    font-size: 29px;
}

.dt_h4 {
    font-size: 26px;
    margin-bottom: 50px;
}

.a_shop li {
    width: 250px;
}

.h4_24 {
    font-size: 24px;
    text-align: center;
    margin: 50px 0 30px 0;
}

.box_shop {
    background: url(../shop/images/br.png);
    height: 502px;
    position: relative;
}

    .box_shop .box_tt {
        position: absolute;
        top: 70px;
        left: 60px;
    }

    .box_shop .box_list {
        position: absolute;
        top: 285px;
        left: 100px;
        width: 780px;
    }

        .box_shop .box_list ul li {
            float: left;
            margin-top: 5px;
            width: 33.3333%;
            position: relative;
        }

            .box_shop .box_list ul li:before {
                content: '・';
            }

.about_sl {
    width: 920px;
    margin: 0 auto;
    margin: 50px 0;
}

.company_sl {
    width: 960px;
    margin: 0 auto;
    margin: 50px 0;
}

.h3_none {
    margin: 50px 0;
    text-align: center;
}

.box_text_about {
    background: url(../about/images/br2.png) no-repeat top right;
}

.ul_about {
    margin-top: 70px;
}

    .ul_about li {
        padding: 25px;
        float: left;
        margin-left: 20px;
        border: 1px solid #e6e0cd;
        width: 268px;
    }

        .ul_about li:first-child {
            margin-left: 0;
        }

    .ul_about .icon {
        margin-top: -46px;
    }

    .ul_about h4 {
        text-align: center;
        margin: 20px 0;
    }

.ab_contact {
    border-top: 1px solid #e6e0cd;
    border-bottom: 1px solid #e6e0cd;
    padding: 50px 0;
}

    .ab_contact table {
        width: 100%;
    }

    .ab_contact th, .ab_contact td {
        vertical-align: middle;
    }

    .ab_contact th {
        text-align: right;
    }

    .ab_contact td {
        font-size: 16px;
    }

        .ab_contact td span {
            font-size: 20px;
            background: url(../works/images/line.png) repeat-x center bottom;
        }

.box_about {
    border-top: 1px solid #e6e0cd;
    border-bottom: 1px solid #e6e0cd;
    padding: 45px 0;
}

    .box_about .box_shop {
        background: url(../about/images/br.png);
        height: 605px;
    }

        .box_about .box_shop .box_list {
            top: 320px;
        }

            .box_about .box_shop .box_list ul li {
                width: 50%;
            }

#about_sec02 {
    margin: 75px auto;
    background: #fff;
}
#about_sec02 .flex_box{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}
#about_sec02 .flex_box dl {
    line-height: 2;
    padding-left: 75px;
}
#about_sec02 .flex_box dl dt{
    position: relative;
    font-size: 20px;
    font-weight: bold;
}
#about_sec02 .flex_box dl dt img{
    position: absolute;
    top: 10px;
    left: -75px;
}
#about_sec02 .flex_box dl dd{
    margin-bottom: 20px;
}
#about_sec03 {
    margin-bottom: 75px;
}
#about_sec03 ul{
    margin: 30px 0;
}
#about_sec03 ul li img{
    max-width: 100%;
}
#about_sec03 .flex_box{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
#about_sec03 .flex_box li{
    margin-bottom: 15px;
    padding-bottom: 15px;
    text-align: center;
    background: #fff;
    width: 24%;
    border-radius: 0 0 10px 10px;
}
#about_sec03 .flex_box li span{
    display: block;
    margin: 10px 0;
    font-weight: bold;
}
#about_sec04 {
    position: relative;
    margin-bottom: 75px;
    background: url("../about/images/sec04_bg.jpg") no-repeat top center;
    width: 1100px;
    height: 385px;
}
#about_sec04 h3{
    position: absolute;
    top: 0;
    right: 100px;
}
#about_sec04 ul{
    position: absolute;
    top: 100px;
    right: 100px;
    width: 400px;
}
#about_sec04 ul li{
    margin-bottom: 10px;
    padding: 10px 10px 10px 20px;
    background: #fff;
    font-weight: bold;
}
#about_sec05 {
    margin-bottom: 75px;
}
#about_sec05 .flex_box{
    display: flex;
    justify-content: space-around;
    align-items: center;
}
#about_sec05 p{
    font-size: 18px;
}
#about_sec05 .flex_box ul{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-wrap: wrap;
    margin: 20px auto;
    width: 80%;
}
#about_sec05 .flex_box ul li{
    margin-bottom: 20px;
    padding: 32px 15px 0 15px;
    width: 30%;
    height: 80px;
    background: #333;
    border-radius: 8px;
    font-weight: bold;
    color: #fff;
    text-align: center;
}
#about_sec05 .flex_box ul li:nth-child(1){
    padding: 20px 15px 0 15px;
    height: 92px;
}
#about_sec05 .flex_box ul li:nth-child(2){
    background: #4f5257;
}
#about_sec05 .flex_box ul li:nth-child(3){
    margin-bottom: 0;
    background: #93841c;
}
#about_sec05 .flex_box ul li:nth-child(4){
    margin-bottom: 0;
    background: #054a5c;
}

#about_sec06 {
	background: #FFFFFF;
	margin: 0 auto;
}
#about_sec06 ul {
	width: 906px;
	margin: 0 auto 20px;
}
#about_sec06 ul li {
	background: #faf5eb;
	border: solid 2px #7E791E;
	border-radius: 8px;
	width: 246px;
	margin-right: 18px;
	padding: 20px;
	text-align: center;
	font-weight: bold;
	font-size: 18px;
	float: left;
}
#about_sec06 ul li span {
	font-size: 16px;
}
#about_sec06 ul li:last-child {
	margin-right: 0;
}

#about_sec07 div p {width: 520px;}
#about_sec07 .a_works li{margin: 0 5px 0 0;}

.ul_v li {
    float: left;
    width: calc(33.3333% - 25px);
    background: url(../plan/images/icon.png) no-repeat top left;
    font-size: 15px;
    padding-left: 25px;
    margin-bottom: 20px;
}

.ul_v {
    margin-top: 35px;
}

.ul_img li:first-child {
    float: left;
}

.ul_img li:last-child {
    float: right;
    text-align: left;
}

.ul_img li p {
    margin-top: 10px;
}

.ul_v2 li {
    width: 450px;
}

.box_plan {
    background: url(../plan/images/img5.png) no-repeat center top;
    min-height: 230px;
}

    .box_plan > div {
        width: 600px;
        margin: 0 auto;
        padding-top: 30px;
    }

.box_flow {
    margin-top: 40px;
}

    .box_flow li {
        padding: 30px;
        float: left;
        margin-left: 30px;
        border: 1px solid #e6e0cd;
        width: 251px;
        position: relative;
    }

        .box_flow li:before {
            content: url(../flow/images/arrow.png);
            position: absolute;
            top: calc(50% - 15px);
            left: -18px;
        }

        .box_flow li:first-child {
            margin-left: 0;
        }

    .box_flow ul {
        margin-bottom: 30px;
    }

    .box_flow li h4 img {
        margin-right: 15px;
        vertical-align: inherit;
    }

    .box_flow li h4 {
        font-size: 20px;
        margin-bottom: 15px;
        text-indent: -43px;
        margin-left: 43px;
    }

    .box_flow ul:first-child li:first-child:before {
        display: none;
    }

    .box_flow ul li:last-child::after {
        content: url(../flow/images/arrow.png);
        position: absolute;
        top: calc(50% - 15px);
        right: -18px;
    }

    .box_flow ul:last-child li:last-child::after {
        display: none;
    }

.box_faq {
    background: url(../flow/images/br.png) no-repeat top right;
    padding-right: 335px;
    min-height: 839px;
}

    .box_faq dt {
        background: url(../flow/images/q.png) no-repeat top left;
        padding-left: 35px;
        margin-bottom: 15px;
        font-size: 20px;
    }

    .box_faq dd {
        background: url(../flow/images/a.png) no-repeat top left;
        padding-left: 35px;
        margin-bottom: 35px;
    }

.ul_cost {
    margin: 40px 0;
}

    .ul_cost li {
        float: left;
        margin-right: 20px;
        width: 278px;
        border: 1px solid #e6e0cd;
        text-align: center;
        padding: 20px;
    }

        .ul_cost li:last-child {
            margin-right: 0;
        }

        .ul_cost li h4 {
            margin: 20px 0;
        }

        .ul_cost li p {
            text-align: left;
        }

.mb60 {
    margin-bottom: 60px;
}

.box_company {
    background: url(../company/images/br.png) no-repeat top right;
    min-height: 437px;
    padding-top: 50px;
}

.dv_50 > div {
    width: 465px;
    float: left;
}

    .dv_50 > div:last-child {
        float: right;
        text-align: left;
    }

.tb_company {
    width: 100%;
}

    .tb_company th, .tb_company td {
        padding: 10px;
        text-align: left;
        border: 1px solid #e6e0cd;
    }

    .tb_company th {
        background: #f5f1e5;
        width: 135px;
    }

.dv_960 {
    width: 960px;
    margin: 0 auto;
}

.content_920 {
    width: 920px;
    margin: 0 auto;
}

.tb_form {
    width: 100%;
    margin-top: 10px;
    margin-bottom: 30px;
}

    .tb_form th, .tb_form td {
        vertical-align: middle;
        text-align: left;
        border: 1px solid #e6e0cd;
        padding: 20px;
    }

    .tb_form th {
        width: 240px;
        border-right: none;
        background: #f5f1e5;
    }

        .tb_form th.do:before {
            content: '必須';
            color: #fff;
            background: #bf5839;
            padding: 2px 8px;
            margin-right: 10px;
            font-weight: normal;
        }

        .tb_form th.xanh:before {
            content: '任意';
            color: #fff;
            background: #b5b5b5;
            padding: 2px 8px;
            margin-right: 10px;
            font-weight: normal;
        }
        .tb_form th.den:before {
            content: '選択必須';
            color: #fff;
            background: #C4BA85;
            padding: 2px 8px;
            margin-right: 10px;
            font-weight: normal;
        }
    .tb_form td input[type=text] {
        width: 400px;
        height: 30px;
        margin-right: 15px;
    }

    .tb_form .comment {
        width: 100%;
        height: 100px;
    }

    .tb_form td {
        padding: 30px;
    }

    .tb_form ul li {
        width: 50%;
        float: left;
        padding: 10px 0;
    }

.content_960 {
    width: 960px;
    margin: 0 auto;
}

.box_privacy {
    border: 1px solid #e6e0cd;
    padding: 30px;
}

.ln2 {
    line-height: 2;
}

.ip_s {
    width: 150px !important;
    margin: 0 15px;
}

#state {
    height: 35px;
    width: 230px;
    margin-left: 15px;
}
.w100{
    width:100% !important;
}
.ul_3 li{
    width:33%;
}
.f18{
    font-size:18px;
}
.f13{
    font-size:13px !important;
}
.f14{
    font-size:14px !important;
}
.f17{
    font-size:17px !important;
}

#matching_sec02 .flex_box{
    display: flex;
    justify-content: space-evenly;
    margin: 30px auto;
    width: 60%;
}
#matching_sec02 .flex_box .flex_box_content{
    padding: 20px;
    background: #396d7cee;
    width: 20%;
    color: #fff;
    border-radius: 5px;
}

#matching_sec02, #matching_sec03, #matching_sec04{
    margin-bottom: 75px;
}
#matching_sec03 .flex_box{
    display: flex;
    justify-content: space-between;
    margin: 30px auto 50px;
}
#matching_sec03 .flex_box_content.txt{
    margin: 0 auto;
    width: 80%;
    background: #ffffffaa;
}
#matching_sec03 .flex_box_content.txt .fbc_tit{
    margin-bottom: 20px;
    padding: 5px;
    text-align: center;
    color: #fff;
    background: #333333dd;
    font-size: 20px;
}
#matching_sec03 .flex_box_content.txt .fbc_txt{
    margin: 0 auto;
    padding: 0 15% 0 22%;
    text-align: left;
}
#matching_sec03 .flex_box_content.txt .fbc_txt .flex_box{
    justify-content: flex-start;
    margin: 0 auto 10px;
}
#matching_sec03 .flex_box_content.txt .fbc_txt .flex_box span:first-child{
    width: 35%;
}
#matching_sec03 .flex_box_content.txt .fbc_txt .flex_box img{
    margin: 0 5% 0 2%;
}
/*#matching_sec03 .flex_box_content.txt .fbc_txt span{
    position: relative;
    padding-left: 8%;
    font-size: 16px;
}
#matching_sec03 .flex_box_content.txt .fbc_txt span::before{
    position: absolute;
    content:"";
    background: url(../matching/images/ico_arrow.svg) no-repeat;
    width: 14px;
    height: 14px;
    top: 3px;
    left: 10px;
    background-size: contain;
}*/
#matching_sec03 .flex_box.photo{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
    margin: 30px auto;
    width: 80%;
}
#matching_sec03 .flex_box.photo .flex_box_content{
    width: 31%;
}
#matching_sec03 .flex_box.photo .flex_box_content img{
    max-width: 100%;
    max-height: 100%;
}

#matching_sec04 .s_member_box{
    position: relative;
    margin: 30px auto 50px;
    padding: 40px 0 40px 55px;
    width: 55%;
    background: #93841b;
    color: #fff;
    font-weight: bold;
    font-size: 18px;
}

#matching_sec04 .s_member_box::before{
    position: absolute;
    content: "";
    background: url(../matching/images/ico_support.svg) no-repeat;
    width: 55px;
    height: 55px;
    top: 27px;
    left: 45px;
    background-size: contain;
}
#matching_sec04 .s_member_box::after{
    position: absolute;
    content: "";
    background: url(../matching/images/ico_arrow2.svg) no-repeat;
    width: 55px;
    height: 55px;
    bottom: -50px;
    left: 0;
    right: 0;
    margin: auto;
    background-size: contain;
}
#matching_sec04 .s_member_link{
    margin-bottom: 10px;
    font-size: 20px;
}
#matching_sec04 .s_member_link a{
    padding: 0 3px;
    font-size: 24px;
}
#matching_sec04 .u_line{
    background: url(../works/images/line.png) repeat-x center bottom;
    font-weight: bold;
}