/*-----------bg_img-----------*/
#section01 .br_sp {
    display: none;
}

.bg-section,
.bg-section02,
.bg-section04,
.bg-section06 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    z-index: 1;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}



#header_inner {
    background: url(../img/img044.jpg);
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-attachment: fixed;
}

#bg-section02 {
    background: linear-gradient(25deg, rgba(80, 62, 30, 0.6), rgba(58, 53, 33, 0.4)), url(../img/img022.jpg);
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
}

#bg-section04 {
    background: url(../img/img03_.jpg);
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    top: 50vh;
}

#bg-section06 {
    background: url(../img/img01.jpg);
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    top: 70vh;
}


/*---------z-index------------*/


.z-depth-2 {
    z-index: 2;
}


/*-----------------------------
            header
------------------------------*/
#header {
    position: relative;
    z-index: 2;
    padding: 50vh 0;
    text-align: center;
}

#header .content-inner {
    margin: 0 auto;
    position: absolute;
    z-index: 2;
    top: 32%;
    left: 0;
    right: 0;

}

#header .head_copy {
    color: #fff;
    padding-bottom: 20px;
}

.top_title {
    width: 380px;
    padding: 20px 0;
    border: 1px solid #fff;
}

.company_name {
    padding-top: 5px;
    font-size: 30px;
    margin-bottom: 7px;
}

.top_title p {
    color: #fff;
    font-weight: 600;
    margin-bottom: 10px;
}

#header h1 {
    font-size: 16px;
    color: #635945;
    background: #a6d5d0;
    width: 340px;
    margin: 0 auto;
    padding: 7px;
    font-weight: 600;
}

#header h2 span {
    font-size: 14px;
    color: #fff;
    font-weight: normal;
    font-family: "Sawarabi Gothic";
    background: rgba(143, 171, 165, 0.6);
    padding: 5px 30px;
    border-radius: 7px;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
}

#header .inner-el {
    font-size: 4rem;
    position: relative;
    text-align: center;
    padding: 0 10px;
    max-width: 50px;
}

.top_banner {
    position: absolute;
    top: -240px;
}



/*----------------------
        共通bg
----------------------*/

#section01,
#section05,
#section07 {
    position: relative;
    z-index: 4;
    padding: 0;
    background: url(../img/bg_9.jpg);
    filter: drop-shadow(3px 3px 10px rgba(0, 0, 0, 0.4));
    padding-top: 40px;
}

.service {
    padding-bottom: 60px;
}

.sec_box {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px 10px;
}

.sec_box p {
    text-align: left;
    padding: 0 2% 30px 0;
}

.text {
    line-height: 2.3rem;
}

h2 {
    font-size: 20px;
    padding-top: 20px;
    padding-bottom: 40px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.1rem;
}

/*----------------------
section01
----------------------*/
#fog01 {
    position: absolute;
    bottom: -30vh;
    left: 0;
    width: 100%;
    z-index: 1;
    pointer-events: none;
}

#fog01 img {
    width: 100%;
}

.about_list {
    counter-reset: li;
    list-style-type: none;
    padding-left: 0;

}

.about_list li h3 {
    margin-bottom: 25px;
    font-size: 20px;
    font-weight: 500;
    text-align: left;
    display: inline-block;
    margin-bottom: 20px;
}

.about_list li h3 span {
    font-size: 28px;
}

.eng_l {
    padding-top: 70px;
    text-align: center;
    font-family: 'Amaranth', sans-serif;
    font-size: 100px;
    letter-spacing: 0.1rem;
    margin-bottom: 0;
    line-height: 1.7rem;
    color: #a6d5d0;
}

.line {
    background: rgba(0, 0, 0, 0) linear-gradient(transparent 70%, #a6d5d0 0%) repeat scroll 0 0;
}

.left_50 {
    width: 54%;
    display: inline-block;
    padding-bottom: 30px;
}

.right_45 {
    width: 45%;
    display: inline-block;
    vertical-align: top;
    padding-bottom: 30px;
}

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

.left_65 {
    width: 65%;
    display: inline-block;
    padding-bottom: 30px;
}

.right_30 {
    width: 30%;
    display: inline-block;
    vertical-align: top;
    padding-bottom: 30px;
}

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

.va {
    padding-top: 80px;
}

/*----------------------------
    section02
-----------------------------*/
#section02 {
    position: relative;
    z-index: 3;
    padding: 40vh 0 0;
    background: #080126;
    overflow: hidden;
}

#fog02 {
    position: absolute;
    bottom: -50vh;
    left: 0;
    width: 100%;
    z-index: 1;
    pointer-events: none;
}

#fog02 img {
    width: 100%;
}

.servie_text {
    font-size: 18px;
    text-align: center;
    background: #a6d5d0;
    border-radius: 15px;
    padding: 5px 15px;
    font-weight: bold;
}

/*----------------------------
       service
------------------------------*/
.service {
    padding-top: 50px;
}

.service .service_list li {
    display: inline-block;
    width: 33%;
    height: auto;
    margin: 20px auto 40px;
    vertical-align: top;
    text-align: center;
}

.service ul {
    text-align: center;
}

.service .sec_box p {
    width: 70%;
    margin: 0 auto;
    text-align: left;
    padding: 0 2% 30px 0;
}

.service .sec_box .text_center {
    text-align: center;
}

/*------------------------------
    section04
------------------------------*/
#section04 {
    position: relative;
    z-index: 3;
    padding: 40vh 0 0;
    overflow: hidden;
}

/*-----------------------------
section05
-----------------------------*/
#section05 {
    padding-top: 0;
    height: 800px;
}

#section05 h3 {
    font-size: 22px;
    line-height: 3rem;
}

#section05 h3 span {
    font-size: 37px;
}

#section05 .container {
    background: url(../img/carpenter.png)no-repeat right top;
    height: 800px;
}

#section05 .sec_box {
    padding-top: 40px;
}

.btn {
    text-align: center;
    font-size: 18px;
    padding-top: 50px;
}

.btn span {
    background: #a6d5d0;
    padding: 22px 20px;
    box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, 0.4);
}

.btn a {
    color: #30281b;
}

/*-----------------------------
        section07
-----------------------------*/
#section07 ul {
    padding-bottom: 30px;
}

#section07 ul li {
    list-style: none;
    text-align: left;
    width: 80%;
    margin: 0 auto;
    border-bottom: 2px dashed #a6d5d0;
}

#section07 ul li:last-child {
    border: none;
}

#section07 ul li dl dt,
#section07 ul li dl dd {
    display: inline-block;
    text-align: left;
}

#section07 ul li dl {
    margin: 20px;
    font-size: 18px;
}

#section07 ul li dl dt {
    width: 20%;
    vertical-align: top;
}

#section07 ul li dl dd {
    width: 78%;
    margin-bottom: 0;
    padding-left: 18px;
}

#section07 .text {
    padding-bottom: 40px;
}

#section07 ul li a:link,
#section07 ul li a:visited {
    color: #30281b;
}

/*----------section06----------*/
#section06 {
    position: relative;
    z-index: 3;
    padding: 40vh 0 0;
    overflow: hidden;
}

/*------------------------------
PC 980px
------------------------------*/
@media(max-width: 980px) {
    .eng_l {
        line-height: 5rem;
    }

    #section05 {
        padding-top: 0;
        height: 870px;
    }

    #section05 .container {
        background: url(../img/carpenter.png)no-repeat right -239px top;
        height: 870px;
    }

    .service {
        padding-top: 0;
    }

    .service .eng_l {
        padding-top: 0;
    }

    .service .sec_box p {
        width: 90%;
    }

    .sec_box p {
        text-align: left;
        padding: 0;
    }

    /*------------------------------
            PC 900px
------------------------------*/
    @media(max-width: 900px) {
        #bg-section04 {
            top: 70vh;
        }

        #bg-section06 {
            top: 80vh;
        }

        #section05 h3 span {
            font-size: 30px;
        }
    }

    /*------------------------------
            tab 768px
------------------------------*/

    @media(max-width: 768px) {
        .head_line {
            font-size: 22px;
        }

        /*------------------------------
tab 640px
------------------------------*/

        @media(max-width: 640px) {

            #header_bg {
                background: none;
            }

            /*PC用の背景はオフ*/
            #header_inner::before {
                content: "";
                display: block;
                position: fixed;
                top: 0;
                left: 0;
                z-index: -1;
                width: 100%;
                height: 100vh;
                background: url(../img/img044.jpg) center/cover no-repeat;
                /*fixedをトル！*/
                -webkit-background-size: cover;
                /*Android4*/
            }

            #header .content-inner {
                position: absolute;
                top: 25%;
            }

            .top_title {
                width: 96%;
            }

            .top_title p {
                font-size: 14px;
            }

            #header h1 {
                font-size: 14px;
            }

            .top_banner {
                top: -190px;
            }

            .top_banner img {
                width: 214px;
                height: 191px;
            }

            .bg-section02,
            .bg-section04 {
                top: 83vh;
                width: 100%;
                height: 70vh;
            }

            .bg-section06 {
                top: 83vh;
                width: 100%;
                height: 80vh;
            }

            .left_50 {
                display: block;
                width: 100%;
                padding-bottom: 5px;
            }

            .right_45 {
                padding-top: 0;
                display: block;
                width: 100%;
            }

            .sec_box p {
                padding-bottom: 5px;
            }

            .about_list li h3 {
                text-align: center;
                margin: 0 auto 30px;
                display: block;
            }

            #section01 {
                padding-bottom: 0;
            }

            .about_list .sp_padd_set {
                padding-bottom: 0;
            }

            #section03 .service_list li {
                width: 32%;
            }

            #section03 .sec_box p,
            #section07 ul li {
                width: 100%;
            }

            #section07 ul li dl dt {
                width: 25%;
            }

            #section07 ul li dl dd {
                width: 73%;
            }

            #bg-section04 {
                top: 120vh;
            }

            section04 {
                padding: 50vh 0 0;
            }

            .bg-section04 {
                height: 80vh;
            }

            #section06 {
                position: relative;
                z-index: 3;
                padding: 40vh 0 0;
            }

            #bg-section06 {
                top: 155vh;
            }

            .service .service_list li {
                width: 49%;
            }

            .service .sec_box p {
                width: 100%;
            }

            #section05 .eng_l {
                line-height: 5rem;
                padding-top: 30px;
            }

            #section05 h2 {
                padding-top: 10px;
            }

            #section05 h3 {
                text-align: center;
            }

            #section05 {
                padding-top: 0;
                height: 700px;
            }

            #section05 .container {
                background: none;
            }

            #section05 {
                height: 780px;
            }

            #section07 .eng_l {
                line-height: 4rem;
                padding-top: 30px;
            }

            #section07 .head_line {
                padding-top: 0;
            }

            #section07 .br_sp {
                display: block;
            }
        }

        /*------------------------------
tab 420px
------------------------------*/

        @media(max-width: 420px) {
            #section01 .br_sp {
                display: block;
            }

            .bg-section02 {
                top: 62vh;
                height: 75vh;
            }

            .bg-section04 {
                top: 66vh;
                height: 60vh;
            }

            #bg-section06 {
                top: 133vh;
            }

            .eng_l {
                font-size: 60px;
                padding-top: 50px;
            }

            .service h2 {
                padding-top: 0;
                padding-bottom: 20px;
            }

            .service .sec_box .text_center {
                text-align: left;
            }

            #section04,
            #section06 {
                padding: 30vh 0 0;
            }

            #section05 .eng_l {
                line-height: 3.5rem;
                padding-top: 30px;
            }

            #section05 h3 span {
                font-size: 22px;
            }

            #section05 h3 {
                line-height: 2.5rem;
                padding-bottom: 20px;
            }

            #section05 {
                height: 820px;
            }

            .about_list li h3 span {
                font-size: 23px;
            }

            #section03 .service_list li {
                width: 49%;
            }

            .servie_text {
                font-size: 15px;
            }

            #bg-section04 {
                top: 95vh;
            }

            #section07 {
                padding-bottom: 0;
            }

            #section07 h2 {
                padding-top: 0;
                padding-bottom: 15px;
            }

            #section07 ul li dl dt {
                width: 100%;
                font-size: 16px;
            }

            #section07 ul li dl dd {
                width: 100%;
                padding-left: 0;
                font-size: 16px;
            }

            #section07 .head_line {
                padding-bottom: 0;
                font-size: 19px;
                line-height: 2rem;
            }

            #bg-section06 {
                top: 125vh;
            }

        }

        /*------------------------------
tab 380px
------------------------------*/

        @media(max-width: 380px) {


            #bg-section04 {
                top: 110vh;
            }

            #bg-section06 {
                top: 150vh;
            }

            .eng_l {
                line-height: 3rem;
            }

            .service,
            .service .eng_l {
                padding-top: 10px;
            }

            .servie_text {
                font-size: 14px;
            }

            #section05 {
                height: 750px;
            }

            #section05 .eng_l {
                padding-top: 0px;
            }

            #bg-section04 {
                top: 106vh;
            }

            #bg-section06 {
                top: 133vh;
            }

            #section05 h3 span {
                font-size: 26px;
                line-height: 2.5rem;
            }

            #section05 h3 {
                font-size: 18px;
                line-height: 2rem;
            }

            #section07 ul {
                padding-bottom: 5px;
            }
        }

        /*------------------------------
tab 320px
------------------------------*/

        @media(max-width: 320px) {
            .service .service_list li {
                width: 100%;
            }

            .service .sec_box p {
                padding-bottom: 0;
            }

            #section05 h3 span {
                font-size: 28px;
                line-height: 4rem;
            }

            #bg-section04 {
                top: 150vh;
            }

            #section05 {
                height: 800px;
            }

            #bg-section06 {
                top: 185vh;
            }

            #section07 ul li dl {
                margin: 20px 5px;
            }
        }
