@charset "UTF-8";

/*
.sust_mid .sab_title_09{
    margin-top: 30px;
}

.sust_mid .inner{
    width: 900px;
    margin: 0 auto;
}

.sust_mid .table_17 th{
    width: 200px;
}

.sust_mid .table_17 tr:first-of-type th{
    text-align: center;
}

.sust_mid .pdf_link .link{
    color: #005bab;
}

.sust_mid .pdf_link .link:hover{
    color: #0089cc;
}


.sust_dis .sab_title_09{
    margin-top: 30px;
}

.sust_dis .inner{
    width: 900px;
    margin: 0 auto;
}

.sust_dis .inner p span{
    font-weight: 600;
    color: #005bab;
    font-size: 1.6rem;
}

.sust_dis .table_17 th{
    width: 200px;
}
*/
/*========================

インデックス

=========================*/
.sust_index #contents{
    margin-top: 0;
    width: 100%;
}
.sust_index .top_mv_01{
    background: url("../image/sust_00_01.gif") no-repeat 0 0/cover;
}

.sust_index .box_white {
    margin-bottom: 50px;
}
.sust_index .box_blue {
    margin-bottom: 50px;
    background-color: #E0EAF2;
}
.sust_index .inner {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
}

.sust_index .inner .flame {
    overflow: hidden;
    padding: 143px;
    margin-right: 50px;
    width: 500px;
    position: relative;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
    height: 289px;
}

.sust_index .inner .flame img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: auto;
    transition: transform 0.3s ease;
}

.sust_index .inner .flame img:hover {
    transform: translate(-50%, -50%) scale(1.2);
}
.sust_index .inner .flame_nolink {
    overflow: hidden;
    padding: 143px;
    margin-right: 50px;
    width: 500px;
    position: relative;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
    height: 289px;
}
.sust_index .inner .flame_nolink img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: auto;
    transform: translate(-50%, -50%);
    /*transition: transform 0.3s ease;*/
}
/*.sust_index .inner .flame_nolink img:hover {
    transform: translate(-50%, -50%) scale(1.2);

}*/

.sust_index .inner .txt {
    margin-top: auto;
    margin-bottom: auto;
    position: relative;
    flex: 1;
}

.sust_index .inner .txt h3 {
    margin-bottom: 0;
    display: inline;
}

.sust_index .inner .txt a {
    color: #005BAB;
    text-decoration: none;
    position: relative;
    display: inline-flex;
    align-items: center;
    content: '＞';
    margin-left: 5px;
    transition: margin-left 0.3s ease;
    font-size: inherit;
    font-style: normal;
    font-weight: bolder;
}

.sust_index .inner .txt a::after {
    content: '＞';
    margin-left: 5px;
    transition: margin-left 0.3s ease;
    font-size: inherit;
    color: #005BAB;
    position: relative;
    font-style: normal;
    font-weight: bolder;
}

.sust_index .inner .txt a:hover::after {
    margin-left: 10px;
}


.sust_index .inner .txt p {
    margin-bottom: 15px;

}
.sust_index .inner .link_besg  {
    display: flex;
    flex-wrap: wrap;
    margin: 20px;
    justify-content: space-between;
    text-align: center;
}
.sust_index .inner .link_besg li div {
    display: flex;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.sust_index .inner .link_besg li .E   {
    color: #FFFFFF;
    border-radius: 2px;
    background-color: #75BD45;
    font-variant: normal;
    font-weight: bolder;
    font-size: xx-large;
    margin-top: 10px;
    margin-right: 10px;
    margin-left: 10px;
    margin-bottom: 10px;
    width: 300px;
    text-align: center;
}
.sust_index .inner .link_besg li .S   {
    color: #FFFFFF;
    border-radius: 2px;
    font-variant: normal;
    font-weight: bolder;
    font-size: xx-large;
    background-color: #DFB5D3;
    margin: 10px;
    width: 300px;
    text-align: center;
}
.sust_index .inner .link_besg li .G   {
    color: #FFFFFF;
    border-radius: 2px;
    background-color: #2DA9C7;
    font-variant: normal;
    font-weight: bolder;
    font-size: xx-large;
    margin: 10px;
    width: 300px;
    text-align: center;
}
.inner .link_besg li a:hover  {
    transition: ease;
    layer-background-color: 0.3s;
    filter: brightness(70%);
}



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

トップコミットメント

=========================*/
.sust_cmt .inner  {
    margin-top: 0;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 50px;
    max-width: 1000px;
}
.sust_cmt .inner .box   {
    display: flex;
    width: 100%;
}
.sust_cmt .inner .box div  {
    text-align: center;
    display: flex;
    width: 500px;
}
.sust_cmt .inner .box div img {
    -o-object-fit: cover;
    display: flex;
    height: 70%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.sust_cmt .inner .box div p {
    text-align: left;
    font-size: medium;
    margin-right: auto;
    margin-left: 20px;
    margin-bottom: 20px;
    position: relative;
    width: 100%;

}
.sust_cmt .sust_name div {
    width: 100%;
    height: 80px;
}
.sust_cmt .sust_name p  {
    width: auto;
    float: right;
    text-align: center;
}
.sust_cmt .sust_name img  {
    width: auto;
    float: right;
    text-align: center;
}
/*========================

JMSのサステナビリティ経営

=========================*/
.sust_proc .inner  {
    margin: 0 auto;
    max-width: 1000px;
}
.sust_proc .inner h3 {
    margin-top: 50px;
}

.sust_proc .inner div  {
    margin: 20px auto;
}

.sust_proc .inner .policy  {
    padding-top: 25px;
    padding-right: 25px;
    padding-left: 25px;
    padding-bottom: 25px;
    width: 85%;
    margin-left: auto;
    margin-right: auto;
    background-color: #E0EAF2;
    font-size: 2em;
    font-weight: bold;
    -webkit-box-shadow: inset 0px 0px;
    box-shadow: inset 0px 0px;
    border: solid #ccc;
    text-align: left;

}
.sust_proc .inner .policy p  {
    -webkit-box-shadow: inset 0px 0px;
    box-shadow: inset 0px 0px;
    border: 93px solid #005BAB;

}
.sust_proc .inner .process  {
    margin: auto;
    text-align: center;
    position: relative;
    width: 80%;

}
.sust_proc .inner .process img  {
    text-align: center;
    position: relative;
    width: 100%;

}
.sust_proc .inner .pdf_link  {
    text-align: left;
}
.sust_proc .inner .pdf_link img {
    width: auto;
    text-align: justify;




}

.sust_proc .inner .contents  {
    width: 95%;
    margin-right: 0px;
}

.sust_proc .inner .contents .fig    {
    display: flex;
    margin-left: 0px;
}
.sust_proc .inner .contents .fig div img  {
    display: inline-block;
    width: 30%;
    margin-left: 0px;
    margin-right: 50px;
}
.sust_proc .inner .contents .fig div p {
    width: 60%;
    display: inline-block;
    text-align: left;
    margin-top: 20px;
    vertical-align: top;
    margin-right: 0px;
    margin-left: auto;
}
/*========================

マテリアリティの特定

=========================*/
.sust_mat .inner  {
    margin: 0 auto;
    max-width: 1000px;
}
.sust_mat .inner h3 {
    margin-top: 50px;
}

.sust_mat .inner div  {
    margin: 20px auto;
}
.sust_mat .inner .btn   {
    -webkit-box-shadow: 0px 0px;
    box-shadow: 0px 0px;
    text-align: center;
}
.sust_mat .inner .btn a {
    text-decoration: none; /* リンクの下線を削除 */
}

.sust_mat .inner .btn a h5 {
    text-align: left;
    color: #FFFFFF;
    background-color: #005BAB;
    margin-top: 20px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 0;
    padding-top: 20px;
    padding-left: 20px;
    padding-bottom: 20px;
    border-radius: 32px;
    display: inline-block;
    font-size: large;
    padding-right: 50px;
    position: relative; /* 相対位置指定 */
    transition: color 0.3s ease; /* テキストの色変更のトランジション */
}

.sust_mat .inner .btn a h5::after {
    content: '＞';
    margin-left: 5px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 20px;
    transition: right 0.3s ease, margin-left 0.3s ease;
}
.sust_mat .inner .btn a:hover h5 {
    background-color: #5BB2FF;
    transition: ease;
    layer-background-color: 0.3s;
}


.sust_mat .inner .btn a:hover h5::after {
    margin-left: 10px; /* ">"マークを少し右に移動 */
    right: 15px; /* 右端から少し離す */
}
/*.sust_mat .inner .btn a h5::after{
    content: '＞';
    margin-left: 5px;
    transition: margin-left 0.3s ease;
    font-size: inherit;
    position: relative;
    font-weight: bolder;
}
.sust_mat .inner .btn a h5:hover::after{
    content: '＞';
    margin-left: 10px;
    transition: margin-left 0.3s ease;
    font-size: inherit;
    color: #FFFFFF;
    position: relative;
    font-style: normal;
    font-weight: bolder;
}*/

.sust_mat .inner .materiality  {
    margin: auto;
    text-align: center;
    width: 100%;
}
.sust_mat .inner .materiality img  {
    margin: auto;
    text-align: center;
    width: 80%;

}
.sust_mat .inner .contents  {
    width: 95%;
    margin-right: 0px;
}
.sust_mat .inner .contents h4 {
    margin-top: 40px;

}