@charset "utf-8";
/* CSS Document */
/* design_overwrite.css */





/* =========================
breakpoint
========================= */
@media screen and ( min-width: 769px ){
    /* SP <> PC ブレークポイント */
}
@media screen and ( min-width: 1389px ){
    /* XDデザインサイズ　1388 */
}





img {
    max-width: none;
    width: 100%;
}
@media screen and ( min-width: 769px ){
    img {
    }
}
@media screen and ( min-width: 1389px ){
}





/* =========================
c-title--page--full
========================= */
.c-title--page--full {
    height: auto;
}
@media screen and ( min-width: 769px ){
}
@media screen and ( min-width: 1389px ){
}





/* =========================
page_main_visual
========================= */
.page_main_visual .c-title--page--full__title picture {
    width: calc( 102.25 * 100vw / 375 );
    aspect-ratio: 171 / 44;
}
@media screen and ( min-width: 769px ){
    .page_main_visual .c-title--page--full__title picture {
        width: max( min( calc( 157 * 100vw / 1388 ), 216.66px ), 157px );
    }
}
@media screen and ( min-width: 1389px ){
}





/* =========================
each_part
========================= */
.each_part {
    position: relative;
    width: 100%;
    margin: 0;
    padding: calc( 35 * 100vw / 375 ) 0;
}
@media screen and ( min-width: 769px ){
    .each_part {
        padding: max( min( calc( 55 * 100vw / 1388 ), 75.9px ), 55px ) 0;
    }
}
@media screen and ( min-width: 1389px ){
}

.each_part .wrapper {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
}
@media screen and ( min-width: 769px ){
    .each_part .wrapper {
    }
}
@media screen and ( min-width: 1389px ){
}

.each_part h2 {
    position: relative;
    margin: 0 auto calc( 20 * 100vw / 375 );
    padding: 0;
}
@media screen and ( min-width: 769px ){
    .each_part h2 {
        margin: 0 auto max( min( calc( 30 * 100vw / 1388 ), 41.4px ), 30px );
    }
}
@media screen and ( min-width: 1389px ){
}

.each_part .catchcopy {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    margin: 0 0 calc( 20 * 100vw / 375 );
    padding: 0;
    color: #333;
    font-size: var( --font_size-ex_large );
    line-height: 1.54;
    letter-spacing: 0;
    text-align: center;
}
.each_part .lead {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    margin: 0 0 calc( 20 * 100vw / 375 );
    padding: 0;
    color: #333;
    font-size: var( --font_size-large );
    line-height: 1.76;
    letter-spacing: 0;
    text-align: center;
}
.each_part .text {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    margin: 0 0 calc( 20 * 100vw / 375 );
    padding: 0;
    color: #333;
    font-size: var( --font_size-normal );
    line-height: 2;
    letter-spacing: 0;
    text-align: center;
}
@media screen and ( min-width: 769px ){
    .each_part .catchcopy {
        margin: 0 auto max( min( calc( 30 * 100vw / 1388 ), 41.4px ), 30px );
    }
    .each_part .lead {
        margin: 0 auto max( min( calc( 30 * 100vw / 1388 ), 41.4px ), 30px );
    }
    .each_part .text {
        margin: 0 auto max( min( calc( 30 * 100vw / 1388 ), 41.4px ), 30px );
    }
}
@media screen and ( min-width: 1389px ){
}





/* =========================
facade
========================= */
.facade {
    background-image: url( '../img/design/facade-bg.webp' );
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.facade .each_part h2 {
    width: calc( 67.44 * 100vw / 375 );
}
.facade .each_part.part_02 {
    padding: 0 0 calc( 35 * 100vw / 375 );
}
.facade .each_part .catchcopy {
    color: #fff;
}
.facade .each_part .lead {
    color: #fff;
}
.facade .each_part .text {
    color: #fff;
}
@media screen and ( min-width: 769px ){
    .facade {
    }
    .facade .each_part h2 {
        width: max( min( calc( 89.92 * 100vw / 1388 ), 124.09px ), 89.92px );
    }
    .facade .each_part.part_02 {
        padding: 0 0 max( min( calc( 90 * 100vw / 1388 ), 124.2px ), 90px );
    }
    .facade .part_02 .l-content-section-inner--v2 {
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-between;
        align-items: center;
    }
    .facade .part_02 .l-content-section-inner--v2 .wrapper {
        width: 35.2%;
    }
    .facade .part_02 .l-content-section-inner--v2 figure {
        width: 61.5%;
        margin: 0;
    }
    .facade .each_part .catchcopy {
    }
    .facade .each_part.part_02 .lead {
        justify-content: flex-start;
        text-align: left;
    }
    .facade .each_part.part_02 .text {
        justify-content: flex-start;
        text-align: left;
    }
}
@media screen and ( min-width: 1389px ){
}





/* =========================
common_space
========================= */
.common_space {
    background-image: url( '../img/design/common_space-bg.webp' );
    background-position: top left;
    background-repeat: no-repeat;
    background-size: cover;
}
.common_space .each_part h2 {
    width: calc( 143.6 * 100vw / 375 );
}
.common_space .each_part.part_02 {
    padding: 0 0 calc( 35 * 100vw / 375 );
}
@media screen and ( min-width: 769px ){
    .common_space {
    }
    .common_space .each_part h2 {
        width: max( min( calc( 191.47 * 100vw / 1388 ), 264.23px ), 191.47px );
    }
    .common_space .each_part.part_02 {
        padding: 0 0 max( min( calc( 90 * 100vw / 1388 ), 124.2px ), 90px );
    }
    .common_space .part_02 .l-content-section-inner--v2 {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .common_space .part_02 .l-content-section-inner--v2 .wrapper {
        width: 35.2%;
    }
    .common_space .part_02 .l-content-section-inner--v2 figure {
        width: 61.5%;
        margin: 0;
    }
    .common_space .each_part.part_02 .lead {
        justify-content: flex-start;
        text-align: left;
    }
    .common_space .each_part.part_02 .text {
        justify-content: flex-start;
        text-align: left;
    }
}
@media screen and ( min-width: 1389px ){
}





/* =========================
landplan
========================= */
.landplan {
}
.landplan .each_part h2 {
    width: calc( 93.76 * 100vw / 375 );
}
.landplan .each_part.part_02 {
    padding: 0 0 calc( 35 * 100vw / 375 );
}
.landplan .each_part.part_02 {
    padding: 0 0 calc( 35 * 100vw / 375 );
}
.landplan .part_02 figure figcaption {
    position: absolute;
    display: inline-block;
    top: 100%;
    right: 0;
    margin: 0;
    padding: 0.5em 1em;
    color: #333;
    font-size: var( --font_size-caption );
    line-height: 1.5;
    letter-spacing: 0.06em;
    background-color: transparent;
}
@media screen and ( min-width: 769px ){
    .landplan .each_part h2 {
        width: max( min( calc( 125.01 * 100vw / 1388 ), 172.14px ), 125.01px );
    }
    .landplan .each_part.part_02 {
        padding: 0 0 max( min( calc( 55 * 100vw / 1388 ), 75.9px ), 55px );
    }
    .landplan .each_part.part_03 {
        padding: 0;
    }
    .landplan .part_02 figure figcaption {
    }
    .landplan .part_02 .l-content-section-inner--v2 {
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-between;
        align-items: center;
    }
    .landplan .part_02 .l-content-section-inner--v2 .wrapper {
        width: 38.94%;
    }
    .landplan .part_02 .l-content-section-inner--v2 figure {
        width: 57.76%;
        margin: 0;
    }
    .landplan .each_part.part_02 .lead {
        justify-content: flex-start;
        text-align: left;
    }
    .landplan .each_part.part_02 .text {
        justify-content: flex-start;
        text-align: left;
    }
}
@media screen and ( min-width: 1389px ){
}

.landplan_list {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
}
@media screen and ( min-width: 769px ){
    .landplan_list {
        display: flex;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: wrap;
        gap: 2.75%;
    }
}
@media screen and ( min-width: 1389px ){
}

.landplan_list .each_list {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin: 0 0 calc( 30 * 100vw / 375 );
    padding: 0;
}
.landplan_list .each_list:nth-last-of-type(1) {
    margin: 0;
}
@media screen and ( min-width: 769px ){
    .landplan_list .each_list {
        width: 31.5%;
        margin: 0 0 max( min( calc( 40 * 100vw / 1388 ), 55.2px ), 40px );
    }
    .landplan_list .each_list:nth-last-of-type(1), 
    .landplan_list .each_list:nth-last-of-type(2) {
        margin: 0;
    }
}
@media screen and ( min-width: 1389px ){
}

.landplan_list .each_list > .no {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 0 0 calc( 10 * 100vw / 375 );
    padding: 0;
}
.landplan_list .each_list > .no span {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.5em;
    height: 1.5em;
    color: #fff;
    font-size: var( --font_size-small );
    line-height: 1;
    letter-spacing: 0;
    background-color: #908552;
}
.landplan_list .each_list > .subject {
    position: relative;
    width: 100%;
    margin: 0 0 calc( 10 * 100vw / 375 );
    padding: 0 0 calc( 5 * 100vw / 375 );
    font-size: calc( 17 * 100vw / 375 );
    line-height: 1;
    letter-spacing: 0.03em;
    text-align: center;
    border-bottom: 1px solid #908552;
}
.landplan_list .each_list > .subject .text_small {
    padding-left: 0.5em;
    font-size: var( --font_size-small );
    line-height: 1;
    letter-spacing: 0.03em;
}
.landplan_list .each_list > .contents {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: var( --font_size-normal );
    line-height: 1.46;
    letter-spacing: 0.03em;
    text-align: center;
}
@media screen and ( min-width: 769px ){
    .landplan_list .each_list > .no {
        margin: 0 0 calc( 10 * 100vw / 1388 );
    }
    .landplan_list .each_list > .no span {
    }
    .landplan_list .each_list > .subject {
        margin: 0 0 calc( 10 * 100vw / 1388 );
        padding: 0 0 calc( 5 * 100vw / 1388 );
        font-size: max( min( calc( 20 * 100vw / 1388 ), 27.6px ), 20px );
    }
    .landplan_list .each_list > .subject .text_small {
        padding-left: 0.5em;
        font-size: var( --font_size-small );
        line-height: 1;
        letter-spacing: 0.03em;
    }
    .landplan_list .each_list > .contents {
        position: relative;
        width: 100%;
        margin: 0;
        padding: 0;
        font-size: var( --font_size-normal );
        line-height: 1.46;
        letter-spacing: 0.03em;
        text-align: center;
    }
}
@media screen and ( min-width: 1389px ){
}