@charset "UTF-8";
/*===========================================
sustainability.css
===========================================*/
/*-----------------------
variable
-----------------------*/
@media screen and (max-width: 767px) {
  html.noScroll {
    overflow: hidden !important; }
    html.noScroll body {
      overflow: hidden !important; } }
/*-----------------------
Side Nav
-----------------------*/
#sidebar ul > li > ul > li {
  font-size: 1.3rem; }
  #sidebar ul > li > ul > li.active {
    background-color: #eff4fa; }
    #sidebar ul > li > ul > li.active a:hover {
      text-decoration: underline; }
  #sidebar ul > li > ul > li a {
    padding-left: 30px; }
    #sidebar ul > li > ul > li a:before {
      content: '-';
      display: inline-block;
      margin: 0 3px 0 -0.7rem; }
  #sidebar ul > li > ul > li > ul > li {
    font-size: 1.2rem;
    background-color: transparent; }
    #sidebar ul > li > ul > li > ul > li a {
      padding-left: 45px; }
      #sidebar ul > li > ul > li > ul > li a:before {
        content: "\2514";
        display: inline-block;
        margin: 0 3px 0 -1.6rem; }


/*-----------------------
General class
-----------------------*/
/* module custom */
.bPattern01 {
  margin: 20px 0;
  padding: 25px; }
  @media screen and (max-width: 767px) {
    .bPattern01 {
      padding: 15px; } }

.tPattern03 .topLine01 {
  border-top: #ccc 1px solid; }

ul.iconLink li {
  margin-bottom: 0; }
ul.iconLink li + li {
  margin-top: 5px; }
@media screen and (max-width: 767px) {
  ul.iconLink.notChange {
    border: none !important; } }

.insideLinks.-column li {
  display: block; }

.uAlphaList.-margin li + li {
  margin: 15px 15px 15px 24px; }
.uAlphaList .figureWrap {
  margin: 10px 0; }
.uAlphaList .note {
  padding: 10px 0 0; }
  .uAlphaList .note li {
    list-style-type: none;
    margin-left: 0; }

.lumpMix .lumpR span,
.lumpMix .lumpL span {
  padding: 10px 0 0 0;
  text-align: left; }

@media screen and (max-width: 767px) {
  .lumpMix.-order {
    display: flex;
    flex-direction: column; }
    .lumpMix.-order [data-order="1"] {
      order: 1;
      margin: 20px 0 0; }
    .lumpMix.-order [data-order="2"] {
      order: 2;
      margin: 20px 0 0; }
    .lumpMix.-order [data-order="3"] {
      order: 3;
      margin: 20px 0 0; }
    .lumpMix.-order [data-order="4"] {
      order: 4;
      margin: 20px 0 0; }
    .lumpMix.-order [data-order="5"] {
      order: 5;
      margin: 20px 0 0; }
    .lumpMix.-order [data-order="1"] {
      margin: 0; } }
@media screen and (min-width: 768px) {
  .lumpMix.-adjust4 {
    margin-bottom: 30px; }
    .lumpMix.-adjust4 .lumpR {
      margin: 0 140px; } }
@media screen and (max-width: 767px) {
  .lumpMix.-adjust4 {
    margin-bottom: 20px; }
    .lumpMix.-adjust4 .lumpR span {
      text-align: center; } }

[class*="imgColumn"] li span {
  font-size: 1.4rem; }
  @media screen and (max-width: 767px) {
    [class*="imgColumn"] li span {
      text-align: left; } }

.pressBlock {
  margin: 60px 0 0; }
  @media screen and (max-width: 767px) {
    .pressBlock {
      margin: 40px 0 0; } }

.deciList02.-type1 li {
  text-indent: -4.3rem;
  margin-left: 4.3rem; }
.deciList02.-type1 .figureWrap figcaption {
  padding-left: 4.3rem; }

.underline {
  text-decoration: underline; }

/* section */
section.separate {
  margin-top: 45px;
  border-top: #ddd 1px solid; }
  @media screen and (max-width: 767px) {
    section.separate {
      margin-top: 30px; } }

/* heading */
.susHeading1 {
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 1.4;
  margin: 30px 0 15px; }
  .susHeading1.-line {
    margin: 60px 0 15px;
    padding: 0 0 10px;
    border-bottom: #014099 2px solid; }
  .susHeading1 .sub {
    font-size: 1.8rem; }
  .susHeading1 .sublink {
    display: inline-block;
    position: relative;
    margin: 0 0 0 40px;
    padding-left: 15px;
    font-size: 1.4rem; }
    .susHeading1 .sublink:before {
      content: '';
      display: inline-block;
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      top: 0;
      margin: auto;
      width: 6px;
      height: 6px;
      border-top: #014099 2px solid;
      border-right: #014099 2px solid;
      transform: rotate(45deg);
      right: 5%;
      margin: auto 0; }
  .susHeading1 .note {
    display: inline-block;
    font-size: 1.4rem;
    font-weight: 300;
    float: right;
    padding: 10px 0 0; }
  h1 + .susHeading1 {
    margin-top: 0 !important; }
  @media screen and (max-width: 767px) {
    .susHeading1 {
      font-size: 1.8rem; }
      .susHeading1.-line {
        margin: 40px 0 15px; }
      .susHeading1 .sub {
        font-size: 1.4rem; }
      .susHeading1 .sublink {
        margin: 0;
        display: block; }
      .susHeading1 .note {
        font-size: 1.2;
        float: none;
        padding: 3px 0 0; } }

/* text */
.textEmphasis {
  margin: 0 0 30px;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.5;
  text-align: center; }
  h1 + .textEmphasis {
    margin-top: 0; }
  @media screen and (max-width: 767px) {
    .textEmphasis {
      margin: 0 0 20px;
      font-size: 1.6rem;
      text-align: left; }
      .textEmphasis br {
        display: none; } }

.note.-asterisk {
  margin: 20px 0 0; }
  .note.-asterisk li {
    margin: 0;
    list-style-type: none;
    padding-left: 2.7rem;
    text-indent: -2.7rem;
    font-size: 1.4rem; }
    .note.-asterisk li i {
      color: #ff3300;
      font-style: normal; }

/* list */
.lowerList {
  margin: 60px 0 0; }
  .report + .lowerList {
    margin: 20px 0 0; }
  .lowerList + .susHeading1 {
    margin: 60px 0 15px; }
  .lowerList * {
    box-sizing: border-box; }
  .lowerList h4 {
    font-size: 1.8rem;
    font-weight: 600;
    margin: 25px 0 15px; }
  .lowerList > ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    .lowerList > ul li {
      width: 49.2%;
      display: flex;
      align-items: center;
      background-color: #014099; }
      .lowerList > ul li:nth-of-type(n+3) {
        margin: 15px 0 0; }
      .lowerList > ul li a {
        position: relative;
        display: block;
        width: 100%;
        color: #fff;
        padding: 25px;
        font-size: 1.8rem;
        font-weight: bold;
        transition: all 0.3s cubic-bezier(0.17, 0.935, 0.305, 1); }
        .lowerList > ul li a.-small {
          font-size: 1.6rem; }
        .lowerList > ul li a:after {
          content: '';
          display: inline-block;
          position: absolute;
          left: 0;
          right: 0;
          bottom: 0;
          top: 0;
          margin: auto;
          width: 6px;
          height: 6px;
          border-top: #fff 2px solid;
          border-right: #fff 2px solid;
          transform: rotate(45deg);
          right: 5%;
          margin: auto 0;
          left: 93%; }
        .lowerList > ul li a:hover {
          opacity: .8;
          text-decoration: none; }
  @media screen and (max-width: 767px) {
    .lowerList {
      margin: 30px 0 0; }
      .lowerList + .susHeading1 {
        margin: 40px 0 15px; }
      .lowerList h4 {
        font-size: 1.6rem;
        margin: 20px 0 10px; }
      .lowerList > ul {
        flex-direction: column; }
        .lowerList > ul li {
          width: 100%;
          margin: 0; }
          .lowerList > ul li:nth-of-type(n+3) {
            margin: 0; }
          .lowerList > ul li:nth-of-type(n+2) {
            margin-top: 1px; }
          .lowerList > ul li a {
            padding: 10px 25px 10px 15px;
            font-size: 1.4rem;
            font-weight: 300; }
            .lowerList > ul li a.-small {
              font-size: 1.4rem; } }

/* button */
.btnLink {
  margin: 40px 0 0;
  text-align: center; }
  .btnLink a {
    position: relative;
    display: inline-block;
    padding: 20px 140px;
    background-color: #014099;
    font-weight: 600;
    color: #fff;
    transition: all .4s; }
  .btnLink a:hover {
    text-decoration: none;
    opacity: .7; }
  .btnLink a::before {
    content: '';
    display: inline-block;
    margin: 0 10px 3px 0;
    width: 8px;
    height: 8px;
    border-top: #fff 2px solid;
    border-right: #fff 2px solid;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    vertical-align: middle; }
  .btnLink.-mid {
    margin: 20px 0 0; }
    .btnLink.-mid a {
      padding: 15px 70px; }
  @media screen and (max-width: 767px) {
    .btnLink {
      margin: 20px 15% 0; }
      .btnLink a {
        display: block;
        padding: 15px 0;
        font-size: 1.4rem; }
      .btnLink.-mid {
        margin: 20px 0 0; }
        .btnLink.-mid a {
          padding: 15px; } }

.btnLink1 {
  position: relative;
  display: inline-block;
  padding: 5px 30px 5px 23px;
  background-color: #014099;
  color: #fff;
  font-size: 1.4rem;
  font-weight: 600;
  text-align: center; }
  .btnLink1:visited {
    color: #fff; }
  .btnLink1:hover {
    text-decoration: none;
    opacity: .7; }
  .btnLink1:before {
    content: '';
    display: inline-block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
    width: 6px;
    height: 6px;
    border-top: #fff 2px solid;
    border-right: #fff 2px solid;
    transform: rotate(45deg);
    right: 5%;
    margin: auto 0;
    position: relative;
    margin: 0 8px 0 0;
    top: -1px; }

/* img */
.figureWrap {
  margin: 30px 0;
  text-align: center;
  overflow: hidden; }
  .figureWrap figcaption {
    margin: 0 0 20px;
    text-align: left;
    font-weight: 600; }
    .figureWrap figcaption .supp {
      display: inline-block;
      float: right;
      font-size: 1.4rem; }
  .figureWrap img + figcaption {
    margin: 20px 0 0; }
  h2 + .figureWrap {
    margin-top: 0; }
  h3 + .figureWrap {
    margin-top: 0; }
  @media screen and (max-width: 767px) {
    .figureWrap {
      margin: 20px 0; }
      .figureWrap figcaption .supp {
        display: block;
        float: none;
        text-align: right; } }

.figCaption1 {
  margin: 30px 0 20px;
  font-weight: bold; }
  .headingActivity + .figCaption1 {
    margin-top: 0; }
  h2 + .figCaption1 {
    margin-top: 0; }

.figureColumn {
  display: flex;
  justify-content: space-between; }
  .figureColumn.-col2 > .figureWrap {
    width: calc((100% - 40px) / 2); }
  @media screen and (max-width: 767px) {
    .figureColumn.-col2 {
      flex-direction: column; }
      .figureColumn.-col2 > .figureWrap {
        width: 100%; }
        .figureColumn.-col2 > .figureWrap + .figureWrap {
          margin-top: 20px; } }

/* table */
.dataTable {
  overflow-x: scroll;
  padding-bottom: 10px; }
  .dataTable .tPattern03 th, .dataTable .tPattern03 td {
    vertical-align: middle; }
  .dataTable .tPattern03 thead th {
    background: #ccc;
    border-color: #fff;
    font-weight: bold;
    white-space: nowrap; }
  .dataTable .tPattern03 tbody th {
    white-space: nowrap;
    text-align: left; }
    .dataTable .tPattern03 tbody th[colspan].segment {
      background: #dedede; }
    .dataTable .tPattern03 tbody th[colspan] {
      font-weight: 600;
      background: #eaeaea; }
  .dataTable .tPattern03 tbody td .discList {
    white-space: nowrap;
    text-align: left; }
  .dataTable .tPattern03 .indent1 {
    padding-left: 40px; }
  .dataTable .tPattern03[data-label="all"] thead th[colspan], .dataTable .tPattern03[data-label="basicUnit"] thead th[colspan] {
    background: #666;
    color: #fff; }
  .dataTable .tPattern03[data-label="all"] thead tr > th:nth-of-type(5n), .dataTable .tPattern03[data-label="basicUnit"] thead tr > th:nth-of-type(5n) {
    background-color: #edf5dd; }
  .dataTable .tPattern03[data-label="all"] tbody tr > td:nth-of-type(5n-1), .dataTable .tPattern03[data-label="basicUnit"] tbody tr > td:nth-of-type(5n-1) {
    background-color: #edf5dd; }
  .dataTable::-webkit-scrollbar {
    height: 7px; }
  .dataTable::-webkit-scrollbar-track {
    margin: 0 2px;
    background: #ccc;
    border-radius: 5px; }
  .dataTable::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background: #666; }

@media screen and (max-width: 767px) {
  .smpVerticalTable,
  .smpVerticalTable caption,
  .smpVerticalTable tbody,
  .smpVerticalTable thead,
  .smpVerticalTable tr,
  .smpVerticalTable th,
  .smpVerticalTable td {
    display: block; }

  .smpVerticalTable th,
  .smpVerticalTable td {
    width: 100% !important; }

  .smpTableScroll {
    overflow-x: scroll;
    padding-bottom: 10px; }

  .smpTableScroll::-webkit-scrollbar {
    height: 7px; }

  .smpTableScroll::-webkit-scrollbar-track {
    margin: 0 2px;
    background: #ccc;
    border-radius: 5px; }

  .smpTableScroll::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background: #666; } }
/* box */
.activityReport {
  margin: 60px 0 0;
  padding: 30px 64px;
  background-color: #eff4fa; }
  .activityReport h3 {
    color: #014099;
    font-size: 2.4rem;
    font-weight: 600;
    margin: 0 0 25px;
    text-align: center; }
  .activityReport h4 {
    color: #014099;
    font-size: 1.8rem;
    font-weight: 600;
    margin: 25px 0 15px;
    text-align: center; }
  .activityReport ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    .activityReport ul li {
      width: 48%; }
      .activityReport ul li:nth-of-type(n+3) {
        margin-top: 10px; }
      .activityReport ul li a {
        position: relative;
        display: block;
        padding: 20px 25px;
        background-color: #fff;
        border: #fff 1px solid;
        transition: all 0.3s cubic-bezier(0.17, 0.935, 0.305, 1); }
        .activityReport ul li a:after {
          content: '';
          display: inline-block;
          position: absolute;
          left: 0;
          right: 0;
          bottom: 0;
          top: 0;
          margin: auto;
          width: 6px;
          height: 6px;
          border-top: #014099 2px solid;
          border-right: #014099 2px solid;
          transform: rotate(45deg);
          right: 5%;
          margin: auto 0;
          left: 93%; }
        .activityReport ul li a:hover {
          text-decoration: none;
          border-color: #014099; }
  @media screen and (max-width: 767px) {
    .activityReport {
      margin: 40px 0 0;
      padding: 20px; }
      .activityReport h3 {
        font-size: 1.8rem;
        margin: 0 0 10px; }
      .activityReport h4 {
        font-size: 1.6rem;
        margin: 20px 0 10px; }
      .activityReport ul {
        flex-direction: column; }
        .activityReport ul li {
          width: 100%;
          font-size: 1.4rem; }
          .activityReport ul li + li {
            margin: 5px 0 0; }
          .activityReport ul li:nth-of-type(n+3) {
            margin-top: 5px; }
          .activityReport ul li a {
            padding: 12px 25px 12px 12px; } }

.emphasisBox {
  margin: 30px 0;
  background-color: #eee;
  padding: 20px; }
  .emphasisBox dl {
    display: flex;
    justify-content: space-between;
    align-items: center; }
    .emphasisBox dl dt {
      font-weight: 600; }
    .emphasisBox dl dd {
      font-size: 2rem;
      font-weight: 600;
      line-height: 1.2;
      text-align: center; }
      .emphasisBox dl dd span {
        font-size: 1.3rem;
        font-weight: 300; }
  @media screen and (max-width: 767px) {
    .emphasisBox {
      padding: 20px 10px; }
      .emphasisBox dl {
        flex-direction: column; }
        .emphasisBox dl dt {
          font-size: 1.4rem; }
        .emphasisBox dl dd {
          margin: 15px 0 0;
          font-size: 1.8rem; } }

.bborder01 {
  margin: 30px 0;
  padding: 20px;
  border: 2px solid #eee; }
  .bborder01 .columnBlock {
    margin-bottom: 0; }
  .h3Type01 + .bborder01 {
    margin-top: 0; }

/* Grid */
@media screen and (max-width: 767px) {
  .lumpMix .sp100 + * {
    margin: 20px 0 0; } }
.lumpMix.-index .lumpL {
  margin: 0 30px 0 0; }
.lumpMix.-index .lumpEnd > h3 {
  color: #014099;
  font-size: 2rem;
  font-weight: 600; }
.lumpMix.-index .lumpEnd > .outline {
  display: flex;
  font-size: 1.4rem; }
  .lumpMix.-index .lumpEnd > .outline > .link {
    min-width: 170px;
    margin-left: 30px; }
    .lumpMix.-index .lumpEnd > .outline > .link a {
      display: inline-block; }
  .lumpMix.-index .lumpEnd > .outline + h3 {
    margin: 25px 0 0; }
@media screen and (max-width: 767px) {
  .lumpMix.-index .lumpEnd {
    margin: 15px 0 0; }
    .lumpMix.-index .lumpEnd > h3 {
      font-size: 1.8rem;
      margin: 0 0 5px; }
    .lumpMix.-index .lumpEnd > .outline {
      flex-direction: column; }
      .lumpMix.-index .lumpEnd > .outline > .link {
        min-width: 0;
        margin: 15px 0 0; } }
.lumpMix.-stance {
  margin: 35px 0; }
  .lumpMix.-stance .declaration {
    width: 50%;
    float: left;
    color: #014099;
    font-size: 2rem;
    font-weight: 600;
    line-height: 1.6;
    margin: 0 0 50px; }
  .lumpMix.-stance .degree {
    font-size: 1.4rem;
    line-height: 1.6; }
    .lumpMix.-stance .degree em {
      display: inline-block;
      padding: 5px 0 0;
      font-size: 1.8rem;
      font-weight: 600; }
  @media screen and (min-width: 768px) {
    .lumpMix.-stance .lumpR {
      margin: 0 0 0 60px; } }
  @media screen and (max-width: 767px) {
    .lumpMix.-stance {
      margin: 20px 0; }
      .lumpMix.-stance .declaration {
        float: none;
        width: 100%;
        font-size: 1.6rem;
        margin: 0 0 20px; } }

/*-----------------------
TOP
-----------------------*/
.topVision {
  display: flex;
  align-items: center;
  margin: 0 0 85px; }
  .topVision .slogan {
    width: 60%;
    font-size: 3.6rem;
    font-weight: 600;
    color: #014099;
    line-height: 1.5; }
  .topVision .link {
    width: 40%; }
    .topVision .link a {
      display: block;
      color: #fff; }
      .topVision .link a:hover {
        text-decoration: none;
        opacity: .7; }
      .topVision .link a img {
        display: block; }
      .topVision .link a p {
        position: relative;
        padding: 20px 10px;
        background-color: #014099;
        color: #fff;
        text-align: center; }
        .topVision .link a p:before {
          content: '';
          display: inline-block;
          position: absolute;
          left: 0;
          right: 0;
          bottom: 0;
          top: 0;
          margin: auto;
          width: 6px;
          height: 6px;
          border-top: #fff 2px solid;
          border-right: #fff 2px solid;
          transform: rotate(45deg);
          right: 5%;
          margin: auto 0;
          position: relative;
          top: -2px;
          left: 0;
          margin: 0 8px 0 0; }
  @media screen and (max-width: 767px) {
    .topVision {
      flex-direction: column;
      margin: 0 0 25px; }
      .topVision .slogan {
        width: 100%;
        font-size: 2.2rem;
        margin: 0 0 25px; }
      .topVision .link {
        width: 100%; }
        .topVision .link a p {
          padding: 10px; } }

.indexLineup {
  margin: 80px 0 0; }
  .indexLineup > section + section {
    margin: 80px 0 0; }
  .indexLineup h2 {
    font-size: 2.8rem;
    font-weight: 600;
    line-height: 1.4;
    margin: 0 0 25px; }
  .indexLineup .lumpMix > .lumpR,
  .indexLineup .lumpMix > .lumpL {
    margin-bottom: 0; }
  .indexLineup .btnLink {
    text-align: left; }
  .indexLineup .futureItem {
    display: flex;
    justify-content: space-between;
    margin: 0 0 30px; }
    .indexLineup .futureItem li {
      width: 230px; }
      .indexLineup .futureItem li span {
        display: block;
        margin-top: 13px;
        font-size: 1.8rem;
        font-weight: 600;
        line-height: 1.5; }
  @media screen and (max-width: 767px) {
    .indexLineup {
      margin: 50px 0 0; }
      .indexLineup > section + section {
        margin: 50px 0 0; }
      .indexLineup h2 {
        font-size: 2rem;
        margin: 0 0 10px; }
      .indexLineup .btnLink {
        margin: 20px 10% 0; }
        .indexLineup .btnLink a {
          text-align: center; }
      .indexLineup .futureItem {
        flex-direction: column; }
        .indexLineup .futureItem li {
          display: flex;
          align-items: center;
          width: 100%; }
          .indexLineup .futureItem li img {
            width: 33%;
            height: 100%; }
          .indexLineup .futureItem li span {
            display: block;
            margin-top: 0;
            padding: 10px;
            font-size: 1.5rem;
            text-align: left; }
        .indexLineup .futureItem li + li {
          margin-top: 10px; } }
  .indexLineup > .bg {
    background-color: #eff4fa;
    padding: 35px 50px; }
    .indexLineup > .bg + .bg {
      margin: 50px 0 0; }
    .indexLineup > .bg h2 {
      color: #014099;
      text-align: center; }
    @media screen and (max-width: 767px) {
      .indexLineup > .bg {
        margin: 50px -10px 0;
        padding: 30px 20px; }
        .indexLineup > .bg + .bg {
          margin: 30px -10px 0; } }

.gridBlock.-sus {
  display: flex;
  justify-content: space-between;
  margin: 40px 0 0; }
  .pickupBlock + .gridBlock.-sus {
    margin: 60px 0 0; }
  .gridBlock.-sus .listBox {
    background-color: #fff;
    float: none; }
  .gridBlock.-sus.cl3 .listBox {
    width: 32.4%; }
  .gridBlock.-sus.cl4 .listBox {
    width: 23.8%; }
  .gridBlock.-sus.cl4 .listBoxInner .listTitle {
    font-size: 1.6rem; }
  .gridBlock.-sus .listBoxInner {
    background-color: #fff;
    padding: 10px 15px; }
    .gridBlock.-sus .listBoxInner .listTitle {
      text-align: center; }
  .gridBlock.-sus .imgArea.-pict {
    display: flex;
    align-items: center;
    justify-content: center;
    border: #ddd 1px solid;
    padding: 15px 0;
    height: 70px; }
    .gridBlock.-sus .imgArea.-pict img {
      width: 108px;
      display: inline-block; }
    .gridBlock.-sus .imgArea.-pict.tcfd img {
      width: 230px;
      display: inline-block; }
    .gridBlock.-sus .imgArea.-pict.sasb img {
      width: 150px; }
  @media screen and (max-width: 767px) {
    .gridBlock.-sus {
      flex-direction: column;
      margin: 10px 0 0 !important; }
      .pickupBlock + .gridBlock.-sus {
        margin: 40px 0 0; }
      .gridBlock.-sus .listBox {
        padding: 10px 0 0; }
        .gridBlock.-sus .listBox:nth-of-type(1) {
          padding: 0; }
        .gridBlock.-sus .listBox.thumb .imgArea {
          width: 34.6%; }
      .gridBlock.-sus.cl3 .listBox {
        width: 100%; }
      .gridBlock.-sus.cl4 .listBox {
        width: 100%; }
      .gridBlock.-sus .listBoxInner {
        width: calc(100% - 34.6%); }
        .gridBlock.-sus .listBoxInner .listTitle {
          text-align: left; }
      .gridBlock.-sus .imgArea.-pict {
        padding: 10px 0;
        display: table-cell;
        height: 46px;
        vertical-align: middle; }
        .gridBlock.-sus .imgArea.-pict img {
          width: 60px; }
        .gridBlock.-sus .imgArea.-pict.tcfd img {
          width: 100px; }
        .gridBlock.-sus .imgArea.-pict.sasb img {
          width: 80px; } }

.categoryUI {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  margin: 0 0 60px; }
  @media screen and (max-width: 767px) {
    .categoryUI {
      flex-direction: column;
      margin: 0 0 25px; } }
  .categoryUI * {
    box-sizing: border-box; }
  .categoryUI ol {
    width: 530px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    .categoryUI ol li {
      width: 260px;
      height: 100px;
      margin: 0;
      list-style-type: none;
      margin: 10px 0 0; }
      .categoryUI ol li:nth-of-type(1), .categoryUI ol li:nth-of-type(2) {
        margin: 0; }
      .categoryUI ol li a {
        display: flex;
        flex-direction: column;
        justify-content: center;
        height: 100%;
        padding: 18px;
        border: #ddd 1px solid;
        color: #014099;
        font-size: 1.4rem;
        text-decoration: none;
        transition: all 0.3s cubic-bezier(0.17, 0.935, 0.305, 1); }
        .categoryUI ol li a span {
          color: #333;
          font-size: 1.6rem;
          line-height: 1.4; }
        .categoryUI ol li a i {
          display: inline-block; }
        .categoryUI ol li a:hover {
          border-color: #014099; }
        .categoryUI ol li a.current {
          color: #fff;
          background-color: #014099;
          border-color: #014099; }
        .categoryUI ol li a.current span {
          color: #fff; }
    @media screen and (max-width: 767px) {
      .categoryUI ol {
        width: 100%; }
        .categoryUI ol li {
          width: 49%; }
          .categoryUI ol li a {
            padding: 8px;
            font-size: 1.2rem; }
            .categoryUI ol li a span {
              font-size: 1.4rem; } }
  .categoryUI .lowerLinks {
    position: relative;
    width: 530px;
    background-color: #eff4fa;
    border: #014099 1px solid;
    overflow: hidden; }
    @media screen and (max-width: 767px) {
      .categoryUI .lowerLinks {
        width: 100%;
        background-color: transparent;
        border: none; } }
    .categoryUI .lowerLinks > div {
      position: absolute;
      width: 1px;
      height: 1px;
      background-color: #eff4fa;
      opacity: 0; }
      .categoryUI .lowerLinks > div.current {
        width: 100%;
        height: 100%;
        animation: elm-show 0.7s cubic-bezier(0.17, 0.935, 0.305, 1) both; }
      .categoryUI .lowerLinks > div .close {
        display: none; }
      @media screen and (max-width: 767px) {
        .categoryUI .lowerLinks > div {
          display: none;
          width: 100%;
          height: 100vh;
          position: fixed;
          top: 0;
          left: 0;
          z-index: 102;
          opacity: 1;
          background-color: transparent; }
          .categoryUI .lowerLinks > div .close {
            display: block; }
          .categoryUI .lowerLinks > div .overlay {
            background: rgba(0, 0, 0, 0.7);
            height: 100vh;
            position: absolute;
            width: 100%; }
          .categoryUI .lowerLinks > div .modalContent {
            background: #fff;
            left: 50%;
            padding: 0;
            position: absolute;
            top: 50%;
            transform: translate(-50%, -50%);
            width: 90%; }
            .categoryUI .lowerLinks > div .modalContent .close {
              width: 23px;
              height: 23px;
              border: none;
              background-color: transparent;
              position: absolute;
              top: -30px;
              right: 0; }
              .categoryUI .lowerLinks > div .modalContent .close:before, .categoryUI .lowerLinks > div .modalContent .close:after {
                content: '';
                width: 24px;
                height: 2px;
                position: absolute;
                background-color: #fff;
                top: 0;
                right: 0; }
              .categoryUI .lowerLinks > div .modalContent .close:before {
                transform: translateY(8px) rotate(-45deg); }
              .categoryUI .lowerLinks > div .modalContent .close:after {
                transform: translateY(-6px) rotate(45deg);
                top: 14px; }
            .categoryUI .lowerLinks > div .modalContent .inner {
              max-height: 70vh;
              overflow-y: scroll; } }
    .categoryUI .lowerLinks .head {
      font-size: 2.4rem;
      color: #fff;
      display: flex;
      align-items: center;
      padding: 25px;
      height: 120px;
      background-color: #ccc;
      background-position: 0 0;
      background-repeat: no-repeat; }
      .categoryUI .lowerLinks .head.-create {
        background-image: url(../stance/images/index_guide_01.jpg); }
      .categoryUI .lowerLinks .head.-governance {
        background-image: url(../stance/images/index_guide_02.jpg); }
      .categoryUI .lowerLinks .head.-society {
        background-image: url(../stance/images/index_guide_03.jpg); }
      .categoryUI .lowerLinks .head.-environment {
        background-image: url(../stance/images/index_guide_04.jpg); }
    .categoryUI .lowerLinks .inner {
      padding: 30px; }
      .categoryUI .lowerLinks .inner h3 {
        position: relative;
        font-size: 2rem;
        padding-left: 16px; }
        .categoryUI .lowerLinks .inner h3::before {
          content: '';
          display: inline-block;
          position: absolute;
          left: 0;
          right: 0;
          bottom: 0;
          top: 0;
          margin: auto;
          width: 6px;
          height: 6px;
          border-top: #014099 2px solid;
          border-right: #014099 2px solid;
          transform: rotate(45deg);
          right: 5%;
          margin: auto 0; }
      .categoryUI .lowerLinks .inner.manyItem2 {
        padding: 30px 20px; }
        .categoryUI .lowerLinks .inner.manyItem2 ul {
          display: flex;
          flex-wrap: wrap;
          justify-content: space-between;
          padding: 10px 0 0; }
          .categoryUI .lowerLinks .inner.manyItem2 ul li {
            width: 46.5%;
            font-size: 1.4rem;
            margin-top: 5px; }
      .categoryUI .lowerLinks .inner ul {
        padding: 10px 0 0 40px; }
        @media screen and (min-width: 767px) {
          .categoryUI .lowerLinks .inner ul.manyItem1 {
            font-size: 1.4rem; } }
    @media screen and (max-width: 767px) {
      .categoryUI .lowerLinks .head {
        padding: 15px;
        height: 75px;
        font-size: 1.8rem;
        background-size: 100%; }
      .categoryUI .lowerLinks .inner {
        padding: 20px; }
        .categoryUI .lowerLinks .inner h3 {
          font-size: 1.8rem; }
        .categoryUI .lowerLinks .inner ul {
          padding: 10px 0 0; }
          .categoryUI .lowerLinks .inner ul li {
            font-size: 1.4rem; }
        .categoryUI .lowerLinks .inner.manyItem2 {
          padding: 20px; }
          .categoryUI .lowerLinks .inner.manyItem2 ul {
            flex-direction: column; }
            .categoryUI .lowerLinks .inner.manyItem2 ul li {
              width: 100%; } }

@keyframes elm-show {
  0% {
    opacity: 0;
    display: none; }
  100% {
    opacity: 1;
    display: block; } }
@keyframes elm-show-x {
  0% {
    opacity: 0;
    display: none; }
  100% {
    opacity: 1;
    display: block; } }
@keyframes elm-hide-x {
  0% {
    transform: translateX(0);
    opacity: 1;
    display: block; }
  100% {
    transform: translateX(-16px);
    opacity: 0;
    display: none; } }
.pickupBlock {
  display: flex;
  justify-content: space-between;
  margin: 60px 0 0; }
  .pickupBlock * {
    box-sizing: border-box; }
  .pickupBlock > a {
    display: block;
    position: relative;
    width: 49%;
    border: #014099 1px solid; }
    .pickupBlock > a:hover {
      text-decoration: none;
      opacity: .8; }
    .pickupBlock > a img {
      width: 100%; }
    .pickupBlock > a p {
      position: absolute;
      bottom: 0;
      width: 100%;
      background-color: rgba(255, 255, 255, 0.9);
      padding: 15px 20px 10px;
      font-size: 1.8rem;
      font-weight: 600;
      line-height: 1.5;
      color: #014099; }
      .pickupBlock > a p span {
        display: block;
        font-size: 1.4rem;
        font-weight: 600; }
  @media screen and (max-width: 767px) {
    .pickupBlock {
      flex-direction: column;
      margin: 40px 0 0; }
      .pickupBlock > a {
        width: 100%; }
        .pickupBlock > a + a {
          margin: 10px 0 0; }
        .pickupBlock > a p {
          padding: 8px 10px;
          font-size: 1.6rem; }
          .pickupBlock > a p span {
            font-size: 1.2rem; } }

/*-----------------------
Message
-----------------------*/
.kvMessage {
  background: url(../message/images/kv_01.jpg) 0 0 no-repeat;
  position: relative;
  height: 400px;
  padding: 80px 0 0 120px;
  box-sizing: border-box; }
  .kvMessage h2 {
    color: #014099;
    font-size: 3rem;
    font-weight: 600;
    line-height: 1.5; }
  .kvMessage .sign {
    padding: 65px 0 0; }
    .kvMessage .sign > span {
      display: block;
      margin-bottom: 10px;
      font-size: 1.4rem;
      font-weight: 600; }
  @media screen and (max-width: 767px) {
    .kvMessage {
      margin: 0 -10px;
      background-position: 55% 100%;
      background-size: 200%;
      height: 74vw;
      padding: 40px 0 0 20px; }
      .kvMessage h2 {
        font-size: 1.8rem;
        text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.8); }
      .kvMessage .sign {
        padding: 70px 0 0 0; }
        .kvMessage .sign img {
          width: 139px; }
        .kvMessage .sign > span {
          font-size: 1.2rem; } }

/*-----------------------
activity
-----------------------*/
.headingActivity {
  font-weight: 600;
  padding: 43px 0; }
  .headingActivity h1 {
    padding: 0;
    line-height: 1.3; }
    .headingActivity h1 img {
      display: inline-block;
      vertical-align: top;
      padding: 5px 0 0 20px;
      width: 100px; }
  .headingActivity > .label {
    font-size: 1.4rem;
    color: #014099; }
  .headingActivity.-materiality h1 {
    position: relative;
    padding-right: 130px; }
    .headingActivity.-materiality h1:after {
      content: 'マテリアリティ';
      position: absolute;
      top: 5px;
      right: 0;
      color: #014099;
      border: #014099 1px solid;
      border-radius: 5px;
      padding: 5px 10px 4px 25px;
      display: inline-block;
      font-size: 1.3rem;
      font-weight: 300;
      line-height: 1.2;
      letter-spacing: -1px;
      background: url(../images/icon_materiality.svg) 7px center no-repeat;
      background-size: 14px 14px; }
  .headingActivity + .susHeading1 {
    margin-top: 0; }
  @media screen and (max-width: 767px) {
    .headingActivity {
      padding: 25px 0; }
      .headingActivity h1 img {
        width: 60px; }
      .headingActivity > .sub {
        font-size: 1.3rem; }
      .headingActivity > .label {
        font-size: 1.3rem;
        margin: 5px 0 0; }
      .headingActivity.-materiality h1 {
        padding-right: 100px; }
        .headingActivity.-materiality h1:after {
          font-size: 1rem;
          background-size: 12px 12px;
          padding: 5px 10px 4px 23px; } }

[class*="goal"] .materiality {
  margin: 20px 0 0;
  font-size: 1.4rem; }
  [class*="goal"] .materiality p {
    font-weight: 600; }

.goalCommon {
  background-color: #eff4fa;
  padding: 30px; }
  .goalCommon * {
    box-sizing: border-box; }
  .goalCommon h3 {
    color: #014099;
    font-size: 2.4rem;
    font-weight: 600;
    line-height: 1.4; }
    .goalCommon h3 span {
      font-size: 1.4rem; }
  @media screen and (max-width: 767px) {
    .goalCommon {
      padding: 20px; }
      .goalCommon h3 {
        font-size: 1.8rem; } }

.goalAchievement {
  display: flex;
  justify-content: space-between;
  border: #014099 1px solid;
  background-color: #eff4fa;
  margin: 30px 0;
  padding: 12px 12px 12px 24px; }
  .goalAchievement * {
    box-sizing: border-box; }
  .headingActivity + .goalAchievement {
    margin-top: 0; }
  @media screen and (max-width: 767px) {
    .goalAchievement {
      flex-direction: column;
      padding: 20px 12px 12px; } }
  .goalAchievement .achievement {
    width: 67%; }
    .goalAchievement .achievement h3 {
      padding: 20px 0 0;
      color: #014099;
      font-size: 2.4rem;
      font-weight: 600;
      line-height: 1.4; }
      .goalAchievement .achievement h3 span {
        font-size: 1.4rem; }
    .goalAchievement .achievement .target + .items {
      padding: 20px 0 0;
      border-top: #ddd 1px solid; }
    .goalAchievement .achievement > .items {
      display: flex;
      margin: 25px 0 0;
      font-size: 1.4rem; }
      .goalAchievement .achievement > .items div + div {
        margin-left: 50px; }
      .goalAchievement .achievement > .items dt {
        font-weight: 600; }
      .goalAchievement .achievement > .items dd {
        color: #033333;
        font-size: 1.3rem; }
      .goalAchievement .achievement > .items .adjust1 {
        display: inline-block;
        width: 200px;
        font-size: 1.2rem; }
    @media screen and (max-width: 767px) {
      .goalAchievement .achievement {
        width: 100%; }
        .goalAchievement .achievement h3 {
          padding: 0 0 10px;
          font-size: 1.8rem; }
        .goalAchievement .achievement > .items {
          margin: 15px 0 0; }
          .goalAchievement .achievement > .items div + div {
            margin-left: 20px; }
          .goalAchievement .achievement > .items .adjust1 {
            width: 100%; } }
  .goalAchievement .goal {
    width: 33%;
    margin-left: 27px;
    padding: 35px 20px 30px;
    background-color: #fff;
    color: #014099;
    font-size: 1.8rem;
    font-weight: 600;
    text-align: center; }
    .goalAchievement .goal .result {
      padding: 10px 0 0;
      font-size: 2.6rem;
      white-space: nowrap; }
      .goalAchievement .goal .result em {
        font-size: 4.6rem; }
    .goalAchievement .goal .evaluation {
      line-height: 1.2; }
      .goalAchievement .goal .evaluation em {
        display: inline-block;
        margin: 0 0 0 10px;
        font-size: 3rem;
        line-height: 1.2; }
    .goalAchievement .goal .terms {
      font-size: 1.4rem;
      font-weight: 300; }
    @media screen and (max-width: 767px) {
      .goalAchievement .goal {
        width: 100%;
        margin: 20px 0 0;
        padding: 20px;
        font-size: 1.6rem; }
        .goalAchievement .goal .result {
          line-height: 1.5;
          font-size: 2rem; }
          .goalAchievement .goal .result em {
            font-size: 3.6rem; }
        .goalAchievement .goal .evaluation em {
          font-size: 2.4rem; } }
  .goalAchievement[class*="-row"] {
    background-color: #fff;
    border: none;
    width: 100%;
    padding: 30px 0 0;
    flex-wrap: wrap; }
    .goalAchievement[class*="-row"] > .col {
      counter-increment: section;
      background-color: #eff4fa;
      padding: 60px 20px 20px; }
      .goalAchievement[class*="-row"] > .col:before {
        content: counter(section,decimal-leading-zero);
        display: block;
        margin: -90px auto 0;
        width: 45px;
        padding: 5px;
        color: #fff;
        background-color: #014099;
        font-size: 2.8rem;
        font-weight: 600;
        text-align: center;
        line-height: 1.6; }
      .goalAchievement.-counter4 {
        counter-reset: section 3; }
      .goalAchievement.-counter5 {
        counter-reset: section 4; }
      .goalAchievement.-counter6 {
        counter-reset: section 5; }
      .goalAchievement.-counter7 {
        counter-reset: section 6; }
      .goalAchievement.-counter8 {
        counter-reset: section 7; }
      .goalAchievement[class*="-row"] > .col .achievement {
        width: 100%; }
        .goalAchievement[class*="-row"] > .col .achievement h3 {
          font-size: 1.8rem;
          line-height: 1.5; }
        .goalAchievement[class*="-row"] > .col .achievement > .items {
          flex-direction: column; }
          .goalAchievement[class*="-row"] > .col .achievement > .items div + div {
            margin: 15px 0 0; }
      .goalAchievement[class*="-row"] > .col .goal {
        width: 100%;
        margin: 20px 0 0;
        padding: 20px;
        border: #014099 1px solid; }
        .goalAchievement[class*="-row"] > .col .goal .result {
          font-size: 3.2rem;
          line-height: 1.4; }
          .goalAchievement[class*="-row"] > .col .goal .result em {
            font-size: 6.4rem; }
          .goalAchievement[class*="-row"] > .col .goal .result.-small {
            font-size: 2rem; }
            .goalAchievement[class*="-row"] > .col .goal .result.-small em {
              font-size: 5rem; }
      @media screen and (max-width: 767px) {
        .goalAchievement[class*="-row"] > .col {
          width: 100%; }
          .goalAchievement[class*="-row"] > .col + .col {
            margin: 60px 0 0; }
          .goalAchievement[class*="-row"] > .col .achievement h3 {
            margin-top: 20px; }
          .goalAchievement[class*="-row"] > .col .goal .result {
            font-size: 2rem; }
            .goalAchievement[class*="-row"] > .col .goal .result em {
              font-size: 3.6rem; } }
    @media screen and (max-width: 767px) {
      .goalAchievement[class*="-row"] {
        flex-direction: column; } }
  .goalAchievement.-start {
    justify-content: flex-start; }
    .goalAchievement.-start > .col + .col {
      margin-left: 16px; }
  .goalAchievement.-row2 > .col {
    width: 49%; }
  .goalAchievement.-row3 > .col {
    width: 32.4%; }
  .goalAchievement.-row4 > .col {
    width: 24%; }
    .goalAchievement.-row4 > .col .goal .result {
      font-size: 1.8rem;
      line-height: 1.4; }
      .goalAchievement.-row4 > .col .goal .result em {
        font-size: 4rem; }
  @media screen and (max-width: 767px) {
    .goalAchievement.-start > .col + .col {
      margin-left: 0; }
    .goalAchievement.-row2 > .col, .goalAchievement.-row3 > .col, .goalAchievement.-row4 > .col {
      width: 100%; } }

.eventBlock > h4 {
  margin: 20px 0 0;
  font-weight: 600; }
  .eventBlock > h4 + h5 {
    margin-top: 0; }
.eventBlock > h5 {
  font-weight: 600;
  margin: 20px 0 10px; }
.eventBlock > .date,
.eventBlock > .purpose {
  position: relative;
  padding: 0 0 0 5em; }
  .eventBlock > .date:before,
  .eventBlock > .purpose:before {
    content: attr(data-label);
    position: absolute;
    left: 0;
    padding: 2px 10px;
    background-color: #eee;
    font-size: 1.4rem; }
.eventBlock > .purpose {
  margin: 5px 0 0; }
.eventBlock [class*="imgColumn"] span {
  font-size: 1.4rem; }

.flexFigure {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  margin-bottom: 30px; }
  .flexFigure > li + li {
    margin-left: 20px; }
  .flexFigure a:hover {
    opacity: .7; }
  @media screen and (min-width: 768px) {
    .flexFigure.-lower {
      width: 25%;
      float: right;
      overflow: hidden;
      justify-content: flex-end;
      margin: -90px 0 0; } }
  .flexFigure.-lower > li {
    width: 33%; }
    .flexFigure.-lower > li + li {
      margin-left: 10px; }
  @media screen and (max-width: 767px) {
    .flexFigure.-lower {
      margin-bottom: 15px; }
      .flexFigure.-lower > li {
        width: 15%; } }

/*-----------------------
comment
-----------------------*/
.commentNote {
  text-align: right;
  font-size: 1.4rem;
  margin-top: -70px; }

section.comment {
  margin: 75px 0 0;
  padding: 30px 0 0;
  border-top: #014099 1px solid; }
  section.comment:nth-of-type(1) {
    border: none;
    padding-top: 0; }
  section.comment .lumpMix {
    margin: 0 0 35px; }
    section.comment .lumpMix .lumpL {
      margin: 0 36px 0 0; }
  section.comment .expertName {
    font-size: 2rem; }
  section.comment h2 {
    margin: 35px 0 20px;
    font-size: 2rem;
    font-weight: 600;
    line-height: 1.4; }
    section.comment h2.expertName {
      margin: 10px 0 0; }
      section.comment h2.expertName span {
        font-size: 1.6rem; }
  section.comment .profile {
    margin: 30px 0 0;
    padding: 20px 30px;
    background-color: #eff4fa;
    font-size: 1.4rem; }
    section.comment .profile .expertName {
      margin: 0 0 10px;
      color: #014099;
      font-size: 1.8rem;
      font-weight: 600; }
      section.comment .profile .expertName span {
        font-size: 1.4rem; }
  @media screen and (max-width: 767px) {
    section.comment {
      margin: 50px 0 0;
      padding: 20px 0 0; }
      section.comment .lumpMix {
        margin: 0 0 20px; }
        section.comment .lumpMix .lumpL {
          margin: 0 20px 0 0; }
        section.comment .lumpMix .lumpEnd {
          font-size: 1.4rem; }
      section.comment .expertName {
        font-size: 1.8rem; }
      section.comment h2 {
        margin: 20px 0 10px;
        font-size: 1.8rem; }
        section.comment h2.expertName span {
          font-size: 1.4rem; }
      section.comment .profile {
        margin: 20px 0 0;
        padding: 15px; }
        section.comment .profile .expertName {
          font-size: 1.6rem; }
          section.comment .profile .expertName span {
            font-size: 1.4rem; } }

/*-----------------------
vision (/sustainability/vision/css/style.scss)
The css file was integrated on January 30, 2020.
-----------------------*/
.vision * {
  box-sizing: border-box; }
@media screen and (min-width: 768px) {
  .vision .u-sp-on {
    display: none; } }
@media screen and (max-width: 767px) {
  .vision .u-pc-on {
    display: none; }
  .vision .u-sp-on {
    display: block; }
  .vision br.u-sp-on {
    display: inline; } }
.vision .visionHeading1 {
  font-size: 4.4rem;
  letter-spacing: 0.2em;
  line-height: 1.4;
  margin: 60px 0;
  padding: 0;
  text-align: center; }
  .vision .visionHeading1 span {
    display: block;
    font-size: 1.4rem;
    letter-spacing: 0; }
  .vision .visionHeading1.is-border::after {
    content: '';
    display: block;
    width: 30px;
    height: 1px;
    background-color: #999;
    margin: 60px auto 0; }
.vision .visionHeading2 {
  color: #014099;
  font-size: 3.6rem;
  font-weight: 600;
  line-height: 1.6;
  margin: 70px 0 50px;
  text-align: center; }
.vision .visionHeading3 {
  color: #014099;
  padding: 0 0 20px;
  margin: 0 0 20px;
  border-bottom: #014099 1px solid;
  font-size: 2.8rem;
  font-weight: 600;
  line-height: 1.4; }
@media screen and (max-width: 767px) {
  .vision .visionHeading1 {
    font-size: 3.2rem;
    margin: 25px 0; }
    .vision .visionHeading1 span {
      font-size: 1.2rem; }
    .vision .visionHeading1.is-border::after {
      margin: 25px auto 0; }
  .vision .visionHeading2 {
    font-size: 2.2rem;
    margin: 25px 0; }
  .vision .visionHeading3 {
    font-size: 2rem;
    padding: 0 0 10px;
    margin: 0 0 10px; } }
.vision .visionIntro {
  margin: 0 0 60px; }
  .vision .visionIntro p {
    line-height: 2; }
@media screen and (max-width: 767px) {
  .vision .visionKV {
    margin: 0 -10px; }
  .vision .visionIntro {
    margin: 0 0 25px; }
    .vision .visionIntro p {
      line-height: 1.6; }
    .vision .visionIntro .alignC {
      text-align: left !important; } }
.vision .bnrBlock.is-top {
  margin-top: 80px; }
.vision .bnrBlock ul li {
  background-color: transparent;
  margin: 0; }
  .vision .bnrBlock ul li span {
    padding: 10px 0;
    text-align: center;
    font-size: 1.3rem;
    line-height: 1.3; }
  .vision .bnrBlock ul li em {
    font-size: 2rem; }
  .vision .bnrBlock ul li.current a {
    color: #014099; }
.vision .bnrBlock .cl2 li {
  width: 500px;
  margin: 28px 0 0 24px; }
  .vision .bnrBlock .cl2 li:nth-of-type(2n+1) {
    margin-left: 28px; }
.vision .bnrBlock .cl5 li {
  width: 200px;
  margin: 24px 0 0 10px; }
  .vision .bnrBlock .cl5 li:nth-of-type(5n+1) {
    margin-left: 20px; }
  .vision .bnrBlock .cl5 li span {
    font-size: 1.2rem; }
  .vision .bnrBlock .cl5 li em {
    font-size: 1.6rem; }
@media screen and (max-width: 767px) {
  .vision .bnrBlock {
    padding: 15px; }
    .vision .bnrBlock.is-top {
      margin: 40px 0 0;
      padding: 30px 35px; }
    .vision .bnrBlock .cl2 li {
      width: 100%;
      margin: 0; }
      .vision .bnrBlock .cl2 li:nth-of-type(2n+2) {
        margin-left: 0; }
      .vision .bnrBlock .cl2 li + li {
        margin-top: 20px !important; }
    .vision .bnrBlock .cl5 li span {
      font-size: 1rem; }
    .vision .bnrBlock .cl5 li em {
      font-size: 1.4rem; }
    .vision .bnrBlock .cl5 li:nth-of-type(n+3) {
      margin-top: 10px !important; } }
.vision .visionChronology {
  margin: 60px 0 0;
  overflow: hidden; }
  .vision .visionChronology section {
    position: relative;
    border-left: #014099 6px solid;
    margin: 0 0 0 57px;
    padding: 0 0 20px 82px; }
    .vision .visionChronology section:last-child {
      border: none; }
  .vision .visionChronology .year {
    position: absolute;
    top: 0;
    left: -63px;
    display: inline-block;
    padding: 10px 3px;
    background-color: #014099;
    color: #fff;
    font-size: 1.8rem;
    line-height: 1.4;
    width: 120px;
    text-align: center; }
  .vision .visionChronology .switchDetail {
    margin: 0;
    padding-bottom: 80px; }
    @media screen and (min-width: 768px) {
      .vision .visionChronology .switchDetail {
        display: block !important; } }
    @media print {
      .vision .visionChronology .switchDetail {
        display: block !important; } }
  .vision .visionChronology h3 {
    color: #014099;
    padding: 0 0 20px;
    border-bottom: #014099 1px solid;
    font-size: 2.8rem;
    font-weight: 600;
    line-height: 1.4; }
    .vision .visionChronology h3 .switchToggle {
      display: none; }
  .vision .visionChronology .historyTable {
    margin: 27px 0 0 0;
    display: flex;
    background: url(../vision/images/history_bg_01.gif) 0 0 repeat-y; }
    .vision .visionChronology .historyTable dt,
    .vision .visionChronology .historyTable .insights h4 {
      padding: 10px 15px;
      font-size: 2.4rem;
      font-weight: 600;
      color: #fff;
      vertical-align: middle; }
      .vision .visionChronology .historyTable dt::after,
      .vision .visionChronology .historyTable .insights h4::after {
        content: attr(data-opt);
        font-size: 1.2rem;
        padding-left: 10px;
        display: inline-block;
        vertical-align: middle;
        text-transform: uppercase; }
    .vision .visionChronology .historyTable dd {
      padding: 20px 20px 0; }
      .vision .visionChronology .historyTable dd h4 {
        font-size: 1.8rem;
        font-weight: 600;
        line-height: 1.4;
        margin-bottom: 10px; }
    .vision .visionChronology .historyTable .context {
      width: 375px; }
      .vision .visionChronology .historyTable .context dt {
        background-color: #ccc; }
    .vision .visionChronology .historyTable .episode {
      width: 560px; }
      .vision .visionChronology .historyTable .episode dt {
        background-color: #014099; }
      .vision .visionChronology .historyTable .episode dd h4 {
        color: #014099; }
    .vision .visionChronology .historyTable .insights {
      position: relative;
      z-index: 1;
      margin: 40px 0 0;
      border: #014099 1px solid;
      background-color: #fff; }
      .vision .visionChronology .historyTable .insights h4 {
        padding: 10px;
        margin: 0;
        text-align: center;
        background-color: #eff4fa; }
      .vision .visionChronology .historyTable .insights .inner {
        padding: 18px 10px;
        color: #014099;
        font-size: 1.5rem;
        font-weight: 600; }
    .vision .visionChronology .historyTable .historyPhoto {
      position: relative;
      z-index: 0;
      margin: -60px -20px 0 -395px; }
  .vision .visionChronology.future section {
    margin: 0;
    padding: 0 0 20px 0;
    border: none; }
  .vision .visionChronology.future .year {
    display: none; }
  .vision .visionChronology .futureItemWrap {
    padding: 50px 0 80px; }
  .vision .visionChronology section:last-child .futureItemWrap {
    padding: 50px 0 0; }
  .vision .visionChronology .futureItem1 {
    display: flex;
    justify-content: space-between; }
    .vision .visionChronology .futureItem1 li {
      width: 230px; }
      .vision .visionChronology .futureItem1 li span {
        display: block;
        margin-top: 13px;
        font-size: 1.8rem;
        font-weight: 600;
        line-height: 1.5;
        text-align: center; }
  .vision .visionChronology .futureItem2 .row {
    display: flex;
    justify-content: space-between;
    align-items: stretch; }
    .vision .visionChronology .futureItem2 .row .col {
      border-left: #ccc 1px solid;
      padding: 10px 30px;
      text-align: center; }
      @media screen and (min-width: 768px) {
        .vision .visionChronology .futureItem2 .row .col:nth-of-type(1) {
          border: none; } }
    .vision .visionChronology .futureItem2 .row.is-column3 .col {
      width: calc(100% / 3); }
    .vision .visionChronology .futureItem2 .row.is-column2 .col {
      width: 50%; }
    .vision .visionChronology .futureItem2 .row + .row {
      margin-top: 40px; }
  .vision .visionChronology .futureItem2 h4 {
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1.4; }
  .vision .visionChronology .futureItem2 .objectiveImg {
    margin: 15px 0 0; }
    .vision .visionChronology .futureItem2 .objectiveImg img {
      width: 184px; }
  .vision .visionChronology .futureItem2 .objectiveNum {
    margin: 30px 0;
    font-size: 3.4rem;
    font-weight: 600;
    line-height: 1.2;
    color: #014099; }
    .vision .visionChronology .futureItem2 .objectiveNum em {
      font-size: 8.0rem; }
  .vision .visionChronology .futureItem2 .details {
    text-align: left; }
  .vision .visionChronology .futureItem3 {
    display: flex;
    justify-content: space-between;
    padding: 0 8px; }
    .vision .visionChronology .futureItem3 li {
      width: 255px;
      list-style-type: none;
      margin: 0; }
      .vision .visionChronology .futureItem3 li span {
        display: block;
        margin-top: 13px;
        font-size: 1.8rem;
        font-weight: 600;
        line-height: 1.5;
        text-align: center; }
  @media screen and (max-width: 767px) {
    .vision .visionChronology section {
      border-left-width: 3px;
      margin: 0 0 0 30px;
      padding: 0 0 20px 36px; }
    .vision .visionChronology .year {
      left: -32px;
      padding: 8px 3px;
      font-size: 1.2rem;
      width: 60px; }
    .vision .visionChronology .switchDetail {
      padding-bottom: 10px; }
    .vision .visionChronology.switchWrap .nowOpen {
      background: none !important; }
    .vision .visionChronology h3 {
      position: relative;
      font-size: 2rem;
      padding: 0 50px 10px 0; }
      .vision .visionChronology h3 .switchToggle {
        position: absolute;
        top: 0;
        right: 0;
        display: block;
        width: 25px;
        height: 25px;
        border: #014099 1px solid;
        text-indent: 9999px;
        cursor: pointer;
        background: none; }
        .vision .visionChronology h3 .switchToggle::after {
          content: '';
          display: inline-block;
          position: absolute;
          top: 6px;
          left: 0;
          right: 0;
          margin: 0 auto;
          width: 6px;
          height: 6px;
          border-top: #014099 2px solid;
          border-right: #014099 2px solid;
          transform: rotate(135deg); }
        .vision .visionChronology h3 .switchToggle.nowOpen::after {
          top: 9px;
          transform: rotate(-45deg); }
    .vision .visionChronology .historyTable {
      margin: 15px 0 0 0;
      flex-direction: column;
      background: none; }
      .vision .visionChronology .historyTable dt,
      .vision .visionChronology .historyTable .insights h4 {
        padding: 6px 10px;
        font-size: 1.8rem; }
        .vision .visionChronology .historyTable dt::after,
        .vision .visionChronology .historyTable .insights h4::after {
          font-size: 1.0rem; }
      .vision .visionChronology .historyTable dd {
        padding: 10px 0 0; }
        .vision .visionChronology .historyTable dd h4 {
          font-size: 1.6rem; }
      .vision .visionChronology .historyTable .context {
        width: 100%;
        margin-bottom: 15px; }
      .vision .visionChronology .historyTable .episode {
        width: 100%; }
      .vision .visionChronology .historyTable .insights {
        margin: 20px 0 0; }
        .vision .visionChronology .historyTable .insights h4 {
          padding: 8px 10px; }
        .vision .visionChronology .historyTable .insights .inner {
          font-size: 1.4rem; }
      .vision .visionChronology .historyTable .historyPhoto {
        margin: 15px 0 0; }
    .vision .visionChronology.future {
      margin-top: 40px; }
      .vision .visionChronology.future h3 {
        padding-right: 0; }
    .vision .visionChronology .futureItemWrap {
      padding: 15px 0 50px; }
    .vision .visionChronology section:last-child .futureItemWrap {
      padding: 15px 0 0; }
    .vision .visionChronology .futureItem1 {
      flex-direction: column; }
      .vision .visionChronology .futureItem1 li {
        display: flex;
        align-items: center;
        width: 100%; }
        .vision .visionChronology .futureItem1 li img {
          width: 33%;
          height: 100%; }
        .vision .visionChronology .futureItem1 li span {
          display: block;
          margin-top: 0;
          padding: 10px;
          font-size: 1.5rem;
          text-align: left; }
      .vision .visionChronology .futureItem1 li + li {
        margin-top: 10px; }
    .vision .visionChronology .futureItem2 .row {
      flex-direction: column; }
      .vision .visionChronology .futureItem2 .row .col {
        width: 100% !important;
        padding: 15px 0;
        border: none;
        border-bottom: #ccc 1px solid; }
      .vision .visionChronology .futureItem2 .row + .row {
        margin-top: 0; }
    .vision .visionChronology .futureItem2 h4 {
      font-size: 1.6rem; }
      .vision .visionChronology .futureItem2 h4 br {
        display: none; }
    .vision .visionChronology .futureItem2 .objectiveImg {
      margin: 8px 0 0; }
      .vision .visionChronology .futureItem2 .objectiveImg img {
        width: 115px; }
    .vision .visionChronology .futureItem2 .objectiveNum {
      margin: 8px 0;
      font-size: 2.7rem; }
      .vision .visionChronology .futureItem2 .objectiveNum em {
        font-size: 5.0rem; }
    .vision .visionChronology .futureItem2 .details {
      font-size: 1.4rem; }
    .vision .visionChronology .futureItem3 {
      padding: 0 8px;
      flex-wrap: wrap; }
      .vision .visionChronology .futureItem3 li {
        width: 49%; }
        .vision .visionChronology .futureItem3 li:nth-of-type(n+3) {
          margin-top: 15px; }
        .vision .visionChronology .futureItem3 li span {
          margin-top: 10px;
          font-size: 1.5rem;
          text-align: center; } }
.vision .notesList ol {
  padding: 40px 0;
  margin: 70px 0;
  border-top: #ccc 1px solid;
  border-bottom: #ccc 1px solid;
  font-size: 1.4rem; }
  .vision .notesList ol li {
    position: relative;
    list-style-type: none;
    margin: 0;
    padding: 0 0 0 3rem; }
    .vision .notesList ol li span {
      position: absolute;
      top: 0;
      left: 0;
      color: #ff3300; }
  .vision .notesList ol li + li {
    margin-top: 10px; }
@media screen and (max-width: 767px) {
  .vision .notesList ol {
    padding: 20px 0;
    margin: 35px 0; } }
.vision .sdgsKV {
  position: relative; }
  .vision .sdgsKV .goal {
    display: block;
    margin: -103px auto 0; }
  @media screen and (max-width: 767px) {
    .vision .sdgsKV .goal {
      width: 35%;
      margin: -8% auto 0; } }
.vision .sdgsGoals {
  margin: 0 0 90px;
  text-align: center; }
  .vision .sdgsGoals h3 {
    margin: 0 0 25px;
    font-size: 2.4rem;
    font-weight: 600;
    line-height: 1.4; }
    .vision .sdgsGoals h3 span {
      display: block;
      font-size: 1.2rem; }
  @media screen and (max-width: 767px) {
    .vision .sdgsGoals {
      margin: 0 0 50px; }
      .vision .sdgsGoals h3 {
        margin: 0 0 20px;
        font-size: 1.8rem; }
        .vision .sdgsGoals h3 span {
          font-size: 1rem; } }
.vision .sdgsItems h2 {
  padding: 30px 0;
  border-top: #014099 1px solid;
  border-bottom: #014099 1px solid;
  color: #014099;
  font-size: 2.8rem;
  font-weight: 600;
  line-height: 1.4;
  text-align: center; }
.vision .sdgsItems section {
  padding: 47px 0 60px;
  border-bottom: #014099 1px solid; }
.vision .sdgsItems .goalList {
  display: flex;
  justify-content: center; }
  .vision .sdgsItems .goalList li {
    font-size: 2rem;
    font-weight: 600;
    line-height: 1.4;
    text-align: center;
    padding: 0 50px; }
    .vision .sdgsItems .goalList li::before {
      content: '';
      background: url(../vision/images/sdgs_goals.png) 0 0 no-repeat;
      background-size: 550px;
      width: 83px;
      height: 83px;
      display: block;
      margin: 0 auto 10px; }
    .vision .sdgsItems .goalList li::after {
      content: attr(data-opt);
      display: block;
      font-size: 1.1rem; }
    .vision .sdgsItems .goalList li.goal03 {
      color: #1b973a; }
      .vision .sdgsItems .goalList li.goal03::before {
        background-position: -188px 0; }
    .vision .sdgsItems .goalList li.goal06 {
      color: #00a6d9; }
      .vision .sdgsItems .goalList li.goal06::before {
        background-position: 100% 0; }
    .vision .sdgsItems .goalList li.goal07 {
      color: #fabd00; }
      .vision .sdgsItems .goalList li.goal07::before {
        background-position: 0 -93px; }
    .vision .sdgsItems .goalList li.goal12 {
      color: #d39206; }
      .vision .sdgsItems .goalList li.goal12::before {
        background-position: 100% -93px; }
    .vision .sdgsItems .goalList li.goal13 {
      color: #407936; }
      .vision .sdgsItems .goalList li.goal13::before {
        background-position: 0 -186px; }
    .vision .sdgsItems .goalList li.goal14 {
      color: #0075ba; }
      .vision .sdgsItems .goalList li.goal14::before {
        background-position: -94px -186px; }
    .vision .sdgsItems .goalList li.goal15 {
      color: #28a838; }
      .vision .sdgsItems .goalList li.goal15::before {
        background-position: -188px -186px; }
.vision .sdgsItems h3 {
  margin: 30px 0;
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 1.4;
  text-align: center; }
.vision .sdgsItems .detailsWrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap; }
  .vision .sdgsItems .detailsWrap .items {
    width: 330px; }
    .vision .sdgsItems .detailsWrap .items:nth-of-type(n+4) {
      margin-top: 30px; }
    .vision .sdgsItems .detailsWrap .items dt {
      margin: 15px 0 8px;
      font-weight: 600;
      color: #014099; }
@media screen and (max-width: 767px) {
  .vision .sdgsItems h2 {
    padding: 15px 0;
    font-size: 2.0rem; }
  .vision .sdgsItems section {
    padding: 35px 0 30px; }
  .vision .sdgsItems .goalList li {
    font-size: 1.6rem;
    padding: 0 10px; }
    .vision .sdgsItems .goalList li::before {
      background-size: 345px;
      width: 53px;
      height: 53px;
      margin: 0 auto 10px; }
    .vision .sdgsItems .goalList li.goal03::before {
      background-position: -117px 0; }
    .vision .sdgsItems .goalList li.goal06::before {
      background-position: 100% 0; }
    .vision .sdgsItems .goalList li.goal07::before {
      background-position: 0 -58px; }
    .vision .sdgsItems .goalList li.goal12::before {
      background-position: 100% -58px; }
    .vision .sdgsItems .goalList li.goal13::before {
      background-position: 0 -115px; }
    .vision .sdgsItems .goalList li.goal14::before {
      background-position: -59px -115px; }
    .vision .sdgsItems .goalList li.goal15::before {
      background-position: -117px -115px; }
    .vision .sdgsItems .goalList li::after {
      margin-top: 5px;
      font-size: 1rem; }
  .vision .sdgsItems h3 {
    margin: 30px 0 25px;
    font-size: 1.8rem; }
  .vision .sdgsItems .detailsWrap {
    flex-direction: column; }
    .vision .sdgsItems .detailsWrap .items {
      width: 100%;
      display: flex; }
      .vision .sdgsItems .detailsWrap .items:nth-of-type(n+4) {
        margin-top: auto; }
      .vision .sdgsItems .detailsWrap .items + .items {
        margin-top: 20px; }
      .vision .sdgsItems .detailsWrap .items .itemThumb {
        width: 30%; }
        .vision .sdgsItems .detailsWrap .items .itemThumb img {
          width: 100%; }
      .vision .sdgsItems .detailsWrap .items dl {
        width: 70%;
        padding: 0 0 0 15px; }
      .vision .sdgsItems .detailsWrap .items dt {
        margin: 0 0 5px; }
      .vision .sdgsItems .detailsWrap .items dd {
        font-size: 1.4rem; } }
.vision .articleIntro, .vision .articleOutro {
  text-align: center;
  font-size: 1.4rem; }
  .vision .articleIntro .logo, .vision .articleOutro .logo {
    width: 130px;
    margin: 10px auto 0; }
  @media screen and (max-width: 767px) {
    .vision .articleIntro .logo, .vision .articleOutro .logo {
      width: 100px; } }
.vision .articleOutro {
  margin: 20px 0 0;
  text-align: right;
  overflow: hidden; }
  .vision .articleOutro .logo {
    margin: 10px 0 0;
    float: right; }
.vision .articleItem {
  color: #014099;
  font-weight: 600;
  line-height: 1.4;
  text-align: center; }
  .vision .articleItem .vol {
    font-size: 2.4rem;
    padding-bottom: 35px; }
    .vision .articleItem .vol::after {
      content: '';
      display: block;
      width: 30px;
      height: 1px;
      background-color: #014099;
      margin: 30px auto 0; }
    .vision .articleItem .vol em {
      display: block;
      font-size: 3.2rem;
      padding-left: 0; }
  .vision .articleItem .month {
    margin: 0 0 20px; }
  .vision .articleItem h2 {
    margin: 0 0 25px;
    font-size: 3.2rem;
    font-weight: 600; }
  .vision .articleItem .outline {
    color: #333;
    font-weight: 600;
    line-height: 1.8;
    text-align: left; }
  @media screen and (max-width: 767px) {
    .vision .articleItem .vol {
      font-size: 1.7rem;
      padding-bottom: 15px; }
      .vision .articleItem .vol::after {
        margin: 10px auto 0; }
      .vision .articleItem .vol em {
        font-size: 2.4rem; }
    .vision .articleItem .month {
      margin: 0 0 10px; }
    .vision .articleItem h2 {
      margin: 0 0 15px;
      font-size: 2.2rem; }
    .vision .articleItem .outline {
      font-size: 1.4rem;
      text-align: left; } }
.vision .articleKV {
  position: relative;
  margin: 50px 0 0;
  padding: 80px 30px 30px;
  min-height: 600px; }
  .vision .articleKV.vol1 {
    background: url(../vision/articles/images/kv_vol1.jpg) 0 0 no-repeat; }
  .vision .articleKV.vol2 {
    background: url(../vision/articles/images/kv_vol2.jpg) 0 0 no-repeat; }
  .vision .articleKV.vol3 {
    background: url(../vision/articles/images/kv_vol3.jpg) 0 0 no-repeat; }
  .vision .articleKV.vol4 {
    background: url(../vision/articles/images/kv_vol4.jpg) 0 0 no-repeat; }
  .vision .articleKV.vol5 {
    background: url(../vision/articles/images/kv_vol5.jpg) 0 0 no-repeat; }
  .vision .articleKV.vol6 {
    background: url(../vision/articles/images/kv_vol6.jpg) 0 0 no-repeat; }
  .vision .articleKV.vol7 {
    background: url(../vision/articles/images/kv_vol7.jpg) 0 0 no-repeat; }
  .vision .articleKV.vol8 {
    background: url(../vision/articles/images/kv_vol8.jpg) 0 0 no-repeat; }
  .vision .articleKV.vol9 {
    background: url(../vision/articles/images/kv_vol9.jpg) 0 0 no-repeat; }
  .vision .articleKV.vol10 {
    background: url(../vision/articles/images/kv_vol10.jpg) 0 0 no-repeat; }
  .vision .articleKV.vol11 {
    background: url(../vision/articles/images/kv_vol11.jpg) 0 0 no-repeat; }
  .vision .articleKV.vol12 {
    background: url(../vision/articles/images/kv_vol12.jpg) 0 0 no-repeat; }
  .vision .articleKV::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
  .vision .articleKV.vol12::before {
    background-color: rgba(0, 0, 0, 0.5); }
  .vision .articleKV .articleItem {
    position: relative;
    color: #fff; }
    .vision .articleKV .articleItem .vol::after {
      background-color: #fff; }
    .vision .articleKV .articleItem .outline {
      color: #fff;
      font-weight: 300; }
  .vision .articleKV .btnLink a {
    background-color: transparent;
    border: #fff 1px solid;
    padding: 15px 100px; }
  .vision .articleKV + .notes {
    margin-top: 10px;
    font-size: 1.4rem; }
  @media screen and (max-width: 767px) {
    .vision .articleKV {
      margin: 25px -10px 0;
      padding: 30px 15px 15px;
      min-height: 124vw; }
      .vision .articleKV.vol1 {
        background-image: url(../vision/articles/images/kv_vol1_sp.jpg);
        background-size: 100%; }
      .vision .articleKV.vol2 {
        background-image: url(../vision/articles/images/kv_vol2_sp.jpg);
        background-size: 100%; }
      .vision .articleKV.vol3 {
        background-image: url(../vision/articles/images/kv_vol3_sp.jpg);
        background-size: 100%; }
      .vision .articleKV.vol4 {
        background-image: url(../vision/articles/images/kv_vol4_sp.jpg);
        background-size: 100%; }
      .vision .articleKV.vol5 {
        background-image: url(../vision/articles/images/kv_vol5_sp.jpg);
        background-size: 100%; }
      .vision .articleKV.vol6 {
        background-image: url(../vision/articles/images/kv_vol6_sp.jpg);
        background-size: 100%; }
      .vision .articleKV.vol7 {
        background-image: url(../vision/articles/images/kv_vol7_sp.jpg);
        background-size: 100%; }
      .vision .articleKV.vol8 {
        background-image: url(../vision/articles/images/kv_vol8_sp.jpg);
        background-size: 100%; }
      .vision .articleKV.vol9 {
        background-image: url(../vision/articles/images/kv_vol9_sp.jpg);
        background-size: 100%; }
      .vision .articleKV.vol10 {
        background-image: url(../vision/articles/images/kv_vol10_sp.jpg);
        background-size: 100%; }
      .vision .articleKV.vol11 {
        background-image: url(../vision/articles/images/kv_vol11_sp.jpg);
        background-size: 100%; }
      .vision .articleKV.vol12 {
        background-image: url(../vision/articles/images/kv_vol12_sp.jpg);
        background-size: 100%; }
      .vision .articleKV .btnLink a {
        padding: 10px 0; }
      .vision .articleKV + .notes {
        font-size: 1.2rem; } }
.vision .articleList {
  margin-top: 50px;
  border-top: #ccc 1px solid;
  overflow: hidden; }
  .vision .articleList .thumb {
    float: right;
    margin: 0 0 0 60px; }
  .vision .articleList .itemWrap {
    display: block;
    padding: 47px 0;
    border-bottom: #ccc 1px solid;
    overflow: hidden;
    transition: all .3s; }
    .vision .articleList .itemWrap:hover {
      background-color: #eff4fa;
      text-decoration: none; }
    .vision .articleList .itemWrap .articleItem {
      font-size: 1.4rem;
      text-align: left; }
      .vision .articleList .itemWrap .articleItem .vol {
        font-size: 1.4rem;
        padding: 0; }
        .vision .articleList .itemWrap .articleItem .vol::after {
          display: none; }
        .vision .articleList .itemWrap .articleItem .vol em {
          display: inline-block;
          font-size: 2.8rem;
          padding-left: 10px; }
      .vision .articleList .itemWrap .articleItem .month {
        margin: 20px 0 5px; }
      .vision .articleList .itemWrap .articleItem h2 {
        margin: 20px 0 15px;
        font-size: 2.4rem; }
      .vision .articleList .itemWrap .articleItem .outline {
        font-weight: 300; }
  @media screen and (max-width: 767px) {
    .vision .articleList {
      margin-top: 27px; }
      .vision .articleList .thumb {
        margin: 0 0 0 25px;
        width: 35%; }
      .vision .articleList .itemWrap {
        padding: 18px 0; }
        .vision .articleList .itemWrap .articleItem {
          font-size: 1.4rem; }
          .vision .articleList .itemWrap .articleItem .vol {
            font-size: 1.2rem; }
            .vision .articleList .itemWrap .articleItem .vol em {
              font-size: 2rem;
              padding-left: 7px; }
          .vision .articleList .itemWrap .articleItem .month {
            margin: 7px 0 5px;
            font-size: 1.3rem; }
          .vision .articleList .itemWrap .articleItem h2 {
            margin: 0;
            font-size: 1.5rem;
            font-weight: 300;
            color: #333; }
          .vision .articleList .itemWrap .articleItem .outline {
            display: none; } }
.vision .articleDetails {
  border-bottom: #ccc 1px solid;
  padding: 0 0 40px; }
  .vision .articleDetails section + section {
    margin: 50px 0 0; }
  .vision .articleDetails section p + p {
    margin-top: 40px; }
  .vision .articleDetails .articleItem .kv {
    margin: 40px 0 45px; }
  .vision .articleDetails .articleItem .text1 {
    color: #333;
    font-weight: 300;
    line-height: 1.8;
    text-align: left; }
  .vision .articleDetails .bPattern01 {
    margin: 40px 0;
    font-size: 1.8rem;
    font-weight: 600; }
  @media screen and (max-width: 767px) {
    .vision .articleDetails section + section {
      margin: 30px 0 0; }
    .vision .articleDetails section p + p {
      margin-top: 20px; }
    .vision .articleDetails .articleItem .kv {
      margin: 20px 0; }
    .vision .articleDetails .articleItem .text1 {
      line-height: 1.6; }
    .vision .articleDetails .bPattern01 {
      margin: 20px 0;
      font-size: 1.6rem;
      text-align: left; } }
@media print {
  .vision .visionHeading2 {
    font-size: 3rem;
    margin: 30px 0; }
  .vision .bnrBlock {
    display: none !important; }
  .vision .visionChronology h3 {
    font-size: 2.4rem; }
  .vision .visionChronology section {
    break-inside: avoid; }
  .vision .visionChronology section:last-child .futureItemWrap,
  .vision .visionChronology .futureItemWrap {
    padding: 20px 0; }
  .vision .visionChronology .switchDetail {
    padding-bottom: 30px; }
  .vision .visionChronology .historyTable dt,
  .vision .visionChronology .historyTable .insights h4 {
    font-size: 2rem; }
  .vision .visionChronology .futureItem2 .objectiveNum {
    margin: 10px 0;
    font-size: 3rem; }
    .vision .visionChronology .futureItem2 .objectiveNum em {
      font-size: 6rem; }
  .vision .visionChronology .futureItem2 .row .col {
    padding: 10px 15px; }
  .vision .sdgsItems {
    break-before: page; }
    .vision .sdgsItems h2 {
      font-size: 2.4rem; }
    .vision .sdgsItems section {
      padding: 20px 0;
      break-inside: avoid; }
  .vision .articleList .itemWrap {
    break-inside: avoid; }
  .vision .notesList ol {
    margin: 0;
    padding: 20px 0; } }

/*===========================================
print
===========================================*/
@media print {
  #subSiteMapArea {
    display: none !important; }

  [data-print="breakbefore"] {
    break-before: page; }

  [data-print="breakafter"] {
    break-after: page; }

  [data-print="nobreak"] {
    break-inside: avoid; }

  [data-print="none"] {
    display: none !important; }

  .figureWrap {
    break-inside: avoid; }

  .susHeading1 {
    break-after: avoid;
    break-inside: avoid; }

  .susHeading1.-line {
    margin: 40px 0 15px; }

  .headingActivity + .susHeading1 {
    margin-top: 0; }

  .h3Type01 {
    font-size: 1.8rem; }

  [class*="imgColumn"] {
    display: flex; }

  #main .imgColumn2List li {
    width: 44%;
    height: auto !important; }

  #main .imgColumn2List {
    margin: 20px 0 0; }

  h4, h5 {
    font-size: 1.6rem !important; }

  .emphasisBox {
    margin: 20px 0 30px; }

  .dataTable {
    overflow-x: visible; }
    .dataTable table {
      width: 100%; }

  .topVision {
    margin: 0 0 40px; }
    .topVision .slogan {
      font-size: 3rem; }

  .categoryUI {
    break-inside: avoid;
    margin: 0 0 30px; }
    .categoryUI ol {
      width: 49%; }
      .categoryUI ol li {
        width: 49%; }
    .categoryUI .lowerLinks {
      width: 49%; }
      .categoryUI .lowerLinks .head {
        height: auto;
        padding: 20px;
        background-size: 100%; }
      .categoryUI .lowerLinks > div.current {
        position: relative;
        z-index: 1;
        width: 100%;
        height: 100%;
        opacity: 1 !important;
        animation: none; }
      .categoryUI .lowerLinks .inner {
        padding: 20px; }
        .categoryUI .lowerLinks .inner ul {
          padding: 10px 0 0 10px; }

  .gridBlock.-sus {
    margin-top: 20px; }

  .kvMessage {
    background-size: 100%;
    padding: 20px 0 40px 20px;
    height: auto; }
    .kvMessage .sign {
      padding: 30px 0 0; }
      .kvMessage .sign img {
        width: 100px; }

  .susHeading1[data-print="none"] + .report,
  .lowerList {
    display: none !important; }

  .lowerList.-csrIndex {
    display: block !important; }

  .goalAchievement {
    break-inside: avoid; }
    .goalAchievement[class*="-row"] > .col .goal .result {
      font-size: 2.4rem; }
      .goalAchievement[class*="-row"] > .col .goal .result em {
        font-size: 4rem; }
      .goalAchievement[class*="-row"] > .col .goal .result.-small em {
        font-size: 3rem; }
    .goalAchievement.-row4 > .col .goal {
      padding: 10px; }
      .goalAchievement.-row4 > .col .goal .result em {
        font-size: 3rem; }

  [data-print="adjust1"] {
    margin-top: 10px !important; }

  .printAdjust1.tPattern03 th, .printAdjust1.tPattern03 td {
    padding: 6px; }

  .dataTable[data-print="adjust2"] .tPattern03 {
    width: 100%; }
    .dataTable[data-print="adjust2"] .tPattern03 td, .dataTable[data-print="adjust2"] .tPattern03 th {
      padding: 3px !important; }
    .dataTable[data-print="adjust2"] .tPattern03 thead th,
    .dataTable[data-print="adjust2"] .tPattern03 tbody th,
    .dataTable[data-print="adjust2"] .tPattern03 tbody td .discList {
      white-space: normal !important; }

  [data-print="adjust3"] table th, [data-print="adjust3"] table td {
    padding: 5px; }

  .lumpMix.-stance .declaration {
    width: 56%; }
  .lumpMix.-stance .lumpR {
    width: 40%; }
  .lumpMix.-stance .degree {
    width: 56%; }
  .lumpMix.-index .lumpL {
    width: 35%; }
  .lumpMix.-index .lumpEnd {
    width: 60%; }
  .lumpMix.-index .outline > .link {
    display: none; } }


.vision .container a {
	text-decoration: none;
	display: block;
}
.vision .container a:hover {
	opacity: 0.8;
}




/*--------------------------------------------

各ページ

---------------------------------------------*/

.NPcolor02 {color: #D3FE22!important;}
.NPcolor03 {color: #70AAFA!important;}
.NPcolor04 {color: #004098!important;}
.NPcolor05 {color: #59C159!important;}
.NPcolor06 {color: #b7b7b7!important;}
.NPcolor07 {color: #777777!important;}

.NPbgcolor01 {background-color: #141E2D!important;}
.NPbgcolor02 {background-color: #FFFFFF!important;}

.xxxlarge {font-size: 3.0rem!important;}

.annotation {
	background-color: #141E2D;
	color: #fff;
	padding: 20px 30px;
}


/*--------------------------------

story_essential

------------------------------*/

.essential h1 {
	color: #272727;
    font-weight: bold;
    font-size: 4.0rem;
    display: block;
    line-height: 1.1;
	position: relative;
	padding: 40px 0;
}
.essential h1::after {
	    content: "";
    position: absolute;
    bottom: 1px;
    left: 0%;
    border-bottom: 4px solid #004CB1;
    width: 60px;
    white-space: nowrap;
    -webkit-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
}

.essential .Question {
	width: 800px;
	margin: auto;
	margin-top: 70px;
}
.essential .Question h2 {
	font-size: 2.0rem;
    padding-left: 40px;
    margin: 40px auto;
    line-height: 1.6;
    position: relative;
	font-weight: bold;
}
.essential .Question h2::after {
	content: "";
    position: absolute;
    left: -5px;
    top: -5px;
    width: 20px;
    height: 14px;
    background-image: url("../images/essential_ic01.svg");
    background-repeat: no-repeat;
    background-size: cover;
}
.essential .Question p {
	color: #777777;
    font-size: 1.8rem;
    line-height: 1.6;
    margin: 40px auto;
	margin-top: 15px;
}
.essential .articleOutro {
	text-align: right;
	overflow: hidden;
	border-top: #ccc 1px solid;
	padding: 20px 0 0;
}
.essential .articleOutro .logo {
	margin: 10px 0 0;
	float: right;
	width: 130px;
}

/*2021.10.20 追記*/

.TitleCp{
    margin-top: auto;
    margin-bottom: auto;
    padding: 0px 0px;
    padding-left: 20px;
}

.TitleCp p{
	color: #777777;
	line-height: 1.6;
}

.TitleCp .p1{
	margin: 1.3em;
}

.TextBox .row .col p{
	color: #777777;
	font-size: 1.8rem;
	margin: 1.5em 0;
}

.TextBox{
	max-width: 800px;
	margin: auto;
	
}

.inner_TextBox{
	text-align: center;
	
}

.essential .inner_TextBox p.BlueText{
	font-weight: lighter;
    color: #002E6E;
    line-height: 1.2;
    opacity: 0.6;
	font-size: 2.3rem;
}

.essential .inner_TextBox .NameBox p{
	font-size:0.8em;
	color: #8D8D8D;
	line-height: 0.2em;
}

.ImgCp{
	margin: 1rem 1.5em 3rem;
    text-align: center;
    font-size: 1.8rem;
}

@media screen and (max-width: 767px) {
	.essential h1 {
    font-size: 2.2rem;
    line-height: 1.4;
}

.essential .Question {
	width: 100%;
	margin-top: 50px;
}
.essential .Question h2 {
	font-size: 1.8rem;
    padding-left: 30px;
    margin: 30px auto;
}
.essential .Question p {
    font-size: 1.6rem;
    margin: 30px auto;
}
	
	
}