@charset "utf-8";

@media screen and (min-width: 768px) {
  body.en .csr-nv .in_l {
    width: 60%;
  }
}
@media screen and (min-width: 768px) {
  body.en .csr-nv .in_l ul li {
    width: 50%;
  }
}
@media screen and (min-width: 768px) {
  body.en .csr-nv .in_r {
    width: 40%;
    display: flex;
    flex-wrap: wrap;
  }
}
@media screen and (min-width: 768px) {
  body.en .csr-nv .in_r li {
    width: 50%;
  }
}

main div,
main span,
main object,
main iframe,
main h1,
main h2,
main h3,
main h4,
main h5,
main h6,
main p,
main blockquote,
main pre,
main abbr,
main address,
main cite,
main code,
main del,
main dfn,
main em,
main img,
main ins,
main kbd,
main q,
main samp,
main small,
main strong,
main sub,
main sup,
main var,
main b,
main i,
main dl,
main dt,
main dd,
main ol,
main ul,
main li,
main fieldset,
main form,
main label,
main legend,
main table,
main caption,
main tbody,
main tfoot,
main thead,
main tr,
main th,
main td,
main article,
main aside,
main canvas,
main details,
main figcaption,
main figure,
main footer,
main header,
main hgroup,
main menu,
main nav,
main section,
main summary,
main time,
main mark,
main audio,
main video {
  padding: 0;
  margin: 0;
  font-size: 100%;
  vertical-align: baseline;
  border: 0;
  outline: 0;
}
body main header,
body main footer {
  font:
    10px/1 Hiragino Kaku Gothic Pro,
    ヒラギノ角ゴ Pro W3,
    Meiryo,
    メイリオ,
    Osaka,
    MS PGothic,
    arial,
    helvetica,
    sans-serif;
  line-height: 1.8;
  letter-spacing: 0;
}
main article,
main aside,
main canvas,
main details,
main figcaption,
main figure,
main footer,
main header,
main,
main menu,
main nav,
main section,
main summary {
  display: block;
}
main h1,
main h2,
main h3,
main h4,
main h5,
main h6 {
  font-weight: 500;
}
main address,
main em,
main s,
main cite,
main q,
main dfn,
main abbr,
main time,
main code,
main var,
main samp,
main kbd,
main sub,
main sup,
main i,
main mark,
main ruby {
  font-style: normal;
  font-weight: 400;
}
main fieldset,
main img {
  vertical-align: top;
  border: 0;
}
main img {
  width: auto;
  height: auto;
}
main blockquote,
main q {
  quotes: none;
}
main blockquote:before,
main blockquote:after,
main q:before,
main q:after {
  content: "";
  content: none;
}
main a {
  padding: 0;
  margin: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  border: 0;
}
main ins {
  color: #000;
  text-decoration: none;
  background-color: #ff9;
}
main mark {
  font-style: italic;
  font-weight: 700;
  color: #000;
  background-color: #ff9;
}
main del {
  text-decoration: line-through;
}
main abbr[title],
main dfn[title] {
  cursor: help;
  border-bottom: 1px dotted #000;
}
main table {
  font-size: inherit;
  border-spacing: 0;
  border-collapse: collapse;
}
main hr {
  display: block;
  height: 1px;
  padding: 0;
  margin: 1em 0;
  border: 0;
  border-top: 1px solid #ccc;
}
main input,
main button,
main textarea,
main select {
  padding: 0;
  margin: 0;
  font-family:
    メイリオ,
    Meiryo,
    游ゴシック,
    YuGothic,
    ヒラギノ角ゴ ProN W3,
    Hiragino Kaku Gothic ProN,
    ＭＳ Ｐゴシック,
    sans-serif;
  appearance: none;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
}
main input,
main select {
  vertical-align: middle;
}
main textarea {
  resize: none;
}
main select::-ms-expand {
  display: none;
}
main pre,
main code,
main kbd,
main samp,
main tt {
  font-family: monospace;
  line-height: 100%;
}
main sup {
  font-size: 75%;
  vertical-align: text-top;
}
main sub {
  vertical-align: text-bottom;
}
main ul,
main ol {
  list-style: none;
}
main *::selection {
  color: #000;
  background: #f3f3f3;
}
main :placeholder-shown {
  color: #b9b9b9;
}
main ::input-placeholder {
  color: #b9b9b9;
}
main :placeholder {
  color: #b9b9b9;
}
main ::placeholder {
  color: #b9b9b9;
}
main :input-placeholder {
  color: #b9b9b9;
}
main ::-ms-expand {
  display: none;
}
main header:after,
main footer:after,
main:after,
main article:after,
main aside:after,
main .cf:after {
  display: block;
  height: 0;
  clear: both;
  font-size: 0;
  line-height: 0;
  visibility: hidden;
  content: "";
}
@media (min-width: 768px) {
  main a {
    color: #333;
    text-decoration: none;
    outline: none;
    transition:
      opacity 0.3s ease 0s,
      border-bottom 0.3s ease;
  }
  main a:hover,
  main a:focus {
    opacity: 0.7;
  }
  main .news dl dt[class]:after,
  main .newsTop table th[class]:after,
  main #news dt:after {
    display: inline-block;
    width: 125px;
    height: 17px;
    margin-left: 18px;
    font-size: 11px;
    line-height: 17px;
    color: #fff;
    text-align: center;
    vertical-align: top;
  }
  main .furniture:after {
    content: "家具";
    background: #244bac;
  }
  main .garage:after {
    content: "Garage";
    background: #a4961b;
  }
  main .jtx:after {
    content: "ジョインテックス";
    background: #daaa00;
  }
  main .logistics:after {
    content: "ロジスティクス";
    background: #684615;
  }
  main .plus:after {
    content: "プラス";
    background: #000;
  }
  main .showroom:after {
    content: "+PLUS";
    background: #4e2d2d;
  }
  main .stationery:after {
    content: "文具・事務用品";
    background: #a71919;
  }
  main .npn:after {
    content: "日本ノート";
    background: #a71919;
  }
  main .vision:after {
    content: "ミーティングツール";
    background: #5a810f;
  }
  main .biznet:after {
    content: "ビズネット";
    background: #4c35a2;
  }
  main .com:after {
    content: "オフィスコム";
    background: #c0323c;
  }
  main .retail:after {
    content: "リテールサポート";
    background: #bf590e;
  }
  main .csr:after {
    content: "CSRマネジメント";
    background: #0c3178;
  }
  main .environment:after {
    content: "環境のためにできること";
    background: #559f42;
  }
  main .customer:after {
    content: "お客様のためにできること";
    background: #993213;
  }
  main .area:after {
    content: "地域社会のためにできること";
    background: #34778f;
  }
  main .partner:after {
    content: "お取引先様のためにできること";
    background: #d6741f;
  }
  main .employee:after {
    content: "働く仲間のためにできること";
    background: #a09925;
  }
  main .sus_organization:after {
    content: "強くしなやかな組織を築く。";
    background: #7c5199;
  }
  main .sus_sustainability:after {
    content: "サステナビリティマネジメント";
    background: #22aee3;
  }
  main .sus_employee:after {
    content: "働く人に満足を。";
    background: #dc6b88;
  }
  main .sus_earth:after {
    content: "地球環境に満足を。";
    background: #45a943;
  }
  main .sus_social:after {
    content: "社会に満足を。";
    background: #ea973b;
  }
  main header:before {
    position: absolute;
    top: 0;
    left: -100%;
    box-sizing: border-box;
    display: block;
    width: 300%;
    height: 100%;
    content: "";
    background: #fff;
    border-bottom: solid 1px #e6e6e6;
  }
  main .overlay {
    position: absolute;
    z-index: 7;
    display: none;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.3;
  }
  main .sp {
    display: none;
  }
  main {
    width: 100%;
    min-width: 980px;
    padding-bottom: 100px;
    overflow: hidden;
    text-align: left;
  }
  .fix + main {
    padding-top: 112px;
  }
  main > section {
    position: relative;
    width: 100%;
    min-width: 980px;
    max-width: 1200px;
    margin: auto;
  }
  main section a:hover,
  main section a:focus {
    text-decoration: none;
    opacity: 0.7;
    transition: all 0.3s ease;
  }
  main ul,
  main ol {
    padding: 0;
    margin: 0;
    list-style: none;
  }
  main img {
    width: auto;
    max-width: 100%;
    height: auto;
  }
  main .pagetop {
    position: fixed;
    right: 50px;
    bottom: 0;
    z-index: 9;
    display: none;
  }
  main .pagetop a {
    float: left;
    width: 48px;
    height: 0 !important;
    padding-top: 48px;
    margin: 0;
    overflow: hidden;
    background: #cfcfcf url(/common/img/pagetop.gif) no-repeat center center;
    outline: none;
  }
  @media all and (-ms-high-contrast: none) {
    main *::-ms-backdrop,
    main .pagetop a {
      box-sizing: border-box;
      width: 50px !important;
      height: 50px !important;
      overflow: hidden;
      text-indent: -9999px;
      outline: auto;
    }
  }
  main .breadcrumb {
    display: block;
    width: 100%;
    min-width: 980px;
    max-width: 1200px;
    padding: 35px 0 55px;
    margin: auto;
  }
  main .breadcrumb li {
    display: table-cell;
    padding-right: 5px;
    font-size: 1.2rem;
    color: #838383;
  }
  main .breadcrumb li a {
    display: inline-block;
    padding: 5px 0;
    margin-right: 5px;
    color: #838383;
  }
  main .breadcrumb li a:hover {
    text-decoration: underline;
  }
  main h1 {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 50px;
    font-size: 3rem;
    font-weight: 600;
    text-align: center;
  }
  main footer {
    min-width: 940px;
    max-width: 1200px;
    height: 134px;
    padding: 40px 20px 0;
    margin: 0 auto;
    overflow: hidden;
    line-height: 1.8;
  }
  main footer:before {
    position: absolute;
    left: 0;
    display: block;
    width: 100%;
    height: 174px;
    margin-top: -40px;
    content: "";
    background: #f6f6f6;
  }
  main footer > * {
    position: relative;
  }
  main footer ul {
    padding: 5px 0 0;
    margin: 0 0 38px;
    overflow: hidden;
    font-size: 14px;
    font-size: 1.4rem;
  }
  main footer ul li {
    position: relative;
    float: left;
    padding: 0 0 0 12px;
    margin: 0 0 0 10px;
  }
  main footer ul li:before {
    position: absolute;
    top: 6px;
    left: 0;
    display: block;
    width: 2px;
    height: 13px;
    content: "";
    background: #a7a7a7;
    border-top: solid 1px #bdbdbd;
    border-bottom: solid 1px #bdbdbd;
  }
  main footer ul li:first-child {
    padding: 0;
    margin: 0;
  }
  main footer ul li:first-child:before,
  main footer ul li:nth-child(n + 6) {
    display: none;
  }
  main footer ul li a:link,
  main footer ul li a:visited {
    color: #333;
    text-decoration: none;
  }
  main footer ul li a:hover {
    text-decoration: underline;
  }
  main footer form {
    display: block;
    float: left;
    font-size: 14px;
    font-size: 1.4rem;
  }
  main footer form input {
    font-family:
      Hiragino Kaku Gothic Pro,
      ヒラギノ角ゴ Pro W3,
      Meiryo,
      メイリオ,
      Osaka,
      MS PGothic,
      arial,
      helvetica,
      sans-serif;
    font-size: 1.4rem;
    vertical-align: middle;
  }
  main footer form input[type="text"] {
    width: 210px;
    height: 25px;
    padding: 0 5px;
    margin: 0 0 0 10px;
    color: #333;
    background: #e6e6e6;
    border: none;
  }
  main footer form input[type="image"] {
    width: 25px;
  }
  main footer small {
    float: right;
    font-size: 12px;
    font-size: 1.2rem;
  }
  main footer form ::input-placeholder {
    color: #999;
  }
  main footer form ::placeholder {
    color: #999;
    opacity: 1;
  }
  main footer form :input-placeholder {
    color: #999;
  }
  main .annotation_blook {
    width: 900px;
    margin: 0 auto 45px;
    text-align: center;
    background: #fff;
    border: 1px solid #b82234;
  }
  main .annotation_blook .inner {
    padding: 20px;
  }
  main .annotation_blook .inner .text01 {
    font-size: 14px;
    font-weight: 700;
    color: #b82234;
  }
  main .catalog_annotation {
    width: 550px;
    margin: 0 auto 40px;
    background: #eaeaea;
  }
  main .catalog_annotation .inner {
    padding: 20px;
  }
  main .catalog_annotation .inner p {
    font-size: 14px;
    line-height: 1.7;
  }
  main .topics_banner_box {
    padding: 40px 0 0;
    text-align: center;
  }
  main .topics_banner_box .left {
    float: left;
    width: calc(50% - 15px);
    padding: 0 0 0 10px;
  }
  main .topics_banner_box .right {
    float: right;
    width: calc(50% - 15px);
    padding: 0 10px 0 0;
  }
  main .c19_annotation {
    width: 770px;
    padding: 20px;
    margin: 0 auto 40px;
    border: 1px solid #b82234;
  }
  main .c19_annotation.ws {
    display: inline-block;
    width: auto;
  }
  main .c19_annotation p {
    font-size: 14px;
    line-height: 1.7;
    text-align: left !important;
  }
  main .c19_annotation p:first-child {
    margin-bottom: 0 !important;
    font-size: 14px !important;
  }
  main .c19_annotation p span {
    font-weight: 700;
  }
  main .c19_annotation .title {
    margin: 0 0 20px !important;
    font-size: 18px;
    font-weight: 700;
    color: #b82234;
    text-align: center !important;
  }
  main .c19_annotation .title_s {
    margin: 0 0 20px !important;
    font-size: 18px;
    font-weight: 700;
    text-align: center !important;
  }
  main .c19_annotation ul {
    padding: 10px 0;
    margin: 0;
    list-style: none;
  }
  main .c19_annotation ul li {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    color: #b82234;
    text-align: left !important;
  }
}
@media (max-width: 767px) {
  main a {
    -webkit-tap-highlight-color: rgb(255 0 0 / 50%);
  }
  main a,
  main a:link,
  main a:visited {
    color: #333;
    text-decoration: none;
    outline: none;
  }
  main .news dl dt[class]:after,
  main .newsTop table th[class]:after,
  main #news dt:after {
    display: inline-block;
    width: 100px;
    height: 16px;
    margin-left: 10px;
    font-size: 10px;
    line-height: 16px;
    color: #fff;
    text-align: center;
    vertical-align: top;
  }
  main .furniture:after {
    content: "家具";
    background: #244bac;
  }
  main .garage:after {
    content: "Garage";
    background: ＃a4961b;
  }
  main .jtx:after {
    content: "ジョインテックス";
    background: #daaa00;
  }
  main .logistics:after {
    content: "ロジスティクス";
    background: #684615;
  }
  main .plus:after {
    content: "プラス";
    background: #000;
  }
  main .showroom:after {
    content: "+PLUS";
    background: #4e2d2d;
  }
  main .npn:after {
    content: "日本ノート";
    background: #a71919;
  }
  main .stationery:after {
    content: "文具・事務用品";
    background: #a71919;
  }
  main .vision:after {
    content: "ミーティングツール";
    background: #5a810f;
  }
  main .biznet:after {
    content: "ビズネット";
    background: #4c35a2;
  }
  main .com:after {
    content: "オフィスコム";
    background: #c0323c;
  }
  main .retail:after {
    content: "リテールサポート";
    background: #bf590e;
  }
  main .sus_organization:after {
    content: "強くしなやかな組織を築く。";
    background: #7c5199;
  }
  main .sus_sustainability:after {
    content: "サステナビリティマネジメント";
    background: #22aee3;
  }
  main .sus_employee:after {
    content: "働く人に満足を。";
    background: #dc6b88;
  }
  main .sus_earth:after {
    content: "地球環境に満足を。";
    background: #45a943;
  }
  main .sus_social:after {
    content: "社会に満足を。";
    background: #ea973b;
  }
  main img {
    max-width: 100%;
  }
  main .cat-name {
    display: none;
  }
  main .overlay {
    position: absolute;
    z-index: 7;
    display: none;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.3;
  }
  main .pc {
    display: none;
  }
  main {
    padding-bottom: 50px;
    text-align: left;
  }
  main > section {
    padding: 0 10px;
    margin: 30px 0;
  }
  main ul,
  main ol {
    padding: 0;
    margin: 0;
    list-style: none;
  }
  main img {
    width: auto;
    max-width: 100%;
    height: auto;
  }
  main .pagetop {
    position: fixed;
    right: 10px;
    bottom: 0;
    z-index: 9;
    display: none;
  }
  main .pagetop a {
    float: left;
    width: 34px;
    height: 0 !important;
    height: 34px;
    padding-top: 34px;
    margin: 0;
    overflow: hidden;
    background: #cfcfcf url(/common/img/pagetop.gif) no-repeat center center;
    outline: none;
  }
  main .breadcrumb {
    display: none;
  }
  main h1 {
    padding: 20px 10px;
    font-size: 2rem;
    font-weight: 600;
  }
  main footer {
    padding: 30px 3% 25px;
    background: #f6f6f6;
  }
  main footer ul {
    padding: 0;
    margin: 0 0 30px;
    overflow: hidden;
    font-size: 1rem;
    list-style-type: none;
    border-top: 1px solid #e6e6e6;
  }
  main footer ul li {
    display: table;
    float: left;
    width: 49%;
    text-align: left;
    border-bottom: 1px solid #e6e6e6;
  }
  main footer ul li:nth-child(odd) {
    clear: both;
  }
  main footer ul li:nth-child(2n) {
    float: right;
  }
  main footer ul li a {
    display: table-cell;
    height: 40px;
    padding: 5px 9% 5px 3%;
    font-size: 1.2rem;
    vertical-align: middle;
    background: url(/common/img/arw.png) no-repeat 96% center;
  }
  main footer form {
    display: block;
    margin: 0 0 15px;
    font-size: 1.2rem;
    text-align: center;
  }
  main footer form input {
    vertical-align: middle;
  }
  main footer form input[type="text"] {
    width: 170px;
    height: 25px;
    padding: 0 5px;
    margin: 0 0 0 10px;
    color: #333;
    background: #e6e6e6;
    border: none;
  }
  main footer form input[type="image"] {
    width: 25px;
  }
  main footer small {
    display: block;
    font-size: 1rem;
    text-align: center;
  }
  main .annotation_blook {
    width: 100%;
    margin: 0 auto 20px;
    text-align: center;
    background: #fff;
    border: 1px solid #b82234;
  }
  main .annotation_blook .inner {
    padding: 10px;
  }
  main .annotation_blook .inner .text01 {
    font-size: 12px;
    font-weight: 700;
    color: #b82234;
  }
  main .catalog_annotation {
    width: 100%;
    margin: 0 auto 20px;
    background: #eaeaea;
  }
  main .catalog_annotation .inner {
    padding: 15px;
  }
  main .catalog_annotation .inner p {
    font-size: 12px;
    line-height: 1.6;
  }
  main .topics_banner_box {
    padding: 10px 0;
    text-align: center;
  }
  main .topics_banner_box .left {
    margin: 0 0 10px;
  }
  main .c19_annotation {
    width: calc(96% - 20px);
    padding: 10px;
    margin: 30px auto 0;
    border: 1px solid #b82234;
  }
  main .c19_annotation.ws {
    display: inline-block;
    width: auto;
  }
  main .c19_annotation p {
    font-size: 14px;
    line-height: 1.7;
    text-align: left !important;
  }
  main .c19_annotation p:first-child {
    margin: 0 !important;
    font-size: 14px !important;
  }
  main .c19_annotation p span {
    font-weight: 700;
  }
  main .c19_annotation .title {
    margin: 0 0 20px !important;
    font-size: 16px;
    font-weight: 700;
    color: #b82234;
    text-align: center !important;
  }
  main .c19_annotation ul {
    padding: 10px 0;
    margin: 0;
    list-style: none;
  }
  main .c19_annotation ul li {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    color: #b82234;
    text-align: left !important;
  }
}
main ._button_xe2hj_1 {
  position: fixed;
  right: 10px;
  bottom: 10px;
  z-index: 999;
  display: none;
  width: var(--size);
  height: var(--size);
  margin-left: auto;
  overflow: hidden;
  cursor: pointer;
  border: none;
  transition: height 0.2s ease-out;
  --size: 34px;
}
main ._slideIn_xe2hj_18 {
  display: block;
  height: var(--size);
}
main ._slideOut_xe2hj_23 {
  display: block;
  height: 0;
}
main ._aboveFooter_xe2hj_28 {
  position: absolute;
  bottom: 304px;
}
main ._buttonInner_xe2hj_33 {
  display: block;
  width: var(--size);
  height: var(--size);
  background: #cfcfcf url(/assets/pagetop.gif) no-repeat center center;
}
@media (min-width: 768px) {
  main ._button_xe2hj_1 {
    right: 50px;
    bottom: 50px;
    --size: 48px;
  }
  main ._aboveFooter_xe2hj_28 {
    bottom: 174px;
  }
}
@media (max-width: 767px) {
  main ._trigger_1t1o8_2,
  main ._triggerGlobal_1t1o8_3 {
    position: absolute;
    top: 0;
    z-index: 8;
    box-sizing: content-box;
    display: flex;
    justify-content: center;
    height: 22px;
    padding-top: 37px;
    overflow: hidden;
    font-family: inherit;
    font-size: 1rem;
    line-height: 1;
    text-align: center;
  }
  main ._trigger_1t1o8_2._ac_1t1o8_19,
  main ._triggerGlobal_1t1o8_3._ac_1t1o8_19 {
    background: url(/assets/bg_close.gif) no-repeat center 12px;
    background-size: 18px auto;
  }
}
@media (max-width: 767px) {
  main ._nav_vt47v_2 {
    position: absolute;
    top: 59px;
    left: 0;
    z-index: 9;
    width: 100%;
    overflow: hidden;
    font-size: 1.2rem;
    line-height: 1.8;
    text-align: left;
    background: #f6f6f6;
    transition: height 0.3s ease-out;
  }
  main ._nav_vt47v_2._isOpen_vt47v_16 {
    z-index: 10;
  }
}
@media (min-width: 768px) {
  main ._nav_vt47v_2 {
    padding: 63px 0 0;
    transition: 0.3s;
  }
}
@media (max-width: 767px) {
  main ._item_v1v7i_2 {
    margin-top: -1px;
    font-size: 1.4rem;
    border-top: 1px solid #e1e1e1;
  }
}
@media (max-width: 767px) {
  main ._link_usruy_2 {
    position: relative;
    display: block;
    padding: 10px 9% 10px 3%;
  }
  main ._link_usruy_2:before {
    position: absolute;
    top: 50%;
    right: 17px;
    display: block;
    width: 6px;
    height: 6px;
    margin-top: -4px;
    content: "";
    border-top: solid 2px #9c9c9c;
    border-right: solid 2px #9c9c9c;
    transform: rotate(45deg);
  }
  main ._link_usruy_2[target="_blank"]:after {
    display: inline-block;
    margin-left: 10px;
    content: url(/assets/ico_blank_blue.png);
  }
}
@media (max-width: 767px) {
  main ._pcOnly_1voyu_2 {
    display: none;
  }
}
@media (min-width: 768px) {
  main ._spOnly_1voyu_8 {
    display: none !important;
  }
}
main ._contentWrapper_7gm9h_1 {
  overflow: hidden;
  transition: height 0.3s ease-out;
}
@media (max-width: 767px) {
  main ._triggerMenu_7gm9h_7 {
    right: 0;
    width: 56px;
    background: url(/assets/bg_menu.gif) no-repeat center 12px;
    background-size: 24px auto;
  }
  main ._menuInner_7gm9h_14 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding-bottom: 46px;
  }
  main ._inside_7gm9h_22 {
    border-bottom: 1px solid #e1e1e1;
  }
  main ._snLink_7gm9h_26:before {
    transform: rotate(135deg);
  }
  main ._snLink_7gm9h_26._ac_7gm9h_30:before {
    transform: rotate(-45deg);
  }
  main ._subNv_7gm9h_34 {
    padding: 0 4%;
    background: #fff;
    border-top: 1px solid #e1e1e1;
  }
  main ._snClese_7gm9h_40 {
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    width: 100%;
    font-size: 1.2rem;
    line-height: 36px;
    text-align: center;
    background: #e4e4e4;
  }
  main ._snClese_7gm9h_40:before {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 10px;
    vertical-align: middle;
    content: "";
    background: url(/assets/btn_close_sp.png) no-repeat;
    background-size: 100%;
  }
  main ._catName_7gm9h_63 {
    display: none;
  }
  main ._snList_7gm9h_67 ._snList_7gm9h_67 {
    padding: 0 10px;
    background: #f6f6f6;
    border-bottom: solid 15px #fff;
  }
  main ._snList_7gm9h_67 ._snList_7gm9h_67 ._snItem_7gm9h_73:first-child {
    border-top: none;
  }
  main ._snItemLink_7gm9h_77 {
    display: block;
    padding: 8px 10px;
    font-size: 1.2rem;
  }
  main ._snItemLink_7gm9h_77:before {
    right: 3px;
  }
  main ._outside_7gm9h_87 {
    padding: 15px 15px 10px;
  }
  main ._outside_7gm9h_87:before {
    display: block;
    margin-bottom: 10px;
    content: "関連PLUSグループ";
  }
  main ._outsideItem_7gm9h_97 {
    float: left;
    width: 48%;
  }
  main ._outsideItem_7gm9h_97:nth-child(odd) {
    float: right;
  }
  main ._outsideItem_7gm9h_97._lang_7gm9h_106,
  main ._outsideItem_7gm9h_97._search_7gm9h_107 {
    display: none;
  }
  main ._outsideItemLink_7gm9h_111 {
    display: block;
    padding: 3px 0;
    margin: 0 0 10px;
    text-align: center;
    background: #fff;
  }
  main ._outsideItemLink_7gm9h_111[aria-current="location"] {
    background: #e4e4e4;
  }
  main ._snColumnSustainability_7gm9h_123 {
    padding: 10px 0;
    border-top: 1px solid #e1e1e1;
  }
  main ._snColumnSustainability_7gm9h_123:first-child {
    border-top: none;
  }
  main ._snGroupHeadingSustainability_7gm9h_132 {
    padding: 5px 0;
    font-size: 1.3rem;
    font-weight: 700;
  }
  main ._snGroupListSustainability_7gm9h_138 {
    margin-bottom: 10px;
  }
}
@media (min-width: 768px) {
  main ._menuNav_7gm9h_144._shrink_7gm9h_144 {
    padding-left: 250px;
  }
  main ._menuNav_7gm9h_144._shrink_7gm9h_144 ._insideItemLink_7gm9h_148 {
    font-size: 1.3rem;
    padding: 13px 0 11px;
  }
  main ._inside_7gm9h_22,
  main ._outside_7gm9h_87 {
    display: table;
    height: 48px;
    line-height: 1.8;
  }
  main ._inside_7gm9h_22 {
    float: right;
    width: 100%;
  }
  main ._outside_7gm9h_87 {
    position: absolute;
    top: 20px;
    right: 20px;
  }
  main ._insideItem_7gm9h_148,
  main ._outsideItem_7gm9h_97 {
    display: table-cell;
  }
  main ._insideItem_7gm9h_148 {
    width: 17%;
    text-align: center;
  }
  main ._insideItemLink_7gm9h_148 {
    position: relative;
    display: block;
    padding: 10px 0;
    font-size: 1.5rem;
    color: #333;
    border-bottom: solid 1px transparent;
  }
  main ._insideItemLink_7gm9h_148:hover,
  main ._insideItemLink_7gm9h_148[aria-current="location"] {
    background: url(/assets/bd_gnav02.gif) repeat-x 0 bottom;
  }
  main ._insideItemLink_7gm9h_148:after,
  main ._insideItem_7gm9h_148:first-child ._insideItemLink_7gm9h_148:before {
    position: absolute;
    top: 15px;
    right: 0;
    display: block;
    width: 1px;
    height: 18px;
    content: "";
    background: #d3d3d3;
  }
  main ._insideItem_7gm9h_148:first-child ._insideItemLink_7gm9h_148:before {
    right: auto;
    left: 0;
  }
  main ._subNv_7gm9h_34 {
    position: absolute;
    top: 100%;
    left: calc(-100% + 20px);
    width: calc(100% - 40px);
    padding: 0 100%;
    text-align: left;
    background: #fff;
  }
  main ._subNvInner_7gm9h_222 {
    display: block;
  }
  main ._snClese_7gm9h_40 {
    position: relative;
    display: block;
    width: 100%;
    padding-top: 20px;
    padding-right: 28px;
    margin: 0 0 10px;
    font-family: inherit;
    font-size: 1.4rem;
    line-height: 20px;
    text-align: right;
    cursor: pointer;
    background: url(/assets/btn_close.png) no-repeat right bottom;
  }
  main ._catName_7gm9h_63 {
    position: absolute;
    z-index: 999;
    padding: 5px 0 5px 16px;
    margin: 0 0 0 15px;
    font-size: 1.8rem;
    line-height: 1.25;
    background: url(/assets/arw.png) no-repeat 0 center;
  }
  main ._catNameLink_7gm9h_251:hover {
    text-decoration: underline;
  }
  main ._catName2_7gm9h_255 {
    font-size: 1.4rem;
    line-height: 1.25;
  }
  main ._snList_7gm9h_67 {
    position: relative;
    display: table-cell;
    padding: 0 0 40px 280px;
    vertical-align: top;
  }
  main ._snList_7gm9h_67 ._snList_7gm9h_67 {
    padding: 0 0 0 15px;
  }
  @media screen and (min-width: 1101px) {
    main ._snList_7gm9h_67 ._snList_7gm9h_67 {
      padding: 0 0 0 30px;
    }
  }
  main ._snList_7gm9h_67._in5_7gm9h_277 {
    width: 66%;
  }
  main ._snList_7gm9h_67._in5_7gm9h_277 > ._snItem_7gm9h_73 {
    margin-right: 0;
    float: left;
    width: 24%;
  }
  main
    ._snList_7gm9h_67._in5_7gm9h_277
    > ._snItem_7gm9h_73._wrapItem_7gm9h_287 {
    width: 72%;
  }
  @media screen and (min-width: 1101px) {
    main ._snList_7gm9h_67._in5_7gm9h_277 > ._snItem_7gm9h_73 {
      margin-right: 0;
    }
  }
  main ._snList_7gm9h_67._in2_7gm9h_297 {
    max-width: 475px;
    overflow: hidden;
  }
  main ._snList_7gm9h_67._in5_7gm9h_277 + ._in2_7gm9h_297 {
    padding-left: 15px;
    margin-left: 30px;
  }
  main ._snList_7gm9h_67._in5_7gm9h_277 + ._in2_7gm9h_297:after {
    display: none;
  }
  main ._snList_7gm9h_67._in2_7gm9h_297 ._snItem_7gm9h_73 {
    float: left;
    width: 50%;
    max-width: 230px;
  }
  main ._snItemLink_7gm9h_77 {
    display: inline-block;
    padding: 5px 0 5px 16px;
    font-size: 1.2rem;
    line-height: 25px;
    color: #333;
    text-decoration: none;
    background: url(/assets/arw.png) no-repeat 0 center;
    background-size: 5px auto;
  }
  main ._snItemLink_7gm9h_77:hover {
    text-decoration: underline;
  }
  main ._snItemLink_7gm9h_77[target="_blank"]:after {
    margin-left: 8px;
    vertical-align: middle;
    content: url(/assets/ico_blank_blue.png);
  }
  main ._outsideItem_7gm9h_97 {
    padding-left: 30px;
  }
  main ._outsideItemLink_7gm9h_111 {
    display: block;
    padding: 5px 0;
    font-size: 1.2rem;
    color: #333;
    border-bottom: solid 1px #fff;
  }
  main ._outsideItemLink_7gm9h_111:hover,
  main ._outsideItemLink_7gm9h_111[aria-current="location"] {
    border-bottom: 1px solid #9a9a9a;
  }
  main ._outsideItem_7gm9h_97._search_7gm9h_107 {
    position: relative;
    padding: 0 26px 0 0;
  }
  main ._outsideItem_7gm9h_97._lang_7gm9h_106 {
    position: relative;
    padding: 0 31px 0 0;
  }
  main ._outsideItem_7gm9h_97._lang_7gm9h_106:after {
    position: absolute;
    top: 10px;
    right: 0;
    display: block;
    width: 1px;
    height: 12px;
    content: "";
    background: #d3d3d3;
  }
  main ._searchLink_7gm9h_376 {
    display: inline-block;
    padding: 5px 0 5px 18px;
    font-size: 1.2rem;
    color: #333;
    text-decoration: none;
    background: url(/assets/bg_h_search.gif) no-repeat 0 45%;
  }
  main ._searchLink_7gm9h_376:hover {
    text-decoration: underline;
  }
  main ._langButton_7gm9h_389 {
    display: inline-block;
    padding: 5px 0 5px 18px;
    font-family: inherit;
    font-size: 1.2rem;
    cursor: pointer;
    background: url(/assets/bg_h_lang.gif) no-repeat 0 45%;
  }
  main ._langListWrapper_7gm9h_398 {
    position: absolute;
    top: 31px;
    left: 0;
  }
  main ._langItemLink_7gm9h_404 {
    display: block;
    width: 74px;
    padding: 3px 0 2px;
    font-size: 1.2rem;
    color: #fff;
    text-align: center;
    background: #9a9a9a;
    border-bottom: 1px solid #fff;
  }
  main ._langItemLink_7gm9h_404:hover,
  main ._langItemLink_7gm9h_404:focus {
    opacity: 0.7;
  }
  main ._snList_7gm9h_67._snSustainability_7gm9h_420 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 15px;
    width: 66%;
  }
  main ._snGroupHeadingSustainability_7gm9h_132 {
    padding: 5px 0;
    margin: 15px 0 5px;
    font-size: 1.3rem;
    font-weight: 700;
    color: #333;
  }
  main ._snGroupHeadingSustainability_7gm9h_132:first-child {
    margin-top: 0;
  }
  main ._snGroupListSustainability_7gm9h_138 {
    margin-bottom: 10px;
  }
}

:root {
  --sus-color-employee: #f17b9e;
  --sus-color-social: #fdb013;
  --sus-color-earth: #65b744;
  --sus-color-organization: #7566ab;
}
body.en {
  min-width: 980px;
}
main {
  font-size: 1.4rem;
  line-height: 1.78;
  text-align: justify;
}
body.en main {
  text-align: left;
}
main *,
main *:before,
main *:after {
  box-sizing: border-box;
}
main p + p {
  margin-top: 15px;
}
main sub {
  font-size: 60%;
  vertical-align: baseline;
}
main .breadcrumb {
  line-height: 1;
}
@media screen and (max-width: 767px) {
  body.en {
    min-width: 0;
  }
  main {
    font-size: 1.2rem;
  }
  main h1 {
    text-align: center;
  }
  main p + p {
    margin-top: 8px;
  }
}
main .show-anime {
  position: relative;
  top: 40px;
  opacity: 0;
  transition: all 0.5s;
}
main .show .show-anime {
  top: 0;
  opacity: 1;
}
main .show-anime.delay2 {
  transition-delay: 0.2s;
}
main .show-anime.delay4 {
  transition-delay: 0.4s;
}
main .show-anime.delay6 {
  transition-delay: 0.6s;
}
main .show-anime.delay8 {
  transition-delay: 0.8s;
}
main .show-anime.delay10 {
  transition-delay: 1s;
}
main .show-anime.delay12 {
  transition-delay: 1.2s;
}
@media screen and (min-width: 768px) {
  body.en main .csr-nv .in_l {
    width: 60%;
  }
  body.en main .csr-nv .in_l ul li {
    width: 50%;
  }
  body.en main .csr-nv .in_r {
    width: 40%;
    display: flex;
    flex-wrap: wrap;
  }
  body.en main .csr-nv .in_r li {
    width: 50%;
  }
}
main .contents-area {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 20px;
}
@media screen and (max-width: 767px) {
  main .contents-area {
    padding: 0 3%;
  }
}
main .section-l {
  margin: 60px 0;
}
main .section-m {
  margin: 40px 0;
}
main .section-s {
  margin: 20px 0;
}
@media screen and (max-width: 767px) {
  main .section-l {
    margin: 45px 0;
  }
  main .section-m {
    margin: 30px 0;
  }
  main .section-s {
    margin: 15px 0;
  }
}
main .section-title {
  margin: 70px 0 30px;
  border-left: 3px solid #ccc;
  padding-left: 15px;
  font-size: 2.8rem;
  line-height: 1.2;
}
@media screen and (max-width: 767px) {
  main .section-title {
    margin: 45px 0 25px;
    padding-left: 10px;
    font-size: 1.8rem;
  }
}
main .bg-title {
  margin: 40px 0 20px;
  background-color: #f6f6f6;
  padding: 10px 15px;
  text-align: left;
  font-size: 2rem;
  line-height: 1.3;
}
main .bg-title.color {
  background-color: #eff2d5;
}
main .bg-title.narrow {
  letter-spacing: -0.01em;
}
main .no-bg-title {
  margin: 35px 0 15px;
  padding: 10px 15px;
  text-align: left;
  font-size: 2rem;
  line-height: 1.3;
}
main .center-title {
  margin: 35px 0 25px;
  text-align: center;
  font-size: 2rem;
  font-weight: 700;
}
main h5,
main .blue-title {
  font-size: 14px;
  font-weight: 700;
  line-height: 24.92px;
  color: #0060ad;
}
main .bold-title {
  margin: 15px 0 0;
  font-weight: 700;
}
main h3.bold-title,
main h4.bold-title {
  margin: 35px 0 10px;
}
main h5.bold-title,
main .blue-title {
  margin: 20px 0 10px;
}
@media screen and (max-width: 767px) {
  main .bg-title {
    margin: 30px 0 15px;
    padding: 12px 10px;
    font-size: 1.6rem;
  }
  main h3.bold-title,
  main h4.bold-title {
    margin: 20px 0 10px;
  }
  main h5.bold-title,
  main .blue-title {
    margin: 15px 0 10px;
  }
  main .no-bg-title {
    margin: 30px 0 15px;
    padding: 12px 10px;
    font-size: 1.6rem;
  }
}
main .inline-icon {
  float: left;
  margin-right: 10px;
  width: 50px;
  text-align: center;
  color: #fff;
  font-size: 1.1rem;
} 
/* 無効化: body.en main .inline-icon {width:60px} */
main .inline-icon.color01 {
  background-color: #a6a6a6;
}
main .inline-icon.color02 {
  background-color: #666;
}
main .inline-icon + span {
  display: block;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  main .inline-icon {
    width: 37px;
    font-size: 1rem;
  } /* 無効化: body.en main .inline-icon {width:54px} */
}
@media screen and (max-width: 767px) {
  main sup {
    display: inline-block;
    font-size: 60%;
    margin-top: -2px !important;
  }
}
main .dot-list {
  margin: 8px 0;
}
main .dot-list > li {
  position: relative;
  margin-top: 5px;
  padding-left: 1.3em;
}
main .dot-list.no-margin > li {
  margin-top: 0;
}
main .dot-list > li:before {
  content: "●";
  position: absolute;
  top: 0;
  left: 0;
}
main .dot-list.color01 > li:before {
  color: var(--sus-color-employee);
}
main .dot-list.color02 > li:before {
  color: var(--sus-color-social);
}
main .dot-list.color03 > li:before {
  color: var(--sus-color-earth);
}
main .dot-list.color04 > li:before {
  color: var(--sus-color-organization);
}
main .dot-list.inline {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 40px;
}
main .dot-list.inline > li {
  margin-top: 0;
}
@media screen and (max-width: 375px) {
  main .dot-list.inline {
    gap: 5px 25px;
  }
}
main .order-list {
  margin: 10px 0;
  padding-left: 20px;
  list-style-type: decimal;
}
main .order-list.brackets {
  list-style-type: none;
  counter-reset: item;
}
main .order-list.brackets li {
  position: relative;
}
main .order-list.brackets li:before {
  counter-increment: item;
  content: counter(item) ")";
  position: absolute;
  top: 0;
  left: -20px;
}
main .header-list {
  margin: 15px 0;
}
main .header-list.fontS {
  font-size: 1.2rem;
}
main .header-list .head {
  float: left;
  margin-right: 0.3em;
}
main .header-list .text {
  overflow: hidden;
  word-break: break-all;
}
main .note-list {
  margin: 10px 0;
  font-size: 1.2rem;
}
main .note-list.title {
  margin-left: 18px;
}
main .note-list > li {
  position: relative;
  padding-left: 1.2em;
}
main .note-list > li:before {
  content: "※";
  position: absolute;
  top: 0;
  left: 0;
}
main .icon-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  width: 190px;
}
main .icon-list > li {
  width: 90px;
}
main .img-list {
  padding: 8px 0;
  display: flex;
  gap: 10px;
}
main .center-img {
  margin: 35px 0;
  text-align: center;
}
main .center-img.marginS {
  margin: 15px 0;
}
main .center-img p {
  margin-bottom: 6px;
}
main .center-img .block {
  display: inline-block;
  text-align: left;
}
@media screen and (max-width: 767px) {
  main .center-img {
    margin: 20px 0;
  }
}
main .img-layout {
  margin-top: 70px;
}
main .right-img {
  float: right;
  width: 47.5%;
  margin: 0 0 3% 4%;
}
main .right-img + * {
  margin-top: 0;
}
@media screen and (max-width: 767px) {
  main .img-layout {
    margin-top: 45px;
  }
  main .right-img {
    float: none;
    width: 100%;
    margin: 0 0 20px;
  }
}
main .img-layout2 {
  display: flex;
  align-items: center;
  gap: 40px;
}
main .img-layout2 .lead {
  margin-bottom: 25px;
  text-align: center;
}
main .img-layout2 .img {
  width: 32%;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  main .img-layout2 {
    flex-direction: column;
    gap: 30px;
  }
  main .img-layout2 .lead {
    width: 242px;
    margin: 0 auto 15px;
  }
  main .img-layout2 .img {
    width: 80%;
    text-align: center;
  }
}
main .img-layout3 {
  margin: 40px 0;
  overflow: hidden;
}
main .img-layout3 .img {
  float: right;
  margin: 0 0 20px 40px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  main .img-layout3 {
    margin: 30px 0;
    display: flex;
    flex-direction: column-reverse;
  }
  main .img-layout3 .img {
    float: none;
    margin: 25px 0 0;
  }
}
main .img-caption {
  margin-top: 10px;
  text-align: right;
  font-size: 1.2rem;
}
@media screen and (max-width: 767px) {
  main .img-caption {
    margin-top: 8px;
    font-size: 1rem;
  }
}
main .caption {
  margin-top: 10px;
  font-size: 1.2rem;
}
@media screen and (max-width: 767px) {
  main .caption {
    margin-top: 8px;
    font-size: 1rem;
  }
}
main a.inline-link {
  text-decoration: underline;
}
main a.inline-link:hover {
  text-decoration: none;
}
main a.text-link {
  color: #0070c9;
  text-decoration: underline;
}
main a.text-link:hover {
  color: #333;
  text-decoration: none;
}
main a.arw-link {
  display: inline-block;
  padding-left: 16px;
  background: url(/common/img/arw_link.png) no-repeat 0 center;
}
main a.arw-link + a.arw-link {
  margin-top: 8px;
}
@media screen and (max-width: 767px) {
  main a.arw-link {
    background-position: 0 8px;
  }
}
main a.blank-link:after {
  content: url(/common/img/ico_blank_blue.png);
  display: inline-block;
  margin-left: 5px;
}
main a.blank-link.gray:after {
  content: url(/common/img/ico_blank_gray.png);
}
main a.pdf-link {
  text-decoration: underline;
}
main a.pdf-link:hover {
  text-decoration: none;
}
main a.pdf-link:after {
  content: url(/common/img/ico_pdf.png);
  vertical-align: -2px;
  display: inline-block;
  margin-left: 5px;
}
main a.pdf-link.blue {
  color: #0070c9;
}
main a.pdf-link.blue:hover {
  color: #333;
}
main .pdf-btn {
  margin: 20px 0;
  display: block;
  border: 1px solid #c3c3c3;
  width: 285px;
  background: url(/en/sustainability/common/img/icon_pdf.webp) no-repeat 20px 50%;
  padding: 20px 0 20px 30px;
  text-align: center;
  font-weight: 700;
}
main .pdf-btn > span {
  position: relative;
  padding-left: 15px;
}
main .pdf-btn > span:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 8px;
  height: 8px;
  border-top: 2px solid #a3a3a3;
  border-right: 2px solid #a3a3a3;
  transform: translateY(-50%) rotate(45deg);
}
@media screen and (max-width: 767px) {
  main .pdf-btn {
    margin: 20px auto;
    font-size: 1.4rem;
  }
}
main .pdf-btn.no-icon {
  background: none;
  padding: 20px;
}
main .box-section {
  margin-top: 70px;
  border: 1px solid #c3c3c3;
  padding: 40px;
}
main .box-section + .box-section {
  margin-top: 0;
  border-top: none;
}
main .box-section.bg {
  background-color: #eaf3f9;
  border: none;
  padding: 30px;
}
main .box-section > .title {
  margin-bottom: 25px;
  text-align: center;
  font-size: 2rem;
}
main .box-section .sub-title {
  margin: 8px 0 3px;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  main .box-section {
    margin-top: 50px;
    padding: 20px;
  }
  main .box-section.bg {
    padding: 15px;
  }
  main .box-section > .title {
    margin-bottom: 15px;
    font-size: 1.8rem;
  }
}
main .cmn-table {
  margin: 30px 0 10px;
  width: 100%;
  border-top: 1px solid #e6e6e6;
  border-left: 1px solid #e6e6e6;
  text-align: left;
}
main .cmn-table th,
main .cmn-table td {
  border-right: 1px solid #e6e6e6;
  border-bottom: 1px solid #e6e6e6;
  padding: 12px 10px;
  vertical-align: middle;
  line-height: 1.3;
}
main .cmn-table th {
  background-color: #f0f0f0;
  font-weight: 400;
}
main .cmn-table.padding-s th,
main .cmn-table.padding-s td {
  padding: 10px 6px;
}
main .cmn-table.line-l th,
main .cmn-table.line-l td {
  line-height: 1.6;
}
main .cmn-table.th-center th {
  text-align: center;
}
main .cmn-table td.bg01 {
  background-color: var(--sus-color-employee);
  color: #fff;
  font-size: 1.8rem;
}
main .cmn-table td.bg02 {
  background-color: var(--sus-color-social);
  color: #fff;
  font-size: 1.8rem;
}
main .cmn-table td.bg03 {
  background-color: var(--sus-color-earth);
  color: #fff;
  font-size: 1.8rem;
}
main .cmn-table td.bg04 {
  background-color: var(--sus-color-organization);
  color: #fff;
  font-size: 1.8rem;
}
main .cmn-table td.bg05 {
  background-color: #f0f0f0;
}
main .cmn-table td.bg06 {
  background-color: #fafafa;
}
main .cmn-table td.bg07 {
  background-color: #e47e80;
}
main .cmn-table td.bg08 {
  background-color: #f4cc5f;
}
main .cmn-table td.bg09 {
  background-color: #3084c4;
  color: #fff;
}
main .cmn-table td.bg10 {
  background-color: #63a8e2;
}
main .cmn-table td.bg11 {
  background-color: #86bcec;
}
main .cmn-table td.bg12 {
  background-color: #5fc0c9;
}
main .cmn-table td.bg13 {
  background-color: #99d5a9;
}
main .cmn-table td.bg14 {
  background-color: #e4a784;
}
main .cmn-table td.bg15 {
  background-color: #dcc393;
}
main .cmn-table td.bg16 {
  background-color: #9eaadd;
}
main .cmn-table td.bg17 {
  background-color: #c7b1de;
}
main .cmn-table td.bg18 {
  background-color: #99d2d0;
}
main .cmn-table td.bg19 {
  background-color: #d6d6c8;
}
main .cmn-table td.color01 {
  color: var(--sus-color-employee);
  font-weight: 700;
}
main .cmn-table td.color02 {
  color: var(--sus-color-social);
  font-weight: 700;
}
main .cmn-table td.color03 {
  color: var(--sus-color-earth);
  font-weight: 700;
}
main .cmn-table td.color04 {
  color: var(--sus-color-organization);
  font-weight: 700;
}
main .cmn-table .sdgs-icon-header td {
  padding: 5px 9px;
  text-align: center;
  font-weight: 700;
}
main .cmn-table.gri {
  margin-top: 0;
}
main .cmn-table.gri th.bg06 {
  background-color: #fafafa;
  line-height: 1.6;
}
main .cmn-table.gri td {
  width: 30%;
}
main .cmn-table.gri td:nth-child(2),
main .cmn-table.gri td:last-child {
  width: 33%;
}
main .cmn-table.gri td {
  line-height: 1.6;
  word-break: break-all;
  vertical-align: top;
}
@media screen and (min-width: 768px) {
  main .cmn-table .pc-w50p {
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  main .cmn-table {
    margin: 15px 0 8px;
  }
  main .cmn-table th,
  main .cmn-table td {
    padding: 10px 8px;
  }
  main .cmn-table.sp-break th,
  main .cmn-table.sp-break td {
    display: block;
  }
  main .cmn-table td.bg01,
  main .cmn-table td.bg02,
  main .cmn-table td.bg03,
  main .cmn-table td.bg04 {
    font-size: 1.5rem;
  }
}
main .closeup {
  margin-top: 5px;
  line-height: 1.3;
}
main .closeup img {
  width: 70px;
}
@media screen and (max-width: 767px) {
  main .closeup img {
    width: 58px;
    vertical-align: -3px;
  }
}
main .scroll-area {
  position: relative;
  margin: 30px 0 10px;
}
main .scroll-area .inner {
  overflow-x: auto;
}
main .scroll-area .cmn-table {
  min-width: 1020px;
}
main .scroll-area .cmn-table.w670,
main .scroll-area .cmn-table.w720 {
  min-width: 0;
}
main .scroll-area .cmn-table.w1200 {
  min-width: 1200px;
}
@media screen and (max-width: 979px) {
  main .scroll-area {
    margin: 15px 0 8px;
  }
  main .scroll-area:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 40px;
    background: linear-gradient(to right, #0000, #00000026);
  }
  main .scroll-area.end:after {
    display: none;
  }
  main .scroll-area .cmn-table.w670 {
    min-width: 670px;
  }
  main .scroll-area .cmn-table.w720 {
    min-width: 720px;
  }
}
main .col-area {
  margin: 40px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
}
main .bg-title + .col-area {
  margin-top: 20px;
}
main .col-area.align-c {
  align-items: center;
}
main .col-area.align-end {
  align-items: flex-end;
}
main .col-area.caption-bottom > .column {
  display: flex;
  flex-direction: column;
}
main .col-area.caption-bottom > .column .img-caption {
  margin-top: auto;
}
main .col-area.reverse {
  flex-direction: row-reverse;
}
main .col-area .column {
  flex: 1 1 0%;
  width: auto;
}
main .col-area .column.w-auto {
  flex: 0 0 auto;
  width: auto !important;
}
main .col-area .column.w15p {
  flex: 15 1 0%;
  width: auto !important;
}
main .col-area .column.w20p {
  flex: 20 1 0%;
  width: auto !important;
}
main .col-area .column.w25p {
  flex: 25 1 0%;
  width: auto !important;
}
main .col-area .column.w30p {
  flex: 30 1 0%;
  width: auto !important;
}
main .col-area .column.w32p {
  flex: 32 1 0%;
  width: auto !important;
}
main .col-area .column.w35p {
  flex: 35 1 0%;
  width: auto !important;
}
main .col-area .column.w36p {
  flex: 36 1 0%;
  width: auto !important;
}
main .col-area .column.w39p {
  flex: 39 1 0%;
  width: auto !important;
}
main .col-area .column.w45p {
  flex: 45 1 0%;
  width: auto !important;
}
main .col-area .column.w50p {
  flex: 50 1 0%;
  width: auto !important;
}
main .col-area .column.w55p {
  flex: 55 1 0%;
  width: auto !important;
}
main .col-area .column.w56p {
  flex: 56 1 0%;
  width: auto !important;
}
main .col-area .column.w59p {
  flex: 59 1 0%;
  width: auto !important;
}
main .col-area .column.w60p {
  flex: 60 1 0%;
  width: auto !important;
}
main .col-area .column.w63p {
  flex: 63 1 0%;
  width: auto !important;
}
main .col-area .column.w65p {
  flex: 65 1 0%;
  width: auto !important;
}
main .col-area .column.w70p {
  flex: 70 1 0%;
  width: auto !important;
}
main .col-area .column.w75p {
  flex: 75 1 0%;
  width: auto !important;
}
main .col-area .column.w80p {
  flex: 80 1 0%;
  width: auto !important;
}
main .col-area .column.w100p {
  flex: 100 1 0%;
  width: auto !important;
}
main .col-area .column.col-1of2 {
  flex: 0 0 calc((100% - 32px) / 2);
  width: auto !important;
}
main .col-area .column.col-1of3 {
  flex: 0 0 calc((100% - 64px) / 3);
  width: auto !important;
}
main .col-area .column.col-2of3 {
  flex: 0 0 calc((100% - 64px) / 3 * 2 + 32px);
  width: auto !important;
}
main .col-area .column.col-1of4 {
  flex: 0 0 calc((100% - 96px) / 4);
  width: auto !important;
}
main .col-area .column.col-2of4 {
  flex: 0 0 calc((100% - 96px) / 2 + 32px);
  width: auto !important;
}
main .col-area .column.col-3of4 {
  flex: 0 0 calc((100% - 96px) * 0.75 + 64px);
  width: auto !important;
}
main .col-area .column.col-1of5 {
  flex: 0 0 calc((100% - 128px) / 5);
  width: auto !important;
}
main .col-area .column.col-2of5 {
  flex: 0 0 calc((100% - 128px) * 0.4 + 32px);
  width: auto !important;
}
main .col-area .column.col-3of5 {
  flex: 0 0 calc((100% - 128px) / 5 * 3 + 64px);
  width: auto !important;
}
main .col-area .column.col-4of5 {
  flex: 0 0 calc((100% - 128px) * 0.8 + 96px);
  width: auto !important;
}
@media screen and (max-width: 767px) {
  main .col-area {
    margin: 20px 0;
    flex-direction: column;
    gap: 8vw 0;
  }
  main .col-area.sp-reverse {
    flex-direction: column-reverse;
  }
  main .col-area .column {
    flex: none;
    width: 100% !important;
  }
  main .col-area .column[class*="of"] {
    flex: none !important;
    width: 100% !important;
  }
  main .col-area.sp-col2,
  main .col-area.sp-col3 {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8vw 16px;
  }
  main .col-area.sp-col2 > .column {
    flex: none;
    width: calc((100% - 16px) / 2) !important;
  }
  main .col-area.sp-col3 > .column {
    flex: none;
    width: calc((100% - 32px) / 3) !important;
  }
  main .sp-w10 {
    width: 10%;
    margin-left: auto;
    margin-right: auto;
  }
  main .sp-w20 {
    width: 20%;
    margin-left: auto;
    margin-right: auto;
  }
  main .sp-w30 {
    width: 30%;
    margin-left: auto;
    margin-right: auto;
  }
  main .sp-w40 {
    width: 40%;
    margin-left: auto;
    margin-right: auto;
  }
  main .sp-w50 {
    width: 50%;
    margin-left: auto;
    margin-right: auto;
  }
  main .sp-w60 {
    width: 60%;
    margin-left: auto;
    margin-right: auto;
  }
  main .sp-w70 {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
  }
  main .sp-w80 {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
  }
  main .sp-w90 {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
  main .sp-w100 {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}
main .media-area {
  display: flex;
  align-items: flex-start;
}
main .media-area.reverse {
  flex-direction: row-reverse;
}
main .media-area > * {
  flex-shrink: 0;
}
main .media-area > *:last-child {
  flex: 1;
}
main .media-area.reverse > *:last-child {
  flex: none;
}
main .media-area.reverse > *:first-child {
  flex: 1;
}
main .self-start {
  align-self: flex-start;
}
main .self-center {
  align-self: center;
}
main .self-end {
  align-self: flex-end;
}
@media screen and (max-width: 767px) {
  main .media-area,
  main .media-area.reverse {
    flex-direction: column;
  }
}
main .lead-area {
  position: relative;
  margin: 100px 0 50px;
  display: table;
  width: 100%;
}
main .lead-area .inner {
  position: relative;
}
main .lead-area h2 {
  margin-bottom: 15px;
  font-size: 2.8rem;
  line-height: 1.3;
}
main .lead-area h2 strong {
  color: #235ea7;
  font-weight: 400;
}
main .lead-area.governance h2 strong {
  color: #22aee3;
}
@media screen and (max-width: 767px) {
  main .lead-area {
    margin: 60px 0 20px;
  }
  main .lead-area:before {
    top: 10px;
    left: -10vw;
    width: 6px;
  }
  main .lead-area h2 {
    margin-bottom: 10px;
    font-size: 1.8rem;
  }
}
main .slide-area {
  position: relative;
  z-index: 1;
  max-width: 1320px;
  margin: 0 auto 60px;
  padding: 0 60px;
}
main .slide-area .slide {
  position: relative;
  padding-top: 33.33%;
}
main .slide-area .slide li {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
}
main .slide-area .slide li:first-child {
  z-index: 20;
}
main .slide-area .btn {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 60px;
  height: 60px;
  margin: auto 0;
  cursor: pointer;
  transition: opacity 0.2s;
}
main .slide-area .btn:hover {
  opacity: 0.7;
}
main .slide-area .btn.left {
  left: 0;
}
main .slide-area .btn.right {
  right: 0;
}
main .slide-area .btn:after {
  content: "";
  position: absolute;
  top: 50%;
  width: 30px;
  height: 30px;
  border-top: 2px solid #b4b4b4;
}
main .slide-area .btn.left:after {
  left: 10px;
  border-left: 2px solid #b4b4b4;
  transform-origin: left top;
  transform: rotate(-45deg);
}
main .slide-area .btn.right:after {
  right: 10px;
  border-right: 2px solid #b4b4b4;
  transform-origin: right top;
  transform: rotate(45deg);
}
main .slide-area .curmark {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -30px;
  display: flex;
  justify-content: center;
  gap: 10px;
}
main .slide-area .curmark li {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #a5a5a5;
}
main .slide-area .curmark li.current {
  background-color: #0070c9;
}
@media screen and (max-width: 767px) {
  main .slide-area {
    margin: 0 auto 50px;
    padding: 0;
  }
  main .slide-area .slide {
    padding-top: 61.33%;
  }
  main .slide-area .btn {
    display: none;
  }
  main .slide-area .curmark {
    bottom: -24px;
  }
  main .slide-area .curmark li {
    width: 12px;
    height: 12px;
  }
}
main .main-menu {
  margin-bottom: 70px;
  background-color: #f6f6f6;
  padding: 60px 20px;
}
main .main-menu .inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
main .main-menu .inner .column {
  width: 23.5%;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
main .main-menu .btn {
  position: relative;
  display: flex;
  align-items: center;
  height: 100px;
  background-color: #fff;
  padding: 10px 10px 10px 35px;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.3;
  transition: all 0.5s;
  backface-visibility: visible;
}
main .main-menu .btn.sizeL {
  height: 224px;
}
main .main-menu .btn:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 18px;
  width: 8px;
  height: 8px;
  border-top: 2px solid #a3a3a3;
  border-right: 2px solid #a3a3a3;
  transform-origin: right top;
  transform: rotate(45deg);
}
main .main-menu .btn:hover {
  transform: scale(1.03);
  border-color: #0070c966;
  box-shadow: 2px 2px 20px #0070c926;
  color: #235ea7;
  opacity: 1;
}
@media screen and (max-width: 1000px) {
  /* 無効化: body.en main .main-menu .btn {font-size:1.6rem} */
}
@media screen and (max-width: 767px) {
  main .main-menu {
    margin-bottom: 50px;
    padding: 30px 3%;
  }
  main .main-menu .inner {
    flex-direction: column;
    gap: 13px;
  }
  main .main-menu .inner .column {
    width: 100%;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 13px 3.6%;
  }
  main .main-menu .btn {
    width: 48.2%;
    height: 70px;
    padding: 10px 10px 10px 26px;
    font-size: 1.2rem !important;
  }
  main .main-menu .btn.sizeL {
    width: 100%;
    height: 70px;
  }
  main .main-menu .btn:before {
    left: 10px;
  }
}
main .theme-title {
  position: relative;
  margin-bottom: 25px;
  text-align: center;
  font-size: 2.6rem;
  font-weight: 700;
}
main .theme-title strong {
  color: #235ea7;
}
@media screen and (max-width: 767px) {
  main .theme-title {
    margin-bottom: 18px;
    font-size: 1.8rem;
  }
}
main .img-menu {
  margin-bottom: 40px;
  display: flex;
  flex-wrap: wrap;
  gap: 20px 5%;
}
main .img-menu > li {
  width: 47.5%;
}
main .img-menu a {
  display: block;
  text-align: center;
  font-size: 1.8rem;
  font-weight: 700;
}
main .img-menu li:nth-child(1) a {
  color: var(--sus-color-employee);
}
main .img-menu li:nth-child(2) a {
  color: var(--sus-color-social);
}
main .img-menu li:nth-child(3) a {
  color: var(--sus-color-earth);
}
main .img-menu li:nth-child(4) a {
  color: var(--sus-color-organization);
}
main .img-menu a > span {
  position: relative;
  margin-top: 5px;
  display: inline-block;
  padding-left: 16px;
}
main .img-menu a > span:before {
  content: "";
  position: absolute;
  top: 45%;
  left: 0;
  width: 8px;
  height: 8px;
  border-top: 2px solid #a3a3a3;
  border-right: 2px solid #a3a3a3;
  transform-origin: right top;
  transform: rotate(45deg);
}
main .img-menu a .img-area {
  overflow: hidden;
}
main .img-menu a img {
  transition: all 1s;
}
main .img-menu a:hover {
  opacity: 1;
}
main .img-menu a:hover img {
  transform: scale(1.15);
}
@media screen and (max-width: 767px) {
  main .img-menu > li {
    width: 100%;
  }
  main .img-menu a {
    font-size: 1.2rem;
  }
  main .img-menu a > span {
    padding-left: 14px;
  }
}
main .box-menu {
  margin-bottom: 80px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 24px 2%;
}
main .box-menu li {
  width: 32%;
}
main .box-menu li.sizeL {
  width: 100%;
}
main .box-menu a {
  display: flex;
  align-items: center;
  gap: 4px;
  border: 1px solid #c3c3c3;
  height: 100%;
  padding: 7px 15px 7px 6px;
  font-weight: 700;
  line-height: 1.3;
  transition: all 0.5s;
  backface-visibility: visible;
}
main .box-menu a:hover {
  transform: scale(1.03);
  border-color: #0070c966;
  box-shadow: 2px 2px 20px #0070c926;
  color: #235ea7;
  opacity: 1;
}
main .box-menu li.sizeL a {
  justify-content: center;
  padding: 12px 15px 12px 6px;
  font-size: 1.8rem;
}
@media screen and (max-width: 767px) {
  main .box-menu {
    margin-bottom: 45px;
    gap: 13px 3.6%;
  }
  main .box-menu li {
    width: 48.2%;
  }
  main .box-menu a {
    padding: 5px 15px 5px 6px;
  }
  main .box-menu li.sizeL a {
    padding: 14px 15px 14px 6px;
    font-size: 1.2rem;
  }
  main .box-menu a img {
    width: 40px;
  }
}
@media screen and (max-width: 350px) {
  main .box-menu a {
    font-size: 1.1rem;
  }
  main .box-menu a img {
    width: 34px;
  }
}
main .summary-area {
  position: relative;
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  align-items: flex-start;
}
main .summary-area .img {
  margin-right: -6.67%;
  width: 73.33%;
}
main .summary-area .textarea {
  position: relative;
  width: 31%;
  border-left: 10px solid;
  padding-left: 2.5%;
}
main .summary-area.noline .textarea {
  border-left: none;
  padding-left: 0;
}
main .summary-area.color01 .textarea {
  border-left-color: var(--sus-color-employee);
}
main .summary-area.color02 .textarea {
  border-left-color: var(--sus-color-social);
}
main .summary-area.color03 .textarea {
  border-left-color: var(--sus-color-earth);
}
main .summary-area.color04 .textarea {
  border-left-color: var(--sus-color-organization);
}
main .summary-area .lead {
  margin-bottom: 35px;
  font-size: 2.8rem;
  line-height: 1.3;
}
main .summary-area h2 {
  margin: 35px 0 10px;
  border-bottom: 2px solid #ccc;
  font-weight: 700;
}
main .summary-area strong {
  color: #235ea7;
  font-weight: inherit;
}
main .summary-area.color01 strong {
  color: var(--sus-color-employee);
}
main .summary-area.color02 strong {
  color: var(--sus-color-social);
}
main .summary-area.color03 strong {
  color: var(--sus-color-earth);
}
main .summary-area.color04 strong {
  color: var(--sus-color-organization);
}
main .summary-area .anchor a {
  position: relative;
  display: inline-block;
  padding-left: 18px;
}
main .summary-area .anchor a:before {
  content: "";
  position: absolute;
  top: 5px;
  left: 3px;
  width: 8px;
  height: 8px;
  border-right: 2px solid #a3a3a3;
  border-bottom: 2px solid #a3a3a3;
  transform: rotate(45deg);
}
main .summary-area .icon {
  margin-top: 15px;
  display: flex;
  align-items: flex-end;
  gap: 2.2%;
}
main .summary-area .icon li {
  width: 26.7%;
}
main .summary-area .icon li.sizeS {
  width: 20%;
}
main .summary-area .subArea {
  margin-top: 20px;
  border-top: 2px solid #ccc;
  padding-top: 20px;
}
main .summary-area .subArea p:before {
  content: "■";
  color: #45a943;
}
@media screen and (max-width: 767px) {
  main .summary-area {
    display: block;
  }
  main .summary-area .img {
    width: auto;
    margin: 0 -3vw 20px 0;
  }
  main .summary-area .textarea {
    width: auto;
    border-left-width: 6px;
    padding-left: 4%;
  }
  main .summary-area .lead {
    margin-bottom: 20px;
    font-size: 1.8rem;
  }
  main .summary-area h2 {
    margin: 12px 0 6px;
  }
  main .summary-area .anchor a {
    padding-left: 16px;
  }
  main .summary-area .anchor a:before {
    width: 7px;
    height: 7px;
  }
  main .summary-area .icon {
    max-width: 400px;
  }
  main .summary-area .subArea {
    margin-top: 12px;
    padding-top: 12px;
  }
}
main .employee-comment {
  overflow: hidden;
}
main .employee-comment img {
  float: left;
  max-width: 90px;
  margin-right: 20px;
}
main .employee-comment .text {
  overflow: hidden;
}
main .employee-comment .person {
  margin-top: 10px;
  text-align: right;
  font-size: 1.2rem;
}
@media screen and (max-width: 767px) {
  main .employee-comment img {
    width: 17%;
    margin-right: 3%;
  }
  main .employee-comment .person {
    margin-top: 5px;
    font-size: 1rem;
  }
}
main .vision-main {
  max-width: 1360px;
  height: 762px;
  margin: 0 auto 70px;
  background: url(/en/sustainability/img/vision_main_bg.webp) no-repeat 50% 50%;
  display: flex;
  align-items: center;
  overflow: hidden;
  font-size: 1.6rem;
}
main .vision-main .contents-area {
  width: 100%;
  max-width: 920px;
  margin: 0 auto;
}
main .vision-main .lead-area:before {
  top: 40px;
}
main .vision-main .lead {
  font-size: 2rem;
}
@media screen and (max-width: 767px) {
  main .vision-main {
    margin: 0 auto 40px;
    font-size: 1.4rem;
  } /* 無効化: body.en main .vision-main {font-size:1.2rem} */
  main .vision-main .lead {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 375px) {
  main .vision-main {
    height: 776px;
    background-size: auto 100%;
  }
}
@media screen and (max-width: 350px) {
  /* 無効化: body.en main .vision-main {font-size:1.1rem} */
}
main .vision-title {
  margin: -25px 0 40px;
  text-align: center;
  font-size: 2.8rem;
}
@media screen and (max-width: 767px) {
  main .vision-title {
    margin: -20px 0 20px;
    font-size: 1.8rem;
  }
}
main .vision-list > li {
  margin-bottom: 35px;
  display: flex;
  align-items: flex-start;
}
main .vision-list .title {
  margin-right: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #f6f6f6;
  padding: 8px 15px;
  width: 350px;
  flex-shrink: 0;
  font-size: 2rem;
}
main .vision-list .title .eng {
  opacity: 0.6;
  font-size: 1.4rem;
}
main .vision-list .body {
  align-self: center;
}
main .vision-list .philosophy {
  font-size: 2.8rem;
}
@media screen and (max-width: 767px) {
  main .vision-list > li {
    margin-bottom: 15px;
    display: block;
  }
  main .vision-list .title {
    margin: 0 0 10px;
    padding: 5px;
    width: 100%;
    font-size: 1.6rem;
  }
  main .vision-list .title .eng {
    font-size: 1.2rem;
  }
  main .vision-list .philosophy {
    font-size: 1.8rem;
  }
}
main .history .section {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-left: 30px solid #ededed;
  padding-left: 20px;
}
main .history .section:before {
  content: "";
  position: absolute;
  left: 20px;
  right: 0;
  bottom: 0;
  border-bottom: 1px solid #c3c3c3;
}
main .history .section:after {
  content: "";
  position: absolute;
  right: 24%;
  bottom: -12px;
  border-top: 13px solid #005fad;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
}
main .history .section:last-child:after {
  display: none;
}
main .history .chronology {
  align-self: stretch;
  width: 48%;
}
main .history .chronology .inner {
  position: relative;
  display: flex;
  align-items: center;
  gap: 25px;
  height: 100%;
  min-height: 320px;
  padding: 15px 0;
}
main .history .chronology.row2 .inner {
  height: auto;
}
main .history .chronology .inner:before {
  content: "";
  position: absolute;
  top: 0;
  left: -50px;
  border-top: 9px solid #fff;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
}
main .history .chronology .inner:after {
  content: "";
  position: absolute;
  left: -50px;
  bottom: 0;
  width: 30px;
  height: 47px;
  background: url(/en/sustainability/img/philosophy_line_01.webp) no-repeat 0 0;
}
main .history .section:last-child .chronology .inner:after {
  background-image: url(/en/sustainability/img/philosophy_line_02.webp);
}
main .history .chronology .period {
  flex-shrink: 0;
}
main .history .chronology li + li {
  margin-top: 15px;
}
main .history .chronology .year {
  float: left;
  width: 70px;
  font-weight: 700;
}
main .history .chronology p {
  overflow: hidden;
}
main .history .summary {
  position: relative;
  width: 49.57%;
  margin: 20px 0;
  padding-right: 20.87%;
}
main .history .summary.wide {
  padding-right: 0;
}
main .history .summary .img {
  position: absolute;
  top: 0;
  right: 0;
  width: 38.6%;
}
main .history .summary .float-img {
  float: right;
  margin: 0 0 5px 10px;
}
@media screen and (max-width: 767px) {
  main .history .section {
    flex-direction: column;
    padding: 0 0 35px 15px;
  }
  main .history .section:before {
    left: 15px;
  }
  main .history .section:after {
    right: 49%;
  }
  main .history .chronology {
    width: auto;
    padding: 10px 0;
  }
  main .history .chronology .inner {
    position: static;
    gap: 10px;
    min-height: 145px;
    padding: 10px 0;
  }
  main .history .chronology.row2 .inner:first-child {
    position: relative;
  }
  main .history .chronology .inner:before {
    left: -30px;
  }
  main .history .chronology .inner:after {
    left: -30px;
  }
  main .history .chronology.row2 .inner:first-child:before {
    top: 100%;
    left: -45px;
  }
  main .history .chronology.row2 .inner:first-child:after {
    left: -45px;
  }
  main .history .chronology .period {
    width: 100px;
    margin-left: -40px;
  }
  main .history .chronology li + li {
    margin-top: 12px;
  }
  main .history .chronology .year {
    width: 42px;
  }
  main .history .summary {
    width: auto;
    margin: 0;
    padding-right: 0;
  }
  main .history .summary .img {
    position: static;
    margin: 20px auto 0;
    width: 80%;
    max-width: 250px;
    text-align: center;
  }
}
main .business-area {
  display: flex;
  flex-wrap: wrap;
  gap: 30px 2%;
}
main .business-area > li {
  width: 32%;
}
main .business-area h3 {
  position: relative;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  height: 100px;
  background-color: #f6f6f6;
  padding: 0 100px 0 20px;
  font-size: 1.8rem;
  font-weight: 700;
}
main .business-area h3 img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto 0;
}
@media screen and (max-width: 767px) {
  main .business-area {
    gap: 20px;
  }
  main .business-area > li {
    width: 100%;
  }
  main .business-area h3 {
    margin-bottom: 10px;
    height: 80px;
    padding: 0 85px 0 15px;
    font-size: 1.6rem;
  }
  main .business-area h3 img {
    width: 80px;
  }
}
main .message-main {
  position: relative;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto 150px;
  padding: 0 20px;
}
main .message-main:after {
  content: "";
  display: block;
  z-index: 0;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, #fffc 0% 50%, #fff0);
  backdrop-filter: blur(2px);
}
main .message-main .text {
  z-index: 1;
  position: absolute;
  top: 0;
  left: 16%;
  bottom: 0;
  width: 32%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  .text-inner {
    .text-inner-title {
      font-size: min(2.2vw, 2.6rem);
      font-weight: 500;
      color: #454649;
      margin: 0 0 20px;
      text-wrap: nowrap;
    }
  }
  .text-inner-img {
    img {
      width: 220px;
    }
  }
}
@media screen and (max-width: 767px) {
  main .message-main {
    padding: 0 3%;
    margin: 0 auto 60px;
  }
  main .message-main:after {
    display: none;
  }
  main .message-main .text {
    position: static;
    width: 100%;
    padding: 7vw 2vw 3vw 0;
    .text-inner {
      .text-inner-title {
        font-size: min(5vw, 3.2rem);
        margin: 0 0 20px;
        text-wrap: auto;
      }
    }
    .text-inner-bottom {
      width: 90%;
    }
    .text-inner-img {
      img {
        width: min(50vw, 160px);
      }
    }
    .text-inner-text {
      font-size: min(3.2vw, 2.4rem);
    }
  }
  main .message-main .text img {
    width: 85%;
  }
}
main .toggle-list {
  border-top: 1px solid #c3c3c3;
}
main .toggle-list > li {
  position: relative;
  border-bottom: 1px solid #c3c3c3;
}
main .toggle-list .title {
  background: url(/en/sustainability/common/img/icon_open.webp) no-repeat 20px 48%;
  background-size: 20px 20px;
  padding: 30px 40px 30px 55px;
  font-size: 1.8rem;
  font-weight: 700;
  cursor: pointer;
  line-height: 1.3;
  width: 100%;
  text-align: left;
}
main .toggle-list.has-icon .title {
  padding: 20px 30px 20px 55px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
}
main .toggle-list .title.open {
  background-image: url(/en/sustainability/common/img/icon_close.webp);
}
main .toggle-list .title.no-toggle {
  background: none;
  cursor: default;
}
main .toggle-list .sdgs-icon {
  display: flex;
  gap: 8px;
}
main .toggle-list .sdgs-icon li {
  width: 76px;
}
main .toggle-list .body {
  display: none;
  padding: 0 40px 25px 55px;
}
@media screen and (max-width: 767px) {
  main .toggle-list .title {
    background-position: 0 48%;
    padding: 20px 0 20px 30px;
    font-size: 1.6rem;
  }
  main .toggle-list.has-icon .title {
    padding: 9px 0 9px 30px;
  }
  main .toggle-list .sdgs-icon {
    gap: 5px;
  }
  main .toggle-list .sdgs-icon li {
    width: 50px;
  }
  main .toggle-list .body {
    padding: 0 0 20px 30px;
  }
}
main .step-box {
  position: relative;
  margin-top: 70px;
  border: 1px solid #c3c3c3;
  padding: 40px;
}
main .step-box.step2:before {
  content: "";
  position: absolute;
  top: -71px;
  left: 0;
  right: 0;
  width: 70px;
  height: 70px;
  margin: 0 auto;
  background: url(/en/sustainability/common/img/step_arrow_01.webp) no-repeat 0 0;
}
main .step-box.step3:before {
  content: "";
  position: absolute;
  top: -71px;
  left: 0;
  right: 0;
  width: 110px;
  height: 70px;
  margin: 0 auto;
  background: url(/en/sustainability/common/img/step_arrow_02.webp) no-repeat 0 0;
}
main .step-box h3 {
  margin-bottom: 25px;
  text-align: center;
  font-size: 2.8rem;
}
main .step-box h3 span {
  display: block;
  color: #235ea7;
  font-size: 2rem;
}
main .step-box .img-col {
  position: relative;
  padding-right: 390px;
  min-height: 240px;
}
main .step-box .img-col .img {
  position: absolute;
  top: 0;
  right: 0;
}
@media screen and (max-width: 767px) {
  main .step-box {
    margin-top: 35px;
    padding: 20px;
  }
  main .step-box.step2:before {
    top: -36px;
    width: 35px;
    height: 35px;
    background-size: contain;
  }
  main .step-box.step3:before {
    top: -36px;
    width: 55px;
    height: 35px;
    background-size: contain;
  }
  main .step-box h3 {
    margin-bottom: 20px;
    font-size: 1.8rem;
  }
  main .step-box h3 span {
    font-size: 1.8rem;
  }
  main .step-box .img-col {
    padding-right: 0;
  }
  main .step-box .img-col .img {
    position: static;
    display: block;
    margin: 15px auto 0;
  }
}
main .step-repeat {
  position: relative;
  margin-top: 70px;
  text-align: center;
  color: #235ea7;
  font-size: 2.8rem;
}
main .step-repeat:before {
  content: "";
  position: absolute;
  top: -33px;
  left: 0;
  right: 0;
  width: 0;
  margin: 0 auto;
  border-top: 13px solid #005fad;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
}
@media screen and (max-width: 767px) {
  main .step-repeat {
    margin-top: 45px;
    font-size: 1.8rem;
  }
  main .step-repeat:before {
    top: -25px;
  }
}
main .person-list {
  font-size: 1.2rem;
  letter-spacing: -0.06em;
  line-height: 1.6;
}
main .person-list span {
  display: inline-block;
  font-weight: 700;
}
main .person-list li + li {
  margin-top: 5px;
}
@media screen and (max-width: 767px) {
  main .person-list {
    font-size: 1rem;
    letter-spacing: 0;
  }
}
main .symposium {
  margin-bottom: 60px;
}
main .symposium .comment {
  margin-bottom: 12px;
}
main .symposium .comment .name {
  float: left;
  margin-right: 1em;
  font-weight: 700;
} /* 無効化: body.en main .symposium .comment .name {width:80px} */
main .symposium .comment .name.line {
  position: relative;
  width: 2em;
  height: 1.78em;
}
main .symposium .comment .name.line:after {
  content: "";
  position: absolute;
  top: 45%;
  left: 0;
  right: 0;
  border-top: 1px solid #333;
}
main .symposium .comment p,
main .symposium .comment .comment-body {
  overflow: hidden;
}
main .symposium .img-col {
  position: relative;
  padding-right: 335px;
}
main .symposium .img-col img {
  position: absolute;
  top: 0;
  right: 0;
  width: 320px;
}
@media screen and (max-width: 767px) {
  main .symposium {
    margin-bottom: 30px;
  }
  main .symposium .comment {
    margin-bottom: 8px;
  } /* 無効化: body.en main .symposium .comment .name {width:69px} */
  main .symposium .img-col {
    padding-right: 0;
  }
  main .symposium .img-col img {
    position: static;
    display: block;
    margin: 15px auto 20px;
    max-width: 95%;
  }
}
main .box-layout {
  display: flex;
  flex-wrap: wrap;
  gap: 25px 2%;
}
main .box-layout .box {
  border: 1px solid #e5e5e5;
  padding: 0 20px 20px;
  width: 32%;
}
main .box-layout .box04 {
  width: 100%;
  text-align: center;
}
main .box-layout h3 {
  margin: 0 -20px 18px;
  padding: 12px;
  text-align: center;
  color: #fff;
  font-weight: 700;
}
main .box-layout .box01 h3 {
  background-color: var(--sus-color-employee);
}
main .box-layout .box02 h3 {
  background-color: var(--sus-color-social);
}
main .box-layout .box03 h3 {
  background-color: var(--sus-color-earth);
}
main .box-layout .box04 h3 {
  background-color: var(--sus-color-organization);
}
main .box-layout .icon {
  margin-bottom: 15px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  main .box-layout .box {
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  main #news {
    display: table;
    margin-top: 25px;
  }
  main #news div {
    display: table-cell;
    width: 50%;
    box-sizing: border-box;
    position: relative;
  }
  main #news div:first-child {
    border-right: solid 50px #fff;
  }
  main #news div:last-child {
    border-left: solid 50px #fff;
  }
  main #news div h2 {
    font-size: 2.6rem;
    font-weight: 700;
    margin-bottom: 30px;
  }
  main #news dl {
    font-size: 1.6rem;
    line-height: 1.5;
  }
  main #news dt {
    padding: 15px 0 10px;
  }
  main #news dt:after {
    width: 180px;
  }
  main #news dd {
    display: block;
    padding: 0 0 15px;
    border-bottom: solid 1px #e9e9e9;
  }
  main #news dd a {
    display: block;
  }
  main #news dd a.pdf:after {
    content: url(/common/img/ico_pdf.png);
    margin-left: 12px;
  }
  main #news dd a:hover {
    text-decoration: underline;
  }
  main #news .to-list {
    position: absolute;
    right: 0;
    top: 0;
  }
  main #news .to-list a {
    font-size: 1.4rem;
    line-height: 1;
    background: url(/img/arw_link.png) no-repeat 12px center;
    display: block;
    padding: 13px 12px 11px 30px;
  }
}
@media screen and (max-width: 767px) {
  main #news h2 {
    font-size: 1.8rem;
    line-height: 1;
    margin: 30px 0 13px;
  }
  main #news dl {
    font-size: 1.2rem;
    line-height: 1.5;
    margin: 0 -10px;
    border-top: solid 1px #e9e9e9;
  }
  main #news dt {
    padding: 10px 10px 0;
  }
  main #news dt:after {
    width: 160px;
  }
  main #news dl dd {
    display: block;
    border-bottom: solid 1px #e9e9e9;
  }
  main #news dl dd a {
    display: block;
    padding: 5px 30px 10px 10px;
    position: relative;
  }
  main #news dl dd a:not(.pdf):after {
    margin-top: -17px;
  }
  main #news dl dd a:after {
    margin-top: -17px;
  }
  main #news dl dd a.pdf:after {
    content: url(/common/img/ico_pdf.png);
    margin-top: -23px;
    position: absolute;
    right: 10px;
    top: 50%;
  }
  main .to-list {
    display: block;
    margin-top: 15px;
  }
  main .to-list a {
    font-size: 1.2rem;
    line-height: 1;
    background: #f4f4f4;
    text-align: center;
    display: block;
    padding: 14px 0;
    position: relative;
  }
  main #news dl dd a:not(.pdf):after,
  main .to-list a:after {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    margin-top: -4px;
    border-top: solid 2px #9c9c9c;
    border-right: solid 2px #9c9c9c;
    position: absolute;
    right: 14px;
    top: 50%;
    transform: rotate(45deg);
  }
}
@media screen and (min-width: 768px) {
  main .intro {
    width: 1000px;
    margin: 50px auto 0;
  }
  main .intro .txtArea {
    overflow: hidden;
  }
  main .intro .txtArea dl {
    font-size: 1.4rem;
    line-height: 1.5;
    margin: 0 0 50px 30px;
  }
  main .intro figure.csr-pdf {
    float: left;
    margin: 0 70px 30px 0;
  }
  main .intro .txtArea ul li,
  main .intro .txtArea ol li {
    font-size: 1.4rem;
    line-height: 2;
    margin-left: 20px;
  }
  main .intro .txtArea ul li {
    list-style: disc;
  }
  main .intro .txtArea ol li {
    list-style: decimal;
  }
  main .intro .mark-list li {
    font-size: 1.2rem !important;
    line-height: 2;
    text-indent: -2em !important;
    margin: 0 0 0 2em !important;
    padding: 0;
    list-style: none !important;
  }
  main .ebook > li {
    margin: 20px 20px 0 !important;
    list-style: none !important;
  }
  main .ebook > li > a {
    font-size: 1.6rem;
    background: url(/common/img/arw_link.png) no-repeat 0 13px;
    display: inline-block;
    padding: 0 0 0 20px;
  }
  main .ebook ul {
    margin: 10px 0 0 20px;
  }
  main .ebook a.pdf:after {
    content: url(/common/img/ico_pdf.png);
    vertical-align: middle;
    display: inline-block;
    margin-left: 10px;
  }
}
@media screen and (max-width: 767px) {
  main .intro {
    margin: 30px auto 0;
    padding: 0 10px;
  }
  main .intro h2 {
    font-size: 1.7rem;
    line-height: 1.5;
    display: block;
    margin-bottom: 15px;
    position: relative;
  }
  main section + section.intro h2 {
    padding-top: 20px;
  }
  main .intro h2:after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    margin-top: 10px;
    border-top: dotted 1px #e3e3e3;
    border-bottom: dotted 1px #e3e3e3;
    box-sizing: content-box;
  }
  main .intro .txtArea {
    overflow: hidden;
  }
  main .intro .txtArea dl {
    font-size: 1.2rem;
    line-height: 1.5;
    margin: 0 0 25px 20px;
  }
  main .intro .txtArea ul li,
  main .intro .txtArea ol li {
    font-size: 1.2rem;
    line-height: 2;
    margin-left: 20px;
  }
  main .intro .txtArea ul li {
    list-style: disc;
  }
  main .intro .txtArea ol li {
    list-style: decimal;
  }
  main .intro .txtArea ol ul.no-none li {
    list-style: disc;
  }
  main .intro .txtArea .mark-list li {
    font-size: 1rem;
    line-height: 2;
    text-indent: -2em;
    margin: 0 0 0 2em;
    padding: 0;
    list-style: none;
  }
  main .ebook > li {
    margin: 0 5px 20px !important;
    list-style: none !important;
  }
  main .ebook > li > a {
    font-size: 1.4rem;
    background: url(/common/img/arw_link.png) no-repeat 0 10px;
    display: block;
    padding: 0 0 0 12px;
  }
  main .ebook ul {
    margin: 0 0 0 20px;
  }
  main .ebook a.pdf:after {
    content: url(/common/img/ico_pdf.png);
    vertical-align: middle;
    display: inline-block;
    margin-left: 10px;
  }
  main .all-page figure {
    text-align: center !important;
    float: none !important;
    width: 100% !important;
    margin: 20px 0 !important;
  }
}
@media screen and (min-width: 768px) {
  main .topics-title {
    width: 100%;
    min-width: 980px;
    max-width: 1200px;
    margin: auto;
    position: relative;
  }
  main .topics-title h1 {
    font-size: 3.2rem;
    line-height: 1.5;
    font-weight: 500;
    margin: -23px auto 57px !important;
  }
  main .topics-title h1 + p {
    font-size: 1.6rem;
    line-height: 1.6;
    text-align: center;
  }
  main .topics-title figure {
    text-align: center;
    margin-top: 50px;
  }
  main .ikukyu {
    font-size: 1.6rem !important;
    line-height: 1.75 !important;
  }
  main .ikukyu dt {
    font-weight: 700;
  }
  main .ikukyu dt.naka {
    color: #938d45;
  }
  main .ikukyu dt.una {
    color: #457593;
  }
  main .ikukyu dt.hata {
    color: #93456f;
  }
  main .ikukyu dt.matu {
    color: #5d9345;
  }
  main .ikukyu dd .mark-list {
    margin: 20px 0 0 !important;
  }
  main .ikukyu dd {
    margin: -1.75em 0 30px 100px !important;
  }
  main .pare_img {
    float: right;
    margin: 0 0 30px 70px;
  }
}
@media screen and (max-width: 767px) {
  main .topics-title {
    padding: 0 10px;
  }
  main .topics-title h1 {
    font-size: 2rem;
    font-weight: 500;
    margin: 0;
    padding: 18px 0 5px;
    text-align: left;
    line-height: normal;
  }
  main .topics-title h1 + p {
    font-size: 1rem;
    line-height: 1.7;
  }
  main .topics-title figure {
    text-align: center;
    margin-top: 30px;
  }
  main .ikukyu {
    font-size: 1.4rem !important;
    line-height: 1.75 !important;
  }
  main .ikukyu dt {
    font-weight: 700;
  }
  main .ikukyu dt.naka {
    color: #938d45;
  }
  main .ikukyu dt.una {
    color: #457593;
  }
  main .ikukyu dt.hata {
    color: #93456f;
  }
  main .ikukyu dt.matu {
    color: #5d9345;
  }
  main .ikukyu dd {
    margin: -1.75em 0 30px 60px !important;
  }
  main .ikukyu dd .mark-list {
    margin: 20px 0 0 !important;
  }
  main .pare_img {
    float: right;
    width: 46.47%;
    margin: 0 0 20px 15px;
  }
}
main .topic-box {
  margin: 25px 0;
  border: 5px solid;
  padding: 35px 40px;
}
main .topic-box.color01 {
  border-color: #f6dae1;
}
main .topic-box.color02 {
  border-color: #fae5ce;
}
main .topic-box h3 {
  margin-bottom: 25px;
  text-align: center;
  font-size: 2.8rem;
  line-height: 1.3;
}
main .topic-box .img {
  float: left;
  margin: 0 40px 15px 0;
}
@media screen and (max-width: 767px) {
  main .topic-box {
    border-width: 3px;
    padding: 15px;
  }
  main .topic-box h3 {
    margin-bottom: 15px;
    font-size: 1.6rem;
  }
  main .topic-box .img {
    float: none;
    text-align: center;
    margin: 0 0 15px;
  }
}
main .gray-box {
  background-color: #f6f6f6;
  padding: 15px 20px;
}
main .interact-list {
  margin: 30px 0;
  display: flex;
  justify-content: space-between;
}
main .interact-list > li {
  width: 18.6%;
  background-color: #f6f6f6;
  padding: 20px 15px 18px;
  text-align: center;
}
main .interact-list h3 {
  margin: 12px 0 20px;
  font-weight: 700;
}
main .interact-list ul li {
  position: relative;
  padding-left: 0.8em;
  text-align: left;
  line-height: 1.4;
}
main .interact-list ul li:before {
  content: "●";
  position: absolute;
  top: 5px;
  left: 0;
  font-size: 50%;
}
main .interact-list ul li + li {
  margin-top: 8px;
}
@media screen and (max-width: 767px) {
  main .interact-list {
    margin: 20px 0;
    flex-wrap: wrap;
    gap: 20px 0;
  }
  main .interact-list > li {
    width: 48%;
  }
}
main .environment_box {
  margin-top: 30px;
  border: 5px solid #d0e9d0;
  padding: 40px 40px 35px;
}
main .environment_box .bg-title {
  background-color: #e3f2e3;
}
@media screen and (max-width: 767px) {
  main .environment_box {
    margin-top: 25px;
    border: 3px solid #d0e9d0;
    padding: 20px 15px 15px;
  }
}
main .right_img_box {
  display: flex;
  justify-content: space-between;
}
main .right_img_box .left {
  width: 750px;
}
@media screen and (max-width: 767px) {
  main .right_img_box {
    display: block;
  }
  main .right_img_box .left {
    width: 100%;
  }
  main .right_img_box .right {
    width: 100%;
    text-align: center;
  }
}
main .anchor-btn {
  margin-bottom: 80px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
}
main .anchor-btn li {
  width: 282px;
}
main .anchor-btn a {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 60px;
  border: 1px solid #c3c3c3;
  font-weight: 700;
}
main .anchor-btn a:after {
  content: "";
  position: absolute;
  top: 42%;
  right: 20px;
  width: 8px;
  height: 8px;
  border-right: 2px solid #a3a3a3;
  border-bottom: 2px solid #a3a3a3;
  transform: rotate(45deg);
}
main .anchor-btn a.is-long {
  padding: 8px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  column-gap: 12px;
  align-items: center;
  text-align: center;
  min-height: 60px;
  height: 64px;
}
main .anchor-btn a.is-long:before {
  content: "";
}
main .anchor-btn a.is-long:after {
  position: static;
  top: auto;
  right: auto;
  justify-self: end;
  margin-right: 12px;
}
@media screen and (max-width: 767px) {
  main .anchor-btn {
    margin-bottom: 50px;
    flex-wrap: wrap;
    gap: 15px 4%;
  }
  main .anchor-btn li {
    width: 48%;
  }
  main .anchor-btn a {
    height: 50px;
    padding-bottom: 10px;
  }
  main .anchor-btn a:after {
    top: auto;
    right: 50%;
    bottom: 5px;
    transform-origin: right bottom;
  }
  main .anchor-btn a.is-long {
    display: flex;
    min-height: 70px;
    height: auto;
    padding: 8px 8px 16px;
    justify-content: center;
    align-items: center;
  }
  main .anchor-btn a.is-long:before {
    display: none;
  }
  main .anchor-btn a.is-long:after {
    position: absolute;
    justify-self: auto;
    margin-right: 0;
  }
}
main .feature-optimal {
  margin-top: 90px;
}
main .feature-optimal h2 {
  margin-bottom: 15px;
  color: #235ea7;
  font-size: 2.8rem;
}
main .feature-optimal ul {
  display: flex;
  flex-wrap: wrap;
  gap: 25px 5%;
}
main .feature-optimal li {
  position: relative;
  width: 47.5%;
  padding: 35px 18.5% 0 0;
}
main .feature-optimal .lead {
  margin-bottom: 20px;
  font-size: 2rem;
  font-weight: 700;
}
main .feature-optimal .img {
  position: absolute;
  top: 0;
  right: 0;
  width: 35.1%;
  text-align: left;
  font-size: 12px;
}
main .feature-optimal .img a {
  position: relative;
  margin-top: 15px;
  display: inline-block;
  padding-left: 12px;
  color: #0070c9;
}
main .feature-optimal .img a:before {
  content: "";
  position: absolute;
  top: 5px;
  left: -1px;
  width: 8px;
  height: 8px;
  border-top: 2px solid #a3a3a3;
  border-right: 2px solid #a3a3a3;
  transform: rotate(45deg);
}
main .feature-optimal .img p {
  padding-left: 12px;
}
main .feature-optimal .img .name {
  margin-top: 5px;
  font-size: 14px;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  main .feature-optimal {
    margin-top: 60px;
  }
  main .feature-optimal h2 {
    margin-bottom: 10px;
    font-size: 1.8rem;
  }
  main .feature-optimal ul {
    gap: 30px 0;
  }
  main .feature-optimal li {
    width: 100%;
    padding: 0;
  }
  main .feature-optimal .lead {
    margin-bottom: 0;
    font-size: 1.6rem;
  }
  main .feature-optimal .img {
    position: relative;
    margin-bottom: 15px;
    width: 100%;
    overflow: hidden;
  }
  main .feature-optimal .img img {
    float: left;
    width: 130px;
    margin: 0 10px 0 0;
  }
  main .feature-optimal .img a {
    margin-top: 55px;
  }
  main .feature-optimal .img p {
    overflow: hidden;
  }
}
main .report-backnumber {
  margin-bottom: 35px;
  display: flex;
  flex-wrap: wrap;
  gap: 35px 4%;
  list-style-type: none;
}
main .report-backnumber li {
  width: 16.8%;
}
main .report-backnumber a {
  display: block;
  text-align: center;
  color: #0070c9;
}
main .report-backnumber a > span {
  margin-top: 10px;
  display: block;
  font-size: 16px;
}
@media screen and (max-width: 767px) {
  main .report-backnumber {
    margin-bottom: 25px;
    gap: 25px 3.5%;
  }
  main .report-backnumber li {
    width: 31%;
  }
}
main .bg-area {
  margin-top: 60px;
  padding: 70px 0 80px;
  background-color: #f6f6f6;
}
main .right-note {
  margin-bottom: 10px;
  text-align: right;
  font-size: 12px;
}
main .infobox {
  display: flex;
  flex-wrap: wrap;
  gap: 24px 2.3%;
}
main .infobox > li {
  width: 100%;
  background-color: #fff;
  padding: 35px 20px 40px;
  text-align: center;
}
main .infobox > li.col3 {
  width: 31.8%;
}
main .infobox > li.col2 {
  width: 48.8%;
}
main .infobox .title {
  margin: 0 auto 25px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 44px;
  padding: 2px 30px 0;
  border-radius: 22px;
  background-color: #0060ad;
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.1;
}
main .infobox .title.color-type-2 {
  background-color: var(--sus-color-earth);
}
main .infobox .title sup {
  margin-top: -1rem;
  font-size: 60%;
}
main .infobox .img img {
  width: 100%;
}
main .infobox .img + .img {
  margin-top: 35px;
}
main .infobox .col-area01 {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
  max-width: 850px;
  margin: 0 auto;
}
main .infobox .col-area01 .col:first-child {
  width: 37%;
}
main .infobox .col-area01 .col:last-child {
  width: calc(63% - 20px);
}
main .infobox .col-area02 {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 35px 70px;
  max-width: 850px;
  margin: 0 auto;
}
main .infobox .col-area03 {
  display: flex;
  justify-content: center;
  gap: 30px 0;
  max-width: 1080px;
  margin: 0 auto;
  padding-bottom: 40px;
}
main .infobox .col-area03:last-child {
  padding-bottom: 0;
}
main .infobox .col-area + .col-area03,
main .infobox .col-area03 + .col-area03 {
  margin-top: 40px;
}
main .infobox .col-area03 .col {
  width: 33.3%;
  max-width: 360px;
}
main .infobox .col-area04 {
  max-width: 1080px;
  margin: 0 auto;
  padding-bottom: 40px;
}
main .infobox .col-area05 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 40px;
  max-width: 980px;
  margin: 0 auto;
}
main .infobox .col-area05 .col {
  width: 33%;
  max-width: 300px;
}
@media screen and (max-width: 1100px) {
  main .infobox .title {
    min-width: 0;
  }
}
@media screen and (max-width: 767px) {
  main .infobox > li {
    padding: 25px 20px;
  }
  main .infobox > li.col2,
  main .infobox > li.col3 {
    width: 100%;
  }
  main .infobox .title {
    min-width: 0;
    min-height: 40px;
    padding: 2px 15px 0;
    font-size: 16px;
  }
  main .infobox .col-area01 .col:first-child,
  main .infobox .col-area01 .col:last-child {
    width: 100%;
  }
  main .infobox .col-area03 {
    flex-wrap: wrap;
  }
  main .infobox .col-area03 .col,
  main .infobox .col-area05 .col {
    width: 100%;
    max-width: 100%;
  }
  main .infobox .col {
    width: 100%;
  }
  main .infobox .img {
    margin: 0 auto;
  }
  main .infobox .sp90p {
    max-width: 90%;
  }
  main .infobox .sp80p {
    max-width: 80%;
  }
  main .infobox .sp70p {
    max-width: 70%;
  }
  main .infobox .sp65p {
    max-width: 65%;
  }
  main .infobox .sp60p {
    max-width: 60%;
  }
  main .infobox .sp50p {
    max-width: 50%;
  }
  main .infobox .sp45p {
    max-width: 45%;
  }
}
main .fact-num {
  display: block;
  margin: 0 auto 25px;
  font-size: 2.4rem;
  color: #115fad;
  font-family:
    "DIN 2014",
    Hiragino Sans,
    Yu Gothic,
    sans-serif;
  line-height: 1.2;
}
main .fact-num.color-type-2 {
  color: var(--sus-color-earth);
}
main .fact-num.color-type-3 {
  color: #e493a4;
}
main .fact-num.color-type-4 {
  color: #fbca59;
}
main .fact-num.color-type-5 {
  color: #ea973b;
}
main .fact-num.color-type-6 {
  color: #84c5ec;
}
main .fact-num > span {
  display: inline-block;
  transform: translateY(2px);
  margin-right: 8px;
  letter-spacing: -0.05em;
  font-size: 8rem;
  font-weight: 700;
}
main .fact-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
}
main .fact-list li {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 4px;
  line-height: 1.5;
  font-weight: 700;
}
main .fact-list li:before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #aed7f1;
}
main .fact-title {
  margin-bottom: 10px;
  font-size: 2rem;
  line-height: 1.5;
  font-weight: 700;
  color: #0060ad;
}
main .fact-title.color-type-2 {
  color: var(--sus-color-earth);
}
main .fact-title.color-type-3 {
  color: #e493a4;
}
main .fact-title.color-type-4 {
  color: #fbca59;
}
main .fact-title.color-type-5 {
  color: #ea973b;
}
main .fact-title.color-type-6 {
  color: #84c5ec;
}
main .fact-title span {
  font-size: 1.5rem;
}
main .fact-title sup {
  margin-top: -1rem;
  font-size: 60%;
  font-weight: 700;
}
main .fact-title sub {
  font-weight: 700;
}
main .fact-title.line-2 {
  min-height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}
main .fact-img-num {
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: 235px;
  margin: 0 auto;
}
main .border-b-gray {
  border-bottom: 1px solid #e6e6e6;
}
@media screen and (max-width: 767px) {
  main .fact-num {
    font-size: 5vw;
    line-height: 1;
  }
  main .fact-num span {
    font-size: 18vw;
  }
  main .fact-title {
    font-size: 1.6rem;
  }
  main .fact-title span {
    font-size: 1.2rem;
  }
  main .fact-title.line-2 {
    min-height: auto;
  }
  main .fact-img-num {
    width: 60%;
    max-width: 100%;
    justify-content: space-around;
  }
  main .fact-img-num .fact-num {
    margin: 0;
  }
  main .fact-img-num img {
    width: 20vw;
  }
}
main .message-box {
  .title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 10px;
    &:before {
      content: "";
      display: block;
      height: 1px;
      width: 20px;
    }
    &.color-type-1 {
      color: var(--sus-color-employee);
    }
    &.color-type-1:before {
      background: var(--sus-color-employee);
    }
    &.color-type-2 {
      color: var(--sus-color-social);
    }
    &.color-type-2:before {
      background: var(--sus-color-social);
    }
    &.color-type-3 {
      color: var(--sus-color-earth);
    }
    &.color-type-3:before {
      background: var(--sus-color-earth);
    }
    &.color-type-4 {
      color: var(--sus-color-organization);
    }
    &.color-type-4:before {
      background: var(--sus-color-organization);
    }
  }
  > p {
    font-size: 2.2rem;
    /* line-height: 2.1; */
    line-height: 170%;
  }
}
@media screen and (max-width: 767px) {
  main .message-box {
    .title {
      font-size: 1.6rem;
    }
    > p {
      font-size: 1.4rem;
      line-height: 2;
    }
  }
}
main .labeled-card {
  position: relative;
  display: flex;
  flex-direction: column;
  &:after {
    content: "";
    position: absolute;
    z-index: -1;
    right: 0;
    bottom: 0;
    display: block;
    width: calc(100% - 197px);
    height: 100%;
    border-radius: 20px 26px 26px 0;
    background: #f6f6f6;
  }
  .label {
    position: relative;
    width: fit-content;
    min-width: 185px;
    text-align: center;
    line-height: 1;
    margin-bottom: 12px;
    padding: 16px 44px;
    font-weight: 700;
    color: #fff;
    border-radius: 26px 10px 10px;
    &:after {
      content: "";
      position: absolute;
      bottom: -12px;
      right: -12px;
      width: 18px;
      height: 18px;
      background: radial-gradient(
        circle at top left,
        transparent 18px,
        #f6f6f6 18px
      );
    }
  }
  .contents {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 20px 40px 26px;
    border-radius: 10px 0 26px 26px;
    background: #f6f6f6;
    .icon img {
      max-width: 90px;
    }
    .icon .sizeS img {
      max-width: 65px;
    }
  }
  &.color-type-1 .label {
    background: var(--sus-color-employee);
  }
  &.color-type-2 .label {
    background: var(--sus-color-social);
  }
  &.color-type-3 .label {
    background: var(--sus-color-earth);
  }
  &.color-type-4 .label {
    background: var(--sus-color-organization);
  }
  &.color-type-5 .label {
    background: #0060ad;
  }
}
@media screen and (max-width: 767px) {
  main .labeled-card {
    &:after {
      width: calc(100% - 141px);
      border-radius: 10px 16px 16px 0;
    }
    .label {
      min-width: 133px;
      margin-bottom: 8px;
      padding: 12px 24px;
      border-radius: 20px 8px 8px;
      &:after {
        bottom: -8px;
        right: -8px;
        width: 10px;
        height: 10px;
        background: radial-gradient(
          circle at top left,
          transparent 10px,
          #f6f6f6 10px
        );
      }
    }
    .contents {
      padding: 20px;
      border-radius: 10px 0 16px 16px;
      .icon img {
        max-width: 60px;
      }
      .icon .sizeS img {
        max-width: 45px;
      }
    }
  }
}
main .circle-arw {
  display: inline-block;
  span {
    position: relative;
    display: inline-block;
    width: 16px;
    min-width: 16px;
    height: 16px;
    margin-top: auto !important;
    margin-bottom: -2px !important;
    margin-left: 8px;
    border-radius: 50%;
    &:after {
      content: "";
      position: absolute;
      top: 50%;
      left: calc(50% - 1px);
      transform: translate(-50%, -50%) rotate(45deg);
      width: 5px;
      height: 5px;
      border-top: 1px solid #fff;
      border-right: 1px solid #fff;
    }
  }
  &.color-type-1 span {
    background: var(--sus-color-employee);
  }
  &.color-type-2 span {
    background: var(--sus-color-social);
  }
  &.color-type-3 span {
    background: var(--sus-color-earth);
  }
  &.color-type-4 span {
    background: var(--sus-color-organization);
  }
  &.color-type-5 span {
    background: #0060ad;
  }
  &.bold {
    font-weight: 700;
  }
}
main *:first-child {
  margin-top: 0;
}
main *:last-child {
  margin-bottom: 0;
}
main .ta-l {
  text-align: left !important;
}
main .ta-c {
  text-align: center !important;
}
main .ta-r {
  text-align: right !important;
}
main .fz-16 {
  font-size: 1.6rem;
}
main .of-cover {
  object-fit: cover !important;
}
main .of-contain {
  object-fit: contain !important;
}
main .img-fit {
  width: 100%;
  object-fit: cover;
  display: block;
}
main .img-fit.r1-1 {
  aspect-ratio: 1 / 1;
}
main .img-fit.r4-3 {
  aspect-ratio: 4 / 3;
}
main .img-fit.r3-4 {
  aspect-ratio: 3 / 4;
}
main .img-fit.r3-2 {
  aspect-ratio: 3 / 2;
}
main .img-fit.r16-9 {
  aspect-ratio: 16 / 9;
}
main .img-fit.contain {
  object-fit: contain;
}
main .img-fill {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
main .border-r-10 {
  border-radius: 10px;
}
main .border-r-12 {
  border-radius: 12px;
}
main .border-r-20 {
  border-radius: 20px;
}
main .border-r-30 {
  border-radius: 30px;
}
main .border-r-40 {
  border-radius: 40px;
}
main .border-r-50 {
  border-radius: 50px;
}
main .border-r-60 {
  border-radius: 60px;
}
@media screen and (max-width: 767px) {
  main .sp-border-r-10 {
    border-radius: 10px;
  }
  main .sp-border-r-20 {
    border-radius: 20px;
  }
  main .sp-border-r-30 {
    border-radius: 30px;
  }
  main .sp-border-r-40 {
    border-radius: 40px;
  }
  main .sp-border-r-50 {
    border-radius: 50px;
  }
  main .sp-border-r-60 {
    border-radius: 60px;
  }
}
main .w-auto {
  width: auto !important;
}
main .w10p {
  width: 10% !important;
}
main .w20p {
  width: 20% !important;
}
main .w25p {
  width: 25% !important;
}
main .w30p {
  width: 30% !important;
}
main .w40p {
  width: 40% !important;
}
main .w45p {
  width: 45% !important;
}
main .w50p {
  width: 50% !important;
}
main .w55p {
  width: 55% !important;
}
main .w60p {
  width: 60% !important;
}
main .w65p {
  width: 65% !important;
}
main .w70p {
  width: 70% !important;
}
main .w75p {
  width: 75% !important;
}
main .w80p {
  width: 80% !important;
}
main .w90p {
  width: 90% !important;
}
main .w100p {
  width: 100% !important;
}
main .mw-100 {
  max-width: 100% !important;
}
@media screen and (max-width: 767px) {
  main .sp-w-auto {
    width: auto !important;
  }
  main .sp-w10p {
    width: 10% !important;
  }
  main .sp-w20p {
    width: 20% !important;
  }
  main .sp-w25p {
    width: 25% !important;
  }
  main .sp-w30p {
    width: 30% !important;
  }
  main .sp-w40p {
    width: 40% !important;
  }
  main .sp-w45p {
    width: 45% !important;
  }
  main .sp-w50p {
    width: 50% !important;
  }
  main .sp-w55p {
    width: 55% !important;
  }
  main .sp-w60p {
    width: 60% !important;
  }
  main .sp-w65p {
    width: 65% !important;
  }
  main .sp-w70p {
    width: 70% !important;
  }
  main .sp-w75p {
    width: 75% !important;
  }
  main .sp-w80p {
    width: 80% !important;
  }
  main .sp-w90p {
    width: 90% !important;
  }
  main .sp-w100p {
    width: 100% !important;
  }
  main .sp-mw-100 {
    max-width: 100% !important;
  }
}
main .font-s {
  font-size: 1.2rem;
}
main .font-ss {
  font-size: 1rem;
}
@media screen and (max-width: 767px) {
  main .font-s {
    font-size: 1.1rem;
  }
}
main .font-bold {
  font-weight: 700;
}
main .va-t {
  vertical-align: top !important;
}
main .va-m {
  vertical-align: middle !important;
}
main .va-b {
  vertical-align: bottom !important;
}
main .d-flex {
  display: flex !important;
}
main .d-block {
  display: block !important;
}
main .d-none {
  display: none !important;
}
main .db {
  display: block;
}
main .dib {
  display: inline-block;
}
main .jc-start {
  justify-content: flex-start !important;
}
main .jc-center {
  justify-content: center !important;
}
main .jc-end {
  justify-content: flex-end !important;
}
main .jc-between {
  justify-content: space-between !important;
}
main .jc-around {
  justify-content: space-around !important;
}
main .ai-start {
  align-items: flex-start !important;
}
main .ai-center {
  align-items: center !important;
}
main .ai-end {
  align-items: flex-end !important;
}
main .ai-stretch {
  align-items: stretch !important;
}
main .fd-row {
  flex-direction: row !important;
}
main .fd-column {
  flex-direction: column !important;
}
main .flex-wrap {
  flex-wrap: wrap !important;
}
main .flex-nowrap {
  flex-wrap: nowrap !important;
}
main .flex-shrink-0 {
  flex-shrink: 0 !important;
}
main .flex-1 {
  flex: 1 !important;
}
main .nowrap {
  white-space: nowrap;
}
main th.nowrap,
main td.nowrap {
  width: 1px;
}
main .ofh {
  overflow: hidden;
}
main .h-match {
  display: flex;
  flex-direction: column;
}
main .h-match > div:has(img) {
  flex: 1;
  display: flex;
  align-items: center;
}
main .h-match.ai-end > div:has(img) {
  align-items: end;
}
main .m0 {
  margin: 0 !important;
}
main .mt0 {
  margin-top: 0 !important;
}
main .mt5 {
  margin-top: 5px !important;
}
main .mt8 {
  margin-top: 8px !important;
}
main .mt10 {
  margin-top: 10px !important;
}
main .mt12 {
  margin-top: 12px !important;
}
main .mt15 {
  margin-top: 15px !important;
}
main .mt16 {
  margin-top: 16px !important;
}
main .mt20 {
  margin-top: 20px !important;
}
main .mt30 {
  margin-top: 30px !important;
}
main .mt32 {
  margin-top: 32px !important;
}
main .mt40 {
  margin-top: 40px !important;
}
main .mt50 {
  margin-top: 50px !important;
}
main .mt60 {
  margin-top: 60px !important;
}
main .mt70 {
  margin-top: 70px !important;
}
main .mt80 {
  margin-top: 80px !important;
}
main .mb0 {
  margin-bottom: 0 !important;
}
main .mb5 {
  margin-bottom: 5px !important;
}
main .mb8 {
  margin-bottom: 8px !important;
}
main .mb10 {
  margin-bottom: 10px !important;
}
main .mb15 {
  margin-bottom: 15px !important;
}
main .mb16 {
  margin-bottom: 16px !important;
}
main .mb20 {
  margin-bottom: 20px !important;
}
main .mb30 {
  margin-bottom: 30px !important;
}
main .mb40 {
  margin-bottom: 40px !important;
}
main .mb60 {
  margin-bottom: 60px !important;
}
main .mx-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}
main .my-auto {
  margin-top: auto !important;
  margin-bottom: auto !important;
}
main .p0 {
  padding: 0 !important;
}
main .pt0 {
  padding-top: 0 !important;
}
main .pt5 {
  padding-top: 5px !important;
}
main .pt15 {
  padding-top: 15px !important;
}
main .pt30 {
  padding-top: 30px !important;
}
main .pb0 {
  padding-bottom: 0 !important;
}
main .pb5 {
  padding-bottom: 5px !important;
}
main .pb15 {
  padding-bottom: 15px !important;
}
main .pb30 {
  padding-bottom: 30px !important;
}
main .pb40 {
  padding-bottom: 40px !important;
}
main .pl0 {
  padding-left: 0 !important;
}
main .pr0 {
  padding-right: 0 !important;
}
main .no-deco {
  text-decoration: none !important;
}
main .gap-0 {
  gap: 0 !important;
}
main .gap-4 {
  gap: 4px !important;
}
main .gap-8 {
  gap: 8px !important;
}
main .gap-10 {
  gap: 10px !important;
}
main .gap-12 {
  gap: 12px !important;
}
main .gap-16 {
  gap: 16px !important;
}
main .gap-20 {
  gap: 20px !important;
}
main .gap-24 {
  gap: 24px !important;
}
main .gap-28 {
  gap: 28px !important;
}
main .gap-32 {
  gap: 32px !important;
}
main .gap-36 {
  gap: 36px !important;
}
main .gap-40 {
  gap: 40px !important;
}
main .gap-44 {
  gap: 44px !important;
}
main .gap-48 {
  gap: 48px !important;
}
main .gap-56 {
  gap: 56px !important;
}
main .gap-64 {
  gap: 64px !important;
}
main .gap-128 {
  gap: 128px !important;
}
main .gap-x-0 {
  column-gap: 0 !important;
}
main .gap-x-4 {
  column-gap: 4px !important;
}
main .gap-x-8 {
  column-gap: 8px !important;
}
main .gap-x-12 {
  column-gap: 12px !important;
}
main .gap-x-16 {
  column-gap: 16px !important;
}
main .gap-x-20 {
  column-gap: 20px !important;
}
main .gap-x-24 {
  column-gap: 24px !important;
}
main .gap-x-28 {
  column-gap: 28px !important;
}
main .gap-x-32 {
  column-gap: 32px !important;
}
main .gap-x-36 {
  column-gap: 36px !important;
}
main .gap-x-40 {
  column-gap: 40px !important;
}
main .gap-x-44 {
  column-gap: 44px !important;
}
main .gap-x-48 {
  column-gap: 48px !important;
}
main .gap-x-56 {
  column-gap: 56px !important;
}
main .gap-x-64 {
  column-gap: 64px !important;
}
main .gap-y-0 {
  row-gap: 0 !important;
}
main .gap-y-4 {
  row-gap: 4px !important;
}
main .gap-y-8 {
  row-gap: 8px !important;
}
main .gap-y-10 {
  row-gap: 10px !important;
}
main .gap-y-12 {
  row-gap: 12px !important;
}
main .gap-y-16 {
  row-gap: 16px !important;
}
main .gap-y-20 {
  row-gap: 20px !important;
}
main .gap-y-24 {
  row-gap: 24px !important;
}
main .gap-y-28 {
  row-gap: 28px !important;
}
main .gap-y-32 {
  row-gap: 32px !important;
}
main .gap-y-36 {
  row-gap: 36px !important;
}
main .gap-y-40 {
  row-gap: 40px !important;
}
main .gap-y-44 {
  row-gap: 44px !important;
}
main .gap-y-48 {
  row-gap: 48px !important;
}
main .gap-y-56 {
  row-gap: 56px !important;
}
main .gap-y-64 {
  row-gap: 64px !important;
}
@media screen and (max-width: 767px) {
  main .sp-db {
    display: block !important;
  }
  main .sp-d-flex {
    display: flex !important;
  }
  main .sp-d-none {
    display: none !important;
  }
  main .sp-ta-c {
    text-align: center !important;
  }
  main .sp-ta-l {
    text-align: left !important;
  }
  main .sp-ta-r {
    text-align: right !important;
  }
  main .sp-fz-14 {
    font-size: 1.4rem;
  }
  main .sp-jc-center {
    justify-content: center !important;
  }
  main .sp-jc-start {
    justify-content: flex-start !important;
  }
  main .sp-fd-column {
    flex-direction: column !important;
  }
  main .sp-fd-row {
    flex-direction: row !important;
  }
  main .sp-flex-wrap {
    flex-wrap: wrap !important;
  }
  main .sp-flex-1 {
    flex: 1 !important;
  }
  main .sp-face-center:first-child {
    display: flex;
    justify-content: flex-end;
  }
  main .sp-face-center:last-child {
    display: flex;
    justify-content: flex-start;
  }
  main .sp-img-contain {
    width: 100% !important;
    object-fit: contain;
  }
  main .sp-mt0 {
    margin-top: 0 !important;
  }
  main .sp-mt15 {
    margin-top: 15px !important;
  }
  main .sp-mt20 {
    margin-top: 20px !important;
  }
  main .sp-mt30 {
    margin-top: 30px !important;
  }
  main .sp-mt40 {
    margin-top: 40px !important;
  }
  main .sp-mt45 {
    margin-top: 45px !important;
  }
  main .sp-mb0 {
    margin-bottom: 0 !important;
  }
  main .sp-mb15 {
    margin-bottom: 15px !important;
  }
  main .sp-mb20 {
    margin-bottom: 20px !important;
  }
  main .sp-mb30 {
    margin-bottom: 30px !important;
  }
  main .sp-mb40 {
    margin-bottom: 40px !important;
  }
  main .sp-p0 {
    padding: 0 !important;
  }
  main .sp-mx-auto {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  main .sp-gap-0 {
    gap: 0 !important;
  }
  main .sp-gap-4vw {
    gap: 4vw !important;
  }
  main .sp-gap-8vw {
    gap: 8vw !important;
  }
  main .sp-w-full {
    width: 100% !important;
  }
  main .sp-w-auto {
    width: auto !important;
  }
}
@media screen and (max-width: 1300px) {
  main .ov1300 {
    display: none !important;
  }
}
@media screen and (max-width: 1200px) {
  main .ov1200 {
    display: none !important;
  }
}
@media screen and (max-width: 1100px) {
  main .ov1100 {
    display: none !important;
  }
}
@media screen and (max-width: 1000px) {
  main .ov1000 {
    display: none !important;
  }
}
@media screen and (max-width: 900px) {
  main .ov900 {
    display: none !important;
  }
}
@media screen and (max-width: 800px) {
  main .ov800 {
    display: none !important;
  }
}
@media screen and (max-width: 767px) {
  main .ov767 {
    display: none !important;
  }
}
@media screen and (max-width: 700px) {
  main .ov700 {
    display: none !important;
  }
}
@media screen and (max-width: 600px) {
  main .ov600 {
    display: none !important;
  }
}
@media screen and (max-width: 500px) {
  main .ov500 {
    display: none !important;
  }
}
@media screen and (max-width: 400px) {
  main .ov400 {
    display: none !important;
  }
}
@media screen and (min-width: 1301px) {
  main .ud1300 {
    display: none !important;
  }
}
@media screen and (min-width: 1201px) {
  main .ud1200 {
    display: none !important;
  }
}
@media screen and (min-width: 1101px) {
  main .ud1100 {
    display: none !important;
  }
}
@media screen and (min-width: 1001px) {
  main .ud1000 {
    display: none !important;
  }
}
@media screen and (min-width: 901px) {
  main .ud900 {
    display: none !important;
  }
}
@media screen and (min-width: 801px) {
  main .ud800 {
    display: none !important;
  }
}
@media screen and (min-width: 768px) {
  main .ud767 {
    display: none !important;
  }
}
@media screen and (min-width: 701px) {
  main .ud700 {
    display: none !important;
  }
}
@media screen and (min-width: 601px) {
  main .ud600 {
    display: none !important;
  }
}
@media screen and (min-width: 501px) {
  main .ud500 {
    display: none !important;
  }
}
@media screen and (min-width: 401px) {
  main .ud400 {
    display: none !important;
  }
}
@media screen and (min-width: 351px) {
  main .ud350 {
    display: none !important;
  }
}
main .cmn-color01 {
  color: #eb973b;
}
main .cmn-color02 {
  color: #45a943;
}
main .cmn-color03 {
  color: #22aee3;
}
main .cmn-color04 {
  color: #dc6b88;
}
main .cmn-color05 {
  color: var(--sus-color-organization);
}
main .cmn-color06 {
  color: #005ead;
}
main .cmn-color07 {
  color: #0060ad;
}
main .cmn-color08 {
  color: #28a733;
}
main .image-wrapper {
  aspect-ratio: var(--aspect-ratio, 16 / 9);
  overflow: hidden;
}
main .image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--object-position, center);
}
main [data-img-position="top"] img {
  object-position: center top;
}
main [data-img-position="bottom"] img {
  object-position: center bottom;
}
main [data-img-position="5"] img {
  object-position: center 5%;
}
main [data-img-position="10"] img {
  object-position: center 10%;
}
main [data-img-position="15"] img {
  object-position: center 15%;
}
main [data-img-position="20"] img {
  object-position: center 20%;
}
main [data-img-position="25"] img {
  object-position: center 25%;
}
main [data-img-position="30"] img {
  object-position: center 30%;
}
main [data-img-position="35"] img {
  object-position: center 35%;
}
main [data-img-position="40"] img {
  object-position: center 40%;
}
main [data-img-position="45"] img {
  object-position: center 45%;
}
main [data-img-position="50"] img {
  object-position: center 50%;
}
main [data-img-position="55"] img {
  object-position: center 55%;
}
main [data-img-position="60"] img {
  object-position: center 60%;
}
main [data-img-position="65"] img {
  object-position: center 65%;
}
main [data-img-position="70"] img {
  object-position: center 70%;
}
main [data-img-position="75"] img {
  object-position: center 75%;
}
main [data-img-position="80"] img {
  object-position: center 80%;
}
main [data-img-position="85"] img {
  object-position: center 85%;
}
main [data-img-position="90"] img {
  object-position: center 90%;
}
main [data-img-position="95"] img {
  object-position: center 95%;
}
main [data-img-position="100"] img {
  object-position: center 100%;
}

.sustainability-local-footer {
  --color-brand: #0060ad;
  --color-natural-gray: #e6e6e6;
  --primitive-gray: #454649;
  background: #f6f6f6;
}
.sustainability-local-footer .inner {
  max-width: 1240px;
  padding: 60px 20px 40px;
  margin: 0 auto;
  border-bottom: 1px solid var(--color-natural-gray);
  text-align: left;
}
.columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 40px;
  align-items: start;
  margin-top: 40px;
}
.group-list {
  column-gap: 48px;
}
.group-item {
  break-inside: avoid-column;
  display: inline-block;
  width: 100%;
}
.group-item + .group-item {
  margin-top: 30px;
}
.group-title {
  margin: 0 0 12px;
  padding: 12px 0;
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--primitive-gray);
  border-bottom: 1px solid var(--color-natural-gray);
  line-height: 1.8;
}
.level3-list {
  margin: 0;
  padding: 0;
}
.level3-row {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.arw {
  display: inline-flex;
  align-items: flex-start;
  width: fit-content;
  gap: 8px;
  padding: 4px 0;
  font-size: 1.4rem;
  line-height: 1.8;
  color: var(--primitive-gray);
  text-decoration: none;
}
.arw:before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-top: 2.5px solid var(--color-brand);
  border-right: 2.5px solid var(--color-brand);
  border-radius: 1px;
  transform: rotate(45deg);
  flex-shrink: 0;
  box-sizing: border-box;
  margin-top: 8.5px;
}
.arw:hover {
  text-decoration: underline;
}
.level4-wrapper {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s ease;
}
.level4-wrapper[data-open="true"] {
  grid-template-rows: 1fr;
}
.level4-inner {
  overflow: hidden;
  min-height: 0;
}
.level4-list {
  margin: 0 0 12px !important;
  padding: 0 0 0 16px;
}
.level3-list li:last-child .level4-list {
  margin-bottom: 0 !important;
}
.level4-item .arw {
  width: fit-content;
  padding: 4px 0;
  font-size: 1.3rem;
}
.level4-item .arw:before {
  width: 5px;
  height: 5px;
  border: none;
  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNCIgaGVpZ2h0PSI1IiB2aWV3Qm94PSIwIDAgNCA1IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KPHJlY3Qgd2lkdGg9IjQiIGhlaWdodD0iNSIgZmlsbD0idXJsKCNwYXR0ZXJuMF8yNTgzXzI0MzkpIi8+CjxkZWZzPgo8cGF0dGVybiBpZD0icGF0dGVybjBfMjU4M18yNDM5IiBwYXR0ZXJuQ29udGVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgd2lkdGg9IjEiIGhlaWdodD0iMSI+Cjx1c2UgeGxpbms6aHJlZj0iI2ltYWdlMF8yNTgzXzI0MzkiIHRyYW5zZm9ybT0ic2NhbGUoMC4yNSAwLjIpIi8+CjwvcGF0dGVybj4KPGltYWdlIGlkPSJpbWFnZTBfMjU4M18yNDM5IiB3aWR0aD0iNCIgaGVpZ2h0PSI1IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIiB4bGluazpocmVmPSJkYXRhOmltYWdlL3BuZztiYXNlNjQsaVZCT1J3MEtHZ29BQUFBTlNVaEVVZ0FBQUFRQUFBQUZDQU1BQUFCVmM3M3BBQUFBR1hSRldIUlRiMlowZDJGeVpRQkJaRzlpWlNCSmJXRm5aVkpsWVdSNWNjbGxQQUFBQTRScFZGaDBXRTFNT21OdmJTNWhaRzlpWlM1NGJYQUFBQUFBQUR3L2VIQmhZMnRsZENCaVpXZHBiajBpNzd1L0lpQnBaRDBpVnpWTk1FMXdRMlZvYVVoNmNtVlRlazVVWTNwcll6bGtJajgrSUR4NE9uaHRjRzFsZEdFZ2VHMXNibk02ZUQwaVlXUnZZbVU2Ym5NNmJXVjBZUzhpSUhnNmVHMXdkR3M5SWtGa2IySmxJRmhOVUNCRGIzSmxJRFV1Tmkxak1UTTRJRGM1TGpFMU9UZ3lOQ3dnTWpBeE5pOHdPUzh4TkMwd01Ub3dPVG93TVNBZ0lDQWdJQ0FnSWo0Z1BISmtaanBTUkVZZ2VHMXNibk02Y21SbVBTSm9kSFJ3T2k4dmQzZDNMbmN6TG05eVp5OHhPVGs1THpBeUx6SXlMWEprWmkxemVXNTBZWGd0Ym5NaklqNGdQSEprWmpwRVpYTmpjbWx3ZEdsdmJpQnlaR1k2WVdKdmRYUTlJaUlnZUcxc2JuTTZlRzF3VFUwOUltaDBkSEE2THk5dWN5NWhaRzlpWlM1amIyMHZlR0Z3THpFdU1DOXRiUzhpSUhodGJHNXpPbk4wVW1WbVBTSm9kSFJ3T2k4dmJuTXVZV1J2WW1VdVkyOXRMM2hoY0M4eExqQXZjMVI1Y0dVdlVtVnpiM1Z5WTJWU1pXWWpJaUI0Yld4dWN6cDRiWEE5SW1oMGRIQTZMeTl1Y3k1aFpHOWlaUzVqYjIwdmVHRndMekV1TUM4aUlIaHRjRTFOT2s5eWFXZHBibUZzUkc5amRXMWxiblJKUkQwaWVHMXdMbVJwWkRwa09HRmtNREZrWVMxaE1USTFMVEE1TkRjdE9XWTFPQzAxWVRsa1pqSTRNbUpsWlRjaUlIaHRjRTFOT2tSdlkzVnRaVzUwU1VROUluaHRjQzVrYVdRNlF6QTJORGcwTnpoRU5UZzVNVEZGTnprd09UTkNPVEEzTkRsR01FRkdOVE1pSUhodGNFMU5Pa2x1YzNSaGJtTmxTVVE5SW5odGNDNXBhV1E2UXpBMk5EZzBOemRFTlRnNU1URkZOemt3T1ROQ09UQTNORGxHTUVGR05UTWlJSGh0Y0RwRGNtVmhkRzl5Vkc5dmJEMGlRV1J2WW1VZ1VHaHZkRzl6YUc5d0lFTkRJREl3TVRjZ0tGZHBibVJ2ZDNNcElqNGdQSGh0Y0UxTk9rUmxjbWwyWldSR2NtOXRJSE4wVW1WbU9tbHVjM1JoYm1ObFNVUTlJbmh0Y0M1cGFXUTZOelU1TkRnNVlUZ3RNbU5qTVMwNE1qUTBMVGsxWW1ZdFl6SmlPV0kwT1dJMVpURmpJaUJ6ZEZKbFpqcGtiMk4xYldWdWRFbEVQU0poWkc5aVpUcGtiMk5wWkRwd2FHOTBiM05vYjNBNk5XSmxORGRqWm1FdE9UYzVaQzB4TVdVM0xXSmtORGt0WVdJNVlUUmpORFJqTlRZNElpOCtJRHd2Y21SbU9rUmxjMk55YVhCMGFXOXVQaUE4TDNKa1pqcFNSRVkrSUR3dmVEcDRiWEJ0WlhSaFBpQThQM2h3WVdOclpYUWdaVzVrUFNKeUlqOCtuWk16dUFBQUFBWlFURlJGaG9hRy8vLy9tNlRFelFBQUFCbEpSRUZVZU5waVlHQmdaR1FBQWtZR01BVm1nY1FBQWd3QUFHc0FDRTl3Z2dBQUFBQUFTVVZPUks1Q1lJST0iLz4KPC9kZWZzPgo8L3N2Zz4=)
    no-repeat center center/contain;
  transform: rotate(0);
}
@media (prefers-reduced-motion: reduce) {
  .level4-wrapper {
    transition: none;
  }
}
.toggle-btn {
  display: none;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  padding-left: 8px;
  border: none;
  background: none;
  cursor: pointer;
}
.toggle-icon {
  position: relative;
  display: inline-block;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #96b6d0;
}
.toggle-icon:before,
.toggle-icon:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: #fff;
  transition: transform 0.2s ease;
}
.toggle-icon:before {
  width: 7px;
  height: 1px;
  transform: translate(-50%, -50%);
}
.toggle-icon:after {
  width: 1px;
  height: 7px;
  transform: translate(-50%, -50%);
}
.toggle-icon[data-open="true"]:after {
  transform: translate(-50%, -50%) scaleY(0);
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.circle-arw {
  display: inline-block;
  font-weight: 700;
  font-size: 1.6rem;
  color: var(--primitive-gray);
  line-height: 1.8;
}
.circle-arw span {
  position: relative;
  display: inline-block;
  width: 16px;
  min-width: 16px;
  height: 16px;
  margin-top: auto !important;
  margin-bottom: -2px !important;
  margin-left: 8px;
  border-radius: 50%;
  background: var(--color-brand);
}
.circle-arw span:after {
  content: "";
  position: absolute;
  top: 50%;
  left: calc(50% - 1px);
  transform: translate(-50%, -50%) rotate(45deg);
  width: 5px;
  height: 5px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
}
@media (hover: hover) {
  .sustainability-local-footer .circle-arw:hover {
    text-decoration: underline;
  }
}
@media (max-width: 768px) {
  .sustainability-local-footer {
    padding: 32px 0 0;
  }
  .sustainability-local-footer .inner {
    padding: 0 3%;
  }
  .columns {
    grid-template-columns: 1fr;
    margin-top: 16px;
  }
  .group-list + .group-list {
    margin-top: 8px;
  }
  .group-item + .group-item {
    margin-top: 8px;
  }
  .group-title {
    margin: 0 0 8px;
    padding: 12px 0;
    font-size: 1.2rem;
  }
  .arw {
    flex: 1;
    font-size: 1.3rem;
  }
  .arw:before {
    margin-top: 8.2px;
  }
  .level4-list {
    margin: 0 0 12px !important;
    padding: 0;
  }
  .level4-item .arw {
    width: 100%;
    padding: 5px 0;
    border-bottom: 1px solid var(--color-natural-gray);
  }
  .toggle-btn {
    display: inline-flex;
  }
  .has-children .arw {
    padding-right: 4px;
  }
  .circle-arw {
    font-size: 1.3rem;
  }
}
@media (min-width: 769px) {
  .toggle-btn {
    display: none !important;
  }
  .level4-wrapper {
    grid-template-rows: 1fr !important;
    transition: none;
  }
  .level4-list {
    display: block !important;
  }
}

:root {
  --feature-color: #005ead;
  --color-natural-black: #333;
  --feature-bg-gray-01: #f7f7f9;
}
main .feature-main-v-area {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto 80px;
  position: relative;
  padding: 0 20px;
  .main-v {
    width: 100%;
    aspect-ratio: 1400 / 580;
  }
  img {
    border-radius: 20px;
  }
  h2 {
    font-size: 2.6rem;
    font-weight: 700;
  }
  p {
    font-size: 14px;
    line-height: 1.78;
    font-weight: 500;
    margin: 8px 0 0;
  }
  &:has(+ .contents-area .anchor-btn) {
    margin: 0 auto 50px;
  }
  @media screen and (max-width: 767px) {
    margin: 0;
    .main-v {
      aspect-ratio: 350 / 145;
    }
    img {
      border-radius: 10px;
    }
    h2 {
      font-size: 24px;
      color: var(--feature-color);
      margin: 20px 0 0;
    }
    p {
      margin: 10px 0 0;
    }
  }
}
main .feature-main-v-innerarea {
  position: absolute;
  top: 50%;
  left: 5vw;
  transform: translateY(-50%);
  color: #fff;
  text-align: left;
  max-width: 600px;
  background: #0060adcc;
  padding: min(2vw, 50px) min(3vw, 45px);
  border-radius: 15px;
  @media screen and (max-width: 767px) {
    position: static;
    transform: translate(0);
    background: transparent;
    color: #333;
    padding: 0;
    max-width: 100%;
  }
}
main .feature-main-v-area.layout-type-2 {
  h2 {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 3.5rem;
    line-height: 1.5;
    &:after {
      content: "";
      display: block;
      width: 43px;
      height: 6px;
      background: #1e80cf;
    }
  }
  p {
    margin: 20px 0 0;
  }
  .feature-main-v-innerarea {
    left: 8vw;
    max-width: 400px;
    padding: 0;
    background: transparent;
    color: var(--color-natural-black);
  }
  @media screen and (max-width: 767px) {
    h2 {
      color: var(--color-natural-black);
      font-size: 2.4rem;
    }
    .feature-main-v-innerarea {
      max-width: 100%;
    }
  }
}
main .feature-Profile__body {
  position: relative;
  z-index: 0;
  background-color: #f7f7f9;
  display: flex;
  gap: 30px;
  border-radius: 10px 0 10px 10px;
}
main .feature-Profile__item {
  display: flex;
  gap: 20px;
  flex: 1;
}
main .feature-Profile__img {
  flex-shrink: 0;
  width: 110px;
}
main .feature-Profile__img img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
  border-radius: 20px;
}
main .feature-Profile__dept {
  font-size: 1.4rem;
}
main .feature-Profile__name {
  margin-top: 0;
  font-size: 1.4rem;
}
main .feature-Profile__bio {
  margin-top: 10px;
  font-size: 1.4rem;
  color: #636363;
}
main .feature-Profile__body > .border {
  width: 1px;
  position: relative;
  &:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 70%;
    border-left: 1px dashed #ccc;
  }
}
@media screen and (min-width: 768px) {
  main .feature-Profile--bioDrop .feature-Profile__item {
    display: grid;
    grid-template-columns: 110px 1fr;
    grid-template-rows: 110px auto;
    gap: 10px 20px;
    align-items: start;
  }
  main .feature-Profile--bioDrop .feature-Profile__text {
    display: contents;
  }
  main .feature-Profile--bioDrop .feature-Profile__img {
    grid-area: 1 / 1 / 2 / 2;
  }
  main .feature-Profile--bioDrop .feature-Profile__nameBox {
    grid-area: 1 / 2 / 2 / 3;
  }
  main .feature-Profile--bioDrop .feature-Profile__bio {
    grid-area: 2 / 1 / 3 / 3;
    margin-top: 10px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1000px) {
  main .feature-Profile--nameDrop .feature-Profile__item {
    display: block;
  }
  main .feature-Profile--nameDrop .feature-Profile__text {
    display: block;
    margin-top: 12px;
  }
  main .feature-Profile--nameDrop .feature-Profile__nameBox {
    min-height: 96px;
  }
  main .feature-Profile--nameDrop .feature-Profile__bio {
    margin-top: 8px;
  }
}
@media screen and (max-width: 767px) {
  main .feature-Profile__body {
    flex-direction: column;
  }
  main .feature-Profile__item {
    flex-direction: column;
    align-items: center;
  }
  main .feature-Profile__dept,
  main .feature-Profile__name {
    text-align: center;
  }
  main .feature-Profile__body > .border {
    width: 100%;
    height: 1px;
  }
  main .feature-Profile__body > .border:before {
    width: 100%;
    height: 1px;
    border-left: none;
    border-top: 1px dashed #ccc;
  }
  main .feature-Profile__item.sp-otherLayout {
    display: grid;
    grid-template-columns: 150px 1fr;
    grid-template-rows: repeat(3, auto);
  }
  main .feature-Profile__item.sp-otherLayout .feature-Profile__text {
    display: contents;
  }
  main .feature-Profile__item.sp-otherLayout h3 {
    grid-area: 1 / 1 / 2 / 3;
  }
  main .feature-Profile__item.sp-otherLayout .feature-Profile__img {
    grid-area: 2 / 1 / 3 / 2;
  }
  main .feature-Profile__item.sp-otherLayout .feature-Profile__nameBox {
    grid-area: 2 / 2 / 3 / 3;
  }
  main .feature-Profile__item.sp-otherLayout .feature-Profile__bio {
    grid-area: 3 / 1 / 4 / 3;
  }
  main .feature-Profile__item.sp-otherLayout .feature-Profile__dept,
  main .feature-Profile__item.sp-otherLayout .feature-Profile__name {
    text-align: left;
  }
}
main .episode-block {
  margin: 80px 0 0;
  h2.section-title {
    margin: 0 0 35px;
    span {
      color: var(--feature-color);
      font-size: 1.4rem;
      font-weight: 700;
      display: block;
      margin: 0 0 8px;
    }
  }
  &.bg-on {
    margin: 100px 0 0;
    h2.section-title {
      margin: 0 0 48px;
      span {
        color: #fff;
      }
    }
  }
  .name.line + p {
    font-weight: 700;
  }
  &.bg-on {
    position: relative;
    isolation: isolate;
    padding: 80px 0;
    color: #fff;
    &:before {
      content: "";
      position: absolute;
      top: 0;
      left: 50%;
      transform: translate(-50%);
      width: 100vw;
      height: 100%;
      background-image: url(/en/sustainability/img/feature_Section_bg.webp);
      background-size: cover;
      background-position: center;
      z-index: -1;
    }
  }
  &.column {
    display: flex;
    gap: 0;
    > .img-shadow {
      position: relative;
      align-self: flex-start;
      padding-bottom: 50px;
      &:after {
        content: "";
        background: var(--feature-bg-gray-01);
        width: 95%;
        height: calc(100% - 50px);
        position: absolute;
        z-index: -1;
        top: 50px;
      }
    }
    &.img-left {
      > .img-shadow {
        &:after {
          left: -40px;
          border-radius: 0 30px 30px 0;
        }
      }
      img {
        border-radius: 0 30px 30px 0;
        width: 100%;
      }
      > div {
        &:first-child {
          width: 50vw;
          margin-left: calc(50% - 50vw);
        }
        &:last-child {
          width: 50%;
          padding: 0 0 0 5%;
        }
      }
    }
    &.img-right {
      > .img-shadow {
        &:after {
          right: -40px;
          border-radius: 30px 0 0 30px;
        }
      }
      img {
        border-radius: 30px 0 0 30px;
        width: 100%;
      }
      > div {
        &:first-child {
          width: 50%;
          padding: 0 5% 0 0;
        }
        &:last-child {
          width: 50vw;
          margin-right: calc(50% - 50vw);
        }
      }
    }
  }
  .symposium {
    margin: 0 0 40px;
    .comment {
      margin-bottom: 16px;
    }
  }
  @media screen and (max-width: 767px) {
    margin: 64px 0 0;
    h2.section-title {
      margin: 0 0 40px;
      span {
        font-size: 1rem;
        margin: 0 0 8px;
      }
    }
    &.column {
      flex-direction: column;
      &.img-left > div:first-child {
        padding: 0 3% 0 0;
      }
      &.img-right > div:last-child {
        padding: 0 0 0 3%;
      }
      &.img-left > div:first-child,
      &.img-right > div:last-child {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: 0;
      }
      &.img-left > div:last-child,
      &.img-right > div:first-child {
        width: 100%;
        padding: 64px 0 0;
      }
      &.img-right {
        flex-direction: column-reverse;
      }
      > .img-shadow {
        padding-bottom: 50px;
        &:after {
          height: calc(100% - 50px);
          top: 80px;
        }
      }
      &.img-left > .img-shadow:after {
        left: 0;
        width: 85%;
      }
      &.img-right > .img-shadow:after {
        right: 0;
        width: 85%;
      }
    }
    &.bg-on {
      margin: 20px 0 0;
      padding: 40px 0 20px;
      &:before {
        height: 100%;
        background-position: center top;
      }
    }
    .symposium .comment {
      margin-bottom: 20px;
    }
  }
}
main .feature-title-box {
  text-align: center;
  margin-bottom: 60px;
  h2 {
    display: flex;
    align-items: center;
    gap: 20px;
    width: 100%;
    margin-top: 12px;
    font-size: 3rem;
    &:before,
    &:after {
      content: "";
      display: block;
      flex: 1;
      border-top: 1px solid #e6e6e6;
    }
    span {
      display: inline-block;
      padding-left: 0.5em;
    }
  }
  @media screen and (max-width: 767px) {
    margin-bottom: 30px;
    img {
      width: 40px;
      height: 40px;
    }
    h2 {
      font-size: 1.8rem;
    }
  }
}
main section + section:has(.feature-title-box) {
  margin-top: 80px;
  @media screen and (max-width: 767px) {
    margin-top: 40px;
  }
}
main .comment-block {
  display: flex;
  align-items: flex-start;
  gap: 32px;
  &:has(+ .comment-block) {
    margin-bottom: 80px;
  }
  .img-box {
    width: 32.8%;
    text-align: center;
    .img-wrap {
      display: inline-block;
      margin-right: -30px;
      margin-bottom: 50px;
      width: 250px;
      min-width: 250px;
      height: 250px;
      border-radius: 8px;
      box-shadow: -30px 30px 0 var(--feature-bg-gray-01);
      overflow: hidden;
    }
    p {
      font-size: 1.4rem;
    }
  }
  .text-box {
    position: relative;
    width: 68%;
    padding: 40px;
    border-radius: 20px;
    background: var(--feature-bg-gray-01);
    &:before {
      content: "";
      position: absolute;
      left: -18px;
      top: 50px;
      display: block;
      width: 0;
      height: 0;
      border-style: solid;
      border-top: 12px solid transparent;
      border-bottom: 12px solid transparent;
      border-right: 18px solid var(--feature-bg-gray-01);
      border-left: 0;
    }
    &:after {
      content: "”";
      position: absolute;
      top: -38px;
      right: 24px;
      font-size: 20rem;
      line-height: 1;
      color: var(--quote-color, #f9e1e7);
      font-family:
        Hiragino Maru Gothic Pro,
        serif;
    }
    h3 {
      font-size: 2rem;
      margin-bottom: 20px;
    }
    .img-caption {
      font-size: 1.4rem;
    }
  }
  .img-border {
    border-radius: 8px;
    border: 1px solid #fff;
  }
  &.img-right {
    flex-direction: row-reverse;
    .img-box .img-wrap {
      margin-left: -30px;
      margin-right: 0;
      box-shadow: 30px 30px 0 var(--feature-bg-gray-01);
    }
    .text-box:before {
      left: auto;
      right: -18px;
      transform: rotate(180deg);
    }
  }
  @media screen and (max-width: 767px) {
    flex-direction: column;
    gap: 16px;
    &:has(+ .comment-block) {
      margin-bottom: 40px;
    }
    .img-box {
      width: 100%;
      .img-wrap {
        margin-right: 0;
        margin-bottom: 16px;
        width: 90px;
        min-width: 90px;
        height: 90px;
        border-radius: 8px;
        box-shadow: -10px 10px 0 var(--feature-bg-gray-01);
        img {
          object-fit: cover;
          transform: var(--sp-scale-size, scale(1));
          object-position: var(--object-position, top);
        }
      }
      p {
        font-size: 1.2rem;
      }
    }
    .text-box {
      width: 100%;
      padding: 34px 20px 20px;
      &:before {
        display: none;
      }
      &:after {
        font-size: 14rem;
        top: -26px;
        right: 10px;
      }
      h3 {
        font-size: 1.6rem;
        margin-bottom: 16px;
      }
      .img-caption {
        font-size: 1.2rem;
      }
    }
    &.img-right {
      flex-direction: column;
      .img-box .img-wrap {
        margin-left: 0;
        box-shadow: 10px 10px 0 var(--feature-bg-gray-01);
      }
    }
  }
}
main .col-area.gap-64 > .column {
  width: calc(50% - 32px);
}
main .col-area.gap-128 > .column {
  width: calc(50% - 64px);
}
@media (max-width: 767px) {
  ._breadcrumb_1hzx3_2 {
    display: none;
  }
}
@media (min-width: 768px) {
  ._breadcrumb_1hzx3_2 {
    display: block;
    width: 100%;
    min-width: 980px;
    max-width: 1240px;
    padding: 35px 20px 55px;
    margin: auto;
  }
  ._breadcrumb_1hzx3_2 li {
    display: table-cell;
    padding-right: 5px;
    font-size: 1.2rem;
    line-height: 1;
    color: #838383;
  }
  ._breadcrumb_1hzx3_2 li a {
    display: inline-block;
    padding: 5px 0;
    margin-right: 5px;
    color: #838383;
  }
  ._breadcrumb_1hzx3_2 li a:hover {
    text-decoration: underline;
  }
}
._overlay_lgd93_1 {
  position: absolute;
  z-index: 7;
  width: 100%;
  height: 100%;
  pointer-events: none;
  user-select: none;
  background: #000;
  opacity: 0;
  transition: opacity 0.8s ease-out;
}
._overlay_lgd93_1._visible_lgd93_13 {
  pointer-events: auto;
  user-select: auto;
  opacity: 0.3;
  transition: opacity 0.3s ease-out;
}
@media (max-width: 767px) {
  ._header_lgd93_21 {
    position: relative;
    z-index: 8;
    height: 59px;
    background: #fff;
  }
  ._logo_lgd93_28 {
    position: absolute;
    top: 20px;
    left: 3%;
    z-index: 8;
  }
  ._logoLink_lgd93_35 {
    display: block;
    padding-right: 60px;
    background: url(/assets/h_txt.gif) no-repeat right center;
    background-size: 50px auto;
  }
  ._logoImage_lgd93_42 {
    width: 60px;
    height: auto;
  }
  ._lang_lgd93_47 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
  }
  ._triggerGlobal_lgd93_54 {
    right: 56px;
    width: 38px;
    background: url(/assets/bg_lang.gif) no-repeat center 11px;
    background-size: 19px auto;
  }
  ._triggerSearch_lgd93_61 {
    position: absolute;
    top: 0;
    right: 94px;
    z-index: 8;
    box-sizing: content-box;
    display: flex;
    justify-content: center;
    width: 38px;
    height: 22px;
    padding-top: 37px;
    overflow: hidden;
    font-size: 1rem;
    line-height: 1;
    text-align: center;
    color: inherit;
    text-decoration: none;
    background: url(/assets/bg_search_sp.gif) no-repeat center 11px;
    background-size: 19px auto;
  }
  ._navGlobal_lgd93_82 {
    border-bottom: 1px solid #e1e1e1;
  }
}
@media (min-width: 768px) {
  ._headerWrapper_lgd93_88 {
    height: var(--header-height);
    --header-height: 111px;
  }
  ._headerWrapperSimple_lgd93_94 {
    height: var(--header-height);
    --header-height: 56px;
  }
  ._header_lgd93_21 {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 10;
    width: calc(100% - 40px);
    min-width: 940px;
    max-width: 1200px;
    height: var(--header-height);
    padding: 0 20px;
    margin: auto;
  }
  ._header_lgd93_21:before {
    position: absolute;
    top: 0;
    left: -100%;
    box-sizing: border-box;
    display: block;
    width: 300%;
    height: 100%;
    content: "";
    background: #fff;
    border-bottom: solid 1px #e6e6e6;
  }
  ._header_lgd93_21._fix_lgd93_127 {
    position: fixed;
    top: -62px;
  }
  ._header_lgd93_21._fix_lgd93_127 ._inside_lgd93_134 > li > a:after,
  ._header_lgd93_21._fix_lgd93_127
    ._inside_lgd93_134
    > li:first-child
    > a:before {
    position: absolute;
    top: 14px;
    right: 0;
    display: block;
    width: 1px;
    height: 18px;
    content: "";
    background: #d3d3d3;
  }
  ._logo_lgd93_28 {
    position: absolute;
    top: 20px;
    left: 20px;
    transition: 0.3s;
  }
  ._header_lgd93_21._fix_lgd93_127 ._logo_lgd93_28 {
    top: 73px;
  }
  ._logoLink_lgd93_35 {
    display: block;
    padding-right: 105px;
    background: url(/assets/h_txt.gif) no-repeat right center;
    background-size: 89px auto;
  }
  ._header_lgd93_21._fix_lgd93_127 ._logoLink_lgd93_35 {
    height: 22px;
  }
  ._logoImage_lgd93_42 {
    width: 106px;
    height: auto;
  }
  ._header_lgd93_21._fix_lgd93_127 ._logoImage_lgd93_42 {
    width: 64px;
    height: auto;
  }
  ._triggerGlobal_lgd93_54 {
    display: block;
    padding: 5px 0 5px 18px;
    font-size: 1.2rem;
    cursor: pointer;
    background: url(/assets/bg_h_lang.gif) no-repeat 0 45%;
  }
}
.unique-layout[data-astro-cid-lkau67jb] {
  display: flex;
  gap: 40px;
  li {
    position: relative;
    width: 40%;
  }
  li:nth-child(2) {
    width: 19%;
  }
  li + li:before {
    content: "→";
    position: absolute;
    top: 50%;
    left: -27px;
    transform: translateY(-50%);
  }
  li > p {
    min-height: 43px;
    margin-bottom: 4px;
  }
}
@media screen and (max-width: 767px) {
  .unique-layout[data-astro-cid-lkau67jb] {
    flex-direction: column;
    li,
    li:nth-child(2) {
      width: 100%;
    }
    li + li:before {
      content: "→";
      position: absolute;
      top: -29px;
      left: 50%;
      transform: translate(-50%) rotate(90deg);
    }
    li > p {
      min-height: fit-content;
    }
  }
}
.feature-Profile__body[data-astro-cid-eexzdy54]
  > .border[data-astro-cid-eexzdy54]:before {
  height: 92%;
}
.adjust-ml[data-astro-cid-eexzdy54] {
  margin-left: calc(42px + 1em);
}
@media screen and (max-width: 767px) {
  .adjust-ml[data-astro-cid-eexzdy54] {
    margin-left: calc(36px + 1em);
  }
}
.box-section[data-astro-cid-j27he4ej] {
  height: 100%;
  box-sizing: border-box;
}

/****************************** 
2608 add
******************************/
.labeled-card .circle-arw.anchor-type span:after {
  transform: translate(-30%, -70%) rotate(135deg);
}

.box-section.materiality-box > .title {
  width: 100%;
  text-align: center;
  padding: 8px 0;
  font-size: 1.8rem;
  font-weight: bold;
  color: #fff;
  border-radius: 8px;
}
.materiality-box.type-environment .title {
  background: var(--sus-color-earth);
}
main .box-section.materiality-box + .box-section.materiality-box {
  margin-top: 30px;
  border-top: 1px solid #c3c3c3;
}
@media screen and (max-width: 767px) {
  .box-section.materiality-box > .title {
    font-size: 1.4rem;
  }
}

.theme-box {
  margin-top: 30px;
  padding: 30px;
  background: #f6f6f6;
  border-radius: 20px;
}
.theme-box .theme {
  width: fit-content;
  padding: 2px 20px;
  font-size: 1.4rem;
  font-weight: bold;
  border-radius: 4px;
  color: #fff;
}
.theme-box.type-environment .theme {
  background: var(--sus-color-earth);
}
.theme-box.type-build .theme {
  background: var(--sus-color-organization);
}
.theme-box.type-work .theme {
  background: var(--sus-color-social);
}
.theme-box.type-employee .theme {
  background: var(--sus-color-employee);
}
@media screen and (max-width: 767px) {
  .theme-box {
    padding: 20px;
  }
}

.environment-box {
  margin-top: 30px;
  padding: 30px;
  background: #f1f9ea;
  border-radius: 12px;
}
.environment-box .title {
  width: 100%;
  padding: 10px 15px;
  font-size: 2rem;
  color: #fff;
  border-radius: 4px;
  background: var(--sus-color-earth);
}
@media screen and (max-width: 767px) {
  .environment-box {
    padding: 20px;
  }
  .environment-box .title {
    font-size: 1.6rem;
  }
  .environment-box div + .title {
    margin-top: 30px;
  }
}

main .box-layout h4 {
  margin: 0 -20px 18px;
  padding: 12px;
  text-align: center;
  color: #fff;
  font-weight: 700;
}
main .box-layout .box01 h4 {
  background-color: var(--sus-color-employee);
}
main .box-layout .box02 h4 {
  background-color: var(--sus-color-social);
}
main .box-layout .box03 h4 {
  background-color: var(--sus-color-earth);
}
main .box-layout .box04 h4 {
  background-color: var(--sus-color-organization);
}

main sup {
  font-size: 75%;
  vertical-align: top;
  font-variant-numeric: oldstyle-nums;
}
main sup > span {
  font-size: 80%;
}
main .header-list .text {
  word-break: break-word;
}

/* /fact/ */
main .infobox .title {
  font-family: 
    helvetica,
    sans-serif;
}
main .infobox .col-area01,
main .infobox .col-area05 {
  max-width: 1070px;
}
main .infobox .col-area01 {
  gap: 30px;
}
main .infobox .col-area01 .col:first-child {
  width: 45%;
}
main .infobox .col-area01 .col:last-child {
  width: calc(55% - 30px);
}
main .infobox .col-area03 .col {
  width: 36%;
  max-width: 420px;
}
main .infobox .col-area05 {
  gap: 40px 24px;
}
main .infobox .col-area05 .col {
  max-width: 340px;
}
main .fact-num {
  font-weight: bold;
}
main .fact-img-num {
  max-width: 320px;
  gap: 24px;
}
main .fact-title {
  font-size: 18px;
}
main .fact-list {
  width: 70%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  main .infobox .col-area03 .col,
  main .infobox .col-area01 .col:first-child,
  main .infobox .col-area01 .col:last-child {
    width: 100%;
  }
  main .fact-list {
    width: 100%;
  }
}