@property --100vw {
		syntax: "<length>";
		initial-value: 0px;
		inherits: false;
	}


:root {
  --vw1: calc(100vw / 750);
  --100vw: 100vw;
  --window-width: tan(atan2(var(--100vw), 1px));
    /* --rem-sp: calc(1.3rem * max(375, var(--window-width)) / 375); */
    --vw1px: calc(var(--window-width) / 750)

     /* margin-top: calc(51 * var(--vw1)); */
}

.sus_image {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.sus_index_main {
    padding: 70px 0px 100px 0px;
    position: relative;
}
@media screen and (max-width: 767px) {
    .sus_index_main {
        padding: 14.49vw 0;
    }
}

.sus_index_contents {
    padding-left: 120px;
}
@media screen and (max-width: 767px) {
    .sus_index_contents {
        padding-left: 0;
    }
}

.sus_index_hd_title {
    padding: 0 116px 0 30px;
    margin-bottom: 50px;
    margin-bottom: 10px;
}
@media screen and (max-width: 767px) {
    .sus_index_hd_title    {
        margin-left: 0;
        padding: 0;
        margin-bottom: calc(1.3vw * 1);
    }
}

.sus_index_mv {
    display: grid;
}

.sus_index_mv_image {
    grid-row: 1;
    grid-column: 1/3;
}
@media screen and (max-width: 767px) {
.sus_index_mv_image {
    grid-row: 1/3;
    grid-column: 1/-1;
}
}
.sus_index_mv_text {
     grid-row: 1;
    grid-column: 1;
}
@media screen and (max-width: 767px) {
.sus_index_mv_text {
     grid-row: 2;
    grid-column: 1/-1;
}
}
.sus_index_mv_heading {
    margin-top: 78px;
    margin-left: 13px;
    font-size: 3.6rem;
    letter-spacing: -0.03em;
    line-height: calc(52 / 36);
    font-weight: bold;
}

@media screen and (max-width: 767px) {
.sus_index_mv_heading {
    align-self: end;
    margin-top: 0;
    margin-left: 13px;
    font-size: min( calc(var(--vw1px) * 4.6rem), 4.6rem);
    letter-spacing: -0.03em;
    line-height: calc(57 / 46);
    font-weight: bold;
}
}

.sus_index_mv_lead {
    margin-top: 90px;
    height: fit-content;
    font-size: 1.4rem;
    font-weight: bold;
    line-height: calc(26/14);
    letter-spacing: 0;
    margin-left: 16px;
}

@media screen and (max-width: 767px) {
.sus_index_mv_lead {
    font-size: min( calc(var(--vw1px) * 2.3rem), 2.3rem);
    line-height: calc(36/23);
    margin-top: 24px;
    margin-left: 16px;
    margin-top: calc(var(--vw1px) * 2.4rem);
    margin-left: calc(var(--vw1px) * 1.6rem);
    margin-bottom: 0;
}
}

.sus_index_span {
    margin-left: -0.5em;
}

.sus_index_lnuv_layout {
    margin-top: 75px;
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 843px 1fr;
    column-gap: 42px;
}

@media screen and (max-width: 767px) {
    .sus_index_lnuv_layout {
        margin-top: calc(1.3vw * 6);
        grid-template-rows: auto;
        grid-template-columns: 100%;
        padding-left: 0;
        gap: 0;
    }
    .sus_index_lnuv_layout .sus_index_board {
        grid-row: 1;
        grid-column: 1;
    }
    .sus_index_lnuv_layout .boardArea img {
        width: 100%;
    }
    .sus_index_lnuv_layout .contents {
        grid-row: 2;
        padding: 14.49vw 4.83vw;
        padding-top: 0;
        padding-bottom: 0;
    }
    .sus_index_lnuv_layout .sus_index_lnuv {
        display: none;
    }
}


.sus_index_lnuv {
    width: 215px;
}
@media screen and (max-width: 767px) {
    .sus_index_lnuv {
        display: none;
    }
}



.sus_index_list_01 {
    margin-top: 51px;
    display: grid;
    row-gap: 39px;
}
@media screen and (max-width: 767px) {
   .sus_index_list_01 {
    margin-top: calc(51 * var(--vw1));
    row-gap: calc(47 * var(--vw1));
}
}

.sus_index_list_01_link  {
    display: grid;
    grid-auto-flow: column;
    justify-content: space-between;
    border-bottom: solid 1px #E2E2E2;
    font-size: 2rem;
    font-weight: bold;
    line-height: 1;
    padding-bottom: 1.6rem;
    width: 100%;
    align-items: center;
}
.sus_index_list_01_link::after {
    content: "";
    display: block;
    background-image: url("/sustainability/img/index_icon_rect.svg");
    background-size: cover;
    width: .8rem;
    height: .9rem;
    margin-right: .5rem;
}
@media screen and (max-width: 767px) {
   .sus_index_list_01_link  {
    padding-bottom: 1.6rem;
    padding-bottom: calc(21 * var(--vw1));
    column-gap: calc(10 * var(--vw1));
    line-height: 1.5;
}
.sus_index_list_01_link::after {
    width: .8rem;
    height: .9rem;
    margin-right: calc(.5 * var(--vw1));
}
}
@media screen and (max-width: 500px) {
   .sus_index_list_01_link  {
    font-size: 1.6rem;
}
}


.sus_index_list_01_icon {
    width: .8rem;
}

.sus_index_list_02 {
    display: grid;
    row-gap: 1.8rem;
    margin-top: 2.2rem;
}
@media screen and (max-width: 767px) {
   .sus_index_list_02 {
    row-gap: 1.8rem;
    row-gap: calc(33 * var(--vw1));
    margin-top: calc(20 * var(--vw1));
}
}

.sus_index_list_02_item {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 330px 1fr;
    justify-content: start;
    align-items: center;
    column-gap: 5.6rem;
    border: solid 1px #E2E2E2;
}
@media screen and (max-width: 767px) {
   .sus_index_list_02_item {
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: 100%;
    justify-content: start;
    row-gap:0;
}
}

.sus_index_list_02_item_image {
    vertical-align: bottom;
}

.sus_index_list_03 {
    display: grid;
    height: fit-content;
    line-height: 1;
    row-gap: 2.1rem;
}
@media screen and (max-width: 767px) {
   .sus_index_list_03 {
    padding-top: calc(25 * var(--vw1));
    padding-bottom:calc(27 * var(--vw1));
    padding-left: 1.6rem;
    padding-left: calc(16 * var(--vw1));
}
}


.sus_index_list_03_link {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    column-gap: .8rem;
    text-align: left;
    justify-content: start;
}

.sus_index_list_03_link::before {
    content: "";
    display: block;
    background-image: url("/sustainability/img/index_icon_rect.svg");
    background-size: cover;
    width: .8rem;
    height: .9rem;
    transform: translateY(.1em);
}



.sus_index_list_04 {
    margin-top: 4.6rem;
    display: grid;
    grid-auto-flow: column;
    justify-content: space-between;
}
@media screen and (max-width: 767px) {
   .sus_index_list_04 {
    grid-auto-flow: row;
    justify-content: start;
    margin-top: calc(40 * var(--vw1));
    row-gap: calc(46 * var(--vw1));
}
}

.sus_index_list_04_item {
    width: 402px;
}
@media screen and (max-width: 767px) {
   .sus_index_list_04_item {
    width: 100%;
}
}

.sus_index_list_04_item img {
    width: 100%;
    height: 284px;
    object-fit: cover;
    border: solid 1px #365294;
}
@media screen and (max-width: 767px) {
   .sus_index_list_04_item img {
    height: auto;
    border: solid 1px #365294;
}
}

.sus_index_list_04_item p {
    margin-top: 1.6rem;
    font-weight: bold;
    text-align: center;
}
@media screen and (max-width: 767px) {
.sus_index_list_04_item p {
    margin-top: calc(22 * var(--vw1));
    font-size: 1.8rem;
}
}

.sus_index_list_04_link {
    margin-top: 3.6rem;
    display: grid;
    place-items: center;
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 1;
    width: 100%;
    padding: 1.6rem 0;
    border: solid 1px #365294;
    color: #365294;
    text-align: center;
}
@media screen and (max-width: 767px) {
.sus_index_list_04_link {
    border: solid 2px #365294;
    font-size: 1.6rem;
    margin-top: calc(36 * var(--vw1));
    padding: calc(34 * var(--vw1)) 0;
}
}