/*==========================================================================*/


/*                            F U N C T I O N                               */


/*==========================================================================*/


/*==========================================================================*/


/*                               M I X I N                                  */


/*==========================================================================*/


/*==========================================================================*/


/*                     H O V E R    &    P C    O N L Y                     */


/*==========================================================================*/

@media screen and (min-width: 751px) {
    #lightboxOverlay,
    #lightbox {
        min-width: var(--content-width) !important;
        width: 100% !important;
    }
    .sp {
        display: none !important;
    }
    a:hover {
        text-decoration: none;
    }
    .to-top a:hover {
        opacity: 0.7;
    }
    .ft-menu .ft-menu-item:nth-child(4n+4) {
        margin-right: 0;
    }
    .sitemap-menu-tt a {
        pointer-events: none;
    }
    .hd-menu-tt a {
        pointer-events: none;
    }
    .house-desc .custom-link {
        margin-bottom: 0;
    }
    .concept-item.item2 {
        margin-top: -148px;
    }
    a:not([target=_blank]):hover,
    #menu-toggle:hover {
        opacity: 0.6;
    }
    .sweetlink:hover {
        opacity: 1 !important;
    }
    .knowledge-content li:hover {
        opacity: 0.7;
    }
    .hv-op:hover,
    .more:hover {
        opacity: 0.6;
    }
    h1 a:hover {
        opacity: 1 !important;
    }
    a[target=_blank]:hover {
        opacity: 1 !important;
        text-decoration: underline;
    }
    .build-bnr:hover {
        opacity: 0.7;
    }
    .custom-link a:hover {
        opacity: 1 !important;
        background-color: #fff;
        color: #000;
    }
    .custom-link a:hover::before {
        background: url(../images/arrow-link2.png) center no-repeat;
        background-size: cover;
        filter: brightness(0) invert(0);
    }
    .open-nav h1 {
        opacity: 0;
    }
    header h1 img {
        width: 300px;
    }
    .hd-fixed a img {
        width: 40px;
    }
    .concept-item img {
        height: 280px;
    }
    .house-bg .img img {
        height: 657px;
    }
    .build-left img {
        height: 780px;
    }
    .greering-right img {
        height: 600px;
    }
    .custom-link.white-style a:hover {
        background-color: #000;
        color: #fff;
    }
    .works-content .aos-animate .anim-img {
        width: 400px;
    }
    .news-bg .custom-link a:hover,
    .works-bg .custom-link a:hover,
    .real-bg .custom-link a:hover,
    .concept-bg .custom-link a:hover,
    .h2-content .custom-link a:hover {
        background-color: #fff;
        color: #000;
    }
    .news-bg .custom-link a:hover::before,
    .works-bg .custom-link a:hover::before,
    .real-bg .custom-link a:hover::before,
    .concept-bg .custom-link a:hover::before {
        filter: brightness(0) invert(0);
    }
    .main-visual .slick-slide {
        height: 860px;
    }
    .news-right li:hover {
        opacity: 0.8;
    }
    .iworks-bg01 {
        margin-bottom: 130px;
    }
    .custom-link.col2 {
        display: flex;
        width: 500px;
        margin-left: auto;
        a {
            text-align: center;
            &:not(:last-child) {
                margin-right: 10px;
            }  
        }
    }

    .build-right .custom-link.col2 {
        width: 700px;
        margin-right: -200px;
    }


    .works-content .slick-dots, .works-content .slick-arrow {
        display: none;
    }
}


/* END screen-min:751px */

@media screen and (min-width: 751px) and (max-width: 1880px) {
    .banner {
        margin-left: -200px;
        margin-right: -200px;
    }
    .banner ul li {
        flex-shrink: unset;
    }
    .hd-menu-boxs {
        margin-top: 0;
    }
    .txt-bg {
        right: 0;
    }
    .h2-content {
        left: 8%;
    }
    .hd-fixed {
        margin-right: 0;
    }
}
@media screen and (min-width: 751px) and (max-width: 1700px) {
    .build-right .custom-link.col2 {
        width: 600px;
        margin-right: -60px;
    }
    .build-right .custom-link.col2 a {
        font-size: 14px;
        line-height: 1.5em;
    }
}

@media screen and (min-width: 751px) and (max-width: 1440px) {
    .build-left img {
        width: auto;
        height: 650px;
    }
    .build-right .custom-link.col2 a:not(:last-child) {
        margin-right: 5px;
    }
    .build-right .custom-link.col2 {
        width: 560px;
    }
    .build-right .custom-link.col2 a::before {
        right: 8px;
    }

    .build-right {
        padding: 50px 0;
    }
    header {
        padding-left: 15px;
    }
    .btn-contact {
        margin-right: 15px;
        margin-left: 10px;
    }
    header h1 img {
        width: 280px;
    }
    .h2-content {
        left: calc(50% - 600px);
    }
    .btn-contact a {
        font-size: 14px;
    }
    .hd-time p {
        font-size: 14px;
    }
}
@media screen and (min-width: 751px) and (max-width: 1500px) {
    .banner {
        margin-left: 0;
        margin-right: 0;
    }
    .txt-h2 .h2-m {
        font-size: 38px;
    }
    .txt-h2 {
        bottom: -87px;
    }
    .banner-bg {
        padding: 100px 0 41px;
    }
    .banner-bg::before {
        height: 150px;
    }
    .txt-bg {
        font-size: 144px;
    }
    .house-desc {
        width: 680px;
        padding: 77px 158px 81px 60px;
        margin-left: -20px;
    }
    .title-line h3 .en {
        font-size: 50px;
    }
    h4.hyper-tt-h4 {
        font-size: 26px;
    }
    .house-desc .img {
        left: calc(50% + 260px);
    }
    .house-desc::before {
        left: -77px;
    }
    .works-content .desc {
        max-width: 100%;
    }
    .works-content {
        width: calc(100% + 100px);
        margin-left: -50px;
        margin-right: -100px;
    }
    .works-content li {
        width: 373px;
        margin-right: 30px;
        margin-bottom: 30px;
    }
    .news-frame {
        display: flex;
        margin-left: 0;
        margin-right: 0;
    }
    .news-left {
        /* width: 340px; */
    }
    .build-right {
        margin-left: 20px;
        margin-right: 0;
    }
    .concept-item.item1 {
        padding-top: 250px;
    }
    .open-nav .hd-menu {
        align-items: flex-start;
        padding-top: 170px;
    }
    .house-bg .img img {
        height: 500px;
    }
    .list-main-nav li a {
        font-size: 16px;
    }
    .hd-fixed a {
        width: 60px;
    }
    .list-main-nav li:not(:first-child) {
        margin-left: 20px;
    }
    .list-main-nav {
        margin-right: 10px;
    }
    .works-content li .img {
        width: 100%;
    }
    .hd-time p {
        /* font-size: 12px; */
    }
}
/* END screen-min:751px && screen-max:1500px */

@media screen and (min-width: 751px) and (max-width: 1230px) {
    .h2-content {
        left: 30px;
    }
    .btn-contact {
        margin-right: 10px;
        margin-left: 0;
    }
    header {
        padding-left: 10px;
    }
    .hd-fixed {
        margin-right: 10px;
    }
    .list-main-nav li a {
        font-size: 14px;
    }
    .hd-fixed a {
        width: 40px;
    }
    .hd-fixed a img {
        width: 30px;
    }
    header h1 img {
        width: 250px;
    }
    .list-main-nav {
        margin-right: 15px;
    }
    .hd-time p {
        margin-right: 10px;
    }
    .btn-contact a {
        padding: 7px 10px 5px;
    }
}

@media screen and (min-width: 751px) and (max-height: 700px) {

}

@media screen and (min-width: 751px) and (max-width: 1220px) {
    .works-content {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
    .works-content li {
        width: 335px;
    }
    .house-desc .img {
        left: calc(50% + 220px);
    }
    .house-desc {
        margin-left: 0;
    }
    .works-bg::before {
        top: -125px;
    }
}


/* END screen-min:751px && screen-max:1220px */

@media screen and (min-width: 751px) and (max-width: 1110px) {
    .concept-item .img .txt::before {
        top: 98%;
    }
}

@media screen and (min-width: 751px) and (max-height: 700px) {

    .txt-h2 .h2-m {
        font-size: 28px;
    }
    .hd-menu-boxs {
        margin-top: 70px;
    }
    .open-nav .hd-menu {
        padding-top: 0;
        align-items: center;
    }

}

@media screen and (min-width: 751px) and (max-height: 800px) {
    .main-visual .slick-slide {
        height: 100%;
    }

    .main-visual .slick-slider, .main-visual .slick-list, .main-visual .slick-track, .main-visual .slick-slide > div {
        height: 100%;
    }
    .main-visual .img1 {
        height: 93vh;
    }
    .main-visual {
        height: 100vh;
    }
    .main-visual .img-right, .main-visual .img-left{
        height: 100%;
    }
}


/*==========================================================================*/


/*                        M O B I L E    D E V I C E                        */


/*==========================================================================*/

@media screen and (min-width: 1px) and (max-width: 750px) {
    #wrapper {
        min-width: unset !important;
    }
    .pc {
        display: none !important;
    }
    .inner {
        width: 100%;
        padding-left: 15px;
        padding-right: 15px;
    }
    .image-l,
    .image-r {
        float: none;
        text-align: center;
        margin: 0 0 25px;
    }
    #menu-toggle {
        display: block;
        width: 60px;
        height: 60px;
    }
    .main-visual {
        height: 400px;
    }
    .main-visual .img1 {
        height: 400px;
    }
    .banner {
        margin: 0 !important;
    }
    .banner ul {
        margin: 0 auto;
    }
    .banner ul li {
        flex-shrink: unset;
    }
    .banner ul li:not(:last-child) {
        margin-bottom: 15px;
        margin-right: 0;
    }
    .txt-h2 .h2-m {
        font-size: 16px;
    }
    .txt-h2 h2 {
        font-size: 6vw;
        width: 100%;
        line-height: 1.5;
        text-align: center;
        left: 0;
    }
    .txt-h2 h2 span {
        font-size: 3vw;
        padding: 1.5vw;
        top: -7vw;
    }
    .banner-bg {
        padding: 15vw 0 10vw;
    }
    header {
        height: 60px;
        z-index: 100;
        padding-left: 10px;
        padding-right: 0;
    }
    .open-nav header {
        background-color: #fff;
    }
    .open-nav header::before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        background-color: rgba(35, 35, 35, 0.9);
        z-index: -1;
        top: 0;
        left: 0;
    }
    .hd-fixed {
        width: auto;
        height: 100%;
        margin-right: 0;
        gap: 5px;
    }
    h1 a img {
        width: 53vw;
        height: auto;
        max-width: 300px;
    }
    #menu-toggle>span {
        height: 3px;
        width: 40px;
    }
    #menu-toggle>span:nth-child(1) {
        top: 10px;
    }
    #menu-toggle>span:nth-child(2),
    #menu-toggle>span:nth-child(3) {
        top: 25px;
        width: 20px;
    }
    #menu-toggle>span:nth-child(4) {
        top: 38px;
        font-size: 10px;
        left: 0;
        right: 0;
        margin: auto;
        height: auto;
        text-align: center;
        letter-spacing: 0.2em;
        width: 100%;
    }
    #menu-toggle.open span:nth-child(2),
    #menu-toggle.open span:nth-child(3) {
        width: 40px;
        margin: auto;
        top: 25px;
    }
    .contact-banner {
        margin-bottom: 30px;
    }
    .contact-link ul,
    .contact-banner ul {
        flex-direction: column;
        align-items: center;
    }
    .contact-link ul li:not(:last-child),
    .contact-banner ul li:not(:last-child) {
        margin-right: 0;
        margin-bottom: 15px;
    }
    .open-nav #menu-toggle.open span:nth-child(2),
    .open-nav #menu-toggle.open span:nth-child(3) {
        top: 21px;
    }
    .open-nav #menu-toggle>span:nth-child(4) {
        top: 42px;
    }
    .contact-tt .contact-social {
        position: static;
        justify-content: center;
    }
    .contact-tt .contact-social p {
        margin-bottom: 0;
    }
    #home h3 {
        font-size: 24px;
    }
    .contact-social a img {
        width: 50px;
        height: auto;
    }
    .contact-tt h3 {
        margin-bottom: 10px;
    }
    .ft-info-frame {
        flex-direction: column;
    }
    .ft-info-frame .info-txt {
        width: 100%;
        margin-bottom: 30px;
    }
    .ft-info-frame .info-txt li p {
        font-size: 14px;
    }
    .ft-info-frame .info-txt li .ttl {
        width: 80px;
    }
    .ft-info-bg {
        padding: 40px 0;
    }
    .info-img {
        text-align: center;
    }
    .ft-map {
        height: 320px;
    }
    .ft-map iframe {
        height: 320px;
    }
    .sitemap-box {
        flex-direction: column;
        align-items: center;
    }
    .sitemap-box p:not(:last-child) {
        margin-right: 0;
        margin-bottom: 20px;
    }
    .sitemap-tt {
        padding-bottom: 15px !important;
        margin-bottom: 20px !important;
    }
    .sitemap-tt .h3-m {
        font-size: 18px !important;
    }
    .ft-menu .ft-menu-item {
        margin-bottom: 25px;
        width: 100%;
        order: 0;
    }
    .ft-menu .ft-menu-item:not(:last-child) {
        margin-right: 0;
    }
    .ft-menu .ft-menu-item:nth-child(5) {
        order: 2 !important;
    }
    .ft-menu .ft-menu-item:nth-child(6) {
        order: 2 !important;
    }
    .sitemap-menu-tt {
        margin-bottom: 10px;
    }
    .ft-menu-item:nth-child(1) {
        order: 1;
    }
    .ft-menu-item:nth-child(2) {
        order: 2;
    }
    .ft-menu-item:nth-child(3) {
        order: 3;
    }
    .ft-menu-item:nth-child(4) {
        order: 4;
    }
    .ft-menu-item:nth-child(5) {
        order: 5;
    }
    .ft-menu-item:nth-child(6) {
        order: 6;
    }
    .sitemap-box p {
        height: 45px;
    }
    .ft-menu-item:nth-child(4) {
        margin-bottom: 0;
    }
    .sitemap-menu {
        margin-bottom: 30px;
    }
    address {
        padding: 10px 0;
        line-height: 1.5;
        font-size: 11px;
    }
    .to-top {
        bottom: 95px;
    }
    .to-top>a {
        width: 50px;
        height: 50px;
    }
    .to-top>a::before {
        top: 8px;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
    }
    .sitemap-bg {
        padding: 40px 0 60px;
    }
    .hd-menu {
        height: calc(100vh - 60px);
        top: 60px;
        align-items: flex-start;
    }
    .hd-menu .inner {
        height: 100%;
        padding: 20px 15px 120px;
        overflow: auto;
    }
    .hd-menu-boxs {
        display: none;
    }
    .menu {
        margin-bottom: 20px;
        height: auto;
        overflow: auto;
    }
    .menu .menu-list li {
        width: 100%;
        margin-right: 0;
    }
    .menu .menu-list li::before {
        top: 4px;
    }
    .menu .menu-list .hd-menu-tt {
        margin-bottom: 0;
        font-size: 16px;
        letter-spacing: 0.1em;
        padding: 0;
    }
    .menu .menu-list .hd-menu-tt::before {
        display: none;
    }
    .menu .menu-list .hd-menu-item {
        border-bottom: 1px solid #fff;
        padding: 0 12px 10px;
    }
    .menu .menu-list .hd-menu-item ul a {
        font-size: 14px;
    }
    .menu .menu-list .hd-menu-item ul a::before {
        top: 2px;
        width: 8px;
        height: 8px;
    }
    .hd-menu-item {
        margin-bottom: 10px;
    }
    .hd-menu-item>*:last-child {
        margin-bottom: 0 !important;
    }
    .hd-menu-tt.margin-b0 {
        margin-bottom: 0 !important;
    }
    .hd-menu-item ul {
        display: none;
    }
    .hd-menu-item:last-child .hd-menu-tt {
        border-bottom: 0;
    }
    .hd-menu-tt.toggle {
        position: relative;
        z-index: 1;
    }
    .hd-menu-tt.toggle::after {
        content: "";
        position: absolute;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 9px 9px 0 9px;
        border-color: #F4A93B transparent transparent transparent;
        top: 1px;
        bottom: 0;
        right: 0;
        margin: auto;
        z-index: -1;
        transition: 0.2s all;
    }
    .hd-menu-tt.toggle.drop::after {
        transform: rotate(180deg);
    }
    .hd-menu-item ul {
        margin-top: 10px;
    }
    .menu-contact>* {
        width: 320px;
        max-width: 100%;
        margin: auto;
        height: 80px;
        border-radius: 10px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding-left: 81px;
        position: relative;
        z-index: 1;
    }
    .menu-contact>*:not(:last-child) {
        margin-bottom: 10px;
    }
    .menu-contact p {
        color: #2C2C2C;
    }
    .menu-contact .hd-call {
        background-color: #fff;
    }
    .menu-contact .hd-call::before {
        content: "";
        position: absolute;
        background: url("../images/ic-phone.svg") center no-repeat;
        width: 50px;
        height: 50px;
        background-size: cover;
        z-index: -1;
        top: 0;
        bottom: 0;
        left: 20px;
        margin: auto;
        filter: brightness(0);
    }
    .menu-contact .hd-call .num {
        font-size: 29px;
        font-family: var(--font-lato);
        font-weight: 900;
        margin-bottom: 0;
        line-height: 1.3;
        letter-spacing: 0.023em;
    }
    .menu-contact .hd-call .txt {
        font-size: 12px;
        font-weight: bold;
    }
    .menu-contact .hd-mail {
        background-color: #FFB400;
    }
    .menu-contact .hd-mail::before {
        content: "";
        position: absolute;
        background: url("../images/ic-mail.svg") center no-repeat;
        width: 50px;
        height: 50px;
        background-size: cover;
        z-index: -1;
        top: 0;
        bottom: 0;
        left: 20px;
        margin: auto;
    }
    .menu-contact .hd-mail .txt {
        font-size: 20px;
        font-weight: 600;
        line-height: 1.25;
    }
    .menu-contact .hd-line {
        background-color: #00BA51;
    }
    .menu-contact .hd-line::before {
        content: "";
        position: absolute;
        background: url("../images/ic-line.svg") center no-repeat;
        width: 56px;
        height: 53px;
        background-size: cover;
        z-index: -1;
        top: 0;
        bottom: 0;
        left: 16px;
        margin: auto;
    }
    .menu-contact .hd-line .txt {
        color: #fff;
        font-size: 24px;
        font-weight: 500;
        line-height: 1.25;
    }
    .fixed-bot {
        position: fixed;
        bottom: 0;
        width: 100%;
        height: 50px;
        z-index: 50;
        transition: all 0.2s;
        transform-origin: 50% 100%;
        transform: scale(0.5);
        opacity: 0;
        visibility: hidden;
    }
    .fixed-bot.show {
        transform: scale(1);
        opacity: 1;
        visibility: visible;
    }
    .fixed-bot.show ul {
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    }
    .fixed-bot ul {
        display: flex;
        justify-content: center;
    }
    .fixed-bot ul li {
        width: 33.3333333333%;
        height: 50px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .fixed-bot ul li a {
        position: relative;
        z-index: 1;
        font-weight: bold;
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        height: 100%;
        font-size: 10px;
        padding-left: 32px;
        color: #000;
    }
    .fixed-bot ul li a::before {
        content: "";
        position: absolute;
        top: 2px;
        bottom: 0;
        left: 0;
        margin: auto;
        z-index: -1;
    }
    .fixed-bot ul .fixed-call {
        background-color: #fff;
    }
    .fixed-bot ul .fixed-call a::before {
        color: #D01327;
        background: url("../images/ic-phone-nor.svg") center no-repeat;
        width: 20px;
        height: 22px;
        background-size: cover;
        filter: brightness(0);
    }
    .fixed-bot ul .fixed-mail {
        background-color: #FFB400;
    }
    .fixed-bot ul .fixed-mail a {
        color: #2C2C2C;
    }
    .fixed-bot ul .fixed-mail a::before {
        color: #D01327;
        background: url("../images/ic-mail-nor.svg") center no-repeat;
        width: 22px;
        height: 16px;
        background-size: cover;
    }
    .fixed-bot ul .fixed-line {
        background-color: #00BA51;
    }
    .fixed-bot ul .fixed-line a {
        color: #fff;
    }
    .fixed-bot ul .fixed-line a::before {
        color: #D01327;
        background: url("../images/ic-line-nor.svg") center no-repeat;
        width: 23px;
        height: 22px;
        background-size: cover;
    }
    .news-frame {
        flex-direction: column;
        margin: 0 0 30px;
        margin-bottom: 0;
    }
    .news-frame .news-left {
        width: 100%;
        margin-bottom: 0;
        text-align: center;
    }
    .news-frame .news-left a {
        margin: auto;
    }
    .hyper-tt h3 {
        margin-bottom: 30px;
    }
    .hyper-tt h3 .en {
        font-size: 30px;
        line-height: 1.2;
        margin-bottom: 5px;
    }
    .hyper-tt h3 .jp {
        font-size: 18px;
    }
    .news-right p,
    .news-right a {
        font-size: 14px;
    }
    .news-right .date {
        margin-right: 7px;
    }
    .news-right li {
        padding: 0 0 15px;
        margin-bottom: 15px;
    }
    .custom-link a {
        width: 240px;
        height: 50px;
        font-size: 14px;
        padding: 10px 20px;
    }
    .news-bg {
        padding: 40px 0;
    }
    .concept-bg {
        padding: 40px 0 0;
    }
    .title-line h3 .en {
        font-size: 26px;
    }
    .title-line h3 .jp {
        font-size: 14px;
    }
    .concept-content:first-child::before {
        width: 510px;
        height: 106px;
        left: 70%;
    }
    .concept-desc {
        margin-bottom: 18px;
        width: 100%;
        margin-right: 0;
    }
    h4.hyper-tt-h4 {
        font-size: 22px;
    }
    .concept-desc p {
        font-size: 14px;
        margin-bottom: 30px;
    }
    .concept-content {
        flex-direction: column;
    }
    .concept-desc a {
        margin: auto;
    }
    .concept-item {
        margin: 0 auto;
        padding-bottom: 35px;
    }
    .concept-item.item1 {
        padding-top: 0;
        margin-bottom: 70px;
    }
    .concept-item.item2 {
        margin-bottom: 70px;
    }
    .concept-item h4 {
        font-size: 20px;
        margin-bottom: 15px;
    }
    .concept-bg::before {
        width: 100%;
        height: 80%;
        right: 0;
    }
    .concept-desc {
        margin-bottom: 70px;
    }
    .concept-desc .custom-link {
        margin-bottom: 40px;
    }
    .concept-item p {
        font-size: 14px;
    }
    .concept-item {
        display: block;
    }
    .concept-item .img {
        text-align: center;
        width: 100%;
        margin-right: 0;
    }
    .concept-item .img .txt {
        height: 30px;
        font-size: 16px;
    }
    .concept-item .img {
        margin-bottom: 10px;
    }
    .works-bg::before {
        background: url(../images/work-bg-sp.svg) center no-repeat;
        background-size: cover;
        width: 100%;
        height: 11vw;
        top: 6vw;
    }
    .works-bg {
        padding: 20vw 0 40px;
    }
    .works-tt::before {
        width: 120px;
        height: 64px;
        left: 0;
    }
    .works-tt::before {
        width: 110px;
        height: 60px;
        left: calc(50% - 155px);
        top: unset;
        bottom: -60px;
    }
    .works-tt::after {
        width: 76px;
        height: 90px;
        top: unset;
        right: calc(50% - 150px);
        bottom: -55px;
    }
    .works-content {
        width: 90%;
        margin: 0 auto;
    }
    .works-content ul {
        margin-bottom: 0;
        justify-content: center;
    }
    .works-content li {
        margin-right: 0;
        margin-bottom: 30px;
    }
    .works-content li:last-child {
        margin-bottom: 0;
    }
    .works-content li .img {
        width: calc(100% - 15px);
        height: 58vw;
        overflow: hidden;
    }
    .works-content .desc {
        max-width: 100%;
        padding: 10px 15px 40px 15px;
        min-height: 76px;
        margin-left: 10px;
        width: calc(100% - 11px);
    }
    .works-content .slick-slide {
        margin: 0 10px;
    }
    .works-content .desc .more {
        bottom: 10px;
        right: 0;
    }
    .works-content .txt {
        font-size: 14px;
    }
    .works-content h5 {
        font-size: 16px;
        margin-bottom: 0;
        height: auto;
    }
    .more {
        font-size: 12px;
    }
    .more::before {
        width: 65px;
        height: 9px;
    }
    .house-bg {
        padding: 40px 0 0;
        position: relative;
        z-index: 1;
    }
    .house-bg::before {
        content: "";
        position: absolute;
        background-color: #3c3c3c;
        width: 100%;
        height: calc(100% + 97px);
        top: 0;
        left: 0;
        z-index: -1;
    }
    .house-desc {
        width: calc(100% - 4vw);
        margin-left: auto;
        padding: 45px 5.333vw 65vw;
        margin-right: -15px;
        margin-bottom: 60px;
    }
    .house-desc::before {
        width: 56px;
        height: 100%;
        left: 0;
        top: -10px;
    }
    .house-desc .desc {
        font-size: 14px;
        margin-bottom: 30px;
    }
    .house-desc .img {
        left: -60px;
        bottom: -9.333vw;
    }
    .house-desc .custom-link {
        margin-bottom: 0;
    }
    h4.hyper-tt-h4 {
        font-size: 18px;
    }
    .house-desc::after {
        width: 100px;
        height: 71px;
        right: 0;
        bottom: -43px;
    }
    .house-bnr {
        flex-direction: column;
        align-items: center;
    }
    .house-bnr li {
        margin-right: 0;
    }
    .house-bnr li:not(:last-child) {
        margin-bottom: 30px;
    }
    .house-bnr li .house-bnr-tt .en {
        font-size: 20px;
    }
    .house-bnr li .house-bnr-tt .jp {
        font-size: 16px;
    }
    .build-content {
        flex-direction: column-reverse;
    }
    .build-content .title-line {
        text-align: center;
    }
    .build-right {
        margin: auto !important;
        width: 400px;
        max-width: 100%;
        padding: 0 0 30px;
        position: relative;
        z-index: 1;
    }
    .build-right .desc {
        font-size: 14px;
        width: 100%;
        margin-bottom: 30px;
    }
    .build-right .custom-link a {
        margin-right: auto;
    }
    .build-bg {
        padding: 20px 0 0;
        margin-bottom: 0;
    }
    .build-bg::after {
        left: 0;
        height: calc(100% - 60px);
    }
    .build-bg::before {
        display: none;
    }
    .build-right .title-line {
        margin-bottom: 30px;
    }
    .build-left {
        width: calc(100% + 30px);
        margin-left: -15px;
        margin-right: -15px;
    }
    .build-left img {
        width: 100%;
        height: auto;
    }
    .txt-bg {
        bottom: 70px;
        right: -16px;
        font-size: 64px;
    }
    .build-bnr {
        width: 395px;
        max-width: 100%;
        height: auto;
        padding: 0 0 150px;
        margin: auto;
    }
    .build-bnr .img {
        right: 0;
        top: unset;
        bottom: 0;
        width: 470px;
    }
    .build-bnr a {
        width: 225px;
        height: 50px;
    }
    .build-bnr a span::before {
        width: 45px;
        height: 10px;
    }
    .build-bnr-tt {
        padding: 15px;
        flex-grow: 1;
    }
    .build-bnr-tt .en {
        font-size: 8.5vw;
        line-height: 1.5;
        letter-spacing: 0.05em;
    }
    .build-bnr-tt .jp {
        font-size: 16px;
    }
    .build-bnr-bg {
        margin-bottom: 60px;
    }
    .real-bg {
        padding: 40px 0;
    }
    .real-bg::before {
        height: 110px;
        top: -78px;
        width: 100%;
    }
    .real-content::after {
        display: none;
    }
    .real-content ul {
        flex-direction: column;
    }
    .real-content ul li {
        width: 500px;
        margin-left: auto;
        margin-right: auto;
        max-width: 100%;
        padding-right: 0;
        margin-bottom: 60px;
    }
    .real-content ul li:last-child {
        padding-left: 0;
        margin-bottom: 0;
    }
    .real-content ul li a {
        margin: auto;
    }
    .real-content .desc {
        font-size: 14px;
    }
    .real-content .title-line {
        margin-bottom: 20px;
    }
    .real-content ul li:not(:last-child)::before {
        width: 100%;
        height: 1px;
        left: 0;
        right: 0;
        bottom: -35px;
        top: unset;
        margin: auto;
    }
    .knowledge-content ul {
        margin: 0;
        flex-direction: column;
    }
    .knowledge-content ul li {
        margin: 0 auto 30px !important;
        width: 420px;
        height: 53vw;
    }
    .knowledge-content ul li:last-child {
        margin-bottom: 0 !important;
    }
    .knowledge-content ul li .btn {
        font-size: 14px;
        height: 40px;
        bottom: -1px;
        line-height: 1.3;
        padding: 5px 35px 5px 28px;
    }
    .knowledge-content ul li .txt {
        font-size: 9vw;
    }
    .greering-bg {
        padding: 40px 0 50px;
    }
    .greering-left {
        margin: 0 auto 30px;
    }
    .greering-left::after {
        width: 100px;
        height: 102px;
        right: -10px;
        top: 50px;
    }
    .greering-left::before {
        display: none;
    }
    .greering-left .custom-link a {
        margin: auto;
    }
    .greering-left .title-line {
        margin-bottom: 20px;
    }
    .greering-left .desc {
        font-size: 14px;
        margin-bottom: 30px;
    }
    .greering-right {
        width: 500px;
        max-width: 100%;
        margin: auto;
    }
    .greering-right p {
        max-width: 100%;
    }
    .greering-content {
        flex-direction: column;
    }
    .greering-bg::before {
        height: 105px;
        bottom: 15px;
        width: 100%;
    }
    .river {
        height: 150px;
    }
    .river img {
        width: auto;
        height: 150px;
    }
    .ft-contact {
        padding: 10px 0 40px;
    }
    .knowledge-bg {
        padding: 40px 0;
    }
    .knowledge-bg::before {
        height: 100%;
    }
    .works-content li img {
        width: 100%;
        height: 100%;
    }
    .build-right .desc span {
        top: 4px;
    }
    .txt-address {
        display: block;
    }
    .build-bnr .build-link {
        width: 215px;
        height: 50px;
    }
    .build-bnr .build-link span::before {
        width: 46px;
        height: 10px;
        right: -10px;
    }
    .house-bg .custom-link a {
        margin: auto;
    }
    .sp375 {
        display: block;
    }
    .contact-link img {
        width: 290px;
    }
    .sitemap-tt h3 {
        font-size: 24px !important;
    }
    .menu-contact.mb20 {
        margin-bottom: 10px !important;
    }
    .banner-bg::before {
        height: 50%;
    }
    .contact-banner li a {
        font-size: 40px;
    }
    .contact-banner li {
        width: 290px;
    }
    .contact-banner li a {
        font-size: 26px;
    }
    .contact-banner li a.contact-banner-call span {
        padding-left: 30px;
    }
    .contact-banner li a.contact-banner-call span::before {
        width: 24px;
        height: 26px;
        top: 6px;
    }
    .contact-banner li a.contact-banner-mail span {
        padding-left: 30px;
    }
    .contact-banner li a.contact-banner-mail span::before {
        width: 30px;
        height: 20px;
    }
    main {
        margin-top: 60px;
    }
    .main-visual {
        height: 100%;
    }
    .main-visual ul {
        height: 500px;
        margin-bottom: 40px;
    }
    .main-visual .img-left,
    .main-visual .img-right,
    .main-visual .slick-slide {
        height: 500px;
    }
    .mailform+.button {
        margin-bottom: 48px;
    }
    .house-bg .hyper-tt-h4 {
        letter-spacing: -0.05em;
    }
    .house-desc .hyper-tt-h4 {
        font-size: 16px;
    }
    .anim-img {
        text-align: center;
    }
    .house-bg .img img {
        height: 65vw;
    }
    .concept-item .img img {
        height: 51vw;
    }
    .works-tt {
        margin-bottom: 40px;
    }
    .news-right ul {
        flex-direction: column;
        flex-wrap: nowrap;
    }
    .news-right ul li {
        width: 100%;
        flex-direction: row;
        min-height: auto;
        padding: 15px 0;
        margin: 0 auto 15px !important;
    }
    .news-right ul li .img {
        width: 110px;
        height: 80px;
        order: 1;
        margin: 0;
        margin-left: 5px;
    }
    .news-right ul li .date {
        width: 90px;
        margin-left: 5px;
        order: 2;
    }
    .news-right ul li .title {
        width: calc(100% - 200px);
        order: 3;
    }
    .news-right ul li .title span {
        font-size: 14px;
    }
    .custom-link.col2 {
        a {
            width: 290px;
            &:not(:last-child) {
                margin-bottom: 10px;
            }
        }
    }
    .logo-favo-sp {
        img {
            width: 250px;
        }
    }
    .hd-fixed a {
        width: 30px;
    }
    .works-content .slick-dots {
        gap: 10px;
        margin-bottom: 0;
        margin: 15px auto 0;
    }
    .works-content .slick-dots li {
        width: 12px;
        height: 12px;
        border-radius: 100%;
        margin-bottom: 0;
    }
    .works-content .slick-dots li.slick-active button {
        background-color: #000;
    }
    .works-content .slick-slider {
        padding-bottom: 15px;
    }
    .works-content .slick-arrow {
        position: absolute;
        top: 0;
        bottom: 30px;
        margin: auto;
        width: 30px;
        height: 30px;
        background-color: transparent;
        color: transparent;
        border-width: 3px;
        z-index: 10;
    }
    .works-content .slick-next {
        right: -15px;
        border-left: 0;
        border-bottom: 0;
        transform: rotate(45deg);
    }
    .works-content .slick-prev {
        left: -15px;
        border-right: 0;
        border-bottom: 0;
        transform: rotate(-45deg);
    }
    .works-content .slick-dots li button {
        width: 100%;
        height: 100%;
        color: transparent;
        border-radius: 100%;
        border: 0;
        background-color: #c5c5c5;
    }

    .h2-content {
        width: 100%;
        max-width: 500px;
        margin: 0 auto;
        padding: 0 15px;
    }
    .h2-content .row3 p {
        font-size: 12px;
    }
    .h2-content .row2 .txt1 {
        font-size: min(3.75vw, 16px);
        line-height: 2.5em;
    }
    .h2-content .row2 .txt2 {
        font-size: min(3.75vw, 16px);
        line-height: 2.5em;
    }
    .h2-content .row1 {
        margin-bottom: 0;
    }
    .h2-content .row1 p {
        font-size: 18px;
        justify-content: center;
        margin-bottom: 0 !important;
    }
    .h2-content .row4 a { 
        font-size: 14px;
        height: 60px;
        width: 290px;
        max-width: 100%;
        padding: 10px 25px;
        height: 50px;
    }

    .h2-content .row2 {
        gap: 8px;
        align-items: flex-end;
        justify-content: space-between;
        margin-bottom: 10px;
    }

    .custom-link.st-02 {
        grid-template-columns: 1fr;
    }

    .custom-link.st-02 a {
        height: auto;
    }
    .h2-content {
        position: static;
        margin: 0 auto;
        display: block;
    }
    .h2-content .row1 .box {
        background-color: #f7b52c;
        color: #fff;
        padding: 6px 6px 5px;
    }
    .h2-content .row1 p {
        font-size: min(4.95vw, 26px);
        justify-content: space-between;
    }
    .h2-content .row2 .ttm {
        font-size: 110%;
        white-space: nowrap;
    }
    .h2-content .row1 .re-style {
        font-size: 100%;
    }
    .h2-content .row2 .ttm b {
        font-size: 130%;
    }
}


/* END min-width:1px && screen-max:750px */

@media screen and (min-width: 375px) and (max-width: 750px) {
    .fixed-bot ul li a {
        font-size: 12px;
    }
    .fixed-bot ul .fixed-call a::before {
        width: 22px;
        height: 24px;
    }
    .fixed-bot ul .fixed-mail a::before {
        width: 26px;
        height: 18px;
    }
    .fixed-bot ul .fixed-line a::before {
        width: 26px;
        height: 25px;
    }
    .title-line h3 .en {
        font-size: 30px;
    }
    h4.hyper-tt-h4 {
        font-size: 22px;
    }
    .sp375 {
        display: none;
    }
    .txt-h2 .h2-m {
        font-size: 4.2vw;
    }
    .house-desc .hyper-tt-h4 {
        font-size: 18px;
    }
    .txt-h2 h2 {
        font-size: 24px;
    }
}

@media screen and (max-width: 480px) {
    .works-content h5 {
        height: 50px;
    }

    .works-content .slider-02 h5 {
        height: auto;
    }
}


/* END min-width:375px && screen-max:750px */

@media screen and (min-width: 425px) and (max-width: 750px) {
    h1 a img {
        width: 270px;
    }
    .house-desc {
        padding: 45px 8.333vw 65vw;
    }
    .house-desc::before {
        width: 75px;
        height: 100%;
        left: 0;
        top: -14px;
    }
    .build-bnr-tt .en {
        font-size: 38px;
    }
    .knowledge-content ul li .txt {
        font-size: 35px;
    }
    .knowledge-content ul li {
        height: 283px;
    }
}


/* END min-width:425px && screen-max:750px */

@media screen and (min-width: 475px) and (max-width: 750px) {
    .works-bg::before {
        background: url(../images/work-bg-sp.svg) center no-repeat;
        background-size: cover;
        width: 100%;
        height: 11vw;
        top: 10vw;
    }
    .works-bg {
        padding: 23vw 0 40px;
    }
}


/* END min-width:525px && screen-max:750px */

@media screen and (min-width: 525px) and (max-width: 750px) {
    .works-content li .img {
        height: 300px;
    }
    .concept-item .img img {
        height: 285px;
    }
}


/* END min-width:525px && screen-max:750px */


/*==========================================================================*/


/*                 F O R   S P E C I F I E D   B R O W S E R                */


/*==========================================================================*/


/* EDGE  */


/* FIREFOX */

@-moz-document url-prefix() {}


/* Safari 10.1+ (which is the latest version of Safari at this time) */


/*==========================================================================*/


/*                             E N D   A L L                                */


/*==========================================================================*/