@charset "UTF-8";

/* **************************************************

サスティナビリティ用CSS
sustainability.css

***************************************************** */

table.u-left caption,
table.u-left th,
table.u-left td {text-align: left;}

.table-scroll {
margin: 20px 0;
}
.table-scroll {
overflow-x: auto;
}
@media screen and (min-width: 801px) {

}


/* sustainability Top page
------------------------------------------------------------------------------*/
.p-sustainability-row {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: 34px;
  gap: 10px;
}
.p-sustainability-col {
  width: 100%;
}
.p-sustainability-col a.p-card-category__link {
  width: 100%;
  height: 110px;
  background-color: #eee;
  border-radius: 10px;
}
.p-sustainability-col .p-card-category__heading {
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: auto;
  padding-left: 0;
  text-shadow: 0 0 4px rgba(255, 255, 255, 0.9);
}
.p-sustainability-col .p-card-category__heading::before {
  left: auto;
  right: 10px;
  margin-top: 2px;
  width: 10px;
  height: 16px;
  background: url(/images/common/com_ic_link_gray02.svg) no-repeat;
}
.p-sustainability-col .p-card-link--arrow-right .p-card-category__heading {
  padding-right: 30px;
}
.p-sustainability-col .p-card-link--arrow-right .p-card-category__heading::before {
  width: 10px;
  height: 16px;
  background: url(/images/common/com_ic_link_gray02.svg) no-repeat;
}
.p-sustainability-col .p-card-link--pdf .p-card-category__heading {
  padding-right: 40px;
}
.p-sustainability-col .p-card-link--pdf .p-card-category__heading::before {
  width: 20px;
  height: 24px;
  background: url(/images/common/com_ic_pdf01.svg) no-repeat;
}
.p-sustainability-col .p-card-link--newwin .p-card-category__heading {
  padding-right: 40px;
}
.p-sustainability-col .p-card-link--newwin .p-card-category__heading::before {
  width: 14px;
  height: 12px;
  background: url(/images/common/com_ic_blank05.svg) no-repeat;
}
.p-sustainability-col .p-card-category__heading span.note {
  font-size: 1.1rem;
  margin-top: 10px;
  font-weight: normal;
}
@media screen and (min-width: 801px) {
  .p-sustainability-col {
    width: calc((100% - 20px) / 3);
  }
  .p-sustainability-col a.p-card-category__link {
    height: 140px;
  }
}

/* .page-environment
------------------------------------------------------------------------------*/
.page-environment .title_container {
  display: flex;
  margin: 40px 0 20px;
  position: relative;
}
.page-environment .title_container::after {
  content: "";
  display: block;
  clear: both;
}
.page-environment .title_container .img {
  background-color: #fff;
  padding-left: 2.5vw;
  width: 24vw;
  position: absolute;
  top: -5px;
  right: 0;
}
.page-environment .title_container .text {
  flex: 1;
  margin-top: 17px;
}
.page-environment .title_container .category {
  font-size: 2.6rem;
  font-weight: bold;
}
.page-environment .title_container .c-heading-03 {
  border-bottom: none;
  margin: 24px 0 0;
  padding: 10px 0 5px 1.3rem;
}
.page-environment .title_container.reduce .c-heading-03 {
  border-top: 2px solid #1F3082;
}
.page-environment .title_container.reuse .c-heading-03 {
  border-top: 2px solid #688781;
}
.page-environment .title_container.recycle .c-heading-03 {
  border-top: 2px solid #9C7E4D;
}
.page-environment .title_container.reduce .category,
.page-environment .title_container.reduce .c-heading-03 {
  color: #1F3082;
}
.page-environment .title_container.reuse .category,
.page-environment .title_container.reuse .c-heading-03 {
  color: #688781;
}
.page-environment .title_container.recycle .category,
.page-environment .title_container.recycle .c-heading-03 {
  color: #9C7E4D;
}
.page-environment .title_container p {
  padding: 0 0 0 1.3rem;
  margin: 0;
}
@media screen and (min-width: 801px) {
  .page-environment .title_container .img {
    width: 192px;
    position: relative;
  }
}

.page-environment table caption span.u-right-f {
  display: inline-block;
  float: right;
}


/* page-diversity
------------------------------------------------------------------------------*/
.page-diversity table th {width:22%;}

/* xxx
------------------------------------------------------------------------------*/

/* xxx
------------------------------------------------------------------------------*/