@charset "utf-8";
/* CSS Document */





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

main_visual

============================== */
.main_visual.lower_page .main_visual-fg .main_visual-fg-title {
    width: min( calc( 381 * 100vw / var( --dw ) ), calc( 381px * 1.38 ) );
}
@media screen and ( max-width: 768px ) {
    .main_visual.lower_page .main_visual-fg .main_visual-fg-title {
        width: calc( 156.86 * 100vw / var( --dw ) );
        left: calc( 50% - calc( calc( 156.86 * 100vw / var( --dw ) ) / 2 ) );
    }
}










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

view

============================== */
.view {
    position: relative;
    width: 100%;
    margin: 0;
    padding-top: min( calc( 85 * 100vw / var( --dw ) ), calc( 85px * 1.38 ) );
    padding-bottom: min( calc( 85 * 100vw / var( --dw ) ), calc( 85px * 1.38 ) );
}
.view .view-title {
    position: relative;
    width: min( calc( 66.43 * 100vw / var( --dw ) ), calc( 66.43px * 1.38 ) );
    margin: 0 auto min( calc( 40 * 100vw / var( --dw ) ), calc( 40px * 1.38 ) );
    padding: 0;
}
@media screen and ( max-width: 768px ) {
    .view {
        padding-top: calc( 45 * 100vw / var( --dw ) );
        padding-bottom: calc( 45 * 100vw / var( --dw ) );
    }
    .view .view-title {
        width: calc( 66.43 * 100vw / var( --dw ) );
        margin: 0 auto calc( 30 * 100vw / var( --dw ) );
    }
}



.view .view-lead {
    position: relative;
    width: 100%;
    margin: 0 auto min( calc( 60 * 100vw / var( --dw ) ), calc( 60px * 1.38 ) );
    padding: 0;
}
.view .view-lead__caption {
    position: relative;
    width: 100%;
    margin: 0 auto min( calc( 40 * 100vw / var( --dw ) ), calc( 40px * 1.38 ) );
    padding: 0;
    font-size: calc( 22 * 100vw / var( --dw ) );
    text-align: center;
}
.view .view-lead__text {
    position: relative;
    width: 100%;
    margin: 0 auto min( calc( 20 * 100vw / var( --dw ) ), calc( 20px * 1.38 ) );
    padding: 0;
    text-align: center;
}
.view .view-lead__annotation {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
}
@media screen and ( max-width: 768px ) {
    .view .view-lead {
        margin: 0 auto calc( 45 * 100vw / var( --dw ) );
    }
    .view .view-lead__caption {
        margin: 0 auto calc( 45 * 100vw / var( --dw ) );
    }
    .view .view-lead__text {
        margin: 0 auto calc( 20 * 100vw / var( --dw ) );
        text-align: left;
    }
    .view .view-lead__annotation {
        text-align: left;
    }
}



.view .view-content {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 0;
}
@media screen and ( max-width: 768px ) {
    .view .view-content {
    }
}



.view .view-content-tab {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 min( calc( 10 * 100vw / var( --dw ) ), calc( 10px * 1.38 ) );
    width: 100%;
    margin: 0 0 min( calc( 20 * 100vw / var( --dw ) ), calc( 20px * 1.38 ) );
    padding: 0;
    font-size: 0;
}
.view .view-content-tab__button {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: min( calc( 160 * 100vw / var( --dw ) ), calc( 160px * 1.38 ) );
    height: min( calc( 46 * 100vw / var( --dw ) ), calc( 46px * 1.38 ) );
    color: #A59B54;
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings: "wdth" 100;
    background-color: #efefef;
}
.view .view-content-tab__button.is_active {
    color: #fff;
    background-color: #A59B54;
}
@media screen and ( max-width: 768px ) {
    .view .view-content-tab {
        flex-wrap: wrap;
        gap: calc( 10 * 100vw / var( --dw ) );
        margin: 0 0 calc( 20 * 100vw / var( --dw ) );
    }
    .view .view-content-tab__button {
        width: calc( 50% - calc( calc( 10 * 100vw / var( --dw ) ) / 2 ) );
        height: calc( 46 * 100vw / var( --dw ) );
    }
    .view .view-content-tab__button.is_active {
    }
}



.view .view-content-tab_content {
    position: relative;
    width: 100%;
    aspect-ratio: 88 / 35;
    margin: 0;
    padding: 0;
    font-size: 0;
}
.view .view-content-tab_content .content_item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    font-size: 0;
    visibility: hidden;
    opacity: 0;
    transition: all 0.5s;
}
.view .view-content-tab_content .content_item.is_active {
    visibility: visible;
    opacity: 1;
}
.view .view-content-tab_content .content_item figure {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    font-size: 0;
}
.view .view-content-tab_content .content_item picture {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    font-size: 0;
}
.view .view-content-tab_content .content_item picture img {
    width: 100%;
}
.view .view-content-tab_content .content_item figure figcaption {
    position: absolute;
    /*bottom: 0;*/
    bottom:-2em;
    right: 0;
    display: inline-block;
    margin: 0;
    padding: 0 1em;
    /*color: #fff;*/
    color: #000;
    /*background-color: rgba(0, 0, 0, 0.4);*/
}
@media screen and ( max-width: 768px ) {
    .view .view-content-tab_content {
        aspect-ratio: 375 / 210;
    }
    .view .view-content-tab_content .content_item {
    }
    .view .view-content-tab_content .content_item.is_active {
    }
    .view .view-content-tab_content .content_item figure {
    }
    .view .view-content-tab_content .content_item picture {
    }
    .view .view-content-tab_content .content_item picture img {
    }
    .view .view-content-tab_content .content_item figure figcaption {
        bottom:-3em;
        line-height: 1.2;
    }
}










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

madori_list-title

============================== */
.madori_list-title {
    position: relative;
    width: 100%;
    margin: 0 0 min( calc( 35 * 100vw / var( --dw ) ), calc( 35px * 1.38 ) );
    padding: 0;
    font-size: 0;
}
.madori_list-title-image {
    position: relative;
    width: min( calc( 64.55 * 100vw / var( --dw ) ), calc( 64.55px * 1.38 ) );
    margin: 0 auto;
    padding: 0;
    font-size: 0;
}
.madori_list-title-image picture {
    position: relative;
    display: inline-block;
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 0;
}
.madori_list-title-image picture img {
    width: 100%;
}
@media screen and ( max-width: 768px ) {
    .madori_list-title {
        margin: 0 0 calc( 35 * 100vw / var( --dw ) );
    }
    .madori_list-title-image {
        width: calc( 64.55 * 100vw / var( --dw ) );
    }
    .madori_list-title-image picture {
    }
    .madori_list-title-image picture img {
    }
}










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

building_diagram

============================== */
.building_diagram {
    position: relative;
    width: 100%;
    margin: 0 0 min( calc( 40 * 100vw / var( --dw ) ), calc( 40px * 1.38 ) );
    padding: 0;
}
.building_diagram .diagram-list {
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin: 0;
    padding: 0;
}
.building_diagram .diagram-list .each_diagram {
    width: calc( 50% - min( 0.72vw, 12px ) );
    margin: 0 min( 0.36vw, 6px ) min( 0.72vw, 12px );
}
.building_diagram .diagram-list .each_diagram .building-image {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 0;
}
.building_diagram .diagram-list .each_diagram .building-image picture {
    position: relative;
    display: inline-block;
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 0;
}
.building_diagram .diagram-list .each_diagram .building-image picture img {
    width: 100%;
}
@media screen and ( max-width: 768px ) {
    .building_diagram {
        margin: 0 0 calc( 40 * 100vw / var( --dw ) );
    }
    .building_diagram .diagram-list {
    }
    .building_diagram .diagram-list .each_diagram {
        width: calc( 50% - min( 0.72vw, 12px ) );
        margin: 0 min( 0.36vw, 6px ) min( 0.72vw, 12px );
    }
    .building_diagram .diagram-list .each_diagram .building-image {
    }
    .building_diagram .diagram-list .each_diagram .building-image picture {
    }
    .building_diagram .diagram-list .each_diagram .building-image picture img {
    }
}









.t-madori__list__grid__head {
    border-color: #A59B54;
}
@media screen and ( max-width: 768px ) {
}



.t-madori__list__grid__head__data {
    color: #333;
    background-color: #e5dc98;
}
@media screen and ( max-width: 768px ) {
}



.t-madori__list__grid__head {
}













@media screen and ( max-width: 768px ) {
    .t-madori__list__grid__head__area {
        overflow-wrap: anywhere; /* 収まらない場合に折り返す */
        word-break: break-all ; /* 単語の分割はデフォルトに依存 */
         line-break: strict; /* 禁則処理を厳格に適用 */
    }
    .t-madori__list__grid__head__area .text-xs {
        display: none;
        overflow-wrap: anywhere; /* 収まらない場合に折り返す */
        word-break: break-all ; /* 単語の分割はデフォルトに依存 */
        line-break: strict; /* 禁則処理を厳格に適用 */
    }
}


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

.l-inner.hanrei

============================== */
@media screen and ( max-width: 768px ) {
.l-inner.hanrei{
    z-index: 0;
}
}


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

.l-inner.bnr

============================== */
.l-inner.bnr {
    position: relative;
    max-width: none;
    margin-top: 100px;
    margin-bottom: 50px;
    padding: 0 var( --l-inner_default_padding_x_180 );
}
@media screen and ( max-width: 768px ) {
    .l-inner.bnr {
        margin-top: 50px;
        margin-bottom: 50px;
        padding: 0 var( --l-inner_default_padding_x_32 );
        z-index: 0;
    }
}



.l-inner.bnr ul {
    position: relative;
    display: flex;
    justify-content: flex-start;
    justify-content: center;
    align-items: flex-start;
    margin-bottom: var( --defin-pixel_50 );
}
.l-inner.bnr ul li {
    position: relative;
    display: inline-block;
    width: 40%;
    max-width: none;
    margin: 0;
    padding: 0;
}
.l-inner.bnr ul li picture {
    position: relative;
    display: inline-block;
    width: 100%;
    margin: 0;
    padding: 0;
}
.l-inner.bnr ul li picture img {
    width: 80%;
    margin-left: 10%;
}
.l-inner.bnr ul li .remark {
    position: relative;
    display: inline-block;
    width: 80%;
    margin: var( --defin-pixel_10 ) 0 0 10%;
    margin-left: 10%;
    padding: 0;
    font-size: var( --font_size-small );
    line-height: 1.5;
    letter-spacing: 0.1em;
}
@media screen and ( max-width: 768px ) {
    .l-inner.bnr ul {
        position: relative;
        display: block;
        margin-bottom: var( --defin-pixel_50 );
    }
    .l-inner.bnr ul li {
        width: 100%;
    }
    .l-inner.bnr ul li:nth-of-type(2) {
        margin-top: var( --defin-pixel_20 );
    }
    .l-inner.bnr ul li picture {
    }
    .l-inner.bnr ul li picture img {
    }
    .l-inner.bnr ul li .remark {
        font-size: var( --font_size-image_caption );
    }
}













