/* *{border: 1px solid #000;} */
:root {
    --xxxxsmall: 50%;
    --xxxsmall: 67%;
    --xxsmall: 76%;
    --xsmall: 83%;
    --small: 90%;
    --regular: 100%;
    --large: 110%;
    --xlarge: 150%;
    --xxlarge: 180%;
    --xxxlarge: 200%;
    --xxxxlarge: 300%;
    
    --black: #333333;
    --white: #ffffff;
    --red: #ff0026;
    --red02: #b1000e;
    --red03: #7e000a;
    --gray: #b4b4b4;
    --gray02: #d2d2d2;
    --gray03: #a0a0a0;
    --light: #f2f2f2;
    --darkblue: #141928;
    --linktext: #cc0022;
    --youtubeModal: rgba(1,1,1,0.8);
    
    --env: #30a425;
    --env02: #dfeade;
    --scl: #409ad6;
    --scl02: #cce1ee;
    --gvn: #cea048;
    --gvn02: #e3d6bd;
    }
    
    .ex{
      background: var(--black);
      color: var(--white);
      padding: 2px 10px;
      border-radius: 4px;
    }
    
    .xsmall{font-size: var(--xsmall);}
    .small{font-size: var(--small);}
    .regular{font-size: var(--regular);}
    .large{font-size: var(--large);}
    .xlarge{font-size: var(--xlarge);}
    .xxlarge{font-size: var(--xxlarge);}
    .xxxlarge{font-size: var(--xxxlarge);}
  
    .color_env{color:var(--env);}
    .color_scl{color:var(--scl);}
    .color_gvn{color:var(--gvn);}
  
    .bg_red02{background: var(--red02); color: var(--white);}
  
    .mb0{margin-bottom:0px;}
    .mb10{margin-bottom:10px;}
    .mb20{margin-bottom:20px;}
    .mb30{margin-bottom:30px;}
    .mb40{margin-bottom:40px;}
    .mb50{margin-bottom:50px;}
    .mb60{margin-bottom:60px;}
    .mb70{margin-bottom:70px;}
    .mb80{margin-bottom:80px;}
    .mb90{margin-bottom:90px;}
    .mb100{margin-bottom:100px;}
    .mr5{margin-right:5px;}
  
    .mt10{margin-top:10px;}
    .on + .AdditionalNotesStyle3{
      margin-top:20px;
      display: block;
    }
  
  
  
    .w6{width: 6%;}
    .w10{width: 10%;}
    .w15{width: 15%;}
    .w20{width: 20%;}
    .w25{width: 25%;}
    .w29{width: 29%;}
    .w30{width: 30%;}
    .w35{width: 35%;}
    .w38{width: 38%;}
    .w40{width: 40%;}
    .w45{width: 45%;}
    .w48{width: 48%;}
    .w50{width: 50%;}
    .w60{width: 60%;}
    .w70{width: 70%;}
    .w75{width: 75%;}
    .w80{width: 80%;}
    .w90{width: 90%;}
    .w100{width: 100%;}
    
    .lh_2em{line-height: 2em;}
  
    .txt_c{text-align: center;}
    .img_550{width: 550px;}
    .img_brd{
    border:1px solid #ccc;
    }
    .mb20{margin-bottom:20px;}
    .f_box{
    display: flex;
    justify-content: space-between;
      flex-wrap: wrap;
  }
  .f_box.left{justify-content: left;}
    .f_box > div.w38{width: 38%;}
    .f_box > div.w60{width: 60%;}
    .Section{
    margin-bottom: 40px;
    }
    .HeadH1Title + .list_inline:not(.top .list_inline){
      margin-top:0;
    }
    .environment .BoxPatternA h2{
    background: var(--env);
    }
    .HeadH1Title {
    font-size: var(--xxxxlarge);
    font-weight: bold;
    padding-top: 50px;
      padding-bottom: 50px;
      line-height: 1.3em;
    }
    h2, .h2{
    background: none;
    font-size: var(--xxxlarge);
    margin: 0;
    margin-bottom: 40px;
    padding: 0 0 0 0;
    font-weight: bold;
    line-height: 100%;
    }
    h2.sustainability-title-3{
    font-size: var(--xxxlarge);
    
    }
    .text-widget h3{
    margin-bottom:60px;
    }
    h3.summary-title-3{
    font-size: var(--xxlarge);
    }
    .environment h3.summary-title-3{
    font-size: var(--xlarge);
    }
    h3.sustainability-title-6{
    font-size: var(--xxlarge);
    margin-bottom:20px;
    margin-top:40px;
    }
    h3.sustainability-title-7{
      font-size: var(--xxlarge);
      margin-bottom:20px;
      margin-top:40px;
      font-weight: bold;
      color: var(--black);
      position: relative;
      padding:0 20px;
    }
    h3.sustainability-title-7:not(.gri h3.sustainability-title-7)::before{
      content: "";
      border-left: 10px solid var(--gray03);
      height: 1em;
      display: inline-block;
      position: absolute;
      top: 5px;
      left: 0;
    }
    .gri h3.sustainability-title-7{
      padding-left: 0;
    }
  h3.sustainability-title-7::before{
      top:2px;
    }
    h4.summary-title-4{
    font-size: var(--large);
    }
    img{
    width: 100%;
    height: auto;
    }
    .img_cent {
      display: flex;
      justify-content: center;
      align-items: center;
  }
    p{margin-bottom:16px;}
    .HorizontalInnerLinks{
    padding: 40px 0;
    border-bottom:1px solid #333;
    margin-bottom:40px;
    }
    .sustainability-title-2 + p.TextStyle1{
    margin-bottom:40px;
    }
    .ImgOnlyStyle + .sustainability-title-2{
    margin-top:60px;
    }
    .box_01{
    border:1px solid #333;
    padding: 20px 20px 0 20px;
    margin-bottom:20px;
    }
    ul.abc{
      margin: 5px 0 0;
      padding-left: 1.8em;
      font-size: 100%;
    }
    ul.abc li{
      margin: 0 0 5px;
      line-height:1.5em;
      list-style-type: lower-alpha;
    }
    ul.iii{
      margin: 5px 0 0;
      padding-left: 1.8em;
      font-size: 100%;
    }
    ul.iii li{
      margin: 0 0 5px;
      line-height:1.5em;
      list-style-type:lower-roman;
    }
    ul.sdgs{
    display: flex;
    margin-bottom:40px
    }
    ul.sdgs li{
    width: 50px;
    }
    ul.sdgs li img{
    width: 100%;
    }
    ul.sdgs li:not(:last-child){
    margin-right: 10px;
    }
    .f_box{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    }
    .f_box.col2 > div{
    width: 48%;
    }
    .button a, .more {
    padding: 10px 40px;
    border-radius: 50px;
    color:  var(--white);
    text-decoration: none;
    display: inline-block;
    transition: .3s;
    background: var(--red02);
    }
    p + .button a{
    margin-top:20px;
    }
    h2.h2_title{
    margin-top:60px;
    }
    .environment .BoxPatternA {
      border: 1px solid var(--env);
      background: unset;
  }
    /* 2022style */
    .sustainability-body {
    padding: 60px 0;
    }
    .learn-more {
    padding: 0 0 60px 0;
    }
    
    .learn-more.learn-more-presentation {
    padding-top: 0;
    }
    
    .learn-more h2 {
    position: relative;
    }
    
    .learn-more h2:before {
    content: "";
    height: 3px;
    width: 40px;
    position: absolute;
    right: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background-color: #E60027;
    top: 50%;
    }
    
    .learn-more ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    }
    
    .learn-more ul li {
    margin-top: 20px;
    margin-right: 60px;
    }
    .page-navigation .page-navigation-list li a {
    text-decoration: none;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: -0.1px;
    max-width: 175px;
    font-weight: bold;
    display: inline-block;
    position: relative;
    }
    .learn-more ul li a {
    font-weight: bold;
    display: block;
    color: #333333;
    position: relative;
    text-decoration: none;
    padding-left: 45px;
    -webkit-transition: all .4s;
    transition: all .4s;
    }
    
    .learn-more ul li a::before {
    position: absolute;
    content: '';
    background: url("/sustainability/assets/image/icon/arrow.svg");
    left: 0;
    height: 23px;
    width: 34px;
    -webkit-transition: all .4s;
    transition: all .4s;
    background-size: 100%  100%;
    }
    .learn-more ul li.active a::before {
      position: absolute;
      content: '';
      background: url("/sustainability/assets/image/icon/arrow_active.svg");
      left: 0;
      height: 23px;
      width: 34px;
      -webkit-transition: all .4s;
      transition: all .4s;
      background-size: 100%  100%;
      }
    .learn-more ul li a:hover {
    color: #E60027;
    text-decoration: underline;
    }
    
    .learn-more ul li a:hover::before {
    left: 5px;
    }
    
    @media (max-width: 767px) {
    .learn-more {
    padding: 0;
    }
    .learn-more h2 {
    font-size: 42px;
    font-weight: bold;
    line-height: 48px;
    margin-bottom: 0;
    }
    .learn-more h2:before {
    right: 0;
    -webkit-transform: none;
    transform: none;
    background-color: #E60027;
    top: auto;
    bottom: 5px;
    }
    .learn-more ul li {
    margin-top: 4px;
    margin-right: 20px;
    }
    }
  
    .socialLinks {
    padding: 60px 0;
    }
    .learn-more ul li a{
    font-weight: unset;
    display: block;
    color: #333333;
    position: relative;
    text-decoration: none;
    padding-left: 45px;
    -webkit-transition: all .4s;
    transition: all .4s;
    }
    .learn-more ul li a::before {
    position: absolute;
    content: '';
    background: url(/sustainability/assets/image/icon/arrow.svg);
    left: 0;
    height: 23px;
    width: 34px;
    -webkit-transition: all .4s;
    transition: all .4s;
    background-size: 100% 100%;
    }
    
    
    .banner-fixHeight{
    height:3 00px;
    }
    
    .page-navigation {
    margin-top: 0px;
    position: relative;
    z-index: 1;
    }
    
    .page-navigation:before {
    width: 100%;
    content: '';
    background-color: unset;
    position: relative;
    }
    .hero-banner .top-banner-content{
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    }
    .banner-fixHeight {
    min-height: initial;
    width: 100%;
    }
    .hero-banner {
    position: relative;
    overflow: hidden;
    background-size: cover;
    }
    .hero-banner::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.3);
    }
    
    
    .hero-banner .container{
    width: 1275px;
    position: relative;
    margin: 0 auto;
    display: flex;
    align-items: center;
    height: 100%;
    }
    .hero-banner h1 {
    max-width: 900px;
    color: #fff;
    font-size: var(--xxxxlarge);
    font-weight: bold;
    z-index: 74;
    position: relative;
    }
    .LinkListStyle1_2{
      margin: 20px 0 20px;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      font-size: 90%;
    }
    .LinkListStyle1_2 li{
      width: 60%;
      background: var(--light);
      margin-bottom: 10px;
      font-weight: bold;
      font-size: var(--large);
      transition: .5s;
      padding: 0;
      margin: 0;
      line-height: 140%;
    }
    .LinkListStyle1_2 li a{
      padding: 20px;
      display: block;
      background-position: 95% 50%;
      text-decoration: none;
      background-image: url(../../../image/jp/r1/icon/icon_new_window_hd.gif) !important;
      background-repeat: no-repeat;
      font-weight: bold;
      font-size: var(--regular);
      background-size: 16px 16px;
      -moz-background-size: 16px 16px;
      -webkit-background-size: 16px 16px;
      -o-background-size: 16px 16px;
      -ms-background-size: 16px 16px;
    }
    /* 
    ============================================================
    slick
    ============================================================ 
    */
    .slick-slider .slick-track, .slick-slider .slick-list{
    height: 100% !important;
    }
    .slide{
    width: 100%;
    height: 20vw;
    max-height: 360px;
    background: #ccc;
    }
    .slide_01, .slide_02, .slide_03, .slide_04, .slide_05, .slide_06{
    position: relative; 
    width: 100%;
    height: 100%;
    display: block;
    }
    .slide_01 a, .slide_02 a, .slide_03 a, .slide_04 a, .slide_05 a, .slide_06 a{
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    }
    .slide_txt{
    position: absolute;
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    padding-left: 2vw;
    color: #fff;
    text-shadow: 0px 0px 25px rgba(0,0,0,0.70);
    }
    .slide_txt h2{
    font-size: 4vw;
    line-height: 1.2em;
    font-weight: bold;
    margin-bottom:10px;
    }
    .slide_txt p{
    margin-bottom:20px;
    }
    .slick-dots{
    display: flex;
    justify-content: center;
    position: absolute;
    bottom:10px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    }
    
    .slick-dots li {
    position: relative;
    display: inline-block;
    height: 20px; 
    width: 20px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer; 
    }
    .slick-dots li button {
    border: 0;
    background:transparent; 
    display: block; 
    height: 20px; 
    width: 20px; 
    outline: none;
    line-height: 0px; 
    font-size: 0px; 
    color: transparent;
    padding: 5px;
    cursor: pointer; 
    }
    .slick-dots li button:hover, .slick-dots li button:focus {
    outline: none;
    }
    .slick-dots li button:hover:before, .slick-dots li button:focus:before {
    opacity: 1;
    }
    .slick-dots li button:before {
    position: absolute;
    top: 0;
    left: 0;
    content: "\2022";
    width: 20px;
    height: 20px;
    font-family: "slick";
    font-size: 50px;
    /* line-height: 20px; */
    text-align: center;
    color: black;
    opacity: 0.25;
    -webkit-font-smoothing: antialiased;
    -moz-osx-fontsmoothing: grayscale;
    }
    .slick-dots li
    .slick-active button:before {
    color: var(--black); 
    opacity: 0.75;
    }
    .slick-dots li.slick-active button::before{
    opacity: 1;
    }
    .slide_01 a:hover + div .more, .slide_02 a:hover + div .more, .slide_03 a:hover + div .more, .slide_04 a:hover + div .more, .slide_05 a:hover + div .more, .slide_06 a:hover + div .more{
    background:var(--red03);
    }
    .slide > div .more:hover{
    background: var(--red03);
    cursor: pointer;
    }
    
    
    
    /* 
    ============================================================
    message
    ============================================================ 
    */
    .message h2.sp{
      margin-left:0;
      line-height: 1.5em;
      font-size:var(--xxlarge);
    }
    .message .name {
      font-size: var(--xxlarge);
      line-height: 1.6;
      letter-spacing: 0.05em;
    }
    /* 
    ============================================================
    materiality
    ============================================================ 
    */
    /* .materiality .slide_01{background: url(/sustainability/materiality/image/resilience_bg.jpg) no-repeat center center/cover;}
    .materiality .slide_02{background: url(/sustainability/materiality/image/env_bg.jpg) no-repeat center center/cover;}
    .materiality .slide_03{background: url(/sustainability/materiality/image/safety_bg.jpg) no-repeat center center/cover;}
    .materiality .slide_04{background: url(/sustainability/materiality/image/happy_bg.jpg) no-repeat center center/cover;}
    .materiality .slide_05{background: url(/sustainability/materiality/image/sincerity_bg.jpg) no-repeat center center/cover;}
    .materiality .slide_06{background: url(/sustainability/materiality/image/dei_bg.jpg) no-repeat center top 10%/cover;} */
    
    .materiality .slick-dots{
    z-index: 99;
    bottom:-40px;
    }
    .sect_header{
    margin:60px 0 20px;
    min-height: 185px;
    position: relative
    }
    .sect_header h2{
    font-size: 3vw;
    font-weight: bold;
    margin-bottom:0px;
    line-height: 1.2em;
    background: unset !important;
    }
    .sect_header > div{
    display: inline-block;
    min-width: 30%;
    padding: 20px;
    background: #000;
    height: 100%;
    color: #fff;
    position: absolute;
    top:0;
    left:0;
    }
    /* .materiality_env .sect_header{
    background: url(/sustainability/materiality/image/env_bg.jpg) no-repeat bottom 20% right/70%;
    }
    .materiality_resilience .sect_header{
    background: url(/sustainability/materiality/image/resilience_bg.jpg) no-repeat bottom right/cover;
    }
    .materiality_safety .sect_header{
    background: url(/sustainability/materiality/image/safety_bg.jpg) no-repeat top 44% right/70%;
    }
    .materiality_happy .sect_header{
    background: url(/sustainability/materiality/image/happy_bg.jpg) no-repeat top 43% right/70%;
    }
    .materiality_sincerity .sect_header{
    background: url(/sustainability/materiality/image/sincerity_bg.jpg) no-repeat top 26% right/70%;
    }
    .materiality_dei .sect_header{
    background: url(/sustainability/materiality/image/dei_bg.jpg) no-repeat center right/50%;
    } */
    .materiality .slide_txt h2 {
    background: none ;
    }
    .materiality ul.sdgs{margin: 10px  0 0 0; flex-wrap: wrap;}
    .materiality ul.sdgs img{margin-bottom:10px;}
    .materiality table b{
      display: block;
    }
    .footerBner2{
    padding: 36px 0;
    background: #f1f1f1;
    position: relative;
    }
    .footerBner2 ul{
    display: flex;
    flex-wrap: wrap;
    max-width: 1305px;
    width: 100%;
    padding: 0 15px;
    margin: 0 auto;
    }
    .footerBner2 ul li{
    width: 300px;
    height: 130px;
    position: relative;
    }
    .footerBner2 ul li:not(last-child){
    margin-right:20px;
    }
    .footerBner2 ul li img{
    width: 100%;
    height: 130px !important;
    object-fit:cover ;
    }
    .footerBner2 ul li:last-child img{
    object-position: 50% 100%;
    }
    .footerBner2 ul li h3{
    position: absolute;
    bottom:0;
    left:0;
    width: 100%;
    font-size: 100%;
    line-height: 1;
    margin: 0;
    padding: 12px 30px;
    background: rgba(0, 0, 0, 0.8);
    }
    .footerBner2 ul li h3::after{
    content: "";
    position: absolute;
    top: 0;
    right: 20px;
    bottom: 0;
    margin: auto;
    width: 10px;
    height: 18px;
    background: url("/sustainability/assets/image/icon/footer-banner-icon.svg") center/cover no-repeat;
    }
    .footerBner2 ul li h3 span{
    display: inline-block;
    padding-left: 16px;
    border-left: 4px solid #fb0014;
    line-height: 140%;
    color: #fff;
    }
    .footerBner2 ul li a{
    transition: .5s;
    }
    .footerBner2 ul li a:hover{
    opacity: .3;
    }
    
    
  
    .collaborations .collaborations-slider .collaborations-item .collaborations-inner{
    min-height: 342px;
    }
    .collaborations .collaborations-slider .collaborations-image {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: flex;
    }
    
    
    
    
    .main_img{
    width: 100%;
    height: 20vw;
    max-height: 360px;
    object-fit: cover;
    }
    table {width:100%;}
    table td{
    padding-bottom:10px;
    }
    table .ListStyle1{
    margin:0;
    }
    table .ListStyle1 li:last-child{
    margin-bottom: 0;
    }
    td .LinkListStyle2{
      margin-bottom:0;
    }
    
    .environment table th.bg_th{
    background: var(--env02);
    font-weight: bold;
    color: #fff;
    border: solid 1px #fff;
    text-align: center;
    }
    .environment table th.bg_th_02{
    border: solid 1px #fff;
    font-weight: bold;
    color: var(--black);
    }
    .social table th.bg_th{
    background: var(--scl);
    color: #fff;
    font-weight: bold;
    border: solid 1px #fff;
    text-align: center;
    }
    .social table th.bg_th_02{
    background: var(--scl02);
    border: solid 1px #fff;
    font-weight: bold;
    color: var(--black);
    }
    .governance table th.bg_th{
    background: var(--gvn);
    font-weight: bold;
    color: #fff;
    border: solid 1px #fff;
    text-align: center;
    }
    .governance table th.bg_th_02{
    background: var(--gvn02);
    border: solid 1px #fff;
    font-weight: bold;
    color: var(--black);
    }
    
    
    
    .banner-fixHeight{
    height: 300px;
    }
    
    .page-navigation {
    margin-top: 0px;
    position: relative;
    z-index: 1;
    }
    
    .page-navigation:before {
    width: 100%;
    content: '';
    background-color: unset;
    position: relative;
    }
    .hero-banner .top-banner-content{
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    }
    ul.list_inline:not(.top .list_inline) {
    display: flex;
    flex-wrap: wrap;
    margin: 40px 0 0 0;
    position: relative;
    padding: 0 0 40px 0;
    /* border-bottom: 1px solid #000; */
    font-weight: bold;
    }
    .list_inline li{
    margin-right:2em;
    line-height: 2em;
    padding-left: 1.2em;
    background: url(/sustainability/assets/image/icon/arrow-down_2.svg) left 0px top 0.6em no-repeat;
    background-size: 15px auto;
    }
    .list_inline a{
    text-decoration: unset;
    color: #000;
    transition: .3s;
    }
    .list_inline a:hover{
    color: #b1000e;
    }
    .text-widget{
    padding: 0;
    }
    .text-widget h3{
    font-size: 130%;
    }
    .JS #Contents img.esg_img{
    
    height: 340px ;
    object-fit: cover;
    }
    .sustainability-title-2{
    padding: 20px;
    border-bottom: 1px solid #333333;
    position: relative;
    
    margin-top: 40px;
    }
    .sustainability-title-2::before{
    content: "";
    border-left: 10px solid #b1000e;
    height: 1em;
    display: inline-block;
    position: absolute;
    top: 18px;
    left: 0;
    }
    .sustainability-title-2 a{
    color:#fff;
    }
    .sustainability-title-4{
    border-bottom:1px solid #000;
    padding-bottom:20px;
    margin-bottom:20px;
    }
    h3.sustainability-title-5 {
    margin-bottom: 60px;
    margin-top: 40px;
    font-size: var(--xxlarge);
    color: #333;
    position: relative;
    }
    h3.sustainability-title-5:after{
    content: "";
    border-bottom: 3px solid #b1000e;
    width: 80px;
    position: absolute;
    bottom:-20px;
    left:0;
    }
    h2.esg_title{
    font-size: 180%;
    font-weight: bold;
    line-height: 32px;
    border-bottom: 2px solid #E60027;
    padding-bottom: 5px;
    margin-bottom: 20px;
    }
    h2.esg_title + ul{
    margin-bottom:40px;
    }
    h2.esg_title.lh_2em{line-height: 2.2em;}
    .sustainability2022 .pt_40{
    padding-top: 40px;
    }
    .button a:hover{
    background: #7e000a;
    }
    .news .news_list{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    }
    .news .news_list dt{
    width: 15%;
    padding: 5px 20px;
    background: #ededed;
    border-radius: 10px;
    justify-content: center;
    font-weight: bold;
    }
    .news .news_list dd{
    width: 80%;
    }
    .news .news_list dt, .news .news_list dd{
    display: flex;
    align-items: center;
    margin-bottom:10px;
    }
    .news .news_list .LinkListStyle1{
    margin:0;
    }
    
    
    
    .ClearFix + .ResponsiveTableStyle1{
    margin: 20px 0 0 0;
    }
    .ClearFix + .ResponsiveTableStyle1 > .DataTableStyle1{
    margin:0;
    }
    /* 
    =============================================================================
    DOWNLOAD
    ============================================================================= 
    */
  
    .downloadpage table th, .downloadpage table td{
      border: none;
    }
    .downloadpage .title{
      font-weight: bold;
    }
    .downloadpage .child-row, .downloadpage .parent-row{
      border-bottom:1px solid #333;
    }
    .report_section{
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      margin-top:40px;
      margin-bottom:60px;
      background: var(--light);
      padding: 40px;
      box-sizing: border-box;
    }
    .report_section > div:first-child{
      width: 48%;
    }
    .report_section > div h5{
      font-weight: bold;
      margin-bottom: 20px;
      font-size: var(--xlarge);
    }
    .report_section > div:last-child{
      width: 48%;
    }
    .report_section .ButtonStyle1 a {
      min-width: 340px;
  }
    .downloadpage .child{
      display: none;
      transition: .5s;
    }
    .downloadpage .title.on + ul .child{
      display: block;
    }
    .downloadpage .section{
      display: flex;
      justify-content: space-between;
      background: var(--light);
      margin: 0 0 20px 0;
      align-items: center;
      padding: 10px 20px;
    }
    .downloadpage .section p{
      font-weight: bold;
      margin:0;
    }
    .downloadpage .title .open{
      font-size: var(--xsmall);
      cursor: pointer;
      color: var(--red02);
      font-weight: normal;
      text-decoration: underline;
    }
    .downloadpage .section + ul{
      padding: 0 20px;
    }
    .downloadpage #anc02_1{
      margin-bottom:60px
    }
    .open::after, .open2::after {
      content: "";
      background-image: url(/image/jp/r1/icon/icon_link_bottom_hd.gif);
      display: inline-block;
      width: 15px;
      height: 15px;
      background-size: contain;
      vertical-align: middle;
  }
    .on .open::after, .on .open2::after {
      content: "";
      background-image: url(/image/jp/r1/icon/icon_link_top_hd.gif);
      display: inline-block;
      width: 15px;
      height: 15px;
      background-size: contain;
      vertical-align: middle;
  }
    
    .downloadpage .section .open:hover{
      text-decoration: underline;
    }
    .downloadpage .Pdf span, .downloadpage .Pdf span span{
      color:var(--black);
      margin-left: auto;  
    }
   
    .downloadpage .LinkListStyle1 li.Pdf,.downloadpage .LinkListStyle1 li.Download,.downloadpage .LinkListStyle1 li.link{
      padding: 10px 0;
    }
    .downloadpage .LinkListStyle1 li.Pdf:first-child, 
    .downloadpage .section.on + .LinkListStyle1 li.Pdf.child, 
    .downloadpage .section.on + .LinkListStyle1 li.Download.child,
    .downloadpage .report_body .LinkListStyle1 li.Pdf:not(.child),
     .downloadpage .report_body .on + .LinkListStyle1 li.Pdf.child,
    .downloadpage .report_body .LinkListStyle1 li.Download{
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
    }
    .downloadpage .Pdf + .Pdf, .downloadpage .Pdf+.Download, .downloadpage .link+.link {
      border-top:1px solid #dddddd;
    }
    .downloadpage .report_head{
      display: flex;
      background:var(--light);
      padding: 10px 20px;
    }
    .downloadpage .report_head p{
      margin:0;
    }
    .downloadpage .report_head p:nth-child(1){width: 40%;}
    .downloadpage .report_head p:nth-child(2){width: 40%;}
    .downloadpage .report_head p:nth-child(3){width: 20%;text-align: right;}
  .report_body > div{
    display: flex;
    flex-wrap: wrap;
    border-bottom:1px solid #000;
    padding: 0 20px;
  }
  .report_body .title{
    width: 40%;
    display: flex;
      justify-content: space-between;
      padding-right:20px;
      box-sizing: border-box;
      padding-top: 8px;
  }
  .report_body p{
    margin-bottom:0;
  }
  .report_body .LinkListStyle1{
    width: 60%;
    margin:0;
  }
  .report_body{
    margin-bottom:60px;
  }
  .container + .LinkListStyle1{
    margin: -40px 0 60px 0;
  }
  .news .learn-more{
    margin-top: 60px;
  }
    /* 
    ============================================================
    assessment
    ============================================================ 
    */
    .assessment h2{
      margin-top:60px;
    }
    .assessment .card_box h5{
      font-weight: bold;
      font-size: var(--large);
      min-height: 5em;
    }
    .assessment .card_box h5 span{
      font-size: var(--xxsmall);
      font-weight: normal;
      white-space: nowrap;
    }
    .assessment .card_box{
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      box-sizing: border-box;
      margin-bottom:40px;
    }
    .assessment .card:not(.assessment #anc01 .card){
      width: 23%;
      box-sizing: border-box;
      background-color: var(--light);
      min-height: 300px;
      padding: 20px;
      margin-bottom:20px;
    }
    .assessment #anc01 .card{
      width: 23%;
      box-sizing: border-box;
      margin-bottom:20px;
    }
    .assessment #anc01 .card .card_inn{
      background-color: var(--light);
      min-height: 366px;
      padding: 20px;
      box-sizing: border-box;
    }
    .assessment .card .card_img{
      margin-bottom:20px;
      background: var(--white);
      padding: 10px 0;
      box-sizing: border-box;
    }
    .assessment .card ul{margin-bottom:0;}
    .assessment .card p{
      margin:20px 0 0 0;
    }
    .assessment .card p.mb20{
      margin:20px 0;
    }
    .assessment .card.pc-tab{
      width: 23%;
      box-sizing: border-box;
      background-color: unset;
      box-shadow: none;
    }
    .assessment #anc03 .card:not(.assessment #anc01 .card){
      width: 48.5%;
    }
    .assessment #anc03 .card .card_inn{
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
    }
    .assessment #anc03 .card .card_inn > div{
      width: 48%;
    }
    .assessment #anc03 .card .card_inn > div p{
      margin:0;
    }
    .assessment #anc03 .card h5{
      min-height: unset;
      margin-bottom:20px;
    }
    .assessment .learn-more{
      margin-top:60px;
    }
    .assessment .hide{
      display: none;
    }
    .assessment .on + .hide{
      display: block;
    }
    .assessment .open{
      color: var(--red02);
      position: relative;
      padding: 0 17px 0 0;
      /* background-image: url(/image/jp/r1/icon/icon_link_bottom_hd.gif);
      background-repeat: no-repeat;
      background-position: right center;
      background-size: 16px 16px;
      -moz-background-size: 16px 16px;
      -webkit-background-size: 16px 16px;
      -o-background-size: 16px 16px;
      -ms-background-size: 16px 16px; */
      font-size: 100%;
      cursor: pointer;
    }
    .assessment .open:hover{
      text-decoration: underline;
    }
    /* .assessment .on .open{
      background-image: url(/image/jp/r1/icon/icon_link_top_hd.gif);
    } */
  /* 
    =============================================================================
    disclosure
    ============================================================================= 
    */
    .disclosure .Grid4 .LinkListStyle1:not(.ResponsiveTableStyle2 .LinkListStyle1), 
    .management .Grid4 .LinkListStyle1:not(.ResponsiveTableStyle2 .LinkListStyle1),
    .materiality .Grid4 .LinkListStyle1:not(.ResponsiveTableStyle2 .LinkListStyle1){
      margin:50px 0 100px;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
    }
    .materiality .Grid4 .LinkListStyle1:not(.ResponsiveTableStyle2 .LinkListStyle1){
      margin:-20px 0 20px 0;
    }
    .disclosure .Grid4 .LinkListStyle1 li:not(.ResponsiveTableStyle2 .LinkListStyle1 li), 
    .management .Grid4 .LinkListStyle1 li:not(.ResponsiveTableStyle2 .LinkListStyle1 li),
    .materiality .Grid4 .LinkListStyle1 li:not(.ResponsiveTableStyle2 .LinkListStyle1 li){
      width: 48%;
      background: var(--light);
      margin-bottom: 10px;
      font-weight: bold;
      font-size: var(--large);
      transition: .5s;
      padding: 0;
    }
    .disclosure .Grid4 .LinkListStyle1 li a:not(.ResponsiveTableStyle2 .LinkListStyle1 li a), 
    .management .Grid4 .LinkListStyle1 li a:not(.ResponsiveTableStyle2 .LinkListStyle1 li a),
    .materiality .Grid4 .LinkListStyle1 li a:not(.ResponsiveTableStyle2 .LinkListStyle1 li a){
      padding: 20px ;
      display: block;
      background-image: url(../../../image/jp/r1/icon/icon_new_window_hd.gif)no-repeat !important;
      background-position: 95% 50%;
    }
    .disclosure .Grid4 .LinkListStyle1 li a:not(.ResponsiveTableStyle2 .LinkListStyle1 li a):hover, 
    .management .Grid4 .LinkListStyle1 li a:not(.ResponsiveTableStyle2 .LinkListStyle1 li a):hover,
    .materiality .Grid4 .LinkListStyle1 li a:not(.ResponsiveTableStyle2 .LinkListStyle1 li a):hover{
      background-color: #f7f7f7;
    }
  
    .materiality .Grid4 .LinkListStyle1.ptrn2 li:not(.ResponsiveTableStyle2 .LinkListStyle1 li){
      width: auto;
      background: var(--light);
      margin-bottom: 10px;
      font-weight: normal;
      font-size: var(--regular);
      transition: .5s;
      padding: 0;
    }
  
    .materiality .Grid4 .LinkListStyle1.ptrn2 li a:not(.ResponsiveTableStyle2 .LinkListStyle1 li a){
      padding: 20px 40px 20px 20px;
      display: block;
      background-image: url(../../../image/jp/r1/icon/icon_new_window_hd.gif)no-repeat !important;
      background-position: 95% 50%;
    }
  
    .materiality .Grid4 .LinkListStyle1.ptrn2 li a:not(.ResponsiveTableStyle2 .LinkListStyle1 li a):hover{
      background-color: #f7f7f7;
    }
  /* 
    =============================================================================
    esg
    ============================================================================= 
    */
  .environment .LinkListStyle1 a,
  .social .LinkListStyle1 a,
  .governance .LinkListStyle1 a{
    font-size: 180%;
      line-height: 140%;
  }
  .environment .LinkListStyle1,
  .social .LinkListStyle1,
  .governance .LinkListStyle1
  {
    margin-top:30px;
  }
  .environment .LinkListStyle1 li a,
  .social .LinkListStyle1 li a,
  .governance .LinkListStyle1 li a
  {
    padding: 0px 37px 0 0;
  }
  .environment .LinkListStyle1 li a:link,
  .social .LinkListStyle1 li a:link,
  .governance .LinkListStyle1 li a:link
  {
    background-size: 30px 30px;
      -moz-background-size: 30px 30px;
      -webkit-background-size: 30px 30px;
      -o-background-size: 30px 30px;
      -ms-background-size: 30px 30px;
  }
  
  
  .read_2{
    border:1px solid var(--gray03);
    padding: 20px;
    margin-bottom:80px;
  }
  .read_2 h3{
    margin:0;
  }
  .environment .BoxPatternA h2{
    text-align: center;
  }
  /* 
  =============================================================================
  GRI
  ============================================================================= 
  */
  .griExplanation { margin-bottom: 30px; }
  .griExplanation dt {
  width: 100%;
  margin-bottom: 5px;
  font-size: 100%;
  }
  .griExplanation dd {
  display: inline-block;
  margin-right: 20px;
  font-size: 100%;
  }
  .gri #Contents table thead th{
  background: var(--red02);
  color: #fff;
  text-align: center;
  }
  .gri #Contents table tbody th{
  font-weight: bold;
  }
  .dropAllOC a{
  padding: 9px 22px 9px 15px;
  background-color: #e60027;
  color: #fff;
  text-decoration: none;
  border-right: solid 3px transparent;
  display: inline-block;
  min-width: 130px;
  min-height: 18px;
  margin: 0 0 15px;
  text-align: center;
  font-size: 83%;
  line-height: 130%;
  background-image: url(../../../image/jp/r1/icon/icon_link_right_l_white_hd.gif);
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 16px 16px;
  -moz-background-size: 16px 16px;
  -webkit-background-size: 16px 16px;
  -o-background-size: 16px 16px;
  -ms-background-size: 16px 16px;
  word-break: break-all;
  }
  .dropTitle {
  position: relative;
  }
  .dropTitle::before {
  content: "";
  background: url(/sustainability/assets/image/icon/plus.png) no-repeat center center;
  background-size: 20px;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  }
  .dropTitle.dropFlag::before{
    content: "";
  background: url(/sustainability/assets/image/icon/minus2.png) no-repeat center center;
  background-size: 20px;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  }
  .sustainability-title-2 + p.TextStyle1.mb40 {
    margin-bottom: 40px;
  }
  
  
    /* 
    =============================================================================
    PC迚医€應ｸ�
    ============================================================================= 
    */
    @media screen and (min-width: 1001px){
    .tab{display: none !important;}
    .sp{display: none !important;}
  
    .mb0_pc{margin-bottom:0px;}
    .mb10_pc{margin-bottom:10px;}
    .mb20_pc{margin-bottom:20px;}
    .mb30_pc{margin-bottom:30px;}
    .mb40_pc{margin-bottom:40px;}
    .mb50_pc{margin-bottom:50px;}
    .mb60_pc{margin-bottom:60px;}
    .mb70_pc{margin-bottom:70px;}
    .mb80_pc{margin-bottom:80px;}
    .mb90_pc{margin-bottom:90px;}
    .mb100_pc{margin-bottom:100px;}
    
    .w10_pc{width: 10%;}
    .w20_pc{width: 20%;}
    .w30_pc{width: 30%;}
    .w40_pc{width: 40%;}
    .w48_pc{width: 48%;}
    .w50_pc{width: 50%;}
    .w60_pc{width: 60%;}
    .w70_pc{width: 70%;}
    .w80_pc{width: 80%;}
    .w90_pc{width: 90%;}
    .w100_pc{width: 100%;}
    }
    
    /* 
    =============================================================================
    TAB縲弃C縲應ｸ�
    ============================================================================= 
    */
    @media screen and (min-width: 768px){
    .pc{display: block;}
    .sp{display: none !important;}
    }
    /* 
    =============================================================================
    TAB迚�
    ============================================================================= 
    */
    @media screen and (max-width: 1000px){
    /* common------------------------------------------------------------- */
    .pc-tab{display: none !important;}
    .tab{display: block;}
    /*  assessment  */
    
    .assessment .card:not(.assessment #anc01 .card), .assessment #anc01 .card{
      width: 48.5%;
    }
    .height_cont{height: 3.5em;}
    .assessment #anc03 .card:not(.assessment #anc01 .card){
      width: 100%;
    }
    }
    @media screen and (max-width: 1304px){
    .banner-fixHeight {
    margin: 0 -15px;
    box-sizing: border-box;
    width: 100vw;
    }
    .hero-banner .container{
    padding: 0 15px;
    }
    
    }
    @media screen and (max-width: 1023px){
    .sustainability2022-report .reports-table .table{
    display:block;
    }
    }
    /* 
    =============================================================================
    SP迚�
    ============================================================================= 
    */
    @media screen and (max-width: 767px){
    /* common------------------------------------------------------------- */
  
    .img_550{width: 100%;}
    .w100_sp{width: 100%;}
    .pc{display: none!important;}
    .sp{display: block;}
    .tab{display: none !important;}
    .f_box{display: block;}
    .f_box > div, .f_box.col2 > div{width: 100%;}
    h2.esg_title{
      padding-left:15px;
    }
    h2.esg_title.sp_mlr0 {
      padding-left: 0px;
      margin-left: 0;
      margin-right: 0;
  }
    .sustainability-body {
    padding: 20px 0;
    }
    .text-widget h3 {
    font-size: var(--regular);
    }
    .HeadH1Title {
    font-size: var(--xxxxlarge);
    padding-top: 20px;
    padding-bottom: 20px;
    line-height: 1.1em;
    }
    h3.sustainability-title-7{
      font-size: var(--xlarge);
    }
    .JS h2.sustainability-title-2{margin-left:0; margin-bottom:20px;font-size: var(--xxxlarge);}
    .slide, .main_img {height: 220px;margin-bottom: 20px;}
    .materiality .slide_txt h2{margin: 0 0px 5px;font-size: 190%;}
    .materiality  .learn-more h2:before{display: none;}
    .materiality  .learn-more h2{margin-bottom:20px;}
    .materiality  .learn-more h2 + ul, .materiality .learn-more ul{margin-top:20px;}
    .footerBner2{margin:0 -15px;}
    .footerBner2 ul li:not(last-child){margin:0 0 20px 0;}
    .footerBner2 ul{justify-content: center;}
    .news .news_list dt{width: unset;}
    .news .news_list dd{width: 100%;}
    .JS #Contents img.esg_img{width: 100%; margin-bottom:20px !important; height: auto; aspect-ratio: 5 / 2;object-position: 50% 50%;}
    .table_scroll{overflow-x:scroll;}
    .hero-banner {
    margin: 0 -15px;
    width: 100vw;
    }
    h2.summary-title-1{
    margin-left:0;
    }
    
    .hero-banner h1{
    margin-left:15px;
    line-height: 1.1em;
    }
    .banner-fixHeight{
    height:200px;
    }
    .news .news_list dd{
    margin-bottom:30px;
    }
    .learn-more ul li a::before, .learn-more ul li.active a::before {
    height: 24px;
    width: 14px;
    }
    .learn-more ul li a{
    padding-left: 19px;
    font-size: var(--xsmall);
    }.learn-more ul li a:hover::before {
    left: 3px;
    }
    ul.list_inline:not(.top .list_inline){
    margin: 20px 0;
    padding: 0 0 20px 0;
    }
    .learn-more ul li {
    margin-top: 2px;
    }
    .list_inline li{
    margin-right: 1em;
    line-height: 1.5em;
    padding-left: 1.2em;
    background: url(/sustainability/assets/image/icon/arrow-down_2.svg) left 0px top 0.4em no-repeat;
    background-size: 13px auto;
    font-size: var(--small);
    }
    .JS h2.sustainability-title-2{
    margin-left:0;
    margin-right:0;
    font-size: var(--xxxlarge);
    padding: 20px 0 10px 20px;
    }
    .sustainability-title-2 + p.TextStyle1{
    margin-bottom:20px;
    }
    h3.sustainability-title-6 {
    font-size: var(--xlarge);
    margin-bottom: 20px;
    }
    .ImgOnlyStyle + .sustainability-title-2, h2.h2_title {
    margin-top: 20px;
    }
    h2.h2_title, ul.sdgs{
    margin-bottom:20px
    }
    table {width:auto;}
    .Section {
    margin-bottom: 20px;
    }
    .f_box > div.w38, .f_box > div.w60{width: 100%;}
    .assessment .card:not(.assessment #anc01 .card), .assessment #anc01 .card, .assessment #anc01 .card .card_inn{
      width: 100%;
      min-height: unset;
    }
    .height_cont{height: unset;}
    
    .assessment .card,
    .assessment #anc03 .card .card_inn > div{
      width: 100%;
      min-height: unset;
    }
    .assessment .card_box h5 {
      min-height: unset;
      margin-bottom: 10px;
  }
  .assessment h2{
    margin:40px 0 10px 0;
  }
  .assessment .card img{
    width: 70%;
    display: block;
    margin: 0 auto 10px auto;
  }
  .assessment #anc03 .card ul{
    margin-bottom:10px;
  }
  .news .learn-more{
    margin-top: 20px;
  }
  .disclosure .Grid4 .LinkListStyle1 li:not(.ResponsiveTableStyle2 .LinkListStyle1 li), 
    .management .Grid4 .LinkListStyle1 li:not(.ResponsiveTableStyle2 .LinkListStyle1 li),
    .materiality .Grid4 .LinkListStyle1 li:not(.ResponsiveTableStyle2 .LinkListStyle1 li){
    width: 100%;
  }
  .report_section .ButtonStyle1 a {
    min-width: unset;
    width: 100%;
    box-sizing: border-box;
  }
  .report_section {
    margin-bottom: 40px;
    padding: 20px;
  }
  .report_body .title {
    justify-content: left;
  }
  .downloadpage .title .open{margin-left: 10px;}
    }
  
  
  
  
    @media screen and (max-width: 850px){
    /* 
    =============================================================================
    DOWNLOAD
    ============================================================================= 
    */
    .report_section{
      margin-bottom:40px;
    }
    .report_section > div:first-child{
      width: 100%;
      margin-bottom:40px;
    }
    .report_section > div:last-child,
    .report_body .title,
    .report_body .LinkListStyle1{
      width: 100%;
    }
    .report_body .title{
    padding: 10px 0 0;
    }
    .downloadpage .report_head{
      display: none;
    }
    .report_body > div{
      padding: 0 0px;
    }
    .downloadpage h2{
      padding-left: 15px;
      margin-bottom:20px;
    }
  .report_body .title {
      justify-content: left;
  }
    }