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



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

mousecursor

======================================== */
.cursor_02 {
	/* position */
    position: fixed;
    top: 0;
    left: 0;
	/* display */
    opacity: 0;
    z-index: 400;
	/* box */
    width: 140px;
    height: 140px;
	/* font */
    color: #000;
	/* border */
    border-radius: 50%;
    border: solid 1px #fff;
	/* background */
    background-color: rgba( 255, 255, 255, 0.5);
	/* animation */
    transition: .1s;
	/* etc */
    pointer-events: none;
    mix-blend-mode: screen;
}
.cursor_02 .mouse__txt {
	/* position */
    position: absolute;
    top: 50%;
    left: 50%;
	/* display */
    transform: translate(-50%, -50%);
	/* box */
    width: 100%;
	/* font */
    font-family: "Murecho", sans-serif;
    font-size: 1.8rem;
    color: #fff;
    text-align: center;
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.cursor_03 {
	/* position */
    position: fixed;
    top: 0;
    left: 0;
	/* display */
    opacity: 0;
    z-index: 400;
	/* box */
    width: 140px;
    height: 140px;
	/* font */
    color: #000;
	/* border */
    border-radius: 50%;
	/* background */
    background: linear-gradient( to bottom, rgba( 74, 169, 206, 0.5 ), rgba( 31, 58, 109, 0.5 ) );
	/* animation */
    transition: .1s;
	/* etc */
    pointer-events: none;
}
.cursor_03 .mouse__txt {
	/* position */
    position: absolute;
    top: 50%;
    left: 50%;
	/* display */
    transform: translate(-50%, -50%);
	/* box */
    width: 100%;
	/* font */
    font-family: "Murecho", sans-serif;
    font-size: 1.8rem;
    color: #fff;
    text-align: center;
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.cursor_02.show, 
.cursor_03.show {
    opacity: 1;
}





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

esg/index
esg

======================================== */
.esg {
	/* position */
    position: relative;
	/* display */
    z-index: 100;
	/* box */
    width: 100%;
    margin: 0 0 150px 0;
    padding: 0;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .esg {
        margin: 0 0 55px 0;
    }
}



/*
esg_container
*/
.esg .esg_container {
	/* position */
    position: relative;
	/* display */
    z-index: 200;
	/* box */
    width: 100%;
    max-width: 1950px;
    margin: 0 auto 0 auto;
    padding: 0 15px;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .esg .esg_container {
        margin: 0 0 0 0;
    }
}



/*
lead
*/
.esg .esg_container .lead {
	/* position */
	/* display */
	/* box */
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 0 auto;
    padding: 0 0 50px 0;
	/* font */
    text-align: center;
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.esg .esg_container .lead h2 {
	/* position */
	/* display */
    display: inline-block;
	/* box */
    padding: 0;
	/* font */
    font-family: "Murecho", sans-serif;
    font-size: 3.2rem;
    line-height: 1.5;
    text-align: center;
	/* border */
	/* background */
    background: linear-gradient( to right ,#1f3a6d , #4babd0 );
    background: -webkit-linear-gradient( to right ,#1f3a6d , #4babd0 );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .esg .esg_container .lead {
        margin: 0 auto 0 auto;
        padding: 0 0 40px 0;
    }
    .esg .esg_container .lead h2 {
        font-size: 2.0rem;
    }
}



/*
flexbox_esg
*/
.esg .esg_container .flexbox_esg {
	/* position */
    position: relative;
	/* display */
    display:flex;
    justify-content: space-between;
    align-items: flex-start;
    z-index: 200;
	/* box */
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 0 auto;
    padding: 0;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .esg .esg_container .flexbox_esg {
        /* position */
        /* display */
        display: block;
        /* box */
        max-width: none;
        margin: 0;
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}



/*
flexitem
*/
.esg .esg_container .flexbox_esg .flexitem {
	/* position */
    position: relative;
	/* display */
	/* box */
    width: 100%;
    margin: 0;
    padding: 0;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.esg .esg_container .flexbox_esg .flexitem.item_content {
	/* position */
	/* display */
	/* box */
    width: 40.834%;
    max-width: 490px;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.esg .esg_container .flexbox_esg .flexitem.item_image {
	/* position */
	/* display */
	/* box */
    width: 53.167%;
    max-width: 637px;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .esg .esg_container .flexbox_esg .flexitem {
        /* position */
        /* display */
        /* box */
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
    .esg .esg_container .flexbox_esg .flexitem.item_content {
        /* position */
        /* display */
        /* box */
        width: 100%;
        max-width: none;
        margin: 0 0 0 0;
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
    .esg .esg_container .flexbox_esg .flexitem.item_image {
        /* position */
        /* display */
        /* box */
        width: 100%;
        max-width: none;
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}



/*
flexitem .content_box
*/
.esg .esg_container .flexbox_esg .flexitem .content_box {
	/* position */
    position: relative;
	/* display */
	/* box */
    width: 100%;
    margin: 0;
    padding: 0;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.esg .esg_container .flexbox_esg .flexitem .content_box.box_01 {
	/* position */
	/* display */
	/* box */
    margin: 0 0 40px 0;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .esg .esg_container .flexbox_esg .flexitem .content_box {
        /* position */
        /* display */
        /* box */
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
    .esg .esg_container .flexbox_esg .flexitem .content_box.box_01, 
    .esg .esg_container .flexbox_esg .flexitem .content_box.box_02 {
        /* position */
        /* display */
        /* box */
        margin: 0 0 45px 0;
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}



/*
flexitem .content_box
*/
.esg .esg_container .flexbox_esg .flexitem .content_box .caption {
	/* position */
    position: relative;
	/* display */
	/* box */
    width: 100%;
    margin: 0 0 10px 0;
    padding: 0;
	/* font */
	/* border */
    border-bottom: 1px solid #1f3a6d;
	/* background */
	/* animation */
	/* etc */
}
.esg .esg_container .flexbox_esg .flexitem .content_box .caption p {
	/* position */
    position: relative;
	/* display */
	/* box */
    width: 100%;
    margin: 0;
    padding: 0;
	/* font */
    font-family: "Murecho", sans-serif;
    font-size: 2.4rem;
    color: #1f3a6d;
    line-height: 1.5;
    letter-spacing: 0.075em;
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .esg .esg_container .flexbox_esg .flexitem .content_box .caption {
        /* position */
        /* display */
        /* box */
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
    .esg .esg_container .flexbox_esg .flexitem .content_box .caption p {
        /* position */
        /* display */
        /* box */
        /* font */
        font-size: 1.8rem;
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}



/*
flexitem .content_box .text
*/
.esg .esg_container .flexbox_esg .flexitem .content_box .text {
	/* position */
    position: relative;
	/* display */
	/* box */
    width: 100%;
    margin: 0;
    padding: 0;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.esg .esg_container .flexbox_esg .flexitem .content_box .text p {
	/* position */
    position: relative;
	/* display */
	/* box */
    width: 100%;
    margin: 0;
    padding: 0;
	/* font */
    font-family: "Murecho", sans-serif;
    font-size: 1.6rem;
    color: #333;
    line-height: 1.5;
    letter-spacing: 0.075em;
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .esg .esg_container .flexbox_esg .flexitem .content_box .text {
        /* position */
        /* display */
        /* box */
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
    .esg .esg_container .flexbox_esg .flexitem .content_box .text p {
        /* position */
        /* display */
        /* box */
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}



/*
flexitem img
*/
.esg .esg_container .flexbox_esg .flexitem.item_image img {
	/* position */
	/* display */
	/* box */
    width: 100%;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .esg .esg_container .flexbox_esg .flexitem.item_image img {
        /* position */
        /* display */
        /* box */
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}



/*
floorplan_bg_line
*/
.esg .esg_bg_line {
	/* position */
    position: absolute;
    top: 45%;
    top: 90%;
    left: calc( 50% - 960px );
	/* display */
    z-index: 1;
    overflow: hidden;
	/* box */
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.esg .esg_bg_line svg {
	/* position */
	/* display */
	/* box */
    width: 1920px;
    height: 443.41px;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.esg .esg_bg_line .svg_path_line_01 {
	/* position */
	/* display */
	/* box */
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
    stroke-dasharray: 2100px;
    stroke-dashoffset: 2100px;
}
.esg .esg_bg_line .svg_path_line_01.active {
	/* position */
	/* display */
	/* box */
	/* font */
	/* border */
	/* background */
	/* animation */
    animation: move_line_01 5s;
    animation-fill-mode: forwards;
	/* etc */
    stroke-dasharray: 2100px;
}
@keyframes move_line_01 {
    0% {
        stroke-dashoffset: 2100px;
    }
    to {
        stroke-dashoffset: 0px;
    }
}
@media screen and ( max-width: 1920px ){
    .esg .esg_bg_line {
        left: 0;
    }
}
@media screen and ( max-width: 768px ){
    .esg .esg_bg_line {
        display: none;
    }
}



.esg .esg_bg_line_bottom_sp {
	/* position */
    position: absolute;
    top: 75%;
    left: 0;
	/* display */
    display: none;
	/* box */
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .esg .esg_bg_line_bottom_sp {
        display: block;
    }
}





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

esg/index
bcp

======================================== */
.bcp {
	/* position */
    position: relative;
	/* display */
    z-index: 100;
	/* box */
    width: 100%;
    margin: 0 0 150px 0;
    padding: 0;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .bcp {
        margin: 0 0 60px 0;
    }
}



/*
bcp_container
*/
.bcp .bcp_container {
	/* position */
    position: relative;
	/* display */
    z-index: 200;
	/* box */
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 0 auto;
    padding: 50px;
	/* font */
	/* border */
    border: 1px solid #bbb;
	/* background */
    background-color: #fff;
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .bcp .bcp_container {
        /* position */
        /* display */
        /* box */
        width: calc( 100% - 30px );
        max-width: none;
        margin: 0 auto;
        padding: 45px 20px;
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}



/*
bcp .bcp_container .caption
*/
.bcp .bcp_container .caption {
	/* position */
    position: relative;
	/* display */
    z-index: 200;
	/* box */
    width: 100%;
    max-width: 1100px;
    margin: 0 auto 20px auto;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.bcp .bcp_container .caption p {
	/* position */
    position: relative;
	/* display */
	/* box */
    width: 100%;
	/* font */
    font-family: "Murecho", sans-serif;
    font-size: 2.4rem;
    color: #1f3a6d;
    line-height: 1.5;
    letter-spacing: 0.075em;
	/* border */
    border-bottom: 1px solid #1f3a6d;
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .bcp .bcp_container .caption {
        /* position */
        /* display */
        /* box */
        width: 100%;
        max-width: none;
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
    .bcp .bcp_container .caption p {
        /* position */
        /* display */
        /* box */
        /* font */
        font-size: 1.8rem;
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}



/*
bcp .bcp_container .text
*/
.bcp .bcp_container .text {
	/* position */
    position: relative;
	/* display */
    z-index: 200;
	/* box */
    width: 100%;
    max-width: 1100px;
    margin: 0 auto 40px auto;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.bcp .bcp_container .text p {
	/* position */
    position: relative;
	/* display */
	/* box */
    width: 100%;
	/* font */
    font-family: "Murecho", sans-serif;
    font-size: 1.6rem;
    color: #333;
    line-height: 1.5;
    letter-spacing: 0.075em;
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .bcp .bcp_container .text {
        /* position */
        /* display */
        /* box */
        max-width: none;
        margin: 0 auto 30px auto;
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
    .bcp .bcp_container .text p {
        /* position */
        /* display */
        /* box */
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}



/*
bcp_container .image
*/
.bcp .bcp_container .image {
	/* position */
    position: relative;
	/* display */
    z-index: 200;
	/* box */
    width: 100%;
    margin: 0;
    padding: 0;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.bcp .bcp_container .image img {
	/* position */
	/* display */
	/* box */
    width: 100%;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .bcp .bcp_container .image {
        /* position */
        /* display */
        /* box */
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
    .bcp .bcp_container .image img {
        /* position */
        /* display */
        /* box */
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}





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

esg/index
performance

======================================== */
.performance {
	/* position */
    position: relative;
	/* display */
    z-index: 100;
	/* box */
    width: 100%;
    margin: 0 0 150px 0;
    padding: 0;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .performance {
        margin: 0 0 65px 0;
    }
}



/*
lead
*/
.performance .lead {
	/* position */
    position: relative;
	/* display */
    z-index: 200;
	/* box */
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 40px auto;
    padding: 0;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.performance .lead p {
	/* position */
    position: relative;
	/* display */
	/* box */
    width: 100%;
	/* font */
    font-family: "Murecho", sans-serif;
    font-size: 2.4rem;
    color: #1f3a6d;
    line-height: 1.5;
    letter-spacing: 0.075em;
    text-align: center;
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .performance .lead {
        /* position */
        /* display */
        /* box */
        width: 100%;
        max-width: none;
        margin: 0 auto 30px auto;
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
    .performance .lead p {
        /* position */
        /* display */
        /* box */
        /* font */
        font-size: 1.8rem;
        line-height: 1;
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}



/*
flexbox_performance
*/
.performance .flexbox_performance {
	/* position */
    position: relative;
	/* display */
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    z-index: 200;
	/* box */
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 90px auto;
    padding: 0;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.performance .flexbox_performance::after {
    content: '';
    display: block;
    width: 23.5%;
}
@media screen and ( max-width: 768px ){
    .performance .flexbox_performance {
        /* position */
        /* display */
        display: block;
        /* box */
        width: calc( 100% - 30px );
        max-width: none;
        margin: 0 auto 50px auto;
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
    .performance .flexbox_performance::after {
        content: none;
        display: none;
    }
}



/*
flexbox_performance
*/
.performance .flexbox_performance .flexitem {
	/* position */
    position: relative;
	/* display */
    z-index: 200;
	/* box */
    width: 23.5%;
    margin: 0 0 20px 0;
    padding: 0;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.performance .flexbox_performance .flexitem.caption {
	/* position */
	/* display */
    display: flex;
    justify-content: center;
    align-items: center;
	/* box */
    width: 23.5%;
    aspect-ratio: 141 / 75;
	/* font */
	/* border */
	/* background */
    background-image: url( '../img/esg/index/performance__flexbox_performance__flexitem__caption-bg.png' );
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
	/* animation */
	/* etc */
}
.performance .flexbox_performance .flexitem.text {
	/* position */
	/* display */
    display: flex;
    justify-content: flex-start;
    align-items: center;
	/* box */
    min-height: 80px;
    padding: 0 0 0 10px;
	/* font */
	/* border */
    border-left: 6px solid #a9c5dd;
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .performance .flexbox_performance .flexitem {
        /* position */
        /* display */
        /* box */
        width: 100%;
        margin: 0 0 25px 0;
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
    .performance .flexbox_performance .flexitem.caption {
        /* position */
        /* display */
        /* box */
        width: 100%;
        height: 90px;
        aspect-ratio: auto;
        /* font */
        /* border */
        /* background */
        background-position: left top;
        /* animation */
        /* etc */
    }
    .performance .flexbox_performance .flexitem.text {
        /* position */
        /* display */
        /* box */
        min-height: 60px;
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}
.empty-box {
    opacity: 0;
}
@media screen and ( max-width: 768px ) {
    .empty-box {
        display: none !important;
    }
}

/*
flexbox_performance
*/
.performance .flexbox_performance .flexitem.caption p {
	/* position */
    position: relative;
	/* display */
	/* box */
    width: 100%;
    margin: 0;
    padding: 0;
	/* font */
    font-family: "Murecho", sans-serif;
    font-size: 1.8rem;
    color: #1f3a6d;
    line-height: 1.364;
    letter-spacing: 0.05em;
    text-align: center;
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.performance .flexbox_performance .flexitem.caption p span {
	/* position */
	/* display */
	/* box */
	/* font */
    font-family: "Murecho", sans-serif;
    font-size: 1.6rem;
    color: #1f3a6d;
    line-height: 1.875;
    letter-spacing: 0.05em;
    text-align: center;
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .performance .flexbox_performance .flexitem.caption p {
        /* position */
        /* display */
        /* box */
        /* font */
        font-size: 1.8rem;
        line-height: 1.388;
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
    .performance .flexbox_performance .flexitem.caption p span {
        /* position */
        /* display */
        /* box */
        /* font */
        font-size: 1.2rem;
        line-height: 2.083;
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}



/*
flexbox_performance
*/
.performance .flexbox_performance .flexitem.text p {
	/* position */
    position: relative;
	/* display */
	/* box */
    width: 100%;
    margin: 0;
    padding: 0;
	/* font */
    font-family: "Murecho", sans-serif;
    font-size: 1.6rem;
    color: #333;
    line-height: 1.5;
    letter-spacing: 0.075em;
    text-align: left;
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .performance .flexbox_performance .flexitem.text p {
        /* position */
        /* display */
        /* box */
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}



/*
performance .annotation
*/
.performance .annotation {
	/* position */
    position: relative;
	/* display */
    z-index: 200;
	/* box */
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 40px auto;
    padding: 0;
	/* font */
	/* border */
	/* background */
	/* animation */
	/* etc */
}
.performance .annotation p {
	/* position */
    position: relative;
	/* display */
	/* box */
    width: 100%;
	/* font */
    font-family: "Murecho", sans-serif;
    font-size: 1.2rem;
    color: #999;
    line-height: 1.5;
    letter-spacing: 0.075em;
    text-align: left;
	/* border */
	/* background */
	/* animation */
	/* etc */
}
@media screen and ( max-width: 768px ){
    .performance .annotation {
        /* position */
        /* display */
        /* box */
        width: calc( 100% - 30px );
        max-width: none;
        margin: 0 auto 50px auto;
        /* font */
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
    .performance .annotation p {
        /* position */
        /* display */
        /* box */
        /* font */
        font-size: 1.2rem;
        line-height: 1.5;
        letter-spacing: 0.01em;
        /* border */
        /* background */
        /* animation */
        /* etc */
    }
}