@charset "UTF-8";

.pageHeader_sus {
    display: flex;
    background: linear-gradient(to right, #00469B, #3382ED);
    padding: min(30%, 14.6rem) 6rem 12.4rem 8rem;
    justify-content: space-between;
    min-height: 250px;
    align-items: center;
    gap: 10px;
}

.title_sus {
    margin-top: 1rem;
}

.title_sus h2 {
    font-family: roboto;
    color: #fff;
    opacity: 50%;
    font-size: min(10vw, 11rem);
    font-weight: 500;
    white-space: nowrap;
    margin-top: -2rem;
}

.title_sus p {
    font-size: 2.3rem;
    color: #fff;
    font-weight: 700;
    margin: -3.5rem 0 0 0;
    letter-spacing: 0.15em;
}

@media screen and (min-width: 1366px) {
    .pageHeader_sus {
        padding: min(30%, 14.7rem) calc(100vw / 3 - 352px) 12.4rem calc(100vw / 3 - 375px);
    }

}


@media screen and (max-width: 1028px) {

    .pageHeader_sus {
        padding: 6.8rem 16rem 7.2rem 3rem;
    }

    .title_sus h2 {
        font-size: clamp(5.7rem, 10vw, 13rem);
    }

    .title_sus p {
        font-size: 1.8rem;
        margin: -2.5rem 0 0 0;
    }

    .title_sus {
        margin: 1rem 2rem 0;
    }

    .title_sus h2 {
        margin-top: 0;
    }

}



@media screen and (max-width: 570px) {
    .pageHeader_sus {
        padding: 7rem 16rem 6rem 0;
    }
}

@media screen and (max-width: 410px) {
    .title_sus h2 {
        font-size: min(14vw, 5.7rem);
    }

    .pageHeader_sus {
        min-height: 200px;
    }
}

.bgabout01 {
    background-color: #F4F6F8;
}

.bgabout02 {
    background-color: #fff;
}



/***********************:title****************************/
.sus_title01 {
    position: relative;
    display: flex;
    /* フレックスボックスを有効化 */
    justify-content: center;
    /* 水平方向の中央寄せ */
    align-items: center;
    /* 垂直方向の中央寄せ */
    font-size: 30px;
    /* 通常テキスト用のフォントサイズ */
    color: #000;
    /* 通常テキストの色 */
    letter-spacing: 0.15em;
}

.sus_title01::after {
    content: 'TOP MESSAGE';
    position: absolute;
    top: 50%;
    font-family: "Roboto Condensed", sans-serif;
    /* 垂直方向の中央寄せ */
    left: 50%;
    /* 水平方向の中央寄せ */
    transform: translate(-50%, -55%);
    /* 中央に配置 */
    font-size: clamp(4.5rem, 10vw, 14.6rem);
    /* 背景テキストのフォントサイズ */
    color: #fff;
    /* 背景テキストの色（透明度含む） */
    z-index: 0;
    /* 背景として配置 */
    white-space: nowrap;
    /* テキストの折り返し防止 */
    letter-spacing: normal;
}

.sus_title02 {
    position: relative;
    display: flex;
    /* フレックスボックスを有効化 */
    justify-content: center;
    /* 水平方向の中央寄せ */
    align-items: center;
    /* 垂直方向の中央寄せ */
    font-size: 30px;
    /* 通常テキスト用のフォントサイズ */
    color: #000;
    /* 通常テキストの色 */
    letter-spacing: 0.15em;
}

.sus_title02::after {
    content: 'SDGs ACTION';
    position: absolute;
    top: 50%;
    font-family: "Roboto Condensed", sans-serif;
    /* 垂直方向の中央寄せ */
    left: 50%;
    /* 水平方向の中央寄せ */
    transform: translate(-50%, -55%);
    /* 中央に配置 */
    font-size: clamp(4.5rem, 10vw, 14.6rem);
    /* 背景テキストのフォントサイズ */
    color: #f4f6f8;
    /* 背景テキストの色（透明度含む） */
    z-index: 0;
    /* 背景として配置 */
    white-space: nowrap;
    /* テキストの折り返し防止 */
    letter-spacing: normal;
}

.sus_title03 {
    position: relative;
    display: flex;
    /* フレックスボックスを有効化 */
    justify-content: center;
    /* 水平方向の中央寄せ */
    align-items: center;
    /* 垂直方向の中央寄せ */
    font-size: 30px;
    /* 通常テキスト用のフォントサイズ */
    color: #000;
    /* 通常テキストの色 */
    letter-spacing: 0.15em;
}

.sus_title03::after {
    content: 'HEALTH MANAGEMENT';
    position: absolute;
    top: 50%;
    font-family: "Roboto Condensed", sans-serif;
    /* 垂直方向の中央寄せ */
    left: 50%;
    /* 水平方向の中央寄せ */
    transform: translate(-50%, -55%);
    /* 中央に配置 */
    font-size: clamp(3.8rem, 10vw, 14.6rem);
    /* 背景テキストのフォントサイズ */
    color: #fff;
    /* 背景テキストの色（透明度含む） */
    z-index: 0;
    /* 背景として配置 */
    white-space: nowrap;
    /* テキストの折り返し防止 */
    letter-spacing: normal;
}

.sus_title04 {
    position: relative;
    display: flex;
    /* フレックスボックスを有効化 */
    justify-content: center;
    /* 水平方向の中央寄せ */
    align-items: center;
    /* 垂直方向の中央寄せ */
    font-size: 30px;
    /* 通常テキスト用のフォントサイズ */
    color: #000;
    /* 通常テキストの色 */
    letter-spacing: 0.15em;
}

.sus_title04::after {
    content: 'ENVIRONMENTAL INITIATIVES';
    position: absolute;
    top: 50%;
    font-family: "Roboto Condensed", sans-serif;
    /* 垂直方向の中央寄せ */
    left: 50%;
    /* 水平方向の中央寄せ */
    transform: translate(-50%, -55%);
    /* 中央に配置 */
    font-size: clamp(2.5rem, 8vw, 12.6rem);
    /* 背景テキストのフォントサイズ */
    color: #f4f6f8;
    /* 背景テキストの色（透明度含む） */
    z-index: 0;
    /* 背景として配置 */
    white-space: nowrap;
    /* テキストの折り返し防止 */
    letter-spacing: normal;
}

.sus_title05 {
    position: relative;
    display: flex;
    /* フレックスボックスを有効化 */
    justify-content: center;
    /* 水平方向の中央寄せ */
    align-items: center;
    /* 垂直方向の中央寄せ */
    font-size: 30px;
    /* 通常テキスト用のフォントサイズ */
    color: #000;
    /* 通常テキストの色 */
    letter-spacing: 0.15em;
}

.sus_title05::after {
    content: 'LEGAL DISCLOSURES';
    position: absolute;
    top: 50%;
    font-family: "Roboto Condensed", sans-serif;
    /* 垂直方向の中央寄せ */
    left: 50%;
    /* 水平方向の中央寄せ */
    transform: translate(-50%, -55%);
    /* 中央に配置 */
    font-size: clamp(3.5rem, 10vw, 14.6rem);
    /* 背景テキストのフォントサイズ */
    color: #fff;
    /* 背景テキストの色（透明度含む） */
    z-index: 0;
    /* 背景として配置 */
    white-space: nowrap;
    /* テキストの折り返し防止 */
    letter-spacing: normal;
}

.sus_title06 {
    position: relative;
    display: flex;
    /* フレックスボックスを有効化 */
    justify-content: center;
    /* 水平方向の中央寄せ */
    align-items: center;
    /* 垂直方向の中央寄せ */
    font-size: 30px;
    /* 通常テキスト用のフォントサイズ */
    color: #000;
    /* 通常テキストの色 */
    letter-spacing: 0.15em;
}

.sus_title06::after {
    content: 'FUTURE OUTLOOK';
    position: absolute;
    top: 50%;
    font-family: "Roboto Condensed", sans-serif;
    /* 垂直方向の中央寄せ */
    left: 50%;
    /* 水平方向の中央寄せ */
    transform: translate(-50%, -55%);
    /* 中央に配置 */
    font-size: clamp(4.5rem, 10vw, 14.6rem);
    /* 背景テキストのフォントサイズ */
    color: #f4f6f8;
    /* 背景テキストの色（透明度含む） */
    z-index: 0;
    /* 背景として配置 */
    white-space: nowrap;
    /* テキストの折り返し防止 */
    letter-spacing: normal;
}


.sus_title_line {
    background-image: linear-gradient(to right, #00469B, #3382ED);
    min-width: 110px;
    text-align: center;
    /* 線の色 */
    background-size: 110px 8px;
    /* 幅(100%=文字の長さ) | 高さ(線の太さ) */
    background-position: bottom;
    /* 下に配置 */
    background-repeat: no-repeat;
    /* 背景を繰り返さない */
    padding-bottom: 21px;
    /* オフセット */
    z-index: 1;
}

@media screen and (max-width: 767px) {

    .sus_title01,
    .sus_title02,
    .sus_title03,
    .sus_title04,
    .sus_title05,
    .sus_title06,
    .sus_title07 {
        font-size: 22px;
    }



    .sus_title_line {
        background-size: 80px 6px;
        /* 幅(100%=文字の長さ) | 高さ(線の太さ) */
        padding-bottom: 12px;
    }
}

/*********************title************************************/
.sus_box_title {
    font-size: 2.5rem;
    letter-spacing: 0.15em;
    color: #00469b;
    text-align: center;
    width: 100%;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.sus_box_title::before {
    border-top: 1px solid #00469b;
    margin-right: 15px;
    content: "";
    width: 100%;
}

.sus_box_title::after {
    border-top: 1px solid #00469b;
    margin-left: 15px;
    content: "";
    width: 100%;
}

.sus_list li {
    font-size: 1.6rem;
}

.sus_list li:not(:last-child) {
    margin-bottom: 5px;
}

.sus_list li::before {

    background-color: #3382ed;
    content: "";
    display: inline-block;
    height: 17px;
    margin-right: 7px;
    vertical-align: middle;
    width: 4px;
    margin-bottom: 3px;
}

.sus_list dl {
    font-size: 1.6rem;
    font-weight: bold;
}

.sus_list dd {
    font-size: 1.6rem;
    font-weight: 400;
}



.sus_list dt::before {
    background-color: #3382ed;
    content: "";
    display: inline-block;
    height: 17px;
    margin-right: 7px;
    vertical-align: middle;
    width: 4px;
    margin-bottom: 3px;
}


@media screen and (max-width: 767px) {

    .sus_box_title {
        font-size: 2rem;
        color: #00469b;
        text-align: center;
        display: block;
        border-bottom: solid 1px #00469b;
        padding-bottom: 14px;
        line-height: 1.4;
    }

    .sus_box_title::before {
        display: none;
    }

    .sus_box_title::after {
        display: none;
    }

    .sus_box_wrap_sp {
        white-space: normal;
    }

}

/*********************************************************/

.sus_wrapper {
    width: 100%;
    margin: 0 auto;
    padding-top: 11rem;
    padding-bottom: 8.6rem;

}

.sus_content {
    padding: 0 20px;
    margin: 0 auto;
    max-width: 1020px;
    width: 100%;
}

#sus01 h4 {
    font-size: 4.1rem;
    letter-spacing: 0.15em;
    line-height: 1.36;
    margin-top: 90px;
    margin-bottom: 30px;
    text-align: center;

}

.sus01_pg {
    width: 100%;
    max-width: 730px;
    margin: 0 auto 25px;

}

.sus01_pg p {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.75;
    text-align: justify;
}

.sus01_pg p:not(:nth-of-type(4)) {
    margin-bottom: 3rem;
}

.sus01_pg p:nth-of-type(4) {
    margin-bottom: 1rem;
}

.sus_name {
    text-align: right;
    font-weight: bold;
    font-size: 1.6rem;
    letter-spacing: 0.1em;
}

.sus_name span {
    font-size: 2.3rem;
}



@media screen and (max-width:1028px) {

    .sus_wrapper {

        padding-top: 6.3rem;
        padding-bottom: 6rem;

    }

    .sus01_pg {
        margin: 0 auto;
    }
}

@media screen and (max-width:767px) {

    #sus01 h4 {
        font-size: 2.5rem;
        letter-spacing: 0.15em;
        line-height: 1.36;
        margin-top: 47px;
        margin-bottom: 15px;
        text-align: left;
        white-space: nowrap;
    }

    .sus01_pg p {
        font-size: 1.5rem;
        line-height: 1.75;
        text-align: justify;
    }

    .sus01_pg p:not(:nth-of-type(4)) {
        margin-bottom: 2.2rem;
    }

    .sus01_pg p:nth-of-type(4) {
        margin-bottom: .7rem;
    }

    .sus_name {
        font-size: 1.3rem;
        letter-spacing: 0.1em;
    }

    .sus_name span {
        font-size: 1.8rem;
    }

}

@media screen and (max-width:430px) {

    #sus01 h4 {
        font-size: 2.2rem;
    }
}



.sus_intro {
    margin-top: 30px;
    font-size: 2rem;
    line-height: 1.8;
    text-align: justify;
    position: relative;
    z-index: 1;
}

.sus02_box {
    margin-top: 70px;
    background: #e6f3ff;

}

.sus02_box:not(:last-child) {
    margin-bottom: 50px;

}

.sus02_box_container {
    max-width: 820px;
    width: 100%;
    margin: 0 auto;
    padding: 35px 20px 50px;
}



.sus02_box_pg {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.75;
    text-align: justify;
    margin-top: 20px;
}

.sus02_list {
    margin-top: 2.5rem;
}

.sus02_card {
    background: #fff;
    margin-bottom: 17px;
    display: flex;
    align-items: center;
}

.sus02_balloon02 {
    width: 115px;
    margin: 0 auto;
}

.sus02_card .sus02_pg {
    max-width: 600px;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    padding-right: 20px;
}

.sus02_card .sus02_pg .sus02_p {
    text-align: justify;
}

.sus02_card .balloon02 {
    margin-left: 30px;
}

.sus02_pg {
    margin-left: 30px;
}

.sus02_h {
    color: #3382ed;
    font-size: 2rem;
    font-weight: bold;
}

.sus02_p {
    color: #000;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.75;
}

.sdgs_img {
    width: 100%;
    max-width: 780px;
    display: flex;
    flex-wrap: wrap;
    row-gap: 17px;
    justify-content: space-between;
}

.sdgs_img img {
    max-width: 140px;
    width: 100%;
}



.sus02_card02 {
    background: #fff;
    padding-right: 30px;
    padding-left: 30px;
    padding-bottom: 30px;
}

.sus02_card02:not(:last-child) {
    margin-bottom: 30px;
}

.sus02_card02 .sus02_p {
    padding-bottom: 25px;
    border-bottom: 1px solid #000;
    text-align: justify;
}

.sus02_card02_hbox {
    display: flex;
    align-items: center;
    margin-top: -0.5rem;
    margin-bottom: -1.8rem;
}

.sus02_card02_hbox .sus02_h {
    margin-left: 30px;
}

.sus02_card02_content {
    margin-top: 30px;
    display: flex;
}

.sus02_card02_contentpg {
    margin-left: 23px;
    margin-top: -.5rem;
}


.sus02_card02_h {
    font-size: 2rem;
    color: #00973b;
    font-weight: bold;
}

.sus02_card02_h02 {
    font-size: 2rem;
    color: #c60f28;
    font-weight: bold;
}

.sus02_card02_h03 {
    font-size: 2rem;
    color: #970b31;
    font-weight: bold;
}

.sus02_card02_h04 {
    font-size: 2rem;
    color: #dc007a;
    font-weight: bold;
}

.sus02_card02_h05 {
    font-size: 2rem;
    color: #c60f28;
    font-weight: bold;
}

.sus02_card02_h06 {
    font-size: 2rem;
    color: #fabd00;
    font-weight: bold;
}

.sus02_card02_h07 {
    font-size: 2rem;
    color: #f5a200;
    font-weight: bold;
}

.sus02_card02_h08 {
    font-size: 2rem;
    color: #d39200;
    font-weight: bold;
}

.sus02_card02_h09 {
    font-size: 2rem;
    color: #427935;
    font-weight: bold;
}

.sus02_card02_h10 {
    font-size: 2rem;
    color: #28a838;
    font-weight: bold;
}

.sus02_card02_h11 {
    font-size: 2rem;
    color: #ed6a02;
    font-weight: bold;
}

.sus02_card02_h12 {
    font-size: 2rem;
    color: #003067;
    font-weight: bold;
}

.sus02_card02_p {
    font-size: 1.6rem;
    color: #000;
    font-weight: 400;
    text-align: justify
}

.sus02_card03_card {
    background: #fff;
    padding: 30px 25px 0 25px;

}

.sus02_card03_h {
    font-size: 2rem;
    font-weight: bold;
    color: #3382ed;
    margin-bottom: 5px;
}

.sus02_card03_card > div:not(:first-child) {
    margin-top: 25px;
}

.sus02_card03_p {
    font-size: 1.6rem;
    font-weight: 400;
    color: #000;
    padding-bottom: 25px;
    text-align: justify;
}

.sus02_card03_content:not(:last-child) {
    border-bottom: 1px #d3d3d3 solid;
}

.sus02_card03_content dl {
    font-size: 1.6rem;
    padding-bottom: 30px;
}

.sus02_card03_content dl dt {
    font-weight: bold;
}

.sus02_card03_content dl dd {
    font-weight: 400;
    line-height: 1.75;
}

.sus02_card03_content dl dd:not(:last-child) {
    margin-bottom: 25px;
}

@media screen and (max-width:767px) {

    .sdgs_pc {

        display: none;

    }

    .sus02_box_container {
        padding: 20px 20px 50px;
    }

    .sus_intro {
        margin-top: 20px;
        font-size: 1.6rem;
        line-height: 1.8;
        text-align: justify;
    }

    .sus02_box {
        margin-top: 18px;

    }

    .sus02_card {
        display: block;
        background: none;

    }

    .sus02_pg {
        background: #fff;
        /*        text-align: center;*/
        margin: 0;
        padding: 0 5px;
    }

    .sus02_card .sus02_pg {
        max-width: initial;
        margin-top: 1.5rem;
        margin-bottom: 1.5rem;
        padding-left: 20px;
    }

    .sus02_h {
        padding-top: 18px;
        margin-bottom: 12px;
    }

    .sus02_p {
        font-size: 1.5rem;
        padding-bottom: 22px;
    }

    #sus02 .balloon02 {
        margin: 0 auto 26px;
        display: block;
    }

    #sus02 .balloon02:before {
        left: 60%;
        bottom: -24%;
        transform: rotate(0deg);
    }

    .sus02_card02_hbox {
        display: block;
        margin-top: -0.5rem;
        margin-bottom: 2.6rem;
    }

    .sus02_card02 {
        background: none;
        padding-left: 0;
        padding-right: 0;
    }

    .sus02_h {
        text-align: center;
    }

    .sus02_card02_sp {
        background: #fff;
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 30px;
    }

    .sus02_h {
        font-size: 1.8rem;
        line-height: 1.4
    }



    .sus02_card02_content {
        align-items: center;
        margin-top: 18px;
    }

    .sus02_card02_content img {
        max-width: 70px;
        width: 100%;
    }

    .sus02_card02_h,
    .sus02_card02_h02,
    .sus02_card02_h03,
    .sus02_card02_h04,
    .sus02_card02_h05,
    .sus02_card02_h06,
    .sus02_card02_h07,
    .sus02_card02_h08,
    .sus02_card02_h09,
    .sus02_card02_h10,
    .sus02_card02_h11,
    .sus02_card02_h12 {
        line-height: 1.4
    }

    .sus02_card02_h12 {
        font-size: 1.9rem;
    }

    .sus02_card02_p {
        margin-top: 7px;
        font-size: 1.5rem;

    }

    .sus02_card02 .sus02_p {
        padding-bottom: 15px;
    }

    .sus02_card03_h {
        font-size: 1.8rem;
    }

    .sus02_card03_p {
        font-size: 1.5rem;
    }

    .sus02_card03_content dl {
        font-size: 1.5rem;
    }

    .sus_list dd {
        font-size: 1.5rem;
    }
}

.sus03_box {
    background: #fff;
    max-width: 980px;
    width: 100%;
    padding: 35px 100px 50px;
    margin-top: 45px;
}

.sus03_content {
    display: flex;
    margin-top: 22px;
    justify-content: space-between;
    margin-bottom: 50px;
    gap: 10px;
}

#sus03 .sus_list {
    white-space: nowrap;
}

.sus03_content li {
    font-size: 1.6rem;
    font-weight: bold;
}

.sus03_card_h {
    font-size: 2rem;
    font-weight: bold;
    color: #3382ed;
    margin-bottom: 5px;
}

.sus03_card02 {
    font-size: 1.6rem;
    font-weight: 400;
    display: flex;
    margin-top: 24px;
    gap: 10px;
    justify-content: space-between;
}

.sus03_card02_pg {
    max-width: 360px;
    width: 100%;
    text-align: justify;
}

.sus03_card02_img {
    max-width: 390px;
    width: 100%;
    margin-top: 0.5rem;
}

@media screen and (max-width:1028px) {
    .sus03_box {
        padding: 35px 50px 50px;
    }

    .sus03_card02_pg {
        max-width: 470px;
        width: 100%;
    }
}

@media screen and (max-width:767px) {
    .sus03_box {
        max-width: 980px;
        width: 100%;
        padding: 18px 20px 30px;
        margin-top: 18px;
    }

    .sus03_content {
        display: block;
        margin-top: 22px;
        justify-content: space-between;
        margin-bottom: 50px;
    }

    .sus03_content_01 {
        margin: 0 auto 12px;
    }


    .sus03_img {
        text-align: center;
    }

    .sus03_card02 {

        display: block;
    }

    .sus03_card02 img {
        margin-top: 22px;
    }

    .sus03_card02_pg {
        max-width: initial;
        width: 100%;
    }

    .sus03_card02_img {
        margin: 0 auto;
    }
}

.sus04_box {
    margin-top: 50px;
    padding: 38px 95px 94px;
    background: #f4f6f8
}

.sus04_box ul {
    margin-top: 20px;
}

.sus04_box_p {
    font-size: 1.6rem;
    font-weight: 400;
    margin-top: 20px;
    text-align: justify;
}

.sus04_card {
    margin-bottom: 70px;
}

.sus04_box_pg {
    margin-bottom: 53px;
    margin-top: 30px;
}

.sus04_box_h {
    color: #3382ed;
    font-size: 2rem;
}

.sus04_box_p02 {
    font-size: 1.6rem;
    font-weight: 400;
    margin-top: 5px;
    text-align: justify;
}


@media screen and (max-width:767px) {
    .sus04_box {
        max-width: 980px;
        width: 100%;
        padding: 18px 20px 30px;
        margin-top: 18px;
    }

    .sus04_card {
        margin-bottom: 30px;
    }

    #sus04 .sus_list li {
        line-height: 1.3
    }

    .sus_list li:not(:last-child) {
        margin-bottom: 8px;
    }
}

.sus05_box {
    background: #fff;
    margin: 55px auto 0;
    width: 100%;
    padding: 0 20px;
}

.sus05_content {
    padding-top: 37px;
    padding-bottom: 54px;
    max-width: 780px;
    width: 100%;
    margin: 0 auto;
}

.sus_list_flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 26px;
    padding-right: 3.5px;
    gap: 10px;
}

.sus_list_flex:not(:last-child) {
    border-bottom: 1px solid #d3d3d3;

    padding-bottom: 23px;
}

.pdf_hover:hover {
    opacity: 0.5;
    transition: 0.2s ease-out;
}


.sus06_pg {
    text-align: justify;
    position: relative;
    z-index: 1;
}

.sus06_pg:nth-child(2) {
    margin-top: 32px;
}

.sus06_pg:not(:last-child) {
    margin-bottom: 40px;
}

.sus_list_content dd {
    text-align: justify;
}

@media screen and (max-width:767px) {
    .sus04_box {
        max-width: 980px;
        width: 100%;
        padding: 18px 20px 30px;
        margin-top: 18px;
    }

    .sus_list_content {}

    .sus_list_content dt {
        line-height: 1.3;

        margin-bottom: .5em
    }

    .sus06_pg:not(:last-child) {
        margin-bottom: 20px;
    }
}