@charset "utf-8";

main {
    min-height: calc(100vh - 300px);
}

/*****about*****/
.about_message_sec {
    padding-top: 80px;
}

.about_message_sec figure {
    margin-bottom: 25px;
    text-align: center;
}

.about_message_sec  h3 {
    margin-bottom: 35px;
    text-align: center;
    font-size: 1.8rem;
}

.about_message_sec  h3 span {
    font-size: 2.5rem;
    margin-left: 20px;
}

@media screen and (max-width: 800px) {


}
/*info*/
.about_info_sec {
    padding: 80px 0;
}

.info_data_box dl,
.info_data_box p {
    display: flex;
    border-bottom: 1px solid #000;
    padding: 15px 0;
}

.info_data_box dl:first-of-type {
    border-top: 1px solid #000;
}

.info_data_box p,
.info_data_box dl dt,
.info_data_box dl dd {
    font-size: 1.6rem;
    text-align: left;
}

.info_data_box dl dt {
    width: 130px;
    
}

.info_data_box dl dd {
    flex: 1;
}

.about_info_sec .gmap {
    margin-top: 50px;
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 60%;
}

.about_info_sec .gmap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

@media screen and (max-width: 800px) {
.info_data_box p,
.info_data_box dl dt,
.info_data_box dl dd {
    font-size: 1.4rem;
}

}



/***設計ページ***/

.service_architect_list > li:not(:last-of-type) {
    margin-bottom: 20px;
}

.service_architect_list > li a {
    display: block;
    position: relative;
}

.service_architect_list > li a figure img {
    width: 100%;
}

.service_architect_list > li a .text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    text-align: center;
    color: white;
}

.service_architect_list > li a .text h2 {
    font-size: 4rem;
}
.service_architect_list > li a .text p {
    font-size: 2.3rem;
    margin-top: 20px;
}
@media screen and (max-width: 800px) {

    .service_architect_list > li a figure {
        position: relative;
        width: 100%;
        height: 300px;
        overflow: hidden;
    }
    .service_architect_list > li a figure img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }

    .service_architect_list > li a .text h2 {
    font-size: 3rem;
}
.service_architect_list > li a .text p {
    font-size: 2rem;
    margin-top: 10px;
}

}

/*works_list*/
.service_works_list_sec {
    padding: 50px 0;
}

.service_works_list_sec ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.service_works_list_sec ul li {
    width: calc(100% / 5 - 40px / 5);
}

.service_works_list_sec ul li figure {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 77%;
    overflow: hidden;
}

.service_works_list_sec ul li figure img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.service_works_list_sec .btn_box {
    margin-top: 30px;
}
@media screen and (max-width: 800px) {
.service_works_list_sec ul li {
    width: calc(100% / 3 - 20px / 3);
}

}

@media screen and (max-width: 500px) {
.service_works_list_sec ul li {
    width: calc(100% / 2 - 10px / 2);
}

}

/*banner*/
.recruit_banner_sec {
    padding: 150px 0;
}

.recruit_banner_sec .banner {
    display: block;
    width: 100%;
    max-width: 675px;
    height: 200px;
    margin: 0 auto;
    position: relative;
    background: url(../img/recruit_banner_back.png) center / cover no-repeat;
}


.recruit_banner_sec .banner .text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: white;
}

.recruit_banner_sec .banner .text h2 {
    font-size: 4rem;
    font-family: "times-new-roman", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.recruit_banner_sec .banner .text p {
    font-size: 2rem;
    margin-top: 20px;
}


@media screen and (max-width: 800px) {


    .recruit_banner_sec {
        padding: 80px 0;
    }

    .recruit_banner_sec .banner .text h2 {
    font-size: 3rem;
    }

    .recruit_banner_sec .banner .text p {
        font-size: 1.6rem;
        margin-top: 10px;
    }
}




/*設計個別*/
.works_architect_top_sec {
    padding-top: 90px;
}

.works_architect_top_sec .works_singl_title {
    text-align: center;
    margin-bottom: 30px;
    font-size: 3rem;
}
@media screen and (max-width: 800px) {



}

/*画像一覧*/
.works_architect_info_sec {
    padding: 60px 0 120px;
}

.works_architect_info_sec .image_list {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 40px;
}

.works_architect_info_sec .image_list li {
    width: calc(100% / 2 - 20px / 2);
}

.works_architect_info_sec .image_list li:first-of-type {
    width: 100%;
}

.works_architect_info_sec .image_list li figure img {
    width: 100%;
}


@media screen and (max-width: 800px) {
.works_architect_info_sec .image_list {
    gap: 10px;
    margin-bottom: 30px;
}
.works_architect_info_sec .image_list li {
    width: calc(100% / 2 - 10px / 2);
}

}




/***防水***/

.service_waterproofing_ex_sec .expalin_box {
    padding: 70px 0 50px;
}
.service_waterproofing_ex_sec .wrapper > .expalin_box:not(:last-of-type) {
    border-bottom: 2px dashed #000;
}

.service_waterproofing_ex_sec .expalin_box h2 {
    text-align: center;
    font-size: 3.9rem;
    margin-bottom: 45px;
}

.service_waterproofing_ex_sec .expalin_box .three_box,
.service_waterproofing_ex_sec .expalin_box .two_box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 50px;
}

.service_waterproofing_ex_sec .expalin_box .three_box .box {
    width: calc(100% / 3 - 100px / 3);
}

.service_waterproofing_ex_sec .expalin_box .two_box .box {
    width: calc(100% / 2 - 50px / 2);
}

.service_waterproofing_ex_sec .expalin_box .box h3 {
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 10px;
    font-size: 2rem;
    border-bottom: 4px solid #000;
}

.service_waterproofing_ex_sec .expalin_box .box p {
    font-size: 1.4rem;
}

@media screen and (max-width: 800px) {
.service_waterproofing_ex_sec .expalin_box .three_box .box,
.service_waterproofing_ex_sec .expalin_box .two_box .box {
    width: 100%;
}


}

/*staff list*/
.service_staff_sec {
    padding: 50px 0;
}

.staff_list > li:not(:last-of-type) {
    margin-bottom: 50px;
}

.staff_list li .box {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    justify-content: center;
}


.staff_list li .box .image {
    width: 220px;
    text-align: center;
}


.staff_list li .box .image figure {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    overflow: hidden;
    margin-bottom: 10px;
}

.staff_list li .box .image figure img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.staff_list li .box .text {
    flex: 1;
}

.staff_list li .box .text .position {
    margin-bottom: 25px;
    display: flex;
    align-items: center;
    gap: 32px;
    font-size: 2.2rem;
}

.staff_list li .box .text .position::after {
    content: '';
    width: 100%;
    flex: 1;
    background-color: #000;
    height: 1px;
}

.staff_list li .box .text h3 {
    font-size: 3.4rem;
    margin-bottom: 20px;
    line-height: 1;
}

.staff_list li .box .text .ex {
    font-size: 1.5rem;
}

@media screen and (max-width: 800px) {

.staff_list li .box {
    flex-direction: column;
    align-items: center;
}
}


/***waterproofing_single***/
.works_waterproof_info_sec {
    padding: 100px 0;
}

.works_waterproof_info_sec .after_box {
    margin-bottom: 100px;
}

.works_waterproof_info_sec .box h2 {
    text-align: center;
    font-size: 2.6rem;
    padding: 25px 0;
    line-height: 1;
    margin-bottom: 40px;
}


.works_waterproof_info_sec .after_box h2 {
    background-color: rgba(0, 0, 0, 0.45);
    color: white;
}

.works_waterproof_info_sec .before_box h2 {
    border: 1px solid #000;
}

.works_waterproof_info_sec .image_list {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 15px;
}

.works_waterproof_info_sec .image_list li {
    width: calc(100% / 3 - 30px / 3);
}

.works_waterproof_info_sec .after_box .image_list li:first-of-type {
    width: 100%;
} 

.works_waterproof_info_sec .image_list li img {
    width: 100%;
}


.works_waterproof_info_sec .content {
    margin-top: 50px;
}


@media screen and (max-width: 800px) {
.works_waterproof_info_sec .image_list li {
    width: calc(100% / 2 - 15px / 2);
}


}



/***worksページ***/
.works_list_sec {
    padding: 100px 0;
}

.works_list_sec .category_list {
    display: flex;
    align-items: flex-start;
    margin-bottom: 50px;
}

.works_list_sec .category_list h2 {
    font-size: 1.4rem;
    padding-right: 40px;
    position: relative;
}

.works_list_sec .category_list h2::after {
    content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 10px solid #c8c9ca;
  border-right: 0;
  position: absolute;
  top: calc(50% + 1px);
  transform: translateY(-50%);
  right: 15px;
}

.works_list_sec .category_list ul {
    display: flex;
    flex-wrap: wrap;
}

.works_list_sec .category_list ul li {
    font-size: 1.4rem;
}

.works_list_sec .category_list ul li:not(:last-of-type):after {
    content: '/';
    margin: 0 10px;
}

.works_image_list {
    display: flex;
    flex-wrap: wrap;
}

.works_image_list .box {
    width: 50%;
}
.works_image_list .box figure {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 76.5%;
    overflow: hidden;
}

.works_image_list .box figure img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.works_list_sec .works_image_list_pagenation {
    margin-top: 40px;
    display: flex;
    justify-content: center;
    gap: 3px;
    flex-wrap: wrap;
}

.works_list_sec .works_image_list_pagenation button,
.works_list_sec .works_image_list_pagenation a,
.works_list_sec .works_image_list_pagenation span {
    width: 30px;
    height: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #c8c9ca;
    font-size: 1.2rem;
    font-family: "times-new-roman", sans-serif;
    font-weight: 400;
    font-style: normal;
    line-height: 1;
}

.works_list_sec .works_image_list_pagenation button {
    background-color: #c8c9ca;
}

@media screen and (max-width: 800px) {


}

/***recruit***/
.recruit_outline_sec .outline_box {
    background-color: white;
    padding: 50px 60px;
}

.recruit_outline_sec .wrapper > .outline_box:not(:last-of-type) {
    margin-bottom: 50px;
}

.recruit_outline_sec .outline_box h2 {
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    padding: 10px 0;
    text-align: center;
    margin-bottom: 25px;
    font-size: 3rem;
}


.recruit_outline_sec .outline_box figure {
    max-width: 500px;
    margin: 0 auto;
    margin-bottom: 25px;
}

.recruit_outline_sec .outline_box figure img {
    text-align: center;
}

.recruit_outline_sec .outline_box .content {
    margin-bottom: 70px;
}

.recruit_outline_sec .outline_box .content h3 {
    font-size: 2.6rem;
    margin-bottom: 20px;
}
.recruit_outline_sec .outline_box .info_box {
    margin-bottom: 65px;
}
.recruit_outline_sec .outline_box .info_box > dl:not(:last-of-type) {
    margin-bottom: 35px;
}

.recruit_outline_sec .outline_box .info_box dl dt {
    margin-bottom: 20px;
}

.recruit_outline_sec .outline_box .entry_btn a {
    background-color: #38829c;
    color: white;
    width: 100%;
    max-width: 375px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.4rem;
    border-radius: 5px;
    margin: 0 auto;
}

@media screen and (max-width: 800px) {

    .recruit_outline_sec .outline_box {
        padding: 30px 20px;
    }

    .recruit_outline_sec .wrapper > .outline_box:not(:last-of-type) {
        margin-bottom: 40px;
    }

    .recruit_outline_sec .outline_box h2 {
        padding: 10px 0;
        margin-bottom: 20px;
        font-size: 2.6rem;
    }


    .recruit_outline_sec .outline_box figure {
        margin-bottom: 20px;
    }


    .recruit_outline_sec .outline_box .content {
        margin-bottom: 30px;
    }
    .recruit_outline_sec .outline_box .content h3 {
        font-size: 2.2rem;
        margin-bottom: 15px;
    }
    .recruit_outline_sec .outline_box .info_box {
        margin-bottom: 30px;
    }
    .recruit_outline_sec .outline_box .info_box > dl:not(:last-of-type) {
        margin-bottom: 30px;
    }

    .recruit_outline_sec .outline_box .info_box dl dt {
        margin-bottom: 10px;
    }

}


/*staffvoice*/
.recruit_voice_sec {
    padding-top: 100px;
}

.recruit_voice_sec .voice_list .box {
    display: flex;
    align-items: stretch;
    background-color: white;
}

.recruit_voice_sec .voice_list > .box:not(:last-of-type) {
    margin-bottom: 50px;

}

.recruit_voice_sec .voice_list .box .image {
    width: 100%;
    max-width: 290px;
}


.recruit_voice_sec .voice_list .box .image figure {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.recruit_voice_sec .voice_list .box .image figure img {
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    width: 100%;
    height: 100%;
    object-position: center;
}

.recruit_voice_sec .voice_list .box .text {
    flex: 1;
    padding: 25px;
}

.recruit_voice_sec .voice_list .box .text .pattern {
    padding-bottom: 10px;
    font-size: 1.2rem;
}

.recruit_voice_sec .voice_list .box .text h3 {
    margin-bottom: 15px;
    font-size: 1.8rem;
}

@media screen and (max-width: 800px) {

    .recruit_voice_sec {
        padding-top: 50px;
    }

    .recruit_voice_sec .voice_list .box {
        flex-direction: column;
        align-items: center;
    }

    .recruit_voice_sec .voice_list > .box:not(:last-of-type) {
        margin-bottom: 30px;

    }

    .recruit_voice_sec .voice_list .box .image {
        width: 100%;
        max-width: inherit;
    }


    .recruit_voice_sec .voice_list .box .image figure {
        position: relative;
        width: 100%;
        height: 0;
        padding-bottom: 62.5%;
        overflow: hidden;
    }

    .recruit_voice_sec .voice_list .box .image figure img {
        position: absolute;
        top: 0;
        left: 0;
        object-fit: cover;
        width: 100%;
        height: 100%;
        object-position: center;
    }

    .recruit_voice_sec .voice_list .box .text {
        flex: 1;
        padding: 25px;
    }

    .recruit_voice_sec .voice_list .box .text .pattern {
        padding-bottom: 10px;
        font-size: 1.2rem;
    }

    .recruit_voice_sec .voice_list .box .text h3 {
        margin-bottom: 15px;
        font-size: 1.8rem;
    }


}



/***single page****/
.single_page_sec {
    padding: 100px 0;
}
.single_page_sec .wrapper {
    max-width: 800px;
}
.single_page_sec .single_title {
    margin-bottom: 60px;
}


.single_page_sec .single_eyecatch {
    margin-bottom: 50px;
}

.single_page_sec .single_eyecatch img {
    width: 100%;
}

.single_page_sec .single_content {
    margin-bottom: 50px;
}

.single_page_sec .single_content > * {
    margin-bottom: 10px;
}

.single_page_sec .single_content h2,
.single_page_sec .single_content h3,
.single_page_sec .single_content h4,
.single_page_sec .single_content h5,
.single_page_sec .single_content h6 {
    margin-top: 25px;
}

.single_page_sec .single_content h2 {
    font-size: 2.8rem;
}

.single_page_sec .single_content h3 {
    font-size: 2.4rem;
}

.single_page_sec .single_content h4 {
    font-size: 2rem;
}

.single_page_sec .single_content h5 {
    font-size: 1.8rem;
}

.single_page_sec .single_content h6 {
    font-size: 1.6rem;
}

.single_page_sec .single_content th,
.single_page_sec .single_content td {
    padding: 5px 10px;
    border: 1px solid var(--border-gray);
}

.single_page_sec .single_content thead th {
    background-color: var(--back-gray);
    color: white;
}

.single_page_sec .single_content tbody th {
    background-color: var(--border-gray);
    border-bottom:1px solid white;
}

.single_page_sec .single_content ul,
.single_page_sec .single_content ol {
    padding-left: 16px;
}

.single_page_sec .single_content ul {
    list-style: disc;
}

.single_page_sec .single_content ol {
    list-style: decimal;
}

.single_page_sec .single_meta {
    display: flex;
    flex-wrap: wrap;
}

.single_page_sec .single_meta * {
    line-height: 1;
    font-size: 1.5rem;
}

.single_page_sec .single_meta time::after {
    content: '|';
    margin: 0 5px;
}

.single_page_sec .single_meta .cat_list {
    display: flex;
}

.single_page_sec .single_meta .cat_list p {
    margin-right: 5px;
}

.single_page_sec .single_meta .cat_list ul {
    display: flex;
    flex-wrap: wrap;
}


.single_page_sec .single_meta .cat_list ul li:not(:last-of-type)::after {
    content: '/';
    margin: 0 5px;
}

@media screen and (max-width: 800px) {

    .single_page_sec {
        padding: 100px 0;
    }
    .single_page_sec .single_title {
        margin-bottom: 30px;
    }
    .single_page_sec .single_eyecatch {
        margin-bottom: 30px;
    }

    .single_page_sec .single_content h2 {
        font-size: 2.4rem;
    }

    .single_page_sec .single_content h3 {
        font-size: 2rem;
    }

    .single_page_sec .single_content h4 {
        font-size: 1.8rem;
    }

    .single_page_sec .single_content h5 {
        font-size: 1.6rem;
    }

    .single_page_sec .single_content h6 {
        font-size: 1.5rem;
    }

    .single_page_sec .single_meta * {
        font-size: 1.4rem;
    }
}


/***contact***/
.contact_page_sec {
    padding: 100px 0;
}

.contact_page_sec .page_title {
    margin-bottom: 80px;
    text-align: center;
}

.contact_page_sec .page_title p {
    margin-bottom: 25px;
    font-size: 3.8rem;
    font-family: "times-new-roman", sans-serif;
    font-weight: 400;
    font-style: normal;
    line-height: 1;
}

.contact_page_sec .page_title h1 {
    font-size: 1.8rem;
    line-height: 1;
}

.contact_page_sec .contact_content {
    max-width: 600px;
    margin: 0 auto 80px;
}

.contact_page_sec .contact_content label {
    display: block;
    margin-bottom: 25px;
    width: 100%;
    text-align: left;
    font-size: 1.5rem;
    line-height: 1.2;
}

.contact_page_sec .contact_content label input,
.contact_page_sec .contact_content label textarea {
    width: 100%;
    padding: 10px;
    font-size: 1.5rem;
    border-radius: 5px;
    border: 1px solid rgba(0, 0, 0, 0.3);
    margin-top: 5px;
}

.contact_page_sec .contact_content label textarea {
    min-height: 180px;
}

.contact_page_sec .contact_content .submit_box {
    text-align: center;
}

.contact_page_sec .contact_content .submit_box input[type="submit"] {
    background-color: #000;
    color: white;
    font-size: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 112px;
    height: 54px;
    border-radius: 5px;
    margin: 0 auto;
}

.contact_page_sec .contact_tel {
    text-align: center;
}

.contact_page_sec .contact_tel h4 {
    font-size: 1.8rem;
    margin-bottom: 10px;
}

.contact_page_sec .contact_tel p {
    font-size: 4rem;
}


@media screen and (max-width: 800px) {
    .contact_page_sec .page_title p {
        font-size: 3.2rem;
    }

    .contact_page_sec .page_title h1 {
        font-size: 1.6rem;
    }

    .contact_page_sec .contact_tel p {
        font-size: 3.3rem;
    }

}


/***entry***/
.contact_page_sec .contact_content .wpcf7-list-item label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.contact_page_sec .contact_content .wpcf7-list-item label input {
    width: auto;
    margin: 0;
}


.contact_page_sec .contact_content .wpcf7-form > p > br {
    display: none;
}