/* タブレット（width:1024px以下） */

@charset "utf-8";
@media screen and (max-width: 1024px) {
    /* 共通タイトル */
    #common_title_min {
        flex-direction: column;
    }
    .common_ttl_en {
        margin-right: 0;
        margin-bottom: 5px;
    }
    .common_title.tablet_center {
        flex-direction: column;
    }
    /* 共通タイトル */
    .sp-header-tel {
        width: 70px;
        height: 70px;
        background-color: #f0f3f5;
        position: absolute;
        top: 0;
        right: 70px;
    }
    .sp-tel-ico {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end;
        height: 100%;
        background: url(../img/common/sp-tel-ico.png) no-repeat top 12px center;
        background-size: 20px;
    }
    .sp-tel-span {
        -webkit-transform: translateY(-6px);
        -ms-transform: translateY(-6px);
        transform: translateY(-6px);
        font-weight: 500;
        font-size: 15px;
        font-weight: 700;
        color: #19421a;
    }
    .sp-header-contact {
        width: 80%;
        margin: 50px auto 20px;
    }
    .sp-header-contact img {
        width: 100%;
        height: auto;
    }
    .sp-header-mail {
        width: 80%;
        margin: 10px auto;
    }
    .sp-header-mail img {
        width: 100%;
        height: auto;
    }
    .sp-header-access {
        width: 80%;
        margin: 10px auto;
    }
    .sp-header-access img {
        width: 100%;
        height: auto;
    }
    /* container */
    .container {
        width: 94%;
    }
    /* メインビジュアル */
    .mv {
        margin-top: 70px;
        height: calc(100vh - 70px);
    }
    .news_wrap {
        width: 100%;
    }
    #news_linkSP {
        display: block;
    }
    #news_linkPC {
        display: none;
    }
    .news_inner {
        width: 100%;
        flex-direction: column;
        padding: 0;
    }
    .news_discription {
        width: 100%;
    }
    .news_content {
        width: 100%;
        margin: 0 auto;
    }
    .news_list {
        margin: 50px auto;
    }
    .add_about_wrap {
        background-image: url(../img/top/aboutBGsp.jpg);
        background-position: center center;
        background-size: cover;
        background-repeat: no-repeat;
        width: 100%;
        height: 350px;
        overflow: hidden;
        background-attachment: scroll;
    }
    @media screen and (max-width: 1700px) {
        .add_about_wrap {
            background-image: url(../img/top/aboutBGsp.jpg);
            background-position: center center;
            background-size: cover;
            background-repeat: no-repeat;
            width: 100%;
            height: 350px;
            overflow: hidden;
            background-attachment: scroll;
        }
    }
    .about_wrap {
        width: 100%;
        position: relative;
        padding-top: 220px;
        padding-bottom: 0;
        margin: 100px auto 0;
    }
    .about_wrap::before {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
        width: 100%;
        height: 257px;
        overflow: hidden;
        background: url(../img/top/aboutBGsp.jpg) left top/cover no-repeat;
    }
    .about_inner {
        position: relative;
        padding: 0 25px 60px;
        background-color: #fff;
        width: 100%;
        margin-left: 0;
        margin-right: auto;
    }
    .about_inner::before {
        content: '';
        position: absolute;
        top: -35px;
        left: 0;
        width: calc(100% - 25px);
        height: 45px;
        background-color: #fff;
    }
    .motto_wrap {
        width: 100%;
    }
    .motto_list {
        flex-direction: column;
    }
    .motto_list_li {
        width: 80%;
        margin: 0 auto 20px;
        max-width: 100%;
    }
    .motto_wrap::after {
        width: 100%;
        height: calc(100% - 40px);
    }
    .business_wrap {
        width: 100%;
    }
    .business_inner {
        height: 225px;
    }
    .business_content {
        position: relative;
        z-index: 1;
        margin-top: -46px;
    }
    .business_content::before {
        top: 45px;
        height: 815px;
    }
    .business_list {
        grid-template-columns: repeat(auto-fit, 80%);
    }
    .company_add_inner {
        height: 500px;
    }
    .company_wrap {
        width: 100%;
    }
    .company_inner {
        flex-direction: column;
    }
    .company_imgage {
        width: 100%;
    }
    .company_discription {
        width: 100%;
    }
    .recruit_wrap {
        width: 100%;
    }
    .recruit_inner {
        width: 80%;
    }
    .recruit_left {
        width: 30%;
    }
    .recruit_right {
        width: 70%;
    }
    .contact_wrap {
        width: 100%;
        margin: 0 auto;
    }
    .contact_content {
        width: 94%;
        margin: 0 auto;
        padding: 50px 20px;
    }
    .contact_inner {
        flex-direction: column;
    }
    .tel_span {
        margin: 0 auto;
    }
    .contact_mailBox {
        border-left: none;
        margin-top: 35px;
        padding: 0;
    }
    .footer_inner {
        flex-direction: column-reverse;
        width: 100%;
    }
    .footer_discription {
        width: 80%;
        margin: 25px auto 0;
    }
    .footer_sdgs {
        width: 100%;
    }
    .footer_sdgs img {
        width: 94%;
    }
    .copyright {
        width: 100%;
    }
    /* 下層メイン */
    .l_main {
        margin-top: 70px;
    }
    #bread-list {
        padding: 25px 20px 0;
    }
    /* プレカットページ */
    .precut_about {
        width: 100%;
    }
    .story_content {
        flex-direction: column;
        width: 100%;
    }
    .story_image {
        margin: 0 auto;
        width: 100%;
    }
    .story_discription {
        padding: 50px 0;
    }
    .flex_rr>.story_image {
        margin: 0 auto;
    }
    .merit_box {
        width: 100%;
        padding: 50px 0;
    }
    .merit_inner {
        flex-direction: column;
        margin: 0 auto;
    }
    .merit_discription {
        margin-bottom: 50px;
    }
    .merit_explain {
        width: 80%;
    }
    /* 会社概要ページ */
    .access_info {
        padding: 20px;
        margin: 0 20px;
    }
    .driver_inner {
        flex-direction: column;
    }
    .driver01,
    .driver02 {
        width: 80%;
        margin: 20px auto;
    }
    /* 日本住建の想いページ */
    /* .spiritBG::before {
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
    } */
    .will_inner {
        padding: 50px 20px;
    }
    .will_inner p {
        text-align: left;
        margin: 0 auto;
        padding-left: 0;
    }
    .l_motto_content {
        width: 100%;
        padding: 50px;
    }
    .l_motto_image img {
        width: 100%;
        height: auto;
    }
    .l_nishikawa_wrap {
        padding: 100px 0 0;
    }
    .nishikawa_content {
        flex-direction: column;
        margin: 100px auto 0;
    }
    .nishikawa_image {
        width: 100%;
        margin-right: 0;
    }
    .nishikawa_image img {
        width: 100%;
        height: auto;
    }
    .nishikawa_discription {
        width: 100%;
        padding: 50px 0;
    }
    .nishikawa_inner {
        width: 100%;
        margin: 0 auto;
    }
    /* 採用情報ページ */
    .lr_content_title {
        margin: 0 auto;
        width: 94%;
        display: block;
        font-size: 1.2em;
    }
    .lr_image {
        width: 94%;
        margin: 50px auto 0;
    }
    .job_inner {
        width: 94%;
        padding: 50px;
    }
    .job-table {
        width: 100%;
        margin: 45px auto 0;
    }
    .job-table tr {
        padding: 22px 0 23px;
    }
    .job-table th {
        display: block;
        width: 100%;
        padding: 10px 0;
    }
    .job-table td {
        display: block;
        width: 100%;
        padding: 0 0 10px;
    }
    .lr_point_content {
        flex-direction: column;
    }
    .point_left {
        width: 94%;
        margin: 20px auto;
        min-width: 0;
    }
    .point_right {
        width: 94%;
        margin: 20px auto;
        min-width: 0;
    }
    .lr_text {
        display: block;
        width: 80%;
        margin: 0 auto;
    }
    .l_business_content {
        flex-direction: column;
        width: 100%;
        margin: 0 auto;
    }
    .b_content_left>.l_business_image {
        margin-right: 0;
        min-width: 0;
    }
    .l_business_image {
        width: 100%;
    }
    .l_business_image img {
        width: 100%;
        height: auto;
    }
    .l_business_discription {
        width: 100%;
        margin-top: 50px;
    }
    .case_list {
        width: 100%;
        align-items: center;
    }
    .case_list li {
        width: 100%;
    }
    .case_list li img {
        width: 100%;
        height: auto;
    }
}