@charset "UTF-8";
/* Scss Document */
/* Scss Document */
html {
  scroll-snap-type: y mandatory;
  scroll-behavior: smooth; }
  html.preload {
    font-size: 1px !important; }
    html.preload * {
      transition: none !important;
      visibility: hidden;
      max-width: 100%; }
  @media (max-width: 585.98px) {
    html {
      font-size: calc(var(--vw) / 384); } }
  @media (min-width: 586px) and (max-width: 767.98px) {
    html {
      font-size: 1.5px; } }
  @media (min-width: 768px) and (max-width: 1599.98px) {
    html {
      font-size: calc(var(--vw) / 1280); } }
  @media (min-width: 1600px) {
    html {
      font-size: 1.25px; } }
  @media print {
    html {
      font-size: 0.2mm; } }

[id] {
  scroll-margin-top: 70rem; }
  @media screen and (min-width: 768px), print {
    [id] {
      scroll-margin-top: 140rem; } }

* {
  box-sizing: border-box; }

body {
  font-size: 15rem;
  font-weight: 400;
  color: #181A1E;
  background: #F9F9FB;
  line-height: 1.84;
  text-align: left;
  -webkit-text-size-adjust: 100%;
  word-break: break-word;
  min-width: 320rem;
  font-family: "Noto Sans JP", "游ゴシック体", "Yu Gothic", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", Arial, sans-serif;
  margin: 0;
  padding: 0;
  letter-spacing: 0.05em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }
  @media screen and (min-width: 768px), print {
    body {
      font-size: 16rem; } }

html.modal-on, body.modal-on {
  overflow: hidden; }

svg {
  transition: fill .5s ,stroke .5s; }

.tal {
  text-align: left !important; }

.tar {
  text-align: right !important; }

.tac {
  text-align: center !important; }

.fl {
  float: left; }

.fr {
  float: right; }

.mt0 {
  margin-top: 0 !important; }

.mb0 {
  margin-bottom: 0 !important; }

.mt-l {
  margin-top: 48rem !important; }
  @media screen and (min-width: 768px), print {
    .mt-l {
      margin-top: 64rem !important; } }

.mt-m {
  margin-top: 24rem !important; }
  @media screen and (min-width: 768px), print {
    .mt-m {
      margin-top: 32rem !important; } }

.mt-ms {
  margin-top: 16rem !important; }
  @media screen and (min-width: 768px), print {
    .mt-ms {
      margin-top: 24rem !important; } }

.mt-sm {
  margin-top: 12rem !important; }
  @media screen and (min-width: 768px), print {
    .mt-sm {
      margin-top: 16rem !important; } }

.mt-s {
  margin-top: 8rem !important; }
  @media screen and (min-width: 768px), print {
    .mt-s {
      margin-top: 8rem !important; } }

@media screen and (min-width: 768px), print {
  .inner {
    width: 1152rem;
    margin: 0 auto; }

  .inner-medium {
    width: 1006rem;
    margin: 0 auto; }

  .inner-narrow {
    width: 860rem;
    margin: 0 auto; }

  .spOnly {
    display: none !important; }

  .pcTal {
    text-align: left !important; }

  .pcTar {
    text-align: right !important; }

  .pcTac {
    text-align: center !important; }

  .pc-nowrap {
    white-space: nowrap; } }
@media screen and (max-width: 767.98px) {
  .spTal {
    text-align: left !important; }

  .spTar {
    text-align: right !important; }

  .spTac {
    text-align: center !important; }

  .inner,
  .inner-medium,
  .inner-narrow {
    width: 100%;
    padding: 0 16rem;
    box-sizing: border-box; }

  .pcOnly {
    display: none !important; } }
hr {
  border: none;
  height: 1px;
  background: #dddddd;
  margin: 24rem 0; }
  @media screen and (min-width: 768px), print {
    hr {
      margin: 32rem 0; } }
  hr.margn-l {
    margin: 32rem 0; }
    @media screen and (min-width: 768px), print {
      hr.margn-l {
        margin: 64rem 0; } }
  @media screen and (min-width: 768px), print {
    .inner-narrow hr {
      margin-left: -73rem;
      margin-right: -73rem; } }
  @media screen and (min-width: 768px), print {
    .inner-medium hr {
      margin-left: -72rem;
      margin-right: -72rem; } }

.touchdevice .clickdeviceOnly {
  display: none; }

.clickdevice .touchdeviceOnly {
  display: none; }

/* CSS Document */
nav,
header,
footer,
article,
figure {
  margin: 0;
  padding: 0; }

sub {
  vertical-align: baseline;
  font-size: 60%; }

p {
  margin: 1em 0;
  letter-spacing: 0.02em;
  text-align: justify; }
  @media screen and (min-width: 768px), print {
    p {
      line-height: 2.25; } }
  p:first-child {
    margin-top: 0; }
  p:last-child {
    margin-bottom: 0; }

h1, h2, h3, h4, h5 {
  line-height: 1.5;
  font-weight: 900; }
  h1 .en, h2 .en, h3 .en, h4 .en, h5 .en {
    font-weight: 700;
    font-family: "Inter", sans-serif;
    display: block; }
  h1 .ja, h2 .ja, h3 .ja, h4 .ja, h5 .ja {
    display: block; }

h2, h3 {
  letter-spacing: 0.1em; }

a,
span.a {
  color: #181A1E;
  backface-visibility: hidden;
  text-decoration-line: underline;
  text-decoration-color: transparent;
  text-decoration-style: solid;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.3em;
  transition: background .5s,color .5s,opacity .5s, text-decoration .5s;
  cursor: pointer; }
  @media screen and (min-width: 768px), print {
    a:hover,
    span.a:hover {
      text-decoration-color: currentColor; } }

p a {
  color: #0082E6; }
  @media screen and (min-width: 768px), print {
    p a:hover {
      text-decoration-color: currentColor; } }

input, textarea, select, button {
  font-family: "Noto Sans JP", "游ゴシック体", "Yu Gothic", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", Arial, sans-serif;
  font-size: 15rem; }
  @media screen and (min-width: 768px), print {
    input, textarea, select, button {
      font-size: 16rem; } }

em,
address {
  font-style: normal; }

.font-large {
  font-size: 15rem; }
  @media screen and (min-width: 768px), print {
    .font-large {
      font-size: 20rem; } }

.hw-effect {
  display: table;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center;
  position: relative; }
  .hw-effect::before {
    content: "";
    display: block;
    position: absolute;
    top: -5rem;
    left: 0;
    background: url("../images/hw_triangle.svg") no-repeat center center/contain;
    width: 100rem;
    aspect-ratio: 200/64;
    mix-blend-mode: multiply; }
    @media screen and (min-width: 768px), print {
      .hw-effect::before {
        top: -20rem;
        left: -60rem;
        width: 200rem; } }
  .hw-effect:has(span)::before {
    mix-blend-mode: normal; }
  .hw-effect span {
    position: relative; }
  @media screen and (max-width: 767.98px) {
    .hw-effect._short::before {
      left: -30rem; } }
  @media screen and (min-width: 768px), print {
    .hw-effect.pcTal {
      margin-left: 0 !important; } }
  .hw-effect.pcTal::before {
    top: 0rem;
    left: -30rem;
    width: 75rem; }
    @media screen and (min-width: 768px), print {
      .hw-effect.pcTal::before {
        top: -10rem;
        left: -20rem;
        width: 150rem; } }

.hw-large {
  font-size: 20rem;
  margin: 48rem 0 14rem; }
  .hw-large:first-child {
    margin-top: 0; }
  @media screen and (min-width: 768px), print {
    .hw-large {
      font-size: 31rem;
      margin: 64rem 0 16rem; } }
  .hw-large:has(+ p) {
    margin-bottom: 24rem; }
    @media screen and (min-width: 768px), print {
      .hw-large:has(+ p) {
        margin-bottom: 40rem; } }

.hw-medium {
  font-size: 19rem;
  margin: 32rem 0 14rem; }
  @media screen and (min-width: 768px), print {
    .hw-medium {
      font-size: 24rem;
      margin: 64rem 0 16rem; }
      .hw-medium.tac {
        margin-bottom: 24rem; } }

.hw-small,
.hw-small2 {
  font-size: 18rem;
  margin: 32rem 0 6rem; }
  @media screen and (min-width: 768px), print {
    .hw-small,
    .hw-small2 {
      font-size: 20rem;
      margin: 32rem 0 10rem; } }
  .hw-small + p,
  .hw-small2 + p {
    margin-top: 0; }

@media screen and (min-width: 768px), print {
  .hw-small2 {
    font-size: 24rem; } }
.hw-small2 span {
  background: #7B292F;
  color: #fff;
  padding: 2rem 10rem 3rem;
  display: table;
  margin: 0 0 8rem;
  font-size: 13rem; }
  @media screen and (min-width: 768px), print {
    .hw-small2 span {
      font-size: 16rem;
      display: inline-block;
      margin: 0 10rem 0 0;
      padding: 3rem 10rem 5rem;
      transform: translateY(-4rem); } }

h2.common {
  margin: 0 0 16rem;
  position: relative; }
  @media screen and (min-width: 768px), print {
    h2.common {
      margin: 0 0 24rem; } }
  h2.common .en {
    font-size: 12rem;
    line-height: 1;
    color: #7B292F;
    position: relative; }
    @media screen and (min-width: 768px), print {
      h2.common .en {
        font-size: 16rem; } }
  h2.common .ja {
    font-size: 24rem;
    position: relative; }
    @media screen and (min-width: 768px), print {
      h2.common .ja {
        font-size: 36rem; } }

img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94); }

.round {
  border-radius: 4rem; }
  @media screen and (min-width: 768px), print {
    .round {
      border-radius: 8rem; } }

.round-l {
  border-radius: 8rem; }
  @media screen and (min-width: 768px), print {
    .round-l {
      border-radius: 16rem; } }

em {
  font-style: normal; }

header {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1000;
  height: 57rem;
  width: calc(100% - 16rem);
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(6rem);
  --webkit-backdrop-filter: blur(6rem);
  box-shadow: 0px 0px 10rem rgba(0, 0, 0, 0.2);
  border-radius: 0 0 10rem 10rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
  padding: 0 0 0 16rem; }
  @media screen and (min-width: 768px), print {
    header {
      width: 1200rem;
      height: 100rem;
      border-radius: 0 0 10rem 10rem;
      background: rgba(255, 255, 255, 0.9);
      backdrop-filter: blur(12rem);
      --webkit-backdrop-filter: blur(12rem);
      box-shadow: 0px 0px 20rem rgba(0, 0, 0, 0.2);
      padding: 0 40rem;
      transition: transform .5s; }
      .scrolldown header {
        transform: translate(-50%, -37rem) !important; } }
  @media screen and (min-width: 768px), print {
    header .logo {
      transition: transform .5s;
      transform-origin: left bottom; }
      .scrolldown header .logo {
        transform: translateY(12rem) scale(0.85); } }
  header .logo img {
    width: 136rem; }
    @media screen and (min-width: 768px), print {
      header .logo img {
        width: 240rem; } }
  .toppage header {
    transform: translate(-50%, -100%);
    transition: transform .5s; }
    .loaded .toppage header {
      transform: translate(-50%, 0); }

footer {
  width: 100%;
  background: #F9F9FB;
  margin: -8rem 0 0;
  padding: 35rem 0 24rem;
  border-radius: 8rem 8rem 0 0;
  font-size: 11rem;
  overflow: hidden; }
  @media screen and (min-width: 768px), print {
    footer {
      margin: -16rem 0 0;
      border-radius: 16rem 16rem 0 0;
      font-size: 16rem; } }
  footer .flogo {
    display: grid;
    grid-template-columns: 136rem 1fr;
    align-items: center;
    grid-gap: 13rem; }
    @media screen and (min-width: 768px), print {
      footer .flogo {
        grid-template-columns: 240rem 1fr 323rem;
        grid-gap: 30rem; } }
    footer .flogo address {
      font-style: normal;
      line-height: 1.4;
      border-left: 1px solid #dddddd;
      padding: 0 0 0 13rem; }
      @media screen and (min-width: 768px), print {
        footer .flogo address {
          padding: 0 0 0 30px;
          font-size: 14rem; } }
      footer .flogo address a {
        color: #0082E6;
        display: inline-flex;
        align-items: center;
        grid-gap: 5rem;
        margin-top: 5rem; }
      footer .flogo address i {
        line-height: 1px; }
      footer .flogo address svg {
        fill: #0082E6;
        width: 11rem;
        aspect-ratio: 21/29; }
        @media screen and (min-width: 768px), print {
          footer .flogo address svg {
            width: 14rem; } }
    @media screen and (max-width: 767.98px) {
      footer .flogo .download {
        grid-column: 1 / 3;
        grid-row: 2 / 3;
        padding: 16rem 0 0; } }
    footer .flogo .download a {
      color: #0082E6;
      display: grid;
      align-items: center;
      border: 1px solid #0082E6;
      border-radius: 100rem;
      grid-template-columns: 10rem 1fr 12rem;
      box-shadow: 0px 1rem 4rem rgba(0, 0, 0, 0.16);
      width: 233rem;
      margin: 0 auto;
      padding: 7rem 16rem;
      grid-gap: 3rem;
      font-weight: 900;
      text-decoration: none !important; }
      @media screen and (min-width: 768px), print {
        footer .flogo .download a {
          width: auto;
          margin: 0;
          height: 64rem;
          padding: 0 30px;
          grid-gap: 6rem;
          grid-template-columns: 14rem 1fr 27rem; }
          footer .flogo .download a:hover {
            background: #0082E6;
            color: #fff; }
            footer .flogo .download a:hover .icon-document svg {
              fill: #fff; }
            footer .flogo .download a:hover .icon-arrow svg {
              stroke: #fff; } }
    footer .flogo .download .icon-document {
      line-height: 1px; }
      footer .flogo .download .icon-document svg {
        aspect-ratio: 20/25;
        width: 100%;
        fill: #0082E6; }
  footer .fnavi-sub1 {
    text-align: center;
    margin: 32rem 0 0; }
    @media screen and (min-width: 768px), print {
      footer .fnavi-sub1 {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        grid-gap: 32rem;
        margin: 0 0 32rem; } }
    footer .fnavi-sub1 .y100 {
      margin: 0 0 24rem; }
      @media screen and (min-width: 768px), print {
        footer .fnavi-sub1 .y100 {
          margin: 0; } }
      footer .fnavi-sub1 .y100 a {
        font-weight: 900;
        font-size: 12rem;
        display: inline-grid;
        grid-template-columns: 66rem 1fr 12rem;
        grid-gap: 10rem;
        align-items: center;
        pointer-events: all; }
        @media screen and (min-width: 768px), print {
          footer .fnavi-sub1 .y100 a {
            font-size: 16rem;
            display: grid; } }
    footer .fnavi-sub1 .youtube a {
      font-weight: 900;
      font-size: 15rem;
      display: inline-grid;
      grid-template-columns: 44rem 1fr;
      grid-gap: 10rem;
      align-items: center; }
      footer .fnavi-sub1 .youtube a i {
        line-height: 1px; }
      @media screen and (min-width: 768px), print {
        footer .fnavi-sub1 .youtube a {
          font-size: 16rem;
          display: grid; } }
  footer .fnavi-sub2 {
    padding: 32rem 0; }
    @media screen and (min-width: 768px), print {
      footer .fnavi-sub2 {
        float: left;
        padding: 0; } }
    footer .fnavi-sub2 ul {
      margin: 0;
      padding: 0;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      grid-gap: 16rem 0;
      list-style: none; }
      @media screen and (min-width: 768px), print {
        footer .fnavi-sub2 ul {
          justify-content: flex-start; } }
      footer .fnavi-sub2 ul li {
        margin: 0;
        padding: 0 12rem;
        line-height: 1; }
        footer .fnavi-sub2 ul li:nth-of-type(2n) {
          border-left: 1px solid #181A1E; }
        @media screen and (min-width: 768px), print {
          footer .fnavi-sub2 ul li:nth-of-type(3) {
            border-left: 1px solid #181A1E; } }
    footer .fnavi-sub2 a {
      font-size: 11rem;
      letter-spacing: 0;
      display: inline-block; }
      @media screen and (min-width: 768px), print {
        footer .fnavi-sub2 a {
          font-size: 12rem; } }
  footer .copyright {
    text-align: center;
    font-size: 11rem; }
    @media screen and (min-width: 768px), print {
      footer .copyright {
        font-size: 12rem;
        text-align: right; } }

main {
  margin: 0 0 0;
  overflow: hidden;
  position: relative;
  z-index: 10; }
  main.with-tr::before {
    content: "";
    display: block;
    background: url(../images/main_triangle.svg) no-repeat center center/contain;
    width: 220rem;
    aspect-ratio: 441/153;
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(-15%, -10%); }
    @media screen and (min-width: 768px), print {
      main.with-tr::before {
        width: 441rem; } }

section {
  margin: 64rem 0;
  position: relative; }
  @media screen and (min-width: 768px), print {
    section {
      margin: 100rem 0; } }
  section.sub {
    margin: 32rem 0; }
    @media screen and (min-width: 768px), print {
      section.sub {
        margin: 40rem 0; } }
    section.sub:last-child {
      margin-bottom: 0; }

.icon-pdf {
  line-height: 1px; }
  .icon-pdf svg {
    fill: #0082E6;
    width: 30rem;
    aspect-ratio: 42/20; }
    @media screen and (min-width: 768px), print {
      .icon-pdf svg {
        width: 42rem; } }

.icon-pdf2 {
  line-height: 1px; }
  .icon-pdf2 svg {
    display: block;
    width: 15rem;
    fill: #0082E6;
    aspect-ratio: 15/16;
    margin: 0 auto 3rem; }
    @media screen and (min-width: 768px), print {
      .icon-pdf2 svg {
        width: 17rem; } }
  .icon-pdf2 span {
    font-style: normal;
    font-size: 9rem;
    text-align: center;
    display: block;
    line-height: 1;
    letter-spacing: 0;
    font-weight: 500; }
    @media screen and (min-width: 768px), print {
      .icon-pdf2 span {
        font-size: 12rem; } }

.icon-external {
  line-height: 1px; }
  .icon-external svg {
    width: 12rem;
    aspect-ratio: 11/8;
    fill: #181A1E; }

.icon-external2 {
  line-height: 1px; }
  .icon-external2 svg {
    width: 18rem;
    aspect-ratio: 18/19;
    fill: #181A1E; }

.icon-arrow,
.icon-arrow-wide {
  line-height: 1px;
  width: 100%;
  aspect-ratio: 24/18;
  position: relative;
  overflow: hidden; }
  .icon-arrow svg,
  .icon-arrow-wide svg {
    width: 100%;
    height: 100%;
    stroke: #0082E6;
    position: absolute;
    top: 0;
    left: 0;
    stroke-width: 1;
    fill: none; }
    .icon-arrow svg:first-child,
    .icon-arrow-wide svg:first-child {
      transform: translateX(-110%); }

@media screen and (min-width: 768px), print {
  [data-tab]:hover .icon-arrow svg:first-child,
  [data-tab]:hover .icon-arrow-wide svg:first-child,
  a:hover .icon-arrow svg:first-child,
  a:hover .icon-arrow-wide svg:first-child,
  button:hover .icon-arrow svg:first-child,
  button:hover .icon-arrow-wide svg:first-child {
    transform: translateX(-110%);
    animation: a_arrow1 .5s; }
  [data-tab]:hover .icon-arrow svg:last-child,
  [data-tab]:hover .icon-arrow-wide svg:last-child,
  a:hover .icon-arrow svg:last-child,
  a:hover .icon-arrow-wide svg:last-child,
  button:hover .icon-arrow svg:last-child,
  button:hover .icon-arrow-wide svg:last-child {
    animation: a_arrow2 .5s; } }

.icon-arrow-wide {
  aspect-ratio: 58/18; }

@keyframes a_arrow1 {
  0% {
    transform: translateX(-130%); }
  100% {
    transform: translateX(0); } }
@keyframes a_arrow2 {
  0% {
    transform: translateX(0%); }
  100% {
    transform: translateX(130%); } }
@keyframes a_arrow3 {
  0% {
    transform: translateX(-130%); }
  100% {
    transform: translateX(0); } }
@keyframes a_arrow4 {
  0% {
    transform: translateX(0%); }
  100% {
    transform: translateX(130%); } }
/*------------------------------------------*/
@media screen and (max-width: 767.98px) {
  #navi {
    display: none; } }
@media screen and (min-width: 768px), print {
  #navi ul#gnavi {
    margin: 0;
    padding: 0;
    position: absolute;
    display: flex;
    bottom: 0;
    right: 32rem;
    grid-gap: 32rem;
    list-style: none; }
    #navi ul#gnavi li {
      margin: 0;
      padding: 0;
      height: 64rem;
      display: flex;
      align-items: center;
      position: relative; }
      #navi ul#gnavi li::after {
        content: "";
        display: block;
        width: 100%;
        height: 2rem;
        opacity: 0;
        background: #7B292F;
        position: absolute;
        bottom: 0;
        left: 0;
        transition: .3s; }
      #navi ul#gnavi li a {
        font-weight: 900;
        text-decoration: none !important; }
      #navi ul#gnavi li:hover a {
        color: #7B292F; }
      #navi ul#gnavi li:hover::after {
        opacity: 1; } }

ul.subnavi {
  margin: 40rem 0 0;
  padding: 0;
  display: flex;
  grid-gap: 16rem 24rem;
  flex-wrap: wrap;
  list-style: none; }
  @media screen and (min-width: 768px), print {
    ul.subnavi {
      position: absolute;
      top: 15rem;
      right: 32rem;
      grid-gap: 32rem;
      margin: 0; } }
  ul.subnavi li {
    margin: 0;
    padding: 0; }
    ul.subnavi li.inquiry a {
      color: #0082E6; }
    ul.subnavi li.inquiry i {
      width: 8rem;
      height: 8rem;
      background: #0082E6;
      border-radius: 100rem;
      display: block; }
      @media screen and (min-width: 768px), print {
        ul.subnavi li.inquiry i {
          width: 10rem;
          height: 10rem; } }
  ul.subnavi a, ul.subnavi span {
    display: flex;
    align-items: center;
    font-size: 14rem;
    grid-gap: 4rem;
    color: #181A1E;
    font-weight: 900;
    cursor: pointer; }
    @media screen and (min-width: 768px), print {
      ul.subnavi a, ul.subnavi span {
        font-size: 14rem;
        text-decoration-thickness: 2px; } }
    ul.subnavi a i, ul.subnavi span i {
      line-height: 1px; }
      ul.subnavi a i img, ul.subnavi span i img {
        width: 12rem; }
        @media screen and (min-width: 768px), print {
          ul.subnavi a i img, ul.subnavi span i img {
            width: 15rem; } }

@media screen and (max-width: 767.98px) {
  #gnavi-child {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(6rem);
    --webkit-backdrop-filter: blur(6px);
    z-index: 900;
    box-sizing: border-box;
    padding: 64rem 32rem 48rem;
    overflow: auto; }
    #gnavi-child .child {
      display: none;
      margin: 0 -32rem;
      padding: 0 32rem; }
    #gnavi-child .spmenu-parent {
      display: grid;
      grid-template-columns: 1fr 24rem;
      align-items: center;
      border-bottom: 1px solid #DDDDDD;
      padding: 0 0 10rem;
      margin: 32rem 0 16rem;
      font-size: 16rem;
      font-weight: 900;
      transition: color .3s, border-color .3s; }
      #gnavi-child .spmenu-parent i {
        display: block;
        border: 1px solid #0082E6;
        border-radius: 100rem;
        width: 24rem;
        height: 24rem;
        position: relative; }
        #gnavi-child .spmenu-parent i::before, #gnavi-child .spmenu-parent i::after {
          content: "";
          width: 9rem;
          height: 1px;
          position: absolute;
          top: 50%;
          left: 50%;
          display: block;
          background: #0082E6;
          transform: translate(-50%, -50%);
          transition: .3s; }
        #gnavi-child .spmenu-parent i::after {
          transform: translate(-50%, -50%) rotate(90deg); }
      #gnavi-child .spmenu-parent.open {
        border-bottom: 2px solid #7B292F;
        color: #7B292F;
        margin-bottom: calc(16rem - 1px); }
        #gnavi-child .spmenu-parent.open i::after {
          transform: translate(-50%, -50%) rotate(90deg) scaleX(0); }
    #gnavi-child .spmenu-link {
      display: grid;
      grid-template-columns: 1fr 24rem;
      align-items: center;
      border-bottom: 1px solid #DDDDDD;
      padding: 0 0 10rem;
      margin: 32rem 0 16rem;
      font-size: 16rem;
      font-weight: 900;
      transition: color .3s, border-color .3s; }
      #gnavi-child .spmenu-link span {
        display: flex;
        justify-content: center;
        align-items: center;
        border: 1px solid #0082E6;
        border-radius: 100rem;
        width: 24rem;
        height: 24rem;
        position: relative;
        padding: 6rem;
        box-sizing: border-box; }
    #gnavi-child .megamenu-inner .grid {
      display: grid;
      grid-gap: 5rem; } }
@media screen and (min-width: 768px), print {
  #gnavi-child .child {
    position: fixed;
    top: 0;
    left: 50%;
    width: 1200rem;
    background: rgba(255, 255, 255, 0.9);
    box-sizing: border-box;
    transform: translateX(-50%);
    display: none;
    z-index: 900;
    backdrop-filter: blur(612em);
    --webkit-backdrop-filter: blur(12px);
    box-shadow: 0px 0px 20rem rgba(0, 0, 0, 0.2);
    border-radius: 0 0 10rem 10rem;
    padding: calc(100rem + 32rem) 60rem 32rem;
    overflow: hidden;
    transition: transform .5s; }
    .scrolldown #gnavi-child .child {
      transform: translate(-50%, -37rem); }
    #gnavi-child .child .megamenu-inner {
      display: flex;
      grid-gap: 60rem;
      align-items: flex-start; }
  #gnavi-child .grid {
    display: flex;
    grid-gap: 64rem;
    min-height: 70rem; }
    #gnavi-child .grid > div {
      width: 216rem; }
      #gnavi-child .grid > div.double {
        width: 496rem; }
        #gnavi-child .grid > div.double ul {
          grid-template-columns: 1fr 1fr; }
          #gnavi-child .grid > div.double ul li:nth-of-type(1) {
            grid-column: 1/2;
            grid-row: 1/2; }
          #gnavi-child .grid > div.double ul li:nth-of-type(2) {
            grid-column: 1/2;
            grid-row: 2/3; }
          #gnavi-child .grid > div.double ul li:nth-of-type(3) {
            grid-column: 1/2;
            grid-row: 3/4; }
          #gnavi-child .grid > div.double ul li:nth-of-type(4) {
            grid-column: 2/3;
            grid-row: 2/3; }
          #gnavi-child .grid > div.double ul li:nth-of-type(5) {
            grid-column: 2/3;
            grid-row: 3/4; }
  #gnavi-child #gnavi-sustainability-child .grid > div {
    width: auto; }
  #gnavi-child #gnavi-recruit-child .grid > div {
    width: auto; } }
#gnavi-child .label {
  position: relative; }
  @media screen and (max-width: 767.98px) {
    #gnavi-child .label {
      overflow: hidden;
      margin: 0 0 8rem 0;
      padding: 8rem 0 0 0; } }
  @media screen and (min-width: 768px), print {
    #gnavi-child .label {
      width: 250rem; } }
  #gnavi-child .label a {
    text-decoration: none !important; }
    @media screen and (min-width: 768px), print {
      #gnavi-child .label a:hover .ja {
        text-decoration-color: currentColor; } }
  #gnavi-child .label .en {
    font-family: "Inter", sans-serif;
    font-weight: 700;
    font-size: 12rem;
    display: none; }
    @media screen and (min-width: 768px), print {
      #gnavi-child .label .en {
        display: block;
        font-size: 16rem; } }
  #gnavi-child .label .ja {
    display: inline-grid;
    grid-template-columns: 1fr 12rem;
    grid-gap: 20px;
    align-items: center;
    font-size: 14rem;
    font-weight: 900; }
    @media screen and (min-width: 768px), print {
      #gnavi-child .label .ja {
        font-size: 20rem;
        grid-template-columns: 1fr 10rem;
        backface-visibility: hidden;
        text-decoration-line: underline;
        text-decoration-color: transparent;
        text-decoration-style: solid;
        text-decoration-thickness: 2px;
        text-underline-offset: 0.3em;
        transition: background .5s,color .5s,opacity .5s, text-decoration .5s; } }
    @media screen and (max-width: 767.98px) {
      #gnavi-child .label .ja .icon-arrow {
        width: 12rem; } }
  @media screen and (max-width: 767.98px) {
    #gnavi-child .label figure {
      display: none; } }
  @media screen and (min-width: 768px), print {
    #gnavi-child .label figure {
      position: absolute;
      top: 70rem;
      left: -100rem;
      width: 368rem; } }
#gnavi-child .sublabel {
  font-size: 14rem;
  font-weight: 900;
  overflow: hidden;
  margin: 12rem 64rem 6rem 0; }
  @media screen and (min-width: 768px), print {
    #gnavi-child .sublabel {
      font-size: 13rem;
      margin: 5rem 0 0; } }
  #gnavi-child .sublabel span {
    display: inline-block;
    position: relative; }
    #gnavi-child .sublabel span::after {
      content: "";
      position: absolute;
      right: -10rem;
      top: 50%;
      transform: translateX(100%);
      height: 1px;
      width: 500rem;
      display: block;
      background: rgba(24, 26, 30, 0.4); }
  #gnavi-child .sublabel.e {
    color: #37C086; }
    #gnavi-child .sublabel.e span::after {
      background: #37C086; }
  #gnavi-child .sublabel.s {
    color: #0082E6; }
    #gnavi-child .sublabel.s span::after {
      background: #0082E6; }
  #gnavi-child .sublabel.g {
    color: #FB9100; }
    #gnavi-child .sublabel.g span::after {
      background: #FB9100; }
  #gnavi-child .sublabel a {
    display: grid;
    grid-template-columns: 1fr 10rem;
    align-items: center;
    grid-gap: 20px; }
    #gnavi-child .sublabel a[target="_blank"] {
      display: inline-grid;
      grid-gap: 8rem; }
#gnavi-child .child ul {
  font-size: 14rem;
  margin: 0 64rem 0 0;
  padding: 0;
  display: grid;
  grid-gap: 5rem;
  list-style: none; }
  @media screen and (min-width: 768px), print {
    #gnavi-child .child ul {
      margin: 0;
      font-size: 14rem;
      grid-gap: 0 40rem; } }
  #gnavi-child .child ul li {
    margin: 5rem 0 0;
    padding: 0; }
  #gnavi-child .child ul a {
    display: grid;
    grid-template-columns: 1fr 10rem;
    align-items: center;
    grid-gap: 16rem; }
    #gnavi-child .child ul a[target="_blank"] {
      display: inline-grid;
      grid-gap: 8rem; }
#gnavi-child .child .icon-arrow svg {
  stroke: #181A1E;
  stroke-width: 2; }
#gnavi-child ul.sublinks li,
#gnavi-child li.sublink {
  display: grid;
  grid-template-columns: 0.9em 1fr; }
  #gnavi-child ul.sublinks li::before,
  #gnavi-child li.sublink::before {
    content: "-"; }

#search-child {
  display: none;
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 16rem);
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(6rem);
  --webkit-backdrop-filter: blur(6px);
  box-sizing: border-box;
  display: none;
  z-index: 900;
  box-shadow: 0px 0px 20rem rgba(0, 0, 0, 0.2);
  border-radius: 0 0 20rem 20rem;
  overflow: hidden;
  padding: 80rem 0 62rem; }
  @media screen and (min-width: 768px), print {
    #search-child {
      background: rgba(255, 255, 255, 0.9);
      backdrop-filter: blur(12rem);
      --webkit-backdrop-filter: blur(12px);
      padding: calc(100rem + 32rem) 60rem 32rem;
      width: 1200rem;
      transition: transform .5s; }
      .scrolldown #search-child {
        transform: translate(-50%, -37rem); } }
  #search-child .megamenu-inner {
    display: flex;
    grid-gap: 60rem;
    align-items: flex-start; }
  #search-child form {
    display: grid;
    width: 320rem;
    margin: 0 auto;
    border: 1px solid #7a7e86;
    border-radius: 4rem;
    box-shadow: 0rem 1rem 4rem rgba(0, 0, 0, 0.16);
    grid-template-columns: 1fr 48rem;
    overflow: hidden; }
    @media screen and (min-width: 768px), print {
      #search-child form {
        width: 640rem;
        box-shadow: 0rem 2rem 8rem rgba(0, 0, 0, 0.16);
        border-radius: 8rem;
        grid-template-columns: 1fr 94rem; } }
    #search-child form input {
      box-sizing: border-box;
      padding: 0 16rem;
      height: 48rem;
      border: none; }
    #search-child form button {
      height: 48rem;
      background: #0082E6;
      color: #fff;
      display: flex;
      justify-content: center;
      align-items: center;
      font-weight: 700;
      grid-gap: 8rem;
      border: none;
      appearance: none;
      cursor: pointer;
      border-radius: 0;
      line-height: 1px; }
      #search-child form button svg {
        width: 15rem;
        height: 15rem;
        fill: #fff; }
  #search-child .close {
    position: absolute; }
    @media screen and (max-width: 767.98px) {
      #search-child .close {
        bottom: 16rem;
        left: 50%;
        transform: translateX(-50%); } }
    @media screen and (min-width: 768px), print {
      #search-child .close {
        bottom: 16rem;
        right: 16rem; } }
    #search-child .close i {
      display: block;
      border: 1px solid #0082E6;
      border-radius: 100rem;
      width: 32rem;
      height: 32rem;
      position: relative;
      transform: rotate(45deg);
      cursor: pointer;
      transition: background .5s; }
      #search-child .close i::before, #search-child .close i::after {
        content: "";
        width: 11rem;
        height: 1px;
        position: absolute;
        top: 50%;
        left: 50%;
        display: block;
        background: #0082E6;
        transform: translate(-50%, -50%);
        transition: background .5s; }
      #search-child .close i::after {
        transform: translate(-50%, -50%) rotate(90deg); }
    @media screen and (min-width: 768px), print {
      #search-child .close:hover i {
        background: #0082E6; }
        #search-child .close:hover i::before, #search-child .close:hover i::after {
          background: #fff; } }

#fnavi {
  display: flex;
  justify-content: space-between;
  margin: 35rem 0 0; }
  #fnavi h3 {
    font-weight: 900;
    font-size: 16rem;
    margin: 25px 0 0;
    line-height: 1.84; }
    #fnavi h3:first-child {
      margin: 0; }
    @media screen and (min-width: 768px), print {
      #fnavi h3 a {
        text-decoration-thickness: 2px; } }
  #fnavi ul {
    font-size: 13rem;
    margin: 0;
    padding: 0;
    list-style: none; }
    #fnavi ul li {
      margin: 5rem 0 0;
      padding: 0; }
  #fnavi ul.sublinks li,
  #fnavi li.sublink {
    display: grid;
    grid-template-columns: 0.9em 1fr; }
    #fnavi ul.sublinks li::before,
    #fnavi li.sublink::before {
      content: "-"; }
  #fnavi .grid {
    display: flex;
    grid-gap: 32rem; }
    #fnavi .grid .sublabel {
      font-size: 13rem;
      font-weight: 900;
      overflow: hidden;
      margin: 5rem 0 0; }
    #fnavi .grid h4 {
      line-height: 1.84; }
    @media screen and (min-width: 768px), print {
      #fnavi .grid div {
        padding-top: 30rem; }
        #fnavi .grid div:nth-of-type(1) {
          padding-top: 0; } }
  #fnavi a {
    display: grid;
    grid-template-columns: 1fr 10rem;
    align-items: center;
    grid-gap: 20px; }
  #fnavi .icon-arrow svg {
    stroke: #181A1E;
    stroke-width: 2; }

/*------------------------------------------*/
.menu-btn {
  width: 57rem;
  height: 57rem;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  grid-gap: 8rem;
  padding-top: 5rem; }
  .menu-btn .burger {
    width: 28rem;
    height: 12rem;
    display: block;
    position: relative; }
    .menu-btn .burger i {
      background: #0082E6;
      width: 28rem;
      height: 2px;
      border-radius: 10rem;
      display: block;
      position: absolute;
      transform: translate(-50%, -50%);
      left: 50%;
      transition: all 0.3s ease 0s; }
      .menu-btn .burger i:nth-of-type(1) {
        top: 0; }
      .menu-btn .burger i:nth-of-type(2) {
        top: 50%; }
      .menu-btn .burger i:nth-of-type(3) {
        top: 100%; }
  .menu-btn .label {
    font-weight: 900;
    font-size: 8rem;
    line-height: 1; }
  .menu-btn.open .burger i:nth-of-type(1) {
    transform: translate(-50%, -50%) rotate(-135deg);
    top: 50%; }
  .menu-btn.open .burger i:nth-of-type(2) {
    opacity: 0; }
  .menu-btn.open .burger i:nth-of-type(3) {
    transform: translate(-50%, -50%) rotate(135deg);
    top: 50%; }

/*------------------------------------------*/
.bottom-bnrs {
  background: #B0B5BE;
  border-radius: 8rem 8rem 0 0;
  padding: 24rem 0 32rem;
  margin: 16rem 0 0; }
  @media screen and (min-width: 768px), print {
    .bottom-bnrs {
      border-radius: 16rem 16rem 0 0;
      padding: 32rem 0 48rem; }
      .bottom-bnrs .inner {
        max-width: 1006rem; } }
  .bottom-bnrs ul {
    margin: 0;
    padding: 0;
    display: grid;
    grid-gap: 16rem;
    list-style: none; }
    @media screen and (min-width: 768px), print {
      .bottom-bnrs ul {
        grid-template-columns: 1fr 1fr; } }
    .bottom-bnrs ul li {
      margin: 0;
      padding: 0; }
      .bottom-bnrs ul li:first-child .icon-external svg {
        fill: #fff; }
    .bottom-bnrs ul a {
      transform: translateZ(0);
      filter: drop-shadow(0rem 2rem 8rem rgba(0, 0, 0, 0.12));
      overflow: hidden;
      display: block;
      border-radius: 8rem;
      position: relative; }
      @media screen and (min-width: 768px), print {
        .bottom-bnrs ul a {
          border-radius: 16rem;
          filter: drop-shadow(0rem 4rem 16rem rgba(0, 0, 0, 0.12)); }
          .bottom-bnrs ul a:hover img {
            transform: scale(1.05); } }
      .bottom-bnrs ul a .icon-external {
        position: absolute;
        right: 8rem;
        bottom: 8rem; }
        @media screen and (min-width: 768px), print {
          .bottom-bnrs ul a .icon-external {
            right: 13rem;
            bottom: 13rem; } }
      .bottom-bnrs ul a .icon-pdf2 {
        position: absolute;
        right: 8rem;
        bottom: 4rem;
        color: #fff;
        font-size: 8rem;
        font-style: normal;
        letter-spacing: 0;
        display: block;
        text-align: center; }
        @media screen and (min-width: 768px), print {
          .bottom-bnrs ul a .icon-pdf2 {
            right: 13rem;
            bottom: 9rem;
            font-size: 11rem; } }
        .bottom-bnrs ul a .icon-pdf2 svg {
          fill: #fff; }
        .bottom-bnrs ul a .icon-pdf2 span {
          display: block;
          line-height: 1em;
          margin: 3rem 0; }

/*------------------------------------------*/
.btns {
  text-align: center;
  margin: 24rem 0 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  grid-gap: 8rem; }
  @media screen and (min-width: 768px), print {
    .btns {
      grid-gap: 16rem; }
      .btns.pcTal {
        justify-content: flex-start; } }

.btn,
.btn-pdf,
.btn-pdf2 {
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid #0082E6;
  box-shadow: 0px 1rem 4rem rgba(0, 0, 0, 0.16);
  border-radius: 100rem;
  min-width: 150rem;
  display: inline-grid;
  margin: 0;
  align-items: center;
  grid-template-columns: 1fr 12rem;
  height: 48rem;
  text-align: left;
  padding: 0 16rem 0 20rem;
  font-weight: 900;
  color: #0082E6;
  grid-gap: 16rem;
  text-decoration: none !important;
  line-height: 1.4;
  position: relative; }
  @media screen and (min-width: 768px), print {
    .btn,
    .btn-pdf,
    .btn-pdf2 {
      margin: 0;
      min-width: 294rem;
      height: 64rem;
      padding: 0 24rem;
      grid-template-columns: 1fr 23rem;
      backdrop-filter: blur(15rem);
      --webkit-backdrop-filter: blur(15rem); }
      .btn:hover,
      .btn-pdf:hover,
      .btn-pdf2:hover {
        text-decoration: none;
        background: #0082E6;
        color: #fff; } }
  @media screen and (min-width: 768px), print {
    .btn._small,
    .btn-pdf._small,
    .btn-pdf2._small {
      height: 54rem; } }
  .btn .icon-arrow svg,
  .btn-pdf .icon-arrow svg,
  .btn-pdf2 .icon-arrow svg {
    stroke: #0082E6; }
    @media screen and (max-width: 767.98px) {
      .btn .icon-arrow svg,
      .btn-pdf .icon-arrow svg,
      .btn-pdf2 .icon-arrow svg {
        stroke-width: 2; } }
  .btn .icon-external svg,
  .btn .icon-external2 svg,
  .btn .icon-pdf svg,
  .btn-pdf .icon-external svg,
  .btn-pdf .icon-external2 svg,
  .btn-pdf .icon-pdf svg,
  .btn-pdf2 .icon-external svg,
  .btn-pdf2 .icon-external2 svg,
  .btn-pdf2 .icon-pdf svg {
    fill: #0082E6; }
  .btn._blue,
  .btn-pdf._blue,
  .btn-pdf2._blue {
    background: #0082E6;
    color: #fff !important; }
    .btn._blue .icon-arrow svg,
    .btn-pdf._blue .icon-arrow svg,
    .btn-pdf2._blue .icon-arrow svg {
      stroke: #fff !important; }
    .btn._blue .icon-external svg,
    .btn._blue .icon-external2 svg,
    .btn._blue .icon-pdf svg,
    .btn-pdf._blue .icon-external svg,
    .btn-pdf._blue .icon-external2 svg,
    .btn-pdf._blue .icon-pdf svg,
    .btn-pdf2._blue .icon-external svg,
    .btn-pdf2._blue .icon-external2 svg,
    .btn-pdf2._blue .icon-pdf svg {
      fill: #fff !important; }
  .btn._wide,
  .btn-pdf._wide,
  .btn-pdf2._wide {
    min-width: 200rem; }
    @media screen and (min-width: 768px), print {
      .btn._wide,
      .btn-pdf._wide,
      .btn-pdf2._wide {
        min-width: 420rem; } }
  .btn._back,
  .btn-pdf._back,
  .btn-pdf2._back {
    grid-template-columns: 12rem 1fr;
    min-width: 130rem !important;
    margin: 0; }
    @media screen and (min-width: 768px), print {
      .btn._back,
      .btn-pdf._back,
      .btn-pdf2._back {
        grid-template-columns: 23rem 1fr;
        min-width: 160rem !important; } }
    .btn._back .icon-arrow,
    .btn-pdf._back .icon-arrow,
    .btn-pdf2._back .icon-arrow {
      order: -1;
      transform: scaleX(-1); }
  .btn[href^="#"],
  .btn-pdf[href^="#"],
  .btn-pdf2[href^="#"] {
    min-width: 0px; }
    @media screen and (min-width: 768px), print {
      .btn[href^="#"],
      .btn-pdf[href^="#"],
      .btn-pdf2[href^="#"] {
        min-width: 160rem; } }
    .btn[href^="#"] .icon-arrow,
    .btn-pdf[href^="#"] .icon-arrow,
    .btn-pdf2[href^="#"] .icon-arrow {
      transform: rotate(90deg); }
  .btn:disabled,
  .btn-pdf:disabled,
  .btn-pdf2:disabled {
    opacity: .4; }

@media screen and (min-width: 768px), print {
  .btn:hover .icon-arrow svg,
  .btn-pdf:hover .icon-arrow svg,
  .btn-pdf2:hover .icon-arrow svg {
    stroke: #fff; }
  .btn:hover .icon-external svg,
  .btn:hover .icon-pdf svg,
  .btn:hover .icon-pdf2 svg,
  .btn-pdf:hover .icon-external svg,
  .btn-pdf:hover .icon-pdf svg,
  .btn-pdf:hover .icon-pdf2 svg,
  .btn-pdf2:hover .icon-external svg,
  .btn-pdf2:hover .icon-pdf svg,
  .btn-pdf2:hover .icon-pdf2 svg {
    fill: #fff; }
  .btn:hover._blue,
  .btn-pdf:hover._blue,
  .btn-pdf2:hover._blue {
    opacity: .7; } }

.btn-pdf {
  grid-template-columns: 1fr 30rem;
  grid-gap: 8rem; }
  @media screen and (min-width: 768px), print {
    .btn-pdf {
      grid-template-columns: 1fr 42rem;
      min-width: 164rem; } }

.btn-pdf2 {
  grid-template-columns: 1fr 30rem;
  grid-gap: 8rem; }
  @media screen and (min-width: 768px), print {
    .btn-pdf2 {
      grid-template-columns: 1fr 30rem;
      min-width: 164rem; } }

.gotop {
  text-align: right;
  position: sticky;
  bottom: 16rem;
  z-index: 800;
  opacity: 0;
  transition: opacity .5s;
  pointer-events: none; }
  @media screen and (min-width: 768px), print {
    .gotop {
      bottom: 32rem; } }
  .scrolled .gotop {
    opacity: 1; }
  .gotop a {
    pointer-events: all;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    transform: rotate(-90deg);
    border: 1px solid #0082E6;
    border-radius: 100rem;
    width: 50rem;
    height: 50rem;
    background: #fff; }
    @media screen and (min-width: 768px), print {
      .gotop a:hover {
        background: #0082E6; }
        .gotop a:hover svg {
          stroke: #fff; } }
    .gotop a i {
      width: 20rem;
      aspect-ratio: 1; }

/*------------------------------------------*/
/*------------------------------------------*/
#local-contents {
  background: #fff;
  border-radius: 20rem;
  box-shadow: 0 0 12rem rgba(0, 0, 0, 0.08);
  padding: 32rem 0;
  margin: 0 0 44rem; }
  @media screen and (min-width: 768px), print {
    #local-contents {
      border-radius: 24rem;
      box-shadow: 0 0 24rem rgba(0, 0, 0, 0.08);
      padding: 72rem 0;
      margin: 0 0 88rem; } }
  #local-contents > :first-child {
    margin-top: 0; }
  #local-contents > :last-child {
    margin-bottom: 0; }

/*------------------------------------------*/
#pagetitle {
  padding: 0;
  background: url("../images/pagetitle/gray.webp") no-repeat -25rem 0rem/710rem;
  box-sizing: border-box;
  position: relative;
  padding: 82rem 0 8rem; }
  @media screen and (min-width: 768px), print {
    #pagetitle {
      background-position: center top;
      background-size: 1280rem;
      padding: 0; }
      #pagetitle.level-1 {
        height: 356rem; }
      #pagetitle.level-2 {
        height: 300rem; } }
  #pagetitle .inner {
    position: relative;
    height: 100%;
    padding: 0; }
  #pagetitle h1 {
    margin: 0 20rem 12rem;
    padding: 0;
    display: table; }
    @media screen and (min-width: 768px), print {
      #pagetitle h1 {
        position: absolute;
        bottom: 90rem;
        left: 0;
        margin: 0; } }
    #pagetitle h1.r1 .ja::before {
      right: 0;
      bottom: 0;
      transform: translate(50%, 20%) rotate(190deg); }
    #pagetitle h1.r2 .ja::before {
      right: 0;
      bottom: 0;
      transform: translate(50%, 40%) rotate(0deg); }
    #pagetitle h1.c1 .ja::before {
      left: 50%;
      bottom: 0;
      transform: translate(-50%, 40%) rotate(10deg); }
    #pagetitle h1.l1 .ja::before {
      left: 0;
      bottom: 0;
      transform: translate(-30%, -10%) rotate(-20deg); }
    #pagetitle h1 .en {
      color: #7B292F;
      font-size: 12rem;
      position: relative;
      z-index: 2;
      margin: 0 0 5rem; }
      @media screen and (min-width: 768px), print {
        #pagetitle h1 .en {
          font-size: 16rem; } }
    #pagetitle h1 .ja {
      line-height: 1.3;
      font-size: 24rem;
      position: relative;
      display: table; }
      @media screen and (min-width: 768px), print {
        #pagetitle h1 .ja {
          line-height: 1.1;
          font-size: 36rem; } }
      #pagetitle h1 .ja::before {
        content: "";
        display: block;
        position: absolute;
        background: url("../images/pagetitle_triangle.svg") no-repeat center center/contain;
        width: 78rem;
        aspect-ratio: 156/78; }
        @media screen and (min-width: 768px), print {
          #pagetitle h1 .ja::before {
            width: 113rem; } }
      #pagetitle h1 .ja span {
        position: relative; }
  #pagetitle .bread {
    overflow: auto;
    font-size: 11rem;
    padding: 0 20rem 8rem; }
    @media screen and (min-width: 768px), print {
      #pagetitle .bread {
        position: absolute;
        bottom: 12rem;
        left: 0;
        right: 0;
        font-size: 14rem;
        padding: 0 0 8rem; } }
    #pagetitle .bread ul {
      margin: 0;
      padding: 0;
      display: flex;
      white-space: nowrap;
      align-items: center; }
      #pagetitle .bread ul li {
        margin: 0;
        padding: 0;
        list-style: none;
        display: flex;
        align-items: center; }
        #pagetitle .bread ul li::after {
          content: ">";
          display: inline-block;
          margin: 0 0.5em;
          color: #0082E6; }
        #pagetitle .bread ul li:first-child a {
          display: inline-grid;
          grid-template-columns: 14rem 1fr;
          align-items: center;
          grid-gap: 5rem; }
          @media screen and (min-width: 768px), print {
            #pagetitle .bread ul li:first-child a {
              grid-template-columns: 27rem 1fr; } }
        #pagetitle .bread ul li:last-child {
          padding-right: 20rem; }
          #pagetitle .bread ul li:last-child::after {
            display: none; }
          #pagetitle .bread ul li:last-child a {
            color: #181A1E;
            pointer-events: none; }
    #pagetitle .bread a {
      color: #0082E6; }
      #pagetitle .bread a i {
        line-height: 1px; }
        #pagetitle .bread a i img,
        #pagetitle .bread a i lottie-player {
          width: 14rem;
          height: 14rem;
          object-fit: contain; }
          @media screen and (min-width: 768px), print {
            #pagetitle .bread a i img,
            #pagetitle .bread a i lottie-player {
              width: 27rem;
              height: 27rem; } }

.history-title,
.sustainability-title {
  position: relative;
  height: auto;
  background: none; }
  .history-title .bg1,
  .sustainability-title .bg1 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-size: cover;
    background-position: center top;
    z-index: 1; }
    @media screen and (min-width: 768px), print {
      .history-title .bg1,
      .sustainability-title .bg1 {
        height: 100%; } }
  .history-title .bg2,
  .sustainability-title .bg2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-size: cover;
    background-position: center top;
    z-index: 3;
    -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1372.6 325.9"><path fill="white" d="M1.9,120.2l436,205.2L1372.4.5,1.9,120.2Z"/></svg>');
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 610rem 145rem;
    -webkit-mask-position: 30rem -17rem;
    mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1372.6 325.9"><path fill="white" d="M1.9,120.2l436,205.2L1372.4.5,1.9,120.2Z"/></svg>');
    mask-repeat: no-repeat;
    mask-size: 610rem 145rem;
    mask-position: 30rem -17rem; }
    @media screen and (min-width: 768px), print {
      .history-title .bg2,
      .sustainability-title .bg2 {
        -webkit-mask-size: 1370rem 325rem;
        -webkit-mask-position: calc(50% + 56rem) -60rem;
        mask-size: 1370rem 325rem;
        mask-position: calc(50% + 56rem) -60rem; } }
  .history-title #pagetitle,
  .sustainability-title #pagetitle {
    background: none;
    position: relative;
    z-index: 5; }

.sustainability-title::after {
  content: "";
  width: 100%;
  background: linear-gradient(rgba(249, 249, 251, 0), #f9f9fb);
  display: block;
  z-index: 2;
  position: absolute;
  left: 0; }
  @media screen and (max-width: 767.98px) {
    .sustainability-title::after {
      top: 100rem;
      height: 300rem; } }
  @media screen and (min-width: 768px), print {
    .sustainability-title::after {
      bottom: 0;
      height: 70%; } }
@media screen and (max-width: 767.98px) {
  .sustainability-title #pagetitle {
    padding-top: 150rem; } }
@media screen and (min-width: 768px), print {
  .sustainability-title #pagetitle {
    height: 460rem; } }
.sustainability-title .bg1 {
  background-image: url("../images/pagetitle/Eb.webp"); }
  @media screen and (max-width: 767.98px) {
    .sustainability-title .bg1 {
      height: 400rem;
      background-position: 10% top; } }
  @media screen and (min-width: 768px), print {
    .sustainability-title .bg1 {
      height: 100%; } }
.sustainability-title .bg2 {
  background-image: url("../images/pagetitle/Ea.webp"); }
  @media screen and (max-width: 767.98px) {
    .sustainability-title .bg2 {
      height: 400rem;
      -webkit-mask-position: 0rem 23rem;
      mask-position: 0rem 23rem;
      background-position: 10% top; } }
  @media screen and (min-width: 768px), print {
    .sustainability-title .bg2 {
      height: 100%;
      -webkit-mask-position: calc(50% + 56rem) 50rem;
      mask-position: calc(50% + 56rem) 50rem; } }
.sustainability-title .leadblock {
  position: relative;
  z-index: 5; }
  .sustainability-title .leadblock h2 {
    font-size: 16rem;
    margin: 16rem 0; }
    @media screen and (min-width: 768px), print {
      .sustainability-title .leadblock h2 {
        font-size: 24rem;
        margin: -45rem 0 32rem; } }
  .sustainability-title .leadblock p {
    font-size: 13rem; }
    @media screen and (min-width: 768px), print {
      .sustainability-title .leadblock p {
        font-size: 20rem; } }

.history-title {
  padding-bottom: 100rem; }
  @media screen and (min-width: 768px), print {
    .history-title {
      padding-bottom: 280rem; } }
  .history-title + #local-contents {
    margin-top: -100rem;
    background: linear-gradient(rgba(255, 255, 255, 0.5) 0%, white 100rem); }
    @media screen and (min-width: 768px), print {
      .history-title + #local-contents {
        margin-top: -280rem;
        background: linear-gradient(rgba(255, 255, 255, 0.5) 0%, white 280rem); } }
  .history-title .bg1 {
    height: 100%;
    background-image: url("../images/pagetitle/B-6b.webp"); }
  .history-title .bg2 {
    height: 100%;
    background-image: url("../images/pagetitle/B-6a.webp"); }

/*------------------------------------------*/
.gray-frame {
  background: rgba(24, 26, 30, 0.04);
  padding: 20rem; }
  @media screen and (min-width: 768px), print {
    .gray-frame {
      padding: 44rem; } }
  .gray-frame > :first-child {
    margin-top: 0; }
  .gray-frame > :last-child {
    margin-bottom: 0; }

.gray-frame-narrow {
  background: rgba(24, 26, 30, 0.04);
  padding: 10rem 20rem; }
  @media screen and (min-width: 768px), print {
    .gray-frame-narrow {
      padding: 20rem; } }
  .gray-frame-narrow > :first-child {
    margin-top: 0; }
  .gray-frame-narrow > :last-child {
    margin-bottom: 0; }

/*------------------------------------------*/
ul.default {
  margin: 20rem 0;
  padding: 0 0 0 25rem;
  display: grid;
  grid-gap: 5rem; }
  @media screen and (min-width: 768px), print {
    ul.default {
      margin: 40rem 0; } }
  ul.default li {
    margin: 0;
    padding: 0;
    letter-spacing: 0.02em;
    text-align: justify; }

ol.default {
  margin: 20rem 0;
  padding: 0;
  display: grid;
  grid-gap: 5rem;
  list-style: none;
  counter-reset: listcounter; }
  @media screen and (min-width: 768px), print {
    ol.default {
      margin: 40rem 0; } }
  ol.default li {
    margin: 0;
    padding: 0 0 0 1.5em;
    counter-increment: listcounter;
    position: relative;
    padding-left: 1.5em;
    letter-spacing: 0.02em;
    text-align: justify; }
    ol.default li::before {
      content: counter(listcounter) "";
      position: absolute;
      left: 0;
      width: 1.5em;
      text-align: left; }

/*------------------------------------------*/
#sibling-pages {
  margin: 0 0 44rem; }
  @media screen and (min-width: 768px), print {
    #sibling-pages {
      margin: 0 0 88rem; } }
  #sibling-pages h2 {
    font-size: 16rem;
    font-weight: 700;
    margin: 0 0 16rem;
    text-align: center; }
    @media screen and (min-width: 768px), print {
      #sibling-pages h2 {
        font-size: 24rem;
        margin: 0 0 24rem; } }
    #sibling-pages h2::after {
      content: "";
      width: 16rem;
      height: 1px;
      background: #7B292F;
      display: block;
      margin: 8rem auto 0; }
      @media screen and (min-width: 768px), print {
        #sibling-pages h2::after {
          margin-top: 16rem; } }

ul.sibling-links {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 8rem;
  margin: 0;
  padding: 0; }
  @media screen and (min-width: 768px), print {
    ul.sibling-links a:hover img {
      transform: scale(1.05); } }
  @media screen and (max-width: 767.98px) {
    ul.sibling-links.index {
      grid-template-columns: 1fr;
      grid-gap: 16rem; }
      ul.sibling-links.index figure {
        border-radius: 8rem; }
        ul.sibling-links.index figure img {
          border-radius: 0 0 9rem 9rem; }
        ul.sibling-links.index figure figcaption {
          grid-template-columns: 1fr 46rem; } }
  @media screen and (min-width: 768px), print {
    ul.sibling-links.index {
      grid-template-columns: repeat(3, 1fr); }
      ul.sibling-links.index figure figcaption {
        grid-template-columns: 1fr 56rem; } }
  ul.sibling-links.index li.wide {
    margin-bottom: 16rem; }
    @media screen and (min-width: 768px), print {
      ul.sibling-links.index li.wide {
        grid-column: 1/4; } }
    @media screen and (min-width: 768px), print {
      ul.sibling-links.index li.wide figure {
        border-radius: 16rem; } }
    ul.sibling-links.index li.wide figure img {
      border-radius: 0; }
    ul.sibling-links.index li.wide figure::before {
      display: none; }
    ul.sibling-links.index li.wide figure figcaption {
      background: none;
      backdrop-filter: none;
      --webkit-backdrop-filter: mone;
      top: 50%;
      left: 16rem;
      bottom: auto;
      transform: translateY(-50%);
      color: #fff;
      grid-template-columns: 1fr;
      height: auto; }
      @media screen and (min-width: 768px), print {
        ul.sibling-links.index li.wide figure figcaption {
          left: 32rem; } }
      ul.sibling-links.index li.wide figure figcaption .sub {
        font-size: 12rem;
        font-weight: 700; }
        @media screen and (min-width: 768px), print {
          ul.sibling-links.index li.wide figure figcaption .sub {
            font-size: 16rem; } }
      ul.sibling-links.index li.wide figure figcaption .main {
        font-size: 24rem;
        font-weight: 900; }
        @media screen and (min-width: 768px), print {
          ul.sibling-links.index li.wide figure figcaption .main {
            font-size: 36rem; } }
      ul.sibling-links.index li.wide figure figcaption .name {
        font-size: 13rem;
        margin-top: 1em;
        font-weight: 400; }
        @media screen and (min-width: 768px), print {
          ul.sibling-links.index li.wide figure figcaption .name {
            font-size: 16rem; } }
      ul.sibling-links.index li.wide figure figcaption .excerpt {
        font-size: 13rem;
        margin-top: 1em;
        font-weight: 400;
        line-height: 2; }
        @media screen and (min-width: 768px), print {
          ul.sibling-links.index li.wide figure figcaption .excerpt {
            font-size: 16rem; } }
    ul.sibling-links.index li.wide .arrow {
      width: 50rem;
      border: 1rem solid #fff;
      display: flex;
      aspect-ratio: 1;
      justify-content: center;
      align-items: center;
      background: rgba(255, 255, 255, 0.3);
      border-radius: 100rem;
      position: absolute; }
      @media screen and (max-width: 767.98px) {
        ul.sibling-links.index li.wide .arrow {
          bottom: 16rem;
          right: 16rem; } }
      @media screen and (min-width: 768px), print {
        ul.sibling-links.index li.wide .arrow {
          backdrop-filter: blur(15rem);
          --webkit-backdrop-filter: blur(15rem);
          background: rgba(255, 255, 255, 0.1);
          top: 50%;
          right: 70rem;
          transform: translateY(-50%); } }
  @media screen and (min-width: 768px) and (min-width: 768px), print {
    ul.sibling-links.index li.wide .arrow {
      width: 70rem; } }

      ul.sibling-links.index li.wide .arrow .icon-arrow {
        width: 20rem; }
        @media screen and (min-width: 768px), print {
          ul.sibling-links.index li.wide .arrow .icon-arrow {
            width: 27rem; } }
        ul.sibling-links.index li.wide .arrow .icon-arrow svg {
          stroke: #fff; }
  @media screen and (min-width: 768px), print {
    ul.sibling-links {
      grid-gap: 16rem; }
      ul.sibling-links.col3 {
        grid-template-columns: repeat(3, 1fr); }
      ul.sibling-links.col3-center {
        grid-template-columns: repeat(2, 373.33rem);
        justify-content: center; }
      ul.sibling-links.col4 {
        grid-template-columns: repeat(4, 1fr); } }
  ul.sibling-links li {
    list-style: none;
    margin: 0;
    padding: 0; }
  ul.sibling-links figure {
    overflow: hidden;
    box-shadow: 0px 2rem 12rem rgba(0, 0, 0, 0.16);
    border-radius: 4rem;
    position: relative;
    transform: translateZ(0); }
    @media screen and (min-width: 768px), print {
      ul.sibling-links figure {
        border-radius: 8rem; } }
    ul.sibling-links figure img {
      width: 100%;
      border-radius: 0 0 5rem 5rem; }
      @media screen and (min-width: 768px), print {
        ul.sibling-links figure img {
          border-radius: 0 0 12rem 12rem; } }
    @media screen and (min-width: 768px), print {
      ul.sibling-links figure::before {
        content: "";
        position: absolute;
        bottom: -1px;
        left: -1px;
        right: -1px;
        z-index: 1;
        background: #fff;
        display: block;
        mix-blend-mode: plus-lighter;
        opacity: .5;
        height: 47rem; } }
    ul.sibling-links figure figcaption {
      position: absolute;
      bottom: -1px;
      left: -1px;
      right: -1px;
      z-index: 2;
      height: 44rem;
      display: flex;
      align-items: center;
      padding: 0 8rem 1px;
      font-size: 13rem;
      font-weight: 700;
      line-height: 1.2;
      background-color: rgba(255, 255, 255, 0.9);
      display: grid;
      align-items: center;
      grid-template-columns: 1fr 14rem;
      grid-gap: 2rem; }
      @media screen and (min-width: 768px), print {
        ul.sibling-links figure figcaption {
          height: 47rem;
          grid-template-columns: 1fr 18rem;
          padding: 0 16rem;
          grid-gap: 10rem;
          background-color: rgba(255, 255, 255, 0.5);
          backdrop-filter: blur(30rem);
          --webkit-backdrop-filter: blur(30rem); } }

/*------------------------------------------*/
p.lead {
  font-size: 15rem;
  line-height: 1.84 !important; }
  @media screen and (min-width: 768px), print {
    p.lead {
      font-size: 16rem;
      margin: 0 0 64rem;
      text-align: center; } }

/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
dl.common-list > div {
  display: grid;
  grid-template-columns: 96rem 1fr; }
  @media screen and (min-width: 768px), print {
    dl.common-list > div {
      grid-template-columns: 220rem 1fr; } }
dl.common-list dt {
  font-weight: 700;
  margin: 0;
  padding: 19rem 0 19rem 0;
  border-bottom: 1px solid #7B292F; }
  @media screen and (min-width: 768px), print {
    dl.common-list dt {
      padding: 22rem 0; } }
dl.common-list dd {
  margin: 0;
  padding: 20rem 0;
  border-bottom: 1px solid #dddddd; }
  @media screen and (min-width: 768px), print {
    dl.common-list dd {
      padding: 24rem 0; } }

/*------------------------------------------*/
ul.common-list {
  margin: 4rem 0;
  padding: 0;
  list-style: none; }
  ul.common-list li {
    margin: 0;
    padding: 0 0 0 1em;
    text-indent: -1em;
    letter-spacing: 0.02em;
    text-align: justify; }
    ul.common-list li::before {
      content: "・";
      display: inline-block;
      width: 1em;
      text-indent: 0; }

ul.note {
  font-size: 11rem;
  margin: 20rem 0;
  padding: 0;
  list-style: none; }
  @media screen and (min-width: 768px), print {
    ul.note {
      font-size: 14rem; } }
  ul.note li {
    margin: 0;
    padding: 0 0 0 1em;
    text-indent: -1em;
    letter-spacing: 0.02em;
    text-align: justify; }

/*------------------------------------------*/
@media screen and (max-width: 767.98px) {
  .scrollable {
    overflow-x: auto;
    position: relative;
    white-space: nowrap;
    scrollbar-width: none;
    -ms-overflow-style: none;
    margin: 32rem -16rem 0;
    padding: 1px 20rem; }
    .scrollable img {
      width: 200%;
      max-width: 200%; }
    .scrollable .scrollable-content {
      width: 270%;
      max-width: 270%;
      display: block;
      border-radius: 4rem;
      padding: 32rem;
      background: rgba(24, 26, 30, 0.04);
      position: relative; }
      .scrollable .scrollable-content::after {
        content: "";
        display: block;
        width: 16rem;
        position: absolute;
        right: -16rem;
        height: 1px; }
      .scrollable .scrollable-content._wh {
        background: #fff;
        padding: 0; }
      .scrollable .scrollable-content img {
        width: 100%;
        max-width: 100%; } }
@media screen and (min-width: 768px), print {
  .scrollable {
    margin: 64rem 0 16rem; }
    .scrollable._gy {
      padding: 32rem 48rem;
      background: rgba(24, 26, 30, 0.04);
      border-radius: 8rem; }
    .scrollable img {
      width: 100%; } }
.scrollable figcaption {
  font-size: 12rem;
  font-weight: 700;
  margin: 0 0 16rem; }
  @media screen and (min-width: 768px), print {
    .scrollable figcaption {
      font-size: 24rem;
      margin: 0 0 25rem; } }

@media screen and (max-width: 767.98px) {
  .scrollable::-webkit-scrollbar {
    display: none; }

  .scrollable-bar {
    position: relative;
    margin-top: 5px;
    color: #0082E6;
    font-weight: 700;
    margin: 8rem 0 16rem;
    font-size: 12rem; }
    .scrollable-bar .scrollbar {
      position: relative;
      height: 100%;
      width: 100%;
      height: 1px;
      background: #dddddd;
      margin-top: 4rem; }
      .scrollable-bar .scrollbar .bar {
        position: absolute;
        height: 4px;
        width: 30%;
        background: #0082E6;
        cursor: pointer;
        left: 0;
        border-radius: 100rem;
        margin-top: -2rem; } }
/*------------------------------------------*/
nav.anchor:first-child ul {
  margin-top: 0; }
@media screen and (max-width: 767.98px) {
  nav.anchor.spSmall ul {
    display: flex;
    justify-content: center;
    flex-wrap: wrap; }
    nav.anchor.spSmall ul a {
      grid-gap: 4rem; } }
@media screen and (max-width: 767.98px) {
  nav.anchor.spDouble ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr); }
    nav.anchor.spDouble ul a {
      grid-gap: 4rem; }
    nav.anchor.spDouble ul li.spWide {
      grid-column: 1/3; } }
nav.anchor ul {
  margin: 32rem 32rem;
  padding: 0;
  list-style: none;
  display: grid;
  grid-gap: 8rem; }
  @media screen and (min-width: 768px), print {
    nav.anchor ul {
      margin: 64rem 0 80rem;
      display: flex;
      justify-content: center;
      grid-gap: 16rem;
      flex-wrap: wrap; } }
  nav.anchor ul li {
    margin: 0;
    padding: 0; }
nav.anchor a {
  font-size: 13rem; }
  @media screen and (max-width: 767.98px) {
    nav.anchor a {
      width: 100%;
      letter-spacing: 0; } }
  @media screen and (min-width: 768px), print {
    nav.anchor a {
      height: 48rem; } }
nav.anchor._tcfd ul {
  margin: 32rem 48rem; }
  @media screen and (min-width: 768px), print {
    nav.anchor._tcfd ul {
      margin: 16rem 0 32rem; } }

nav.anchor-s ul {
  margin: 32rem 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 8rem; }
  @media screen and (min-width: 768px), print {
    nav.anchor-s ul {
      display: flex;
      flex-wrap: wrap;
      margin: 64rem 0 80rem;
      justify-content: center; } }
  nav.anchor-s ul li {
    margin: 0;
    padding: 0; }
nav.anchor-s a {
  font-size: 13rem; }
  @media screen and (max-width: 767.98px) {
    nav.anchor-s a {
      width: 100%;
      grid-gap: 0; } }
  @media screen and (min-width: 768px), print {
    nav.anchor-s a {
      height: 48rem;
      min-width: 0 !important; } }
nav.anchor-s .icon-arrow {
  width: 11rem; }
  @media screen and (min-width: 768px), print {
    nav.anchor-s .icon-arrow {
      width: 18rem; } }

/*------------------------------------------*/
ol.first-skip {
  counter-reset: ol-counter -1;
  margin: 0;
  padding: 0;
  list-style: none; }
  ol.first-skip li {
    counter-increment: ol-counter;
    margin: 0;
    padding: 0 0 0 1.5em;
    text-indent: -1.5em; }
    ol.first-skip li::before {
      content: counter(ol-counter) "";
      display: inline-block;
      width: 1.5em;
      text-indent: 0; }
    ol.first-skip li:first-child {
      padding: 0;
      text-indent: 0; }
      ol.first-skip li:first-child::before {
        display: none; }

/*------------------------------------------*/
h3.accordion-head {
  background: #7B292F;
  color: #fff;
  text-align: center;
  position: relative;
  cursor: pointer;
  border-radius: 4rem;
  font-size: 14rem;
  font-weight: 900;
  height: 44rem;
  display: flex;
  justify-content: center;
  align-items: center; }
  @media screen and (min-width: 768px), print {
    h3.accordion-head {
      border-radius: 8rem;
      font-size: 18rem;
      height: 64rem; } }
  h3.accordion-head::after {
    content: "┼";
    border-radius: 100rem;
    border: 1px solid #fff;
    width: 28rem;
    aspect-ratio: 1;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    right: 10rem;
    transform: translateY(-50%);
    font-size: 80%; }
    @media screen and (min-width: 768px), print {
      h3.accordion-head::after {
        width: 40rem; } }
  h3.accordion-head.open::after {
    content: "─"; }

.accordion-body {
  display: none; }

/*------------------------------------------*/
ol.common-indent {
  margin: 16rem 0;
  padding: 0; }
  @media screen and (min-width: 768px), print {
    ol.common-indent {
      margin: 24rem 0; } }
  @media screen and (max-width: 767.98px) {
    ol.common-indent.spKakko {
      margin-left: -42rem; } }
  ol.common-indent > li {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: flex-start;
    letter-spacing: 0.02em;
    text-align: justify; }
    ol.common-indent > li > i {
      flex-shrink: 0;
      display: inline-block;
      font-style: normal; }

/*------------------------------------------*/
dl.health-list {
  display: grid;
  grid-gap: 8rem;
  margin: 24rem 0; }
  @media screen and (min-width: 768px), print {
    dl.health-list {
      grid-gap: 16rem;
      margin: 32rem 0; }
      dl.health-list._2col {
        grid-template-columns: repeat(2, 1fr); } }
  dl.health-list > div {
    transform: translateZ(0);
    filter: drop-shadow(0px 1rem 6rem rgba(0, 0, 0, 0.16));
    padding: 16rem;
    background: #fff;
    border-radius: 8rem; }
    @media screen and (min-width: 768px), print {
      dl.health-list > div {
        filter: drop-shadow(0px 2rem 6rem rgba(0, 0, 0, 0.16));
        border-radius: 16rem;
        padding: 32rem; } }
  dl.health-list dt {
    padding: 0;
    margin: 0;
    font-weight: 700;
    display: grid;
    grid-template-columns: 23rem 1fr;
    grid-gap: 10rem;
    align-items: flex-start;
    font-size: 16rem;
    line-height: 1.3; }
    @media screen and (min-width: 768px), print {
      dl.health-list dt {
        font-size: 24rem;
        grid-template-columns: 35rem 1fr;
        grid-gap: 15rem; } }
    dl.health-list dt span {
      color: #7B292F;
      border-right: 2px solid #7B292F;
      line-height: 1;
      transform: translateY(0.15em); }
  dl.health-list dd {
    margin: 0;
    padding: 16rem 0 0 33rem; }
    @media screen and (min-width: 768px), print {
      dl.health-list dd {
        padding: 24rem 0 0 50rem; } }
    dl.health-list dd > *:first-child {
      margin-top: 0; }
    dl.health-list dd > *:last-child {
      margin-bottom: 0; }

/*------------------------------------------*/
.grid-half {
  display: grid;
  grid-gap: 16rem;
  margin: 16rem 0 0; }
  @media screen and (min-width: 768px), print {
    .grid-half {
      grid-template-columns: 1fr 496rem;
      grid-gap: 32rem;
      margin: 24rem 0 0; } }

/*------------------------------------------*/
.photo-double {
  display: grid;
  grid-gap: 16rem; }
  @media screen and (min-width: 768px), print {
    .photo-double {
      display: flex;
      grid-gap: 8rem; } }

/*------------------------------------------*/
.sdgs-icon {
  display: grid;
  grid-gap: 12rem;
  grid-template-columns: repeat(5, 1fr);
  margin: 16rem 0 24rem; }
  @media screen and (min-width: 768px), print {
    .sdgs-icon {
      display: flex;
      flex-wrap: wrap;
      margin: 24rem 0 32rem;
      grid-gap: 12rem; }
      .sdgs-icon:last-child {
        margin-bottom: 0; }
      .sdgs-icon img {
        width: 80rem; } }

/*------------------------------------------*/
.common-table-wrap {
  display: grid;
  grid-template-columns: 1fr 80rem;
  grid-gap: 16rem;
  align-items: center; }
  @media screen and (min-width: 768px), print {
    .common-table-wrap {
      grid-template-columns: 1fr 113rem; } }
  .common-table-wrap .common-table {
    margin: 0; }
  .common-table-wrap .th-1line {
    margin-top: 38rem; }
    @media screen and (min-width: 768px), print {
      .common-table-wrap .th-1line {
        margin-top: 46rem; } }
  .common-table-wrap .th-2line {
    margin-top: 55rem; }
    @media screen and (min-width: 768px), print {
      .common-table-wrap .th-2line {
        margin-top: 66rem; } }
  @media screen and (max-width: 767.98px) {
    .common-table-wrap.noscroll {
      display: flex;
      flex-direction: column;
      align-items: center; }
      .common-table-wrap.noscroll table.common-table {
        width: 100%; }
        .common-table-wrap.noscroll table.common-table thead th {
          white-space: normal;
          padding: 10rem 6rem; }
        .common-table-wrap.noscroll table.common-table tbody th {
          padding: 8rem 10rem; }
        .common-table-wrap.noscroll table.common-table tbody td {
          padding: 8rem 6rem; }
      .common-table-wrap.noscroll .wellbeing-goal {
        min-width: 160rem; } }
    @media screen and (max-width: 767.98px) and (max-width: 767.98px) {
      .common-table-wrap.noscroll .wellbeing-goal {
        margin-top: 0 !important; } }
  @media screen and (max-width: 767.98px) {
        .common-table-wrap.noscroll .wellbeing-goal strong {
          line-height: 1; } }

table.common-table {
  border-collapse: collapse;
  border: 0;
  line-height: 1.6;
  font-size: 11rem;
  margin: 16rem 0; }
  @media screen and (min-width: 768px), print {
    table.common-table {
      margin: 24rem 0;
      font-size: 16rem; } }
  table.common-table small {
    font-size: 9rem; }
    @media screen and (min-width: 768px), print {
      table.common-table small {
        font-size: 12rem; } }
  table.common-table tr th, table.common-table tr td {
    border-right: 1px solid #CCCCCC; }
    table.common-table tr th:last-child, table.common-table tr td:last-child {
      border-right: none; }
  table.common-table thead th {
    padding: 10rem 10rem;
    background: #7B292F;
    color: #fff;
    text-align: center;
    border-right: 1px solid #fff;
    white-space: nowrap;
    font-weight: 400; }
    table.common-table thead th:first-child {
      padding: 10rem 16rem; }
      @media screen and (min-width: 768px), print {
        table.common-table thead th:first-child {
          padding: 10rem 20rem; } }
  table.common-table thead small {
    display: inline-block; }
  table.common-table tbody tr:nth-of-type(2n + 1) th {
    background: #FAF6F7; }
  table.common-table tbody tr:nth-of-type(2n + 1) td {
    background: #fff; }
  table.common-table tbody tr:nth-of-type(2n) th {
    background: #F5EDEF; }
  table.common-table tbody tr:nth-of-type(2n) td {
    background: #FAF6F7; }
  table.common-table tbody th {
    font-weight: 400;
    padding: 8rem 16rem; }
    @media screen and (min-width: 768px), print {
      table.common-table tbody th {
        padding: 8rem 20rem; } }
  table.common-table tbody td {
    padding: 8rem 10rem;
    text-align: center; }
    @media screen and (min-width: 768px), print {
      table.common-table tbody td {
        padding: 18rem 10rem; } }
    table.common-table tbody td small {
      display: block; }

table.common-table2 {
  border-collapse: collapse;
  border: 0;
  line-height: 1.6;
  font-size: 11rem;
  margin: 16rem 0;
  width: 100%; }
  @media screen and (min-width: 768px), print {
    table.common-table2 {
      margin: 24rem 0;
      font-size: 16rem; } }
  table.common-table2 small {
    font-size: 9rem; }
    @media screen and (min-width: 768px), print {
      table.common-table2 small {
        font-size: 14rem; } }
  table.common-table2 tr th, table.common-table2 tr td {
    border-right: 1px solid #CCCCCC; }
    table.common-table2 tr th:last-child, table.common-table2 tr td:last-child {
      border-right: none; }
  table.common-table2 thead th {
    padding: 6rem 10rem;
    background: #7B292F;
    color: #fff;
    text-align: center;
    border-right: 1px solid #fff;
    white-space: nowrap;
    font-weight: 400; }
  table.common-table2 thead small {
    display: inline-block; }
  table.common-table2 tbody tr th, table.common-table2 tbody tr td {
    border-bottom: 1px solid #CCCCCC;
    padding: 6rem 10rem; }
    @media screen and (min-width: 768px), print {
      table.common-table2 tbody tr th, table.common-table2 tbody tr td {
        padding: 6rem 20rem; } }
  table.common-table2 tbody tr th {
    background: #FAF6F7; }
  table.common-table2 tbody tr td {
    background: #fff; }
  table.common-table2 tbody th {
    font-weight: 400; }
  table.common-table2 tbody td small {
    display: block; }

/*------------------------------------------*/
#pager {
  text-align: center;
  margin: 24rem 0 0; }
  @media screen and (min-width: 768px), print {
    #pager {
      margin: 48rem 0 0; } }
  #pager .pages {
    display: inline-flex;
    justify-content: center;
    grid-gap: 16rem;
    font-size: 16rem;
    position: relative; }
  #pager .page.current {
    color: #7B292F;
    font-weight: 700; }
  #pager .prev,
  #pager .next {
    width: 20rem;
    aspect-ratio: 1;
    position: absolute;
    top: 50%;
    display: flex;
    justify-content: center;
    align-items: center; }
    #pager .prev svg,
    #pager .next svg {
      stroke: #181A1E;
      stroke-width: 3; }
  #pager .prev {
    left: -40rem;
    transform: scaleX(-1) translateY(-50%); }
  #pager .next {
    right: -40rem;
    transform: translateY(-50%); }

/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/* CSS Document */
/*------------------------------------------*/
@keyframes mask-animation {
  0% {
    mask-position: 130% 130%;
    -webkit-mask-position: 130% 130%; }
  100% {
    mask-position: 0 0;
    -webkit-mask-position: 0 0; } }
@keyframes bounce-animation {
  0% {
    transform: translateY(20%); }
  60% {
    transform: translateY(0%); }
  75% {
    transform: translateY(3%); }
  85% {
    transform: translateY(0%); }
  95% {
    transform: translateY(1%); }
  100% {
    transform: translateY(0%); } }
.kv-wrap {
  width: 100%;
  position: relative;
  z-index: -1;
  margin: 0 0 32rem;
  overflow: hidden; }
  @media screen and (min-width: 768px), print {
    .kv-wrap {
      margin: 2vw 0 calc(-21vw - 2rem); } }

#kv {
  padding: 100rem 0 30rem;
  margin: 0 0 -40rem; }
  @media screen and (min-width: 768px), print {
    #kv {
      max-height: calc(100vh + 14.5vw);
      min-height: 55vw;
      padding: 0; } }
  #kv .kv-inner {
    position: relative;
    aspect-ratio: 1280 / 870;
    z-index: -1;
    margin: 0 -200rem 0 -80rem; }
    @media screen and (min-width: 768px), print {
      #kv .kv-inner {
        margin: 0; } }
    #kv .kv-inner::before {
      content: "";
      display: block;
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      height: 60%;
      background: linear-gradient(0deg, #f9f9fb 10%, rgba(255, 255, 255, 0) 100%);
      z-index: 90; }
  #kv img {
    width: 100%; }
  #kv .all {
    opacity: .5;
    position: relative;
    display: none; }
  #kv div {
    position: absolute; }
    .loaded #kv div {
      transform: none;
      opacity: 1; }
  #kv .people {
    width: 76.52%;
    top: 3%;
    left: -7.5%;
    z-index: 50;
    opacity: 0;
    transform: scale(4);
    transition: opacity 1.5s, transform 2s cubic-bezier(0.1, 0.97, 0.42, 0.99); }
    #kv .people span {
      display: block;
      mask-image: linear-gradient(90deg, black 50%, rgba(0, 0, 0, 0.4) 55%, rgba(0, 0, 0, 0) 65%, rgba(0, 0, 0, 0) 100%);
      -webkit-mask-image: linear-gradient(90deg, black 50%, rgba(0, 0, 0, 0.4) 55%, rgba(0, 0, 0, 0) 65%, rgba(0, 0, 0, 0) 100%);
      mask-size: 250% 250%;
      -webkit-mask-size: 250% 250%;
      mask-repeat: no-repeat;
      -webkit-mask-repeat: no-repeat;
      mask-position: 130% 130%;
      -webkit-mask-position: 130% 130%;
      animation: mask-animation 1.5s  linear forwards; }
  #kv .city {
    width: 114.25%;
    top: 35.5%;
    left: -16.5%;
    z-index: 40;
    transform: translateX(-10%);
    opacity: 0;
    transition: opacity 1.5s 0.4s, transform 2s 0.4s cubic-bezier(0.1, 0.97, 0.42, 0.99); }
    #kv .city * {
      position: relative; }
  #kv .parts01a {
    width: 16.88%;
    top: 24.0%;
    left: 50.5%;
    z-index: 80;
    opacity: 0;
    transform: translateY(20%);
    transition: opacity 0.6s 2s,transform 0.6s 2s ease-out; }
    @media screen and (min-width: 768px), print {
      #kv .parts01a {
        left: 60.5%; } }
  #kv .parts01b {
    width: 8.16%;
    top: 41.0%;
    left: 60.5%;
    z-index: 80;
    opacity: 0;
    transform: translateY(20%);
    transition: opacity 0.6s 2.2s,transform 0.6s 2.2s ease-out; }
    @media screen and (min-width: 768px), print {
      #kv .parts01b {
        left: 72.5%; } }
  #kv .parts02 {
    width: 26.50%;
    top: 7.5%;
    left: 34.4%;
    z-index: 30;
    opacity: 0;
    transform: translateY(20%);
    transition: opacity 0.6s 1.4s,transform 0.6s 1.4s ease-out; }
    @media screen and (min-width: 768px), print {
      #kv .parts02 {
        width: 32.5%;
        left: 36.4%; } }
  #kv .parts03a,
  #kv .parts03b {
    width: 26.39%;
    bottom: 17%;
    left: 54%;
    z-index: 80;
    animation: bounce-animation 1s 2s  linear forwards;
    opacity: 0;
    transition: opacity .5s 2s; }
    @media screen and (min-width: 768px), print {
      #kv .parts03a,
      #kv .parts03b {
        left: 54%;
        width: 15.39%;
        bottom: 17%; } }
  #kv .parts03b {
    z-index: 120; }
  #kv .effect01 {
    width: 106.95%;
    top: -27%;
    left: -4%;
    z-index: 20;
    opacity: 0;
    transition: opacity 1.5s; }
  #kv .effect02 {
    width: 85.937%;
    top: -26%;
    left: 15%;
    z-index: 20;
    transform: translateX(-10%);
    transition: transform 1.5s; }
    #kv .effect02 span {
      display: block;
      mask-image: linear-gradient(90deg, black 50%, rgba(0, 0, 0, 0.4) 55%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0) 100%);
      -webkit-mask-image: linear-gradient(90deg, black 50%, rgba(0, 0, 0, 0.4) 55%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0) 100%);
      mask-size: 250% 250%;
      -webkit-mask-size: 250% 250%;
      mask-repeat: no-repeat;
      -webkit-mask-repeat: no-repeat;
      mask-position: 130% 130%;
      -webkit-mask-position: 130% 130%;
      animation: mask-animation 3s cubic-bezier(0.1, 0.97, 0.42, 0.99) forwards; }
  #kv .effect03 {
    width: 18.593%;
    top: 23%;
    left: 52%;
    z-index: 20;
    opacity: 0;
    transition: opacity 1s .3s; }
  #kv .effect04 {
    width: 24.453%;
    top: 6%;
    left: 26%;
    z-index: 20;
    opacity: 0;
    transition: opacity 1s .3s; }
  #kv .effect05 {
    width: 43.437%;
    top: 1%;
    left: 27%;
    z-index: 20;
    transform: translate(-20%, -20%);
    opacity: 0;
    transition: opacity 1s 0.3s, transform 1.5s 0.3s cubic-bezier(0.1, 0.97, 0.42, 0.99); }
  #kv .effect06 {
    width: 21.328%;
    top: 56%;
    left: 22%;
    z-index: 10;
    opacity: 0;
    transition: opacity 1s; }
  #kv .effect10 {
    width: 29.687%;
    top: 25%;
    left: 69%;
    z-index: 70;
    opacity: 0;
    transition: opacity 1s 0.7s; }
  #kv .effect12 {
    width: 30.234%;
    top: 10%;
    left: 65%;
    z-index: 70;
    transform: translateX(-40%) rotate(0deg);
    opacity: 0;
    transition: opacity 1s 0.5s, transform 1s 0.5s cubic-bezier(0.1, 0.97, 0.42, 0.99); }
  #kv .effect09 {
    width: 14.218%;
    top: 29%;
    left: 1%;
    z-index: 70;
    transform: translateX(-150%) rotate(-40deg);
    opacity: 0;
    transition: opacity 1s 1.1s, transform 3s 1.1s cubic-bezier(0.1, 0.97, 0.42, 0.99); }
  #kv .effect11 {
    width: 22.656%;
    top: 36%;
    left: 16%;
    z-index: 70;
    transform: translateX(-130%) rotate(20deg);
    opacity: 0;
    transition: opacity 1s 0.9s, transform 3s 0.9s cubic-bezier(0.1, 0.97, 0.42, 0.99); }
  #kv .effect08 {
    width: 20.468%;
    top: 29%;
    left: 40%;
    z-index: 70;
    transform: translateX(-110%) rotate(30deg);
    opacity: 0;
    transition: opacity 1s 0.7s, transform 3s 0.7s cubic-bezier(0.1, 0.97, 0.42, 0.99); }
  #kv .effect07 {
    width: 15.390%;
    top: 26%;
    left: 61%;
    z-index: 70;
    transform: translateX(-110%) rotate(10deg);
    opacity: 0;
    transition: opacity 1s 0.5s, transform 3s 0.5s cubic-bezier(0.1, 0.97, 0.42, 0.99); }
  #kv .effect13 {
    width: 14.531%;
    top: 26%;
    left: 80%;
    z-index: 70;
    transform: translateX(-110%) rotate(0deg);
    opacity: 0;
    transition: opacity 1s 0.3s, transform 3s 0.3s cubic-bezier(0.1, 0.97, 0.42, 0.99); }
  #kv .effect14 {
    width: 15.390%;
    top: 0%;
    left: 5%;
    z-index: 10;
    opacity: 0;
    transition: opacity 1s .3s; }
  #kv h1 {
    margin: 0;
    padding: 0;
    position: absolute;
    top: -5%;
    right: 217rem;
    width: 24.6%;
    z-index: 100;
    transform: scale(1.5);
    transition: opacity 1s .3s,transform 1.1s .3s ease-out;
    transform-origin: right center;
    opacity: 0; }
    @media screen and (min-width: 768px), print {
      #kv h1 {
        top: 15%;
        right: 7%; } }
    .loaded #kv h1 {
      transform: none;
      opacity: 1; }
  #kv .copy {
    bottom: 1%;
    left: 16rem;
    right: 16rem;
    z-index: 100;
    transform: translateX(-20%);
    opacity: 0;
    transition: transform 1.5s 1s,opcity 0s 1s; }
    @media screen and (min-width: 768px), print {
      #kv .copy {
        left: 0;
        right: 0;
        bottom: calc(19vw - 76rem); } }
    #kv .copy span {
      display: block;
      mask-image: linear-gradient(90deg, black 50%, rgba(0, 0, 0, 0.4) 55%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0) 100%);
      -webkit-mask-image: linear-gradient(90deg, black 50%, rgba(0, 0, 0, 0.4) 55%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0) 100%);
      mask-size: 250% 250%;
      -webkit-mask-size: 250% 250%;
      mask-repeat: no-repeat;
      -webkit-mask-repeat: no-repeat;
      mask-position: 130% 130%;
      -webkit-mask-position: 130% 130%;
      animation: mask-animation 3s 1s cubic-bezier(0.1, 0.97, 0.42, 0.99) forwards; }

/*------------------------------------------*/
@media screen and (max-width: 767.98px) {
  #top-news {
    margin-top: 0; } }
@media screen and (min-width: 768px), print {
  #top-news .inner {
    display: grid;
    grid-template-columns: 146rem 1fr; } }
#top-news h2 {
  margin: 0 0 16rem 20rem;
  padding: 0; }
  @media screen and (min-width: 768px), print {
    #top-news h2 {
      margin: 40rem 0 0; } }
  #top-news h2 .en {
    font-size: 28rem;
    line-height: 1; }
    @media screen and (min-width: 768px), print {
      #top-news h2 .en {
        font-size: 40rem;
        margin-bottom: 5rem; } }
  #top-news h2 .ja {
    font-size: 12rem;
    font-weight: 400; }
    @media screen and (min-width: 768px), print {
      #top-news h2 .ja {
        font-size: 18rem; } }
#top-news .frame {
  border-radius: 16px;
  background: #fff;
  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);
  padding: 32rem 20rem; }
  @media screen and (min-width: 768px), print {
    #top-news .frame {
      padding: 60rem 70rem 24rem;
      border-radius: 16rem; } }
#top-news .all {
  margin: 16rem 0 0;
  text-align: right; }
  #top-news .all a {
    color: #0082E6;
    display: inline-grid;
    grid-template-columns: 1fr 18rem;
    align-items: center;
    grid-gap: 16rem;
    font-weight: 700; }
    #top-news .all a i {
      transform: translateY(10%); }

dl.news-list {
  margin: 0;
  padding: 0; }
  dl.news-list > div {
    display: grid;
    grid-gap: 8rem;
    border-top: 1px solid #dddddd;
    padding: 12rem 0; }
    @media screen and (min-width: 768px), print {
      dl.news-list > div {
        display: grid;
        grid-template-columns: 143rem 1fr;
        align-items: center; } }
    dl.news-list > div:last-child {
      border-bottom: 1px solid #dddddd; }
  dl.news-list dt {
    margin: 0 0 3rem;
    padding: 0; }
    dl.news-list dt time {
      font-family: "Inter", sans-serif;
      font-weight: 700;
      display: block;
      margin: 0 0 3rem; }
    dl.news-list dt .category {
      font-size: 11rem;
      display: grid;
      grid-template-columns: 9rem 1fr;
      grid-gap: 6rem;
      align-items: center;
      line-height: 1; }
      @media screen and (min-width: 768px), print {
        dl.news-list dt .category {
          font-size: 12rem; } }
      dl.news-list dt .category::before {
        content: "";
        display: inline-block;
        aspect-ratio: 1;
        width: 9rem;
        background: var(--catcolor);
        border-radius: 100rem; }
  dl.news-list dd {
    margin: 0;
    padding: 0;
    font-weight: 900;
    font-size: 12rem;
    line-height: 1.7; }
    @media screen and (min-width: 768px), print {
      dl.news-list dd {
        font-size: 14rem; } }

/*------------------------------------------*/
#top-about h2.common .en {
  color: #fff; }
@media screen and (min-width: 768px), print {
  #top-about h2.common .ja {
    font-size: 32rem; } }
#top-about .a {
  border-radius: 8rem;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 8rem 0 0;
  height: 340rem;
  box-sizing: border-box;
  grid-gap: 32rem;
  position: relative;
  overflow: hidden;
  cursor: default;
    /*
    .arrow {
      width: 50rem;
      border: 1rem solid #fff;
      display: flex;
      margin: 0 auto;
      aspect-ratio: 1;
      justify-content: center;
      align-items: center;
      background: rgba(#fff,.1);
      border-radius: 100rem;
      backdrop-filter: blur(15rem);
      --webkit-backdrop-filter: blur(15rem); 
      position: relative;
      @include mq(pc) { 
        position: absolute;
        top: 50%;
        right: 70rem;
        transform: translateY(-50%);
        @include mq(pc) {
          width: 70rem;
        }
      }
      .icon-arrow {
        width: 20rem;
        @include mq(pc) { 
          width: 27rem;
        }

        svg {
          stroke:#fff;
        }
      }
    }
    */ }
  @media screen and (min-width: 768px), print {
    #top-about .a {
      align-items: flex-start;
      padding: 0 70rem;
      height: 440rem;
      position: relative;
      border-radius: 16rem;
      text-decoration: none !important; }
      #top-about .a:hover .bg {
        transform: scale(1.03) translateZ(0); } }
  #top-about .a .bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transform: translateZ(0);
    transition: .5s; }
    #top-about .a .bg img,
    #top-about .a .bg video {
      width: 100%;
      height: 100%;
      object-fit: cover;
      will-change: transform; }
    #top-about .a .bg::after {
      content: "";
      display: block;
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      background: rgba(24, 26, 30, 0.4); }
  #top-about .a .text {
    position: relative; }
  #top-about .a .btn {
    border-color: #fff;
    color: #fff; }
    @media screen and (min-width: 768px), print {
      #top-about .a .btn {
        position: absolute;
        top: 50%;
        right: 70rem;
        transform: translateY(-50%); } }
    #top-about .a .btn .icon-arrow svg {
      stroke: #fff; }

/*------------------------------------------*/
@media screen and (min-width: 768px), print {
  #top-company {
    margin-top: -30rem; }
    #top-company .grid {
      display: grid;
      grid-template-columns: 576rem 1fr;
      grid-gap: 70rem;
      position: relative;
      align-items: center; } }
#top-company h2::before {
  content: "";
  position: absolute;
  background: url("../images/top/hw_effect1.svg") no-repeat center center/contain;
  aspect-ratio: 113/56;
  width: 78rem;
  top: 0;
  left: 0;
  transform: translate(100%, 50%); }
  @media screen and (min-width: 768px), print {
    #top-company h2::before {
      width: 113rem; } }
#top-company .text {
  margin: 0 20rem 20rem; }
  @media screen and (min-width: 768px), print {
    #top-company .text {
      margin: 0;
      order: 2;
      padding-bottom: 40rem; } }
@media screen and (min-width: 768px), print {
  #top-company figure {
    order: 1; } }
#top-company figure img {
  border-radius: 8rem; }
  @media screen and (min-width: 768px), print {
    #top-company figure img {
      border-radius: 16rem; } }
@media screen and (min-width: 768px), print {
  #top-company .btns {
    position: absolute;
    bottom: 0;
    right: 0; } }

/*------------------------------------------*/
@media screen and (max-width: 767.98px) {
  #top-business h2 {
    margin-left: 20rem; } }
#top-business h2::before {
  content: "";
  position: absolute;
  background: url("../images/top/hw_effect2.svg") no-repeat center center/contain;
  aspect-ratio: 151/105;
  width: 78rem;
  top: 0;
  left: 0;
  transform: translate(-90%, -50%); }
  @media screen and (min-width: 768px), print {
    #top-business h2::before {
      width: 151rem; } }
@media screen and (min-width: 768px), print {
  #top-business .btns {
    text-align: right;
    margin-top: 38rem; } }

/*------------------------------------------*/
#top-works {
  border-radius: 16rem 16rem 0 0;
  padding: 24rem 0 64rem;
  background: url(../images/top/works_bg.webp) no-repeat center center/cover;
  margin-bottom: 0; }
  @media screen and (min-width: 768px), print {
    #top-works {
      border-radius: 24rem 24rem 0 0;
      padding: 48rem 0 96rem; } }
  @media screen and (max-width: 767.98px) {
    #top-works h2 {
      margin-left: 20rem; } }
  #top-works h2::before {
    content: "";
    position: absolute;
    background: url("../images/top/hw_effect3.svg") no-repeat center center/contain;
    aspect-ratio: 286/167;
    width: 145rem;
    top: 0;
    left: 0;
    transform: translate(-40%, -65%); }
    @media screen and (min-width: 768px), print {
      #top-works h2::before {
        width: 286rem; } }
  #top-works figure img {
    border-radius: 6rem;
    box-shadow: 0px 4rem 8rem rgba(0, 0, 0, 0.16);
    aspect-ratio: 648/840;
    object-fit: cover; }
    @media screen and (min-width: 768px), print {
      #top-works figure img {
        border-radius: 12rem;
        box-shadow: 0px 8rem 16rem rgba(0, 0, 0, 0.16); } }
  #top-works figure figcaption {
    font-weight: bold;
    margin: 8rem 0 0;
    line-height: 1.7; }
    @media screen and (min-width: 768px), print {
      #top-works figure figcaption {
        margin: 16rem 0 0; } }
    #top-works figure figcaption em {
      font-size: 12rem;
      font-weight: 400;
      display: block;
      color: #0082E6;
      margin-top: 4rem; }
      @media screen and (min-width: 768px), print {
        #top-works figure figcaption em {
          font-size: 14rem; } }
  @media screen and (min-width: 768px), print {
    #top-works .slick-list {
      overflow: visible; }
    #top-works .slide {
      width: 325rem;
      padding: 0 16rem 0 0;
      box-sizing: content-box; }
    #top-works .slick-arrow {
      position: absolute;
      top: 190rem;
      z-index: 10;
      background: none;
      border: none;
      padding: 0;
      width: 48rem;
      height: 48rem;
      cursor: pointer;
      outline: 0;
      background: #0082E6;
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 100rem;
      transition: opacity .7s; }
      #top-works .slick-arrow.slick-prev {
        transform: scaleX(-1);
        left: -30rem; }
      #top-works .slick-arrow.slick-next {
        right: -30rem; }
      #top-works .slick-arrow .icon-arrow {
        width: 18rem; }
      #top-works .slick-arrow svg {
        stroke: #fff; }
      #top-works .slick-arrow:hover {
        opacity: .7; } }
  @media screen and (max-width: 767.98px) {
    #top-works .slider {
      margin: 0;
      padding: 0;
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      grid-gap: 16rem 8rem; }
      #top-works .slider .slide {
        margin: 0;
        padding: 0;
        list-style: none; }
        #top-works .slider .slide:nth-of-type(n + 5) {
          display: none; } }
  @media screen and (min-width: 768px), print {
    #top-works .btns {
      text-align: right;
      margin-top: 38rem; } }

/*------------------------------------------*/
#top-sustainability {
  border-radius: 16rem 16rem 0 0;
  padding: 24rem 0 48rem;
  margin-top: -24rem;
  background: url(../images/top/sustainability_bg.webp) no-repeat center center/cover; }
  @media screen and (min-width: 768px), print {
    #top-sustainability {
      padding: 48rem 0 48rem;
      margin-top: -48rem;
      border-radius: 24rem 24rem 0 0; } }
  @media screen and (max-width: 767.98px) {
    #top-sustainability h2 {
      margin-left: 20rem; } }
  #top-sustainability h2::before {
    content: "";
    position: absolute;
    background: url("../images/top/hw_effect5.svg") no-repeat center center/contain;
    aspect-ratio: 214/82;
    width: 115rem;
    top: 0;
    left: 0;
    transform: translate(-30%, -50%);
    mix-blend-mode: screen; }
    @media screen and (min-width: 768px), print {
      #top-sustainability h2::before {
        width: 214rem; } }
  #top-sustainability h2 .en,
  #top-sustainability h2 .ja {
    color: #fff; }
  @media screen and (min-width: 768px), print {
    #top-sustainability .btns {
      text-align: right;
      margin-top: 38rem; } }
  #top-sustainability .btn {
    border-color: #fff;
    color: #fff; }
    #top-sustainability .btn .icon-arrow svg {
      stroke: #fff; }

/*------------------------------------------*/
#top-recruit h2::before {
  content: "";
  position: absolute;
  background: url("../images/top/hw_effect4.svg") no-repeat center center/contain;
  aspect-ratio: 155/77;
  width: 78rem;
  top: 17rem;
  left: 76rem; }
@media screen and (min-width: 768px), print {
  #top-recruit .grid {
    display: grid;
    grid-template-columns: 576rem 1fr;
    grid-gap: 70rem;
    position: relative; } }
#top-recruit .text {
  margin: 0 20rem 20rem; }
  @media screen and (min-width: 768px), print {
    #top-recruit .text {
      margin: 0;
      order: 2; } }
@media screen and (min-width: 768px), print {
  #top-recruit figure {
    order: 1; } }
#top-recruit figure img {
  border-radius: 8rem; }
  @media screen and (min-width: 768px), print {
    #top-recruit figure img {
      border-radius: 16rem; } }
@media screen and (min-width: 768px), print {
  #top-recruit .btns {
    position: absolute;
    bottom: 0;
    right: 0; } }

/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/*------------------------------------------*/
/* CSS Document */
/*------------------------------------------*/
form {
  margin: 0;
  padding: 0; }
  form .required {
    border: 1px solid #7B292F;
    color: #7B292F;
    display: inline-block;
    padding: 0 7rem;
    font-size: 12rem;
    margin-left: 10rem;
    line-height: 1.4;
    font-weight: 400; }
    @media screen and (min-width: 768px), print {
      form .required {
        font-size: 14rem; } }
  form select,
  form input[type="text"],
  form input[type="tel"],
  form input[type="email"],
  form textarea {
    background: transparent;
    border: 1px solid #7a7e86;
    box-shadow: 0px 1rem 4rem rgba(0, 0, 0, 0.1), 0px 1rem 4rem rgba(0, 0, 0, 0.1) inset;
    height: 40rem;
    border-radius: 7rem;
    -webkit-appearance: none;
    appearance: none;
    padding: 0 10rem;
    box-sizing: border-box;
    width: 100%; }
    @media screen and (min-width: 768px), print {
      form select,
      form input[type="text"],
      form input[type="tel"],
      form input[type="email"],
      form textarea {
        height: 48rem; } }
  form textarea {
    height: 120rem;
    padding: 10rem; }
    @media screen and (min-width: 768px), print {
      form textarea {
        height: 240rem; } }
  form input[type="radio"],
  form input[type="checkbox"] {
    width: 28rem;
    height: 28rem;
    margin: 0 8rem 0 0;
    line-height: 1;
    vertical-align: middle; }
    @media screen and (min-width: 768px), print {
      form input[type="radio"],
      form input[type="checkbox"] {
        width: 24rem;
        height: 24rem; } }
  form .note {
    font-size: 12rem;
    text-indent: -1em;
    padding-left: 1em; }
    @media screen and (min-width: 768px), print {
      form .note {
        font-size: 13rem; } }
    form .note.red {
      color: #ea0000; }
  form .error {
    color: #ea0000; }
  form div:has(> .error) select,
  form div:has(> .error) input[type="text"],
  form div:has(> .error) input[type="tel"],
  form div:has(> .error) input[type="email"],
  form div:has(> .error) textarea {
    background: #ffeeee; }
  form fieldset,
  form .fieldset {
    border: none;
    padding: 0;
    margin: 0; }
    form fieldset > legend, form fieldset > label,
    form .fieldset > legend,
    form .fieldset > label {
      display: block;
      font-weight: bold;
      font-size: 13rem;
      padding: 0;
      margin: 0 0 8rem; }
      @media screen and (min-width: 768px), print {
        form fieldset > legend, form fieldset > label,
        form .fieldset > legend,
        form .fieldset > label {
          font-size: 16rem; } }
      form fieldset > legend .note, form fieldset > label .note,
      form .fieldset > legend .note,
      form .fieldset > label .note {
        display: block;
        font-weight: 400;
        margin-top: 8rem; }
  form .select-wrapper {
    position: relative; }
    form .select-wrapper i {
      line-height: 1px;
      position: absolute;
      top: 50%;
      right: 10rem;
      transform: translateY(-50%); }
      @media screen and (min-width: 768px), print {
        form .select-wrapper i {
          right: 16rem; } }
      form .select-wrapper i svg {
        stroke: #0082E6;
        width: 12rem;
        height: 6rem; }
        @media screen and (min-width: 768px), print {
          form .select-wrapper i svg {
            width: 14rem;
            height: 7rem; } }
  form .name-wrapper {
    display: grid;
    grid-gap: 16rem;
    grid-template-columns: 1fr 1fr; }
    form .name-wrapper label {
      display: block; }
  form .radio-wrapper {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 8rem 24rem; }
  form .upload-wrapper {
    display: grid;
    grid-gap: 16rem; }
    form .upload-wrapper p {
      margin: 0; }
    form .upload-wrapper .upload-item {
      display: grid;
      grid-template-columns: 120rem 1fr;
      align-items: center;
      grid-gap: 8rem; }
      @media screen and (min-width: 768px), print {
        form .upload-wrapper .upload-item {
          grid-template-columns: 165rem 1fr; } }
    form .upload-wrapper .custom-file {
      border: 1px solid #0082E6;
      box-shadow: 0px 1rem 4rem rgba(0, 0, 0, 0.16);
      border-radius: 100rem;
      display: flex;
      margin: 0 auto;
      align-items: center;
      justify-content: center;
      height: 32rem;
      font-size: 12rem;
      box-sizing: border-box;
      color: #0082E6;
      margin: 0; }
      @media screen and (min-width: 768px), print {
        form .upload-wrapper .custom-file {
          height: 31rem;
          font-size: 16rem; } }
    form .upload-wrapper .filename {
      line-height: 1.3; }

#form .steps {
  margin: 20rem 0; }
  @media screen and (min-width: 768px), print {
    #form .steps {
      margin: 0;
      position: absolute;
      top: 4rem;
      left: -73rem;
      width: 203rem; } }
  #form .steps ol {
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: listcounter;
    font-weight: bold;
    font-size: 13rem;
    line-height: 1;
    display: grid;
    grid-gap: 25rem;
    grid-template-columns: repeat(3, 1fr); }
    @media screen and (min-width: 768px), print {
      #form .steps ol {
        grid-template-columns: 1fr;
        grid-gap: 24rem;
        font-size: 16rem; } }
    #form .steps ol li {
      margin: 0;
      padding: 0 0 15rem 2em;
      counter-increment: listcounter;
      position: relative;
      padding-left: 2em;
      border-bottom: 1px solid #ccc; }
      #form .steps ol li::before {
        content: "0" counter(listcounter);
        position: absolute;
        left: 0;
        width: 2em;
        text-align: left; }
      #form .steps ol li.current {
        color: #7B292F;
        border-bottom-color: #7B292F; }
#form .form-wrapper {
  position: relative; }
#form .inputs {
  display: grid;
  grid-gap: 16rem;
  margin: 0 0 24rem; }
  @media screen and (min-width: 768px), print {
    #form .inputs {
      width: 640rem;
      margin: 0 0 32rem auto;
      grid-gap: 32rem; } }
#form .privacy-check {
  text-align: center;
  margin: 24rem 0 0; }
  #form .privacy-check label {
    display: inline-flex;
    align-items: center;
    justify-content: center; }
@media screen and (min-width: 768px), print {
  #form .gray-frame {
    padding: 32rem 44rem; } }
#form .btns {
  margin-top: 32rem; }
  @media screen and (min-width: 768px), print {
    #form .btns {
      margin-top: 48rem; } }
@media screen and (max-width: 767.98px) {
  #form .thanks img {
    height: 160rem;
    object-fit: cover; } }

/*------------------------------------------*/
@media screen and (min-width: 768px), print {
  #security .hw-medium {
    margin-top: 32rem; } }

@media screen and (min-width: 768px), print {
  #security2 .hw-effect::before {
    left: 160rem; } }
#security2 .icontext-set {
  margin-top: 24rem;
  display: grid;
  grid-template-columns: 76rem 1fr;
  grid-gap: 16rem;
  align-items: flex-start; }
  @media screen and (min-width: 768px), print {
    #security2 .icontext-set {
      margin-top: 48rem;
      grid-gap: 48rem;
      grid-template-columns: 203rem 1fr; } }
  #security2 .icontext-set figure {
    overflow: hidden;
    box-shadow: 0px 2rem 12rem rgba(0, 0, 0, 0.16);
    border-radius: 8rem;
    position: relative; }
    #security2 .icontext-set figure img {
      width: 100%; }
  #security2 .icontext-set h3 {
    margin-top: 0; }
  #security2 .icontext-set ul.default {
    margin-bottom: 0; }

/*------------------------------------------*/
#profile .inner-narrow {
  position: relative; }
  @media screen and (min-width: 768px), print {
    #profile .inner-narrow {
      transform: translateX(-50rem); } }
#profile figure {
  width: 245rem;
  margin: 24rem auto 0; }
  @media screen and (min-width: 768px), print {
    #profile figure {
      width: 276rem;
      position: absolute;
      margin: 0;
      top: 22rem;
      right: -177rem; } }
#profile dl {
  display: grid; }
  @media screen and (min-width: 768px), print {
    #profile dl {
      margin-top: -22rem; } }
  #profile dl > div {
    display: grid;
    grid-template-columns: 92rem 1fr; }
    @media screen and (min-width: 768px), print {
      #profile dl > div {
        grid-template-columns: 219rem 1fr; }
        #profile dl > div:nth-of-type(-n + 4) {
          padding-right: 142rem; } }
  #profile dl dt {
    border-bottom: 1px solid #7B292F;
    margin: 0;
    padding: 15rem 0;
    font-size: 13rem;
    font-weight: 700; }
    @media screen and (min-width: 768px), print {
      #profile dl dt {
        padding: 22rem 0;
        font-size: 16rem; } }
  #profile dl dd {
    border-bottom: 1px solid #ccc;
    margin: 0;
    padding: 16rem 0; }
    @media screen and (min-width: 768px), print {
      #profile dl dd {
        padding: 24rem 0;
        font-size: 14rem; } }
    @media screen and (min-width: 768px), print {
      #profile dl dd .address {
        display: grid;
        grid-template-columns: 1fr 164rem;
        grid-gap: 16rem;
        align-items: center;
        padding-right: 48rem; } }
    #profile dl dd .address .btn {
      margin-top: 10rem; }
      @media screen and (min-width: 768px), print {
        #profile dl dd .address .btn {
          min-width: 164rem;
          height: 48rem;
          margin: 0; } }

/*------------------------------------------*/
#download .grid {
  display: flex;
  grid-gap: 24rem;
  align-items: center;
  justify-content: center; }
  @media screen and (min-width: 768px), print {
    #download .grid {
      grid-gap: 48rem; } }
#download h2 {
  margin: 0 0 10rem; }
  @media screen and (min-width: 768px), print {
    #download h2 {
      margin: 0 0 16rem; } }
#download figure {
  box-shadow: 0px 0px 12rem rgba(0, 0, 0, 0.16);
  width: 146rem; }
  @media screen and (min-width: 768px), print {
    #download figure {
      width: 292rem; } }
#download .btn-pdf {
  margin-top: 16rem; }
  @media screen and (min-width: 768px), print {
    #download .btn-pdf {
      margin-top: 24rem; } }

/*------------------------------------------*/
#message {
  overflow: hidden;
  padding-top: 40rem;
  margin-top: -40rem !important; }
  #message .inner {
    position: relative; }
    @media screen and (min-width: 768px), print {
      #message .inner {
        padding-right: 515rem; } }
  #message figure {
    margin: 24rem 24rem; }
    @media screen and (min-width: 768px), print {
      #message figure {
        margin: 0;
        position: absolute;
        top: 80rem;
        left: 730rem;
        width: 568rem; } }
    #message figure figcaption {
      text-align: right;
      display: block;
      margin-top: 16rem; }
      @media screen and (min-width: 768px), print {
        #message figure figcaption {
          margin-top: 32rem;
          padding-right: 148rem;
          font-variant-position: 14rem; } }
      #message figure figcaption .name {
        display: block;
        font-size: 24rem; }
        @media screen and (min-width: 768px), print {
          #message figure figcaption .name {
            font-size: 32rem; } }
  @media screen and (min-width: 768px), print {
    #message .text {
      margin: 0 0 48rem; } }
  @media screen and (min-width: 768px), print {
    #message .text .hw-large {
      font-size: 23rem; } }
  #message .text p {
    margin: 2em 0; }
    @media screen and (min-width: 768px), print {
      #message .text p {
        font-size: 18rem; } }
  #message .photo-slide {
    height: 148rem;
    background: url(../images/message/photos.webp) repeat-x 0 0/767rem 148rem; }
    @media screen and (max-width: 767.98px) {
      #message .photo-slide {
        animation: slide-bg_sp 20s linear infinite; } }
    @media screen and (min-width: 768px), print {
      #message .photo-slide {
        height: 296rem;
        background-size: 1533rem 296rem;
        animation: slide-bg_pc 40s linear infinite; } }

@keyframes slide-bg_sp {
  0% {
    background-position: 0 0; }
  100% {
    background-position: -767rem 0; } }
@keyframes slide-bg_pc {
  0% {
    background-position: 0 0; }
  100% {
    background-position: -1533rem 0; } }
/*------------------------------------------*/
#environment-policy ol {
  margin: 32rem 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-gap: 16rem; }
  @media screen and (min-width: 768px), print {
    #environment-policy ol {
      grid-template-columns: repeat(3, 1fr);
      grid-gap: 24rem 16rem;
      margin: 64rem 0 0; } }
  #environment-policy ol li {
    margin: 0;
    padding: 0;
    border-radius: 4rem;
    overflow: hidden;
    background: #fff;
    transform: translateZ(0);
    filter: drop-shadow(0px 1rem 6rem rgba(0, 0, 0, 0.16)); }
    @media screen and (max-width: 767.98px) {
      #environment-policy ol li {
        display: grid; } }
    @media screen and (min-width: 768px), print {
      #environment-policy ol li {
        filter: drop-shadow(0px 2rem 6rem rgba(0, 0, 0, 0.16));
        border-radius: 8rem; }
        #environment-policy ol li:nth-of-type(1), #environment-policy ol li:nth-of-type(5) {
          grid-column: 1/4;
          display: grid;
          grid-template-columns: 372rem 1fr;
          align-items: center; }
          #environment-policy ol li:nth-of-type(1) .text, #environment-policy ol li:nth-of-type(5) .text {
            padding: 0 48rem; } }
  #environment-policy ol figure {
    overflow: hidden;
    border-radius: 4rem; }
    @media screen and (max-width: 767.98px) {
      #environment-policy ol figure {
        order: 2; } }
    @media screen and (min-width: 768px), print {
      #environment-policy ol figure {
        border-radius: 8rem; } }
  #environment-policy ol .text {
    padding: 24rem; }
  #environment-policy ol h3 {
    font-size: 16rem;
    font-weight: 900;
    margin: 0;
    display: grid;
    grid-template-columns: 2.4em 1fr;
    align-items: center; }
    @media screen and (min-width: 768px), print {
      #environment-policy ol h3 {
        font-size: 24rem; } }
    #environment-policy ol h3 span {
      color: #7B292F;
      white-space: nowrap; }

/*------------------------------------------*/
#contact-japan {
  background: url(../images/group/japan.svg) no-repeat calc(50% - 40rem) 50rem/450rem; }
  @media screen and (min-width: 768px), print {
    #contact-japan {
      background-size: 900rem;
      background-position: calc(50% - 100rem) 50rem; }
      #contact-japan dl.contact-list > div {
        grid-template-columns: 220rem 1fr; } }

#contact-world {
  background: url(../images/group/world.svg) no-repeat center top/375rem; }
  @media screen and (min-width: 768px), print {
    #contact-world {
      background-size: 747rem;
      min-height: 350rem; }
      #contact-world dl.contact-list > div {
        grid-template-columns: 365rem 1fr; } }

dl.contact-list {
  margin: 0;
  padding: 0; }
  dl.contact-list > div {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-bottom: 1px solid #dddddd;
    align-items: center; }
    dl.contact-list > div dt {
      margin: 0 0 -1px;
      padding: 12rem 16rem 12rem 0;
      border-bottom: 1px solid #7B292F;
      font-weight: 900; }
      @media screen and (min-width: 768px), print {
        dl.contact-list > div dt {
          padding: 20rem 20rem 20rem 0; } }
    dl.contact-list > div dd {
      margin: 0;
      padding: 12rem 0; }
      @media screen and (min-width: 768px), print {
        dl.contact-list > div dd {
          padding: 20rem 0; } }
      dl.contact-list > div dd a {
        text-decoration-line: underline;
        text-decoration-color: transparent;
        text-decoration-style: dotted;
        text-decoration-thickness: 1px;
        text-underline-offset: 0.3em;
        transition: text-decoration-color .3s; }
        @media screen and (min-width: 768px), print {
          dl.contact-list > div dd a:hover {
            text-decoration-color: currentColor; } }

/*------------------------------------------*/
#procurement-policy-initiative .result {
  display: grid;
  grid-gap: 24rem;
  margin-top: 24rem; }
  @media screen and (min-width: 768px), print {
    #procurement-policy-initiative .result {
      grid-template-columns: 542rem 1fr;
      grid-gap: 40rem;
      align-items: center;
      margin: 40rem -70rem 0; } }
  #procurement-policy-initiative .result table {
    border-collapse: collapse;
    text-align: center; }
    #procurement-policy-initiative .result table caption {
      font-weight: 700;
      text-align: left;
      font-size: 16rem; }
      @media screen and (min-width: 768px), print {
        #procurement-policy-initiative .result table caption {
          font-size: 18rem; } }
    #procurement-policy-initiative .result table th, #procurement-policy-initiative .result table td {
      padding: 8rem 0;
      border-bottom: 1px solid #dddddd;
      width: 33%; }
      @media screen and (min-width: 768px), print {
        #procurement-policy-initiative .result table th, #procurement-policy-initiative .result table td {
          padding: 16rem 0; } }

/*------------------------------------------*/
#recruit .recruit-links {
  display: grid;
  grid-gap: 32rem;
  margin: 24rem 0 0; }
  @media screen and (min-width: 768px), print {
    #recruit .recruit-links {
      grid-template-columns: 1fr 1fr;
      grid-gap: 16rem; } }
  #recruit .recruit-links .box {
    box-shadow: 0rem 1rem 3rem rgba(0, 0, 0, 0.1);
    border-radius: 8rem;
    position: relative;
    overflow: hidden; }
    @media screen and (min-width: 768px), print {
      #recruit .recruit-links .box {
        box-shadow: 0rem 2rem 6rem rgba(0, 0, 0, 0.1);
        border-radius: 16rem; } }
    #recruit .recruit-links .box h2 {
      position: absolute;
      top: 24rem;
      left: 32rem;
      font-size: 20rem;
      margin: 0; }
      @media screen and (min-width: 768px), print {
        #recruit .recruit-links .box h2 {
          top: 40rem;
          left: 48rem;
          font-size: 32rem; } }
      #recruit .recruit-links .box h2.hw-effect::before {
        left: -32rem; }
        @media screen and (min-width: 768px), print {
          #recruit .recruit-links .box h2.hw-effect::before {
            left: -48rem;
            top: 0rem;
            width: 150rem; } }
    #recruit .recruit-links .box ul {
      display: grid;
      grid-gap: 8rem;
      margin: -16rem 32rem 24rem;
      padding: 0;
      list-style: none; }
      @media screen and (min-width: 768px), print {
        #recruit .recruit-links .box ul {
          margin: -16rem 48rem 32rem;
          grid-gap: 16rem; } }
      #recruit .recruit-links .box ul li {
        margin: 0;
        padding: 0; }
      #recruit .recruit-links .box ul .btn {
        width: 100%; }

/*------------------------------------------*/
#guideline .jobselect {
  display: grid;
  grid-template-columns: 116rem 1fr;
  align-items: center; }
  @media screen and (min-width: 768px), print {
    #guideline .jobselect {
      display: flex;
      justify-content: center;
      grid-gap: 32rem;
      margin: 32rem 0 32rem; } }
  #guideline .jobselect label {
    font-weight: bold; }
  #guideline .jobselect select {
    width: 100%;
    font-weight: bold;
    color: #0082E6; }
    @media screen and (min-width: 768px), print {
      #guideline .jobselect select {
        width: 270rem;
        padding: 0 24rem; } }
    #guideline .jobselect select option {
      color: #181A1E; }
    #guideline .jobselect select .selected {
      color: #0082E6;
      font-weight: bold; }
#guideline .details .detail {
  display: none; }
#guideline table.reference {
  text-align: center;
  font-weight: 700;
  table-layout: fixed;
  width: 100%; }
  #guideline table.reference caption {
    padding: 0 0 8rem; }
    #guideline table.reference caption > span {
      display: grid;
      grid-template-columns: 33% 66%; }
  #guideline table.reference tr:first-child th {
    border-top: 1px solid #7B292F; }
  #guideline table.reference tr:first-child td {
    border-top: 1px solid #dddddd; }
  #guideline table.reference th {
    margin: 0;
    padding: 6rem 0;
    border-bottom: 1px solid #7B292F; }
  #guideline table.reference td {
    margin: 0;
    padding: 6rem 0;
    border-bottom: 1px solid #dddddd; }
@media screen and (min-width: 768px), print {
  #guideline .gray-frame {
    width: 714rem;
    padding: 40rem 70rem;
    margin: 0 auto 48rem; } }
#guideline .gray-frame .note {
  font-size: 12rem;
  text-align: right;
  margin: 8rem 0 0; }
#guideline .btns .btn {
  width: 200rem; }
  @media screen and (min-width: 768px), print {
    #guideline .btns .btn {
      width: 420rem; } }

/*------------------------------------------*/
#interview nav.anchor {
  padding: 0 8rem;
  margin: 0 0 32rem; }
  @media screen and (min-width: 768px), print {
    #interview nav.anchor {
      padding: 0;
      margin: 48rem 0 64rem; } }
  #interview nav.anchor ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 16rem; }
    @media screen and (min-width: 768px), print {
      #interview nav.anchor ul {
        grid-template-columns: repeat(5, 1fr); } }
    #interview nav.anchor ul li {
      margin: 0;
      padding: 0;
      text-align: center; }
    #interview nav.anchor ul a {
      height: auto;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      border: 1px solid #7a7e86;
      box-shadow: 0 1rem 4rem rgba(0, 0, 0, 0.16);
      border-radius: 4rem;
      padding: 8rem 0 4rem;
      text-decoration: none !important; }
    #interview nav.anchor ul em {
      font-family: "Inter", sans-serif;
      font-weight: 900;
      color: #7B292F;
      font-size: 16rem; }
    #interview nav.anchor ul strong {
      font-size: 14rem;
      font-weight: 700; }
    #interview nav.anchor ul span {
      font-size: 13rem; }
      @media screen and (min-width: 768px), print {
        #interview nav.anchor ul span {
          font-size: 14rem; } }
    #interview nav.anchor ul .icon-arrow2 svg {
      stroke: #0082E6;
      width: 16rem;
      height: 10rem; }
      @media screen and (min-width: 768px), print {
        #interview nav.anchor ul .icon-arrow2 svg {
          width: 14rem;
          height: 7rem; } }
#interview article {
  box-shadow: 0 1rem 6rem rgba(0, 0, 0, 0.16);
  border-radius: 4rem;
  margin: 32rem 0 0;
  padding: 16rem; }
  @media screen and (min-width: 768px), print {
    #interview article {
      box-shadow: 0 1rem 6rem rgba(0, 0, 0, 0.16);
      border-radius: 4rem;
      margin: 32rem 0 0;
      padding: 32rem; } }
  #interview article h2 {
    display: grid;
    grid-template-columns: 2em 1fr;
    align-items: flex-start;
    grid-gap: 8rem;
    font-size: 16rem;
    margin: 0 0 16rem; }
    @media screen and (min-width: 768px), print {
      #interview article h2 {
        font-size: 24rem;
        grid-gap: 16rem;
        line-height: 1.2;
        margin: 0 0 24rem; } }
    #interview article h2 span {
      color: #7B292F;
      border-right: 1px solid #7B292F; }
      @media screen and (min-width: 768px), print {
        #interview article h2 span {
          border-right-width: 2px; } }
  #interview article dl {
    margin: 0;
    padding: 0;
    display: grid;
    grid-gap: 24rem; }
    #interview article dl dt,
    #interview article dl dd {
      display: grid;
      grid-template-columns: 2em 1fr; }
      #interview article dl dt::before,
      #interview article dl dd::before {
        font-family: "Inter", sans-serif;
        font-weight: 900;
        color: #7B292F; }
    #interview article dl dt {
      font-weight: 700;
      margin: 0 0 8rem;
      padding: 0; }
      #interview article dl dt::before {
        content: "Q"; }
    #interview article dl dd {
      margin: 0;
      padding: 0; }
      #interview article dl dd::before {
        content: "A"; }
#interview .btns {
  margin: 32rem 0 0; }
  @media screen and (min-width: 768px), print {
    #interview .btns {
      margin: 64rem 0 0; } }
#interview .btn {
  width: 200rem; }
  @media screen and (min-width: 768px), print {
    #interview .btn {
      width: 420rem; } }

/*------------------------------------------*/
#dx .dx-links {
  display: grid;
  grid-gap: 32rem;
  margin: 24rem 0 0; }
  @media screen and (min-width: 768px), print {
    #dx .dx-links {
      grid-template-columns: 1fr 1fr;
      grid-gap: 16rem; } }
  #dx .dx-links .box {
    box-shadow: 0rem 1rem 3rem rgba(0, 0, 0, 0.1);
    border-radius: 4rem;
    position: relative;
    overflow: hidden;
    padding: 0 16rem 24rem; }
    @media screen and (min-width: 768px), print {
      #dx .dx-links .box {
        box-shadow: 0rem 2rem 6rem rgba(0, 0, 0, 0.1);
        border-radius: 8rem;
        padding: 0 32rem 32rem; } }
  #dx .dx-links figure {
    margin: 0 -16rem 16rem; }
    @media screen and (min-width: 768px), print {
      #dx .dx-links figure {
        margin: 0 -32rem 32rem; } }
  #dx .dx-links h2 {
    margin: 0; }
  #dx .dx-links .btns {
    margin-top: 16rem; }
    @media screen and (min-width: 768px), print {
      #dx .dx-links .btns .btn {
        min-width: 160rem;
        height: 48rem;
        font-size: 13rem;
        grid-template-columns: 1fr 18rem; } }

/*------------------------------------------*/
#works .controls {
  background: rgba(24, 26, 30, 0.04);
  padding: 24rem 32rem;
  margin: 32rem 0; }
  @media screen and (min-width: 768px), print {
    #works .controls {
      margin: 0 0 64rem;
      display: grid;
      grid-template-columns: 185rem 1fr;
      align-items: center;
      padding: 32rem 32rem 32rem 8rem;
      grid-gap: 24rem 0; } }
  #works .controls h2 {
    text-align: center;
    margin: 0;
    line-height: 1; }
    @media screen and (min-width: 768px), print {
      #works .controls h2 {
        grid-row: 1/3;
        font-size: 24rem;
        line-height: 1.5;
        font-weight: 500; } }
  #works .controls fieldset {
    margin-top: 24rem;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 5rem; }
    @media screen and (min-width: 768px), print {
      #works .controls fieldset {
        position: relative;
        padding: 0 0 0 140rem;
        margin: 0; } }
    #works .controls fieldset label {
      width: 100%;
      position: relative;
      aspect-ratio: 560/64;
      color: #fff;
      text-align: center; }
      @media screen and (min-width: 768px), print {
        #works .controls fieldset label {
          aspect-ratio: 117/72;
          width: 117rem;
          position: absolute;
          left: 0;
          top: 50%;
          transform: translateY(-50%);
          display: flex;
          justify-content: center;
          align-items: center;
          box-sizing: border-box;
          padding-right: 16rem; } }
      #works .controls fieldset label span {
        position: relative;
        font-size: 13rem;
        font-weight: 700;
        display: block;
        transform: translateY(5rem); }
        @media screen and (min-width: 768px), print {
          #works .controls fieldset label span {
            transform: none;
            font-size: 16rem; } }
      #works .controls fieldset label svg {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%; }
    #works .controls fieldset button {
      background: none;
      appearance: none;
      border: 1px solid #7B292F;
      border-radius: 100rem;
      color: #7B292F;
      background: #fff;
      padding: 0 16rem 0.13em;
      font-size: 12rem;
      height: 25rem;
      transition: background .5s,color .5s;
      cursor: pointer; }
      @media screen and (min-width: 768px), print {
        #works .controls fieldset button {
          font-size: 14rem;
          min-width: 108rem;
          height: 32rem; } }
      #works .controls fieldset button.mixitup-control-active {
        background: #7B292F;
        color: #fff; }
#works .container {
  text-align: justify; }
#works .mix,
#works .gap {
  display: inline-block;
  vertical-align: top;
  width: calc(50% - 4rem); }
  @media screen and (min-width: 768px), print {
    #works .mix,
    #works .gap {
      width: calc((100% - 48rem) / 3); } }
#works .mix {
  overflow: hidden;
  margin-bottom: 16rem;
  position: relative;
  border-radius: 8rem;
  overflow: hidden;
  background: #fff;
  transform: translateZ(0);
  filter: drop-shadow(0px 1rem 6rem rgba(0, 0, 0, 0.16));
  box-sizing: border-box;
  padding: 0 16rem 16rem; }
  @media screen and (min-width: 768px), print {
    #works .mix {
      filter: drop-shadow(0px 2rem 6rem rgba(0, 0, 0, 0.16));
      border-radius: 16rem;
      margin-bottom: 32rem; } }
  #works .mix figure {
    margin: 0 -16rem 16rem; }
  #works .mix h3 {
    font-size: 15rem;
    font-weight: 400;
    min-height: 3em;
    line-height: 1.5;
    display: flex;
    align-items: center;
    margin: 0 0 4rem; }
    @media screen and (min-width: 768px), print {
      #works .mix h3 {
        font-size: 20rem;
        margin: 0 0 8rem; } }
  #works .mix .date {
    font-size: 12rem;
    margin: 0 0 4rem; }
    @media screen and (min-width: 768px), print {
      #works .mix .date {
        font-size: 14rem;
        margin: 0 0 8rem; } }
  #works .mix .tags {
    margin: 0;
    padding: 0;
    list-style: none; }
    @media screen and (min-width: 768px), print {
      #works .mix .tags {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-gap: 8rem; } }
    #works .mix .tags li {
      margin: 4rem 0 0;
      padding: 0 8rem 0.13em;
      border-radius: 100rem;
      display: table;
      border: 1px solid #7B292F;
      color: #7B292F;
      font-size: 12rem;
      line-height: 1.8;
      text-align: center; }
      @media screen and (min-width: 768px), print {
        #works .mix .tags li {
          padding: 0; } }

/*------------------------------------------*/
#initiative ul.initiative-list {
  margin: 24rem 0 0;
  padding: 0;
  list-style: none; }
  @media screen and (min-width: 768px), print {
    #initiative ul.initiative-list {
      margin-top: 48rem; } }
  #initiative ul.initiative-list + h2 {
    margin-top: 64rem; }
    @media screen and (min-width: 768px), print {
      #initiative ul.initiative-list + h2 {
        margin-top: 100rem; } }
  #initiative ul.initiative-list li {
    margin: 0 0 24rem;
    padding: 0 0 24rem;
    border-bottom: 1px solid #C7CAD1; }
    @media screen and (min-width: 768px), print {
      #initiative ul.initiative-list li {
        display: grid;
        grid-template-columns: 570rem 1fr;
        grid-gap: 48rem;
        align-items: center;
        padding: 0 73rem 32rem;
        margin: 0 0 32rem; } }
    #initiative ul.initiative-list li:last-child {
      margin-bottom: 0;
      padding-bottom: 0;
      border: none; }
  #initiative ul.initiative-list h3 {
    font-size: 16rem;
    margin: 0; }
    @media screen and (min-width: 768px), print {
      #initiative ul.initiative-list h3 {
        font-size: 24rem; } }
  #initiative ul.initiative-list figure {
    margin: 16rem 0 0;
    text-align: center; }
    #initiative ul.initiative-list figure img {
      width: calc(var(--logo-width) * 0.7); }
      @media screen and (min-width: 768px), print {
        #initiative ul.initiative-list figure img {
          width: var(--logo-width); } }

/*------------------------------------------*/
#officers dl.common-list > div {
  grid-template-columns: calc(50% - 8rem) 1fr; }
  @media screen and (min-width: 768px), print {
    #officers dl.common-list > div {
      grid-template-columns: 250rem 1fr; } }

/*------------------------------------------*/
@media screen and (max-width: 767.98px) {
  #policy .scrollable .scrollable-content {
    width: 270%;
    max-width: 270%; } }

/*------------------------------------------*/
#compliance h3,
#governance h3 {
  margin: 48rem 0 16rem;
  font-size: 16rem;
  text-indent: -3.7em;
  padding: 0 0 0 3.7em;
  font-weight: 900; }
  @media screen and (min-width: 768px), print {
    #compliance h3,
    #governance h3 {
      font-size: 24rem;
      margin: 64rem 0 16rem; } }
#compliance h4,
#governance h4 {
  margin: 16rem 0 4rem;
  font-size: 14rem;
  text-indent: -3.2em;
  padding: 0 0 0 3.2em;
  font-weight: 900; }
  @media screen and (min-width: 768px), print {
    #compliance h4,
    #governance h4 {
      font-size: 18rem;
      margin: 32rem 0 4rem; } }
#compliance p,
#governance p {
  margin: 0;
  line-height: 1.84; }
  @media screen and (min-width: 768px), print {
    #compliance p,
    #governance p {
      line-height: 2; } }
@media screen and (min-width: 768px), print {
  #compliance ol,
  #governance ol {
    line-height: 2; } }
#compliance .indent,
#governance .indent {
  margin-left: 1em; }
#compliance .idea,
#governance .idea {
  background: rgba(24, 26, 30, 0.04);
  border-radius: 4rem;
  margin: 24rem 0 0;
  padding: 24rem 16rem;
  text-align: center;
  display: grid;
  grid-gap: 32rem; }
  @media screen and (min-width: 768px), print {
    #compliance .idea,
    #governance .idea {
      margin: 32rem -70rem;
      padding: 32rem 0; } }
  #compliance .idea > div,
  #governance .idea > div {
    position: relative; }
    #compliance .idea > div::before,
    #governance .idea > div::before {
      content: "";
      display: block;
      position: absolute;
      top: -5rem;
      left: 50%;
      transform: translateX(-50%);
      background: url("../images/hw_triangle.svg") no-repeat center center/contain;
      width: 66rem;
      aspect-ratio: 200/64;
      mix-blend-mode: multiply; }
      @media screen and (min-width: 768px), print {
        #compliance .idea > div::before,
        #governance .idea > div::before {
          width: 130rem; } }
    #compliance .idea > div:last-child::before,
    #governance .idea > div:last-child::before {
      transform: translate(-90%, 30%) rotate(180deg); }
      @media screen and (min-width: 768px), print {
        #compliance .idea > div:last-child::before,
        #governance .idea > div:last-child::before {
          transform: translate(-50%, 0%) rotate(180deg); } }
    #compliance .idea > div:last-child svg,
    #governance .idea > div:last-child svg {
      bottom: -16rem;
      top: inherit; }
  #compliance .idea h5,
  #governance .idea h5 {
    position: relative;
    z-index: 2;
    color: #7B292F;
    font-size: 14rem;
    font-weight: 900;
    margin: 0 0 16rem; }
    @media screen and (min-width: 768px), print {
      #compliance .idea h5,
      #governance .idea h5 {
        font-size: 18rem; } }
  #compliance .idea p,
  #governance .idea p {
    font-size: 17rem;
    font-weight: 900;
    position: relative;
    z-index: 2; }
    @media screen and (min-width: 768px), print {
      #compliance .idea p,
      #governance .idea p {
        font-size: 24rem; } }
  #compliance .idea svg,
  #governance .idea svg {
    width: auto;
    height: 27rem;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; }
    @media screen and (min-width: 768px), print {
      #compliance .idea svg,
      #governance .idea svg {
        height: 45rem;
        top: -16rem; } }
    #compliance .idea svg path,
    #governance .idea svg path {
      stroke-width: 1px; }
      @media screen and (min-width: 768px), print {
        #compliance .idea svg path,
        #governance .idea svg path {
          stroke-width: 0.5px; } }

#compliance .btns {
  margin: 16rem 0;
  text-align: left; }
@media screen and (min-width: 768px), print {
  #compliance .scrollable {
    margin: 64rem 0 80rem; } }
#compliance .scrollable img {
  display: block;
  border-radius: 4rem;
  padding: 32rem;
  background: rgba(24, 26, 30, 0.04); }
  @media screen and (min-width: 768px), print {
    #compliance .scrollable img {
      padding: 32rem 70rem 32rem 215rem;
      width: 100%;
      border-radius: 8rem; } }
#compliance .scrollable-bar {
  margin: 0 0 48rem; }

/*------------------------------------------*/
.base-tab {
  margin: 16rem 0 8rem; }
  .base-tab ul {
    display: grid;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0 32rem;
    list-style: none;
    grid-template-columns: 1fr 1fr;
    grid-gap: 8rem; }
    @media screen and (min-width: 768px), print {
      .base-tab ul {
        grid-template-columns: 160rem 160rem;
        grid-gap: 16rem; } }
    .base-tab ul li {
      background: rgba(255, 255, 255, 0.5);
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 10rem 10rem 0 0;
      height: 45rem;
      color: #0082E6;
      font-size: 13rem;
      font-weight: 700;
      box-shadow: 0px 0px 24rem rgba(0, 0, 0, 0.08);
      position: relative;
      cursor: pointer; }
      @media screen and (min-width: 768px), print {
        .base-tab ul li {
          border-radius: 20rem 20rem 0 0;
          height: 48rem;
          font-size: 13rem;
          box-shadow: 0px 0px 24rem rgba(0, 0, 0, 0.08); } }
      .base-tab ul li .icon-arrow {
        position: absolute;
        top: 50%;
        right: 10rem;
        transform: translateY(-50%) rotate(90deg);
        width: 9rem; }
        @media screen and (min-width: 768px), print {
          .base-tab ul li .icon-arrow {
            width: 18rem;
            right: 24rem; } }
      .base-tab ul li.active {
        background: white; }

#base-japan .head-office {
  margin: 16rem 0 0; }
  @media screen and (min-width: 768px), print {
    #base-japan .head-office {
      margin: 24rem 0 0;
      display: grid;
      grid-template-columns: 276rem 1fr 380rem;
      grid-gap: 24rem; } }
  #base-japan .head-office address {
    padding: 16rem 0 8rem 0;
    display: block; }
    @media screen and (min-width: 768px), print {
      #base-japan .head-office address {
        padding: 0; } }
  #base-japan .head-office .googlemap iframe {
    width: 100%;
    height: 200rem; }
    @media screen and (min-width: 768px), print {
      #base-japan .head-office .googlemap iframe {
        height: 300rem; } }
#base-japan h3 {
  margin: 16rem 0 0; }
  @media screen and (min-width: 768px), print {
    #base-japan h3 {
      margin: 32rem 0 0; } }

#base-world {
  margin: 0; }
  @media screen and (max-width: 767.98px) {
    #base-world .worldmap {
      margin-top: 16rem; }
      #base-world .worldmap img {
        object-fit: cover;
        width: 100%;
        height: 180rem; } }
  @media screen and (min-width: 768px), print {
    #base-world .worldmap {
      margin-top: 32rem; } }
  #base-world h3 {
    margin: 16rem 0 0; }
    @media screen and (min-width: 768px), print {
      #base-world h3 {
        margin: 32rem 0 0; } }

dl.base-list {
  margin: 0;
  padding: 0; }
  dl.base-list > div {
    display: grid;
    grid-template-columns: 92rem 1fr; }
    @media screen and (min-width: 768px), print {
      dl.base-list > div {
        grid-template-columns: 276rem 1fr; } }
  dl.base-list dt {
    margin: 0;
    padding: 16rem 8rem 16rem 0;
    font-weight: 700;
    border-bottom: 1px solid #7B292F; }
    @media screen and (min-width: 768px), print {
      dl.base-list dt {
        padding: 32rem 0 32rem; } }
  dl.base-list dd {
    margin: 0;
    padding: 16rem 0 16rem;
    border-bottom: 1px solid #ccc; }
    @media screen and (min-width: 768px), print {
      dl.base-list dd {
        display: grid;
        grid-template-columns: 1fr 164rem;
        grid-gap: 24rem;
        padding: 32rem 0 32rem; } }
  dl.base-list .map {
    margin-top: 8rem; }
    @media screen and (min-width: 768px), print {
      dl.base-list .map .btn {
        min-width: 164rem;
        height: 49rem; } }

dl.base-list2 {
  margin: 0;
  padding: 0; }
  dl.base-list2 > div {
    display: grid; }
    @media screen and (min-width: 768px), print {
      dl.base-list2 > div {
        grid-template-columns: 276rem 1fr; } }
  dl.base-list2 dt {
    margin: 0;
    padding: 16rem 0 8rem 0;
    font-weight: 700; }
    @media screen and (min-width: 768px), print {
      dl.base-list2 dt {
        padding: 32rem 0 32rem;
        border-bottom: 1px solid #7B292F; } }
  dl.base-list2 dd {
    margin: 0;
    padding: 0 0 16rem;
    border-bottom: 1px solid #7B292F; }
    @media screen and (min-width: 768px), print {
      dl.base-list2 dd {
        display: grid;
        grid-template-columns: 1fr 164rem;
        grid-gap: 24rem;
        padding: 32rem 0 32rem 24rem;
        border-bottom: 1px solid #ccc; } }
  dl.base-list2 .map {
    margin-top: 8rem; }
    @media screen and (min-width: 768px), print {
      dl.base-list2 .map {
        margin: 0;
        align-self: center; }
        dl.base-list2 .map .btn {
          min-width: 164rem;
          height: 49rem; } }

/*------------------------------------------*/
#newslist .year-select {
  width: 180rem;
  margin: 0 0 16rem;
  position: relative; }
  @media screen and (min-width: 768px), print {
    #newslist .year-select {
      margin: 0 0 32rem; } }
  #newslist .year-select i {
    line-height: 1px;
    position: absolute;
    top: 50%;
    right: 10rem;
    transform: translateY(-50%);
    pointer-events: none; }
    @media screen and (min-width: 768px), print {
      #newslist .year-select i {
        right: 16rem; } }
    #newslist .year-select i svg {
      stroke: #0082E6;
      width: 12rem;
      height: 6rem; }
      @media screen and (min-width: 768px), print {
        #newslist .year-select i svg {
          width: 14rem;
          height: 7rem; } }

ul.news-list2 {
  margin: 0;
  padding: 0;
  list-style: none; }
  ul.news-list2 li {
    margin: 0;
    border-top: 1px solid #dddddd;
    padding: 16rem 0; }
    ul.news-list2 li:last-child {
      border-bottom: 1px solid #dddddd; }
  ul.news-list2 a {
    display: grid;
    grid-gap: 8rem;
    text-decoration: none; }
    @media screen and (min-width: 768px), print {
      ul.news-list2 a {
        grid-template-columns: 200rem 1fr;
        align-items: center;
        grid-gap: 24rem; } }
    ul.news-list2 a:hover .title h2 {
      text-decoration-color: currentColor; }
  ul.news-list2 .meta {
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: 6rem 4rem; }
    @media screen and (min-width: 768px), print {
      ul.news-list2 .meta {
        grid-template-columns: 1fr 1fr; } }
    ul.news-list2 .meta time {
      font-family: "Inter", sans-serif;
      display: block;
      margin: 0;
      grid-column: 1 / 3;
      line-height: 1; }
    ul.news-list2 .meta .category {
      font-size: 11rem;
      display: inline-block;
      grid-gap: 6rem;
      align-items: center;
      background: var(--catcolor);
      border-radius: 4rem;
      width: 110rem;
      color: #fff;
      line-height: 24rem;
      text-align: center; }
      @media screen and (min-width: 768px), print {
        ul.news-list2 .meta .category {
          font-size: 10rem;
          display: block;
          width: auto;
          margin: 0;
          letter-spacing: 0;
          line-height: 20rem; } }
  ul.news-list2 .title {
    display: grid;
    grid-template-columns: 1fr 36rem;
    grid-gap: 16rem;
    align-items: center; }
    @media screen and (min-width: 768px), print {
      ul.news-list2 .title {
        grid-template-columns: 1fr 40rem;
        grid-gap: 32rem;
        font-size: 16rem; } }
    ul.news-list2 .title h2, ul.news-list2 .title h3 {
      margin: 0;
      font-weight: 400;
      position: relative;
      backface-visibility: hidden;
      text-decoration-line: underline;
      text-decoration-color: transparent;
      text-decoration-style: solid;
      text-decoration-thickness: 1px;
      text-underline-offset: 0.3em;
      transition: background .5s,color .5s,opacity .5s, text-decoration .5s;
      font-size: 13rem; }
      @media screen and (min-width: 768px), print {
        ul.news-list2 .title h2, ul.news-list2 .title h3 {
          font-size: 16rem; } }
    ul.news-list2 .title .icon {
      text-align: center;
      font-size: 11rem;
      font-weight: 400;
      line-height: 1.4; }
      ul.news-list2 .title .icon .circle {
        width: 100%;
        border: 1px solid #181A1E;
        border-radius: 100rem;
        padding: 25%;
        aspect-ratio: 1;
        display: flex;
        justify-content: center;
        align-items: center; }
      ul.news-list2 .title .icon .icon-arrow svg {
        stroke: #181A1E;
        width: 100%; }
      ul.news-list2 .title .icon .icon-pdf svg {
        fill: #181A1E;
        width: 90%;
        aspect-ratio: 1;
        transform: translateX(5%); }

/*------------------------------------------*/
#newsdetail .meta {
  margin: 0;
  padding: 0;
  position: relative;
  display: flex;
  flex-wrap: wrap; }
  #newsdetail .meta time {
    font-family: "Inter", sans-serif;
    font-weight: 700;
    display: block;
    margin: 0 0 3rem;
    width: 100%; }
  #newsdetail .meta .category {
    font-size: 12rem;
    display: inline-block;
    margin-right: 4rem;
    align-items: center;
    background: var(--catcolor);
    border-radius: 4rem;
    width: 110rem;
    color: #fff;
    line-height: 24rem;
    text-align: center; }
    @media screen and (min-width: 768px), print {
      #newsdetail .meta .category {
        font-size: 12rem; } }
#newsdetail .pdf-download {
  color: #0082E6;
  text-decoration: underline;
  display: inline-grid;
  grid-template-columns: 1fr 15rem;
  grid-gap: 4rem;
  align-items: center;
  text-decoration: none;
  border-bottom: 1px solid #0082E6;
  transition: border .5s;
  margin: 24rem 0; }
  @media screen and (min-width: 768px), print {
    #newsdetail .pdf-download {
      position: absolute;
      top: 50%;
      right: 0;
      transform: translateY(-50%);
      margin: 0; } }
  #newsdetail .pdf-download:hover {
    border-color: transparent; }
#newsdetail h1 {
  font-size: 20rem;
  margin: 24rem 0; }
  @media screen and (min-width: 768px), print {
    #newsdetail h1 {
      font-size: 24rem;
      margin: 64rem 0; } }
#newsdetail .entry-body h2 {
  font-size: 16rem;
  margin: 24rem 0 16rem; }
  @media screen and (min-width: 768px), print {
    #newsdetail .entry-body h2 {
      font-size: 20rem; } }
#newsdetail .entry-body h3 {
  font-size: 16rem;
  margin: 16rem 0 8rem; }
  #newsdetail .entry-body h3 + p {
    margin-top: 0; }
#newsdetail .entry-body p {
  overflow: hidden;
  margin: 1.8em 0; }
#newsdetail .entry-body a {
  color: #0082E6; }
  #newsdetail .entry-body a .icon-external svg {
    fill: #0082E6; }
#newsdetail .entry-body table {
  width: 100% !important;
  height: auto !important;
  margin: 16rem 0;
  border: none; }
  #newsdetail .entry-body table col {
    width: auto !important; }
  #newsdetail .entry-body table tr, #newsdetail .entry-body table th, #newsdetail .entry-body table td {
    border: none;
    width: auto !important;
    height: auto !important; }
  #newsdetail .entry-body table tr:first-child th {
    border-top: 1px solid #7B292F; }
  #newsdetail .entry-body table tr:first-child td {
    border-top: 1px solid #dddddd; }
  #newsdetail .entry-body table th {
    margin: 0;
    padding: 16rem;
    border-bottom: 1px solid #7B292F;
    color: #7B292F; }
    @media screen and (min-width: 768px), print {
      #newsdetail .entry-body table th {
        padding: 24rem 16rem; } }
  #newsdetail .entry-body table td {
    margin: 0;
    padding: 16rem;
    border-bottom: 1px solid #dddddd; }
    @media screen and (min-width: 768px), print {
      #newsdetail .entry-body table td {
        padding: 24rem; } }

/*------------------------------------------*/
#group-japan {
  background: url(../images/group/japan.svg) no-repeat calc(50% - 40rem) top/450rem;
  padding: 30rem 0 0;
  margin: -20rem 0 32rem; }
  @media screen and (min-width: 768px), print {
    #group-japan {
      background-size: 900rem;
      background-position: calc(50% - 100rem) top;
      padding-top: 100rem;
      margin: -50rem 0 100rem; } }
  #group-japan ul.group-list {
    margin: 0;
    padding: 0;
    list-style: none; }
    #group-japan ul.group-list li {
      margin: 0;
      padding: 0; }
      @media screen and (min-width: 768px), print {
        #group-japan ul.group-list li {
          display: grid;
          grid-template-columns: 280rem 1fr; } }
    #group-japan ul.group-list .btn {
      min-width: 1px;
      height: 36rem;
      grid-template-columns: 1fr 13rem;
      padding: 0 16rem;
      grid-gap: 8rem;
      font-size: 12rem; }
      @media screen and (min-width: 768px), print {
        #group-japan ul.group-list .btn {
          height: 48rem;
          font-size: 13rem;
          grid-template-columns: 1fr 18rem; } }
      #group-japan ul.group-list .btn svg {
        width: 100%; }
    #group-japan ul.group-list .head {
      font-weight: 700;
      margin: 0;
      padding: 19rem 0 8rem 0; }
      @media screen and (min-width: 768px), print {
        #group-japan ul.group-list .head {
          display: block;
          padding: 28rem 0;
          border-bottom: 1px solid #7B292F; } }
      #group-japan ul.group-list .head:has(.btn) {
        display: grid;
        grid-template-columns: 1fr 150rem;
        align-items: center;
        grid-gap: 16rem; }
        @media screen and (min-width: 768px), print {
          #group-japan ul.group-list .head:has(.btn) {
            display: block; } }
      #group-japan ul.group-list .head h3 {
        margin: 0;
        font-size: 13rem; }
        @media screen and (min-width: 768px), print {
          #group-japan ul.group-list .head h3 {
            font-size: 16rem; } }
      @media screen and (min-width: 768px), print {
        #group-japan ul.group-list .head .btn {
          margin-top: 16rem;
          width: 164rem; } }
    #group-japan ul.group-list .body {
      margin: 0;
      padding: 0 0 20rem 80rem;
      border-bottom: 1px solid #dddddd;
      display: grid;
      font-size: 12rem;
      position: relative; }
      @media screen and (max-width: 767.98px) {
        #group-japan ul.group-list .body::before {
          content: "";
          width: 80rem;
          height: 1px;
          background: #7B292F;
          position: absolute;
          bottom: -1px;
          left: 0; } }
      @media screen and (min-width: 768px), print {
        #group-japan ul.group-list .body {
          font-size: 14rem;
          padding: 30rem 0 30rem 24rem;
          grid-template-columns: 1fr 220rem;
          height: 100%;
          align-items: center; } }
      #group-japan ul.group-list .body .btn-pdf2 {
        margin: 8rem 0 0;
        width: 180rem; }
        @media screen and (min-width: 768px), print {
          #group-japan ul.group-list .body .btn-pdf2 {
            margin: 0;
            width: 100%; } }

#group-world {
  background: url(../images/group/world.svg) no-repeat center top/375rem;
  padding: 30rem 0 0; }
  @media screen and (min-width: 768px), print {
    #group-world {
      background-size: 747rem;
      background-position: center 50rem;
      padding: 0; } }
  #group-world ul.group-list {
    margin: 0;
    padding: 0;
    list-style: none; }
    #group-world ul.group-list li {
      margin: 0;
      padding: 0; }
      @media screen and (min-width: 768px), print {
        #group-world ul.group-list li {
          display: grid;
          grid-template-columns: 310rem 1fr; } }
    #group-world ul.group-list .btn {
      min-width: 1px;
      height: 36rem;
      grid-template-columns: 1fr 13rem;
      padding: 0 16rem;
      grid-gap: 8rem;
      font-size: 12rem; }
      @media screen and (min-width: 768px), print {
        #group-world ul.group-list .btn {
          height: 48rem;
          font-size: 13rem;
          grid-template-columns: 1fr 18rem; } }
    #group-world ul.group-list .head {
      font-weight: 700;
      margin: 0;
      padding: 19rem 0 8rem 0; }
      @media screen and (min-width: 768px), print {
        #group-world ul.group-list .head {
          display: block;
          padding: 28rem 0;
          border-bottom: 1px solid #7B292F; } }
      #group-world ul.group-list .head:has(.btn) {
        display: grid;
        grid-template-columns: 1fr 150rem;
        align-items: center;
        grid-gap: 16rem; }
        @media screen and (min-width: 768px), print {
          #group-world ul.group-list .head:has(.btn) {
            display: block; } }
      #group-world ul.group-list .head h3 {
        margin: 0;
        font-size: 13rem; }
        @media screen and (min-width: 768px), print {
          #group-world ul.group-list .head h3 {
            font-size: 16rem; } }
      @media screen and (min-width: 768px), print {
        #group-world ul.group-list .head .btn {
          margin-top: 16rem;
          width: 164rem; } }
    #group-world ul.group-list .body {
      margin: 0;
      padding: 0 0 20rem 80rem;
      border-bottom: 1px solid #dddddd;
      display: grid;
      font-size: 12rem;
      position: relative; }
      @media screen and (max-width: 767.98px) {
        #group-world ul.group-list .body::before {
          content: "";
          width: 80rem;
          height: 1px;
          background: #7B292F;
          position: absolute;
          bottom: -1px;
          left: 0; } }
      @media screen and (min-width: 768px), print {
        #group-world ul.group-list .body {
          font-size: 14rem;
          padding: 30rem 0 30rem 64rem;
          grid-template-columns: 1fr 180rem;
          height: 100%;
          align-items: center; } }
      #group-world ul.group-list .body .btn {
        margin: 8rem 0 0; }
        @media screen and (min-width: 768px), print {
          #group-world ul.group-list .body .btn {
            margin: 0;
            width: 100%; } }

/*------------------------------------------*/
#business .business-links {
  display: grid;
  grid-gap: 16rem;
  margin: 24rem 0 0; }
  @media screen and (min-width: 768px), print {
    #business .business-links {
      grid-template-columns: 1fr 1fr;
      grid-gap: 16rem; } }
  #business .business-links .box {
    box-shadow: 0rem 1rem 3rem rgba(0, 0, 0, 0.1);
    border-radius: 8rem;
    position: relative;
    overflow: hidden;
    padding: 0 20rem 20rem; }
    @media screen and (min-width: 768px), print {
      #business .business-links .box {
        box-shadow: 0rem 2rem 6rem rgba(0, 0, 0, 0.1);
        border-radius: 16rem;
        padding: 0 24rem 32rem;
        display: flex;
        flex-direction: column;
        justify-content: flex-start; } }
    #business .business-links .box h2 {
      font-size: 16rem;
      margin: 0; }
      @media screen and (min-width: 768px), print {
        #business .business-links .box h2 {
          font-size: 24rem; } }
    #business .business-links .box figure {
      margin: 0 -20rem 20rem; }
      @media screen and (min-width: 768px), print {
        #business .business-links .box figure {
          margin: 0 -24rem 24rem; } }
    #business .business-links .box .btns {
      margin: 0; }
      @media screen and (min-width: 768px), print {
        #business .business-links .box .btns {
          margin-top: auto; } }
      @media screen and (min-width: 768px), print {
        #business .business-links .box .btns .btn {
          height: 48rem;
          min-width: 164rem; } }

/*------------------------------------------*/
#business-case h2 {
  margin-bottom: 32rem; }
  @media screen and (min-width: 768px), print {
    #business-case h2 {
      margin-bottom: 60rem; } }
#business-case h3 {
  border-bottom: 1px solid #dddddd;
  position: relative;
  font-size: 13rem;
  padding: 0 0 8rem 0;
  margin: 0 0 16rem; }
  @media screen and (min-width: 768px), print {
    #business-case h3 {
      font-size: 16rem;
      padding: 0 0 14rem;
      margin: 32rem 0 16rem; } }
  #business-case h3::after {
    content: "";
    width: 92rem;
    height: 1px;
    background: #7B292F;
    display: block;
    position: absolute;
    bottom: -1px;
    left: 0; }
    @media screen and (min-width: 768px), print {
      #business-case h3::after {
        width: 220rem; } }
#business-case ul {
  margin: 0 0 32rem;
  padding: 0;
  list-style: none;
  font-size: 12rem; }
  @media screen and (min-width: 768px), print {
    #business-case ul {
      columns: 2;
      font-size: 14rem;
      margin: 0 0 48rem; } }
  #business-case ul li {
    margin: 0;
    padding: 0 0 0 1em;
    text-indent: -1em; }
    #business-case ul li::before {
      content: "●"; }
    #business-case ul li.etc::before {
      display: none; }

/*------------------------------------------*/
#naisen figure {
  display: grid;
  grid-gap: 16rem;
  margin: 32rem 0; }
  @media screen and (min-width: 768px), print {
    #naisen figure {
      grid-template-columns: 1fr 1fr; } }

/*------------------------------------------*/
#air-conditioning figure {
  display: grid;
  grid-gap: 16rem;
  margin: 32rem 0; }
  @media screen and (min-width: 768px), print {
    #air-conditioning figure {
      grid-template-columns: repeat(3, 1fr); } }

@media screen and (min-width: 768px), print {
  #air-conditioning2 figure {
    margin-top: -32rem; } }

/*------------------------------------------*/
#oversea2 .worldmap {
  margin-top: 32rem; }
  @media screen and (max-width: 767.98px) {
    #oversea2 .worldmap img {
      object-fit: cover;
      width: 100%;
      height: 180rem; } }
#oversea2 ul {
  margin: 32rem 0 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-gap: 16rem; }
  #oversea2 ul li {
    margin: 0;
    padding: 20rem;
    border-radius: 8rem;
    background: #fff;
    box-shadow: 0px 1rem 6rem rgba(0, 0, 0, 0.16); }
    @media screen and (min-width: 768px), print {
      #oversea2 ul li {
        padding: 24rem 32rem;
        box-shadow: 0px 2rem 12rem rgba(0, 0, 0, 0.16);
        border-radius: 16rem;
        display: grid;
        grid-template-columns: 380rem 1fr; } }
  #oversea2 ul h3 {
    margin: 0 0 8rem;
    font-size: 13rem; }
    @media screen and (min-width: 768px), print {
      #oversea2 ul h3 {
        font-size: 16rem; } }
    #oversea2 ul h3 .country {
      display: table;
      border-radius: 100rem;
      color: #fff;
      width: 130rem;
      text-align: center;
      margin: 0 0 8rem;
      font-size: 13rem;
      line-height: 2; }
      @media screen and (min-width: 768px), print {
        #oversea2 ul h3 .country {
          width: 180rem;
          font-size: 19rem;
          margin: 0 0 16rem; } }

/*------------------------------------------*/
#sutainability1 {
  background: #fff;
  border-radius: 20rem 20rem 0 0;
  box-shadow: 0 0 12rem rgba(0, 0, 0, 0.08);
  padding: 24rem 0 44rem;
  margin: 32rem  0 0; }
  @media screen and (min-width: 768px), print {
    #sutainability1 {
      border-radius: 24rem 24rem 0 0;
      box-shadow: 0 0 24rem rgba(0, 0, 0, 0.08);
      padding: 72rem 0 120rem;
      margin: 64rem  0 0; } }
  #sutainability1 ul.sibling-links.index .wide figure figcaption {
    color: #181A1E; }
  #sutainability1 ul.sibling-links.index li:not(.wide) figure::before {
    display: none; }
  #sutainability1 ul.sibling-links.index li:not(.wide) figure figcaption {
    grid-template-columns: 1fr;
    height: auto;
    padding: 16rem;
    position: static;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background: #fff; }
    @media screen and (min-width: 768px), print {
      #sutainability1 ul.sibling-links.index li:not(.wide) figure figcaption {
        padding: 24rem 24rem; } }
    #sutainability1 ul.sibling-links.index li:not(.wide) figure figcaption .main {
      font-size: 16rem; }
      @media screen and (min-width: 768px), print {
        #sutainability1 ul.sibling-links.index li:not(.wide) figure figcaption .main {
          font-size: 24rem; } }
    #sutainability1 ul.sibling-links.index li:not(.wide) figure figcaption .excerpt {
      font-size: 13rem;
      font-weight: 400;
      line-height: 1.84; }
      @media screen and (min-width: 768px), print {
        #sutainability1 ul.sibling-links.index li:not(.wide) figure figcaption .excerpt {
          font-size: 16rem; } }
  #sutainability1 ul.sibling-links.index a {
    text-decoration: none !important; }

#sutainability2 {
  background: url("../images/sustainability/esg_bg.webp") no-repeat center -3rem/100% #f1f3e9;
  border-radius: 20rem;
  box-shadow: 0 0 12rem rgba(0, 0, 0, 0.08);
  padding: 24rem 0;
  margin: -20rem 0 0; }
  @media screen and (min-width: 768px), print {
    #sutainability2 {
      border-radius: 24rem;
      box-shadow: 0 0 24rem rgba(0, 0, 0, 0.08);
      padding: 72rem 0;
      margin: -48rem 0 0; } }
  #sutainability2 .box {
    margin-top: 32rem; }
    @media screen and (min-width: 768px), print {
      #sutainability2 .box {
        display: grid;
        grid-template-columns: 672rem 1fr;
        grid-gap: 64rem;
        margin: 64rem 0 0 -64rem; } }
    #sutainability2 .box figure {
      margin-left: -16rem; }
      @media screen and (min-width: 768px), print {
        #sutainability2 .box figure {
          margin: 0; } }
    #sutainability2 .box h3 {
      border-radius: 2rem;
      color: #fff;
      height: 44rem;
      display: flex;
      align-items: center;
      padding: 0 16rem;
      line-height: 1;
      margin: -22rem 0 0;
      position: relative; }
      @media screen and (min-width: 768px), print {
        #sutainability2 .box h3 {
          height: 64rem;
          border-radius: 4rem;
          padding: 0 24rem;
          margin: 0; } }
      #sutainability2 .box h3 span {
        display: inline-block;
        font-weight: 400;
        border-left: 1px solid #fff;
        margin-left: 1em;
        padding-left: 1em; }
    #sutainability2 .box ul {
      margin: 0;
      padding: 0;
      list-style: none; }
      #sutainability2 .box ul li {
        margin: 0;
        padding: 0;
        border-bottom: 1px solid #B4B4B4;
        transition: border-color .5s; }
      #sutainability2 .box ul a {
        display: grid;
        grid-template-columns: 1fr 12rem;
        align-items: center;
        text-decoration: none;
        border-bottom: 1px solid transparent;
        padding: 15rem 0 15rem;
        font-weight: 700;
        transition: border-color .5s; }
    #sutainability2 .box .icon-arrow svg {
      stroke: #181A1E;
      stroke-width: 2; }
    #sutainability2 .box.environment h3 {
      background: url("../images/sustainability/environment_line.webp") no-repeat center center/cover; }
    @media screen and (min-width: 768px), print {
      #sutainability2 .box.environment li:hover {
        border-color: #37C086; }
      #sutainability2 .box.environment a:hover {
        border-color: #37C086; }
        #sutainability2 .box.environment a:hover .icon-arrow svg {
          stroke: #37C086; } }
    #sutainability2 .box.social h3 {
      background: url("../images/sustainability/social_line.webp") no-repeat center center/cover; }
    @media screen and (min-width: 768px), print {
      #sutainability2 .box.social li:hover {
        border-color: #0082E6; }
      #sutainability2 .box.social a:hover {
        border-color: #0082E6; }
        #sutainability2 .box.social a:hover .icon-arrow svg {
          stroke: #0082E6; } }
    #sutainability2 .box.governance h3 {
      background: url("../images/sustainability/governance_line.webp") no-repeat center center/cover; }
    @media screen and (min-width: 768px), print {
      #sutainability2 .box.governance li:hover {
        border-color: #FB9100; }
      #sutainability2 .box.governance a:hover {
        border-color: #FB9100; }
        #sutainability2 .box.governance a:hover .icon-arrow svg {
          stroke: #FB9100; } }

#sutainability3 ul {
  margin: 24rem 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  list-style: none;
  grid-gap: 8rem; }
  @media screen and (min-width: 768px), print {
    #sutainability3 ul {
      grid-gap: 16rem;
      grid-template-columns: repeat(4, 1fr);
      margin: 48rem 0; } }
  #sutainability3 ul li {
    border-radius: 4rem;
    background: #fff;
    height: 64rem;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: translateZ(0);
    filter: drop-shadow(0px 1rem 4rem rgba(0, 0, 0, 0.16)); }
    @media screen and (min-width: 768px), print {
      #sutainability3 ul li {
        filter: drop-shadow(0px 2rem 8rem rgba(0, 0, 0, 0.16));
        border-radius: 8rem;
        height: 100rem; } }
  #sutainability3 ul img {
    width: calc(var(--logo-width) * 0.3); }
    @media screen and (min-width: 768px), print {
      #sutainability3 ul img {
        width: calc(var(--logo-width) * 0.45); } }

#sutainability4 .grid {
  display: grid;
  grid-gap: 16rem; }
  @media screen and (min-width: 768px), print {
    #sutainability4 .grid {
      grid-template-columns: 340rem 1fr;
      margin-left: -64rem; } }
#sutainability4 .sustainability-news-title {
  background: #fff;
  border-radius: 8rem;
  text-align: center;
  padding: 24rem 0; }
  @media screen and (min-width: 768px), print {
    #sutainability4 .sustainability-news-title {
      border-radius: 0 16rem 16rem 0;
      padding: 40rem 58rem 0; } }
  #sutainability4 .sustainability-news-title h2 {
    font-size: 16rem;
    margin: 0; }
    @media screen and (min-width: 768px), print {
      #sutainability4 .sustainability-news-title h2 {
        font-size: 18rem;
        text-align: left; } }
  #sutainability4 .sustainability-news-title .btns {
    margin: 16rem 0 0; }
    @media screen and (min-width: 768px), print {
      #sutainability4 .sustainability-news-title .btns {
        margin: 48rem 0 0; } }
    @media screen and (min-width: 768px), print {
      #sutainability4 .sustainability-news-title .btns .btn {
        min-width: 1rem;
        width: 100%; } }
#sutainability4 ul.sustainability-news-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-gap: 16rem;
  grid-template-columns: repeat(2, 1fr); }
  @media screen and (min-width: 768px), print {
    #sutainability4 ul.sustainability-news-list {
      grid-template-columns: repeat(3, 1fr); } }
  #sutainability4 ul.sustainability-news-list li {
    margin: 0;
    padding: 8rem 0; }
    @media screen and (max-width: 767.98px) {
      #sutainability4 ul.sustainability-news-list li:nth-of-type(3) {
        display: none; } }
    #sutainability4 ul.sustainability-news-list li:nth-of-type(4) {
      display: none; }
  #sutainability4 ul.sustainability-news-list figure {
    overflow: hidden;
    border-radius: 4rem;
    transform: translateZ(0);
    filter: drop-shadow(0px 1rem 4rem rgba(0, 0, 0, 0.16)); }
    @media screen and (min-width: 768px), print {
      #sutainability4 ul.sustainability-news-list figure {
        border-radius: 8rem;
        filter: drop-shadow(0px 2rem 8rem rgba(0, 0, 0, 0.16)); } }
  @media screen and (min-width: 768px), print {
    #sutainability4 ul.sustainability-news-list a:hover img {
      transform: scale(1.05); } }
  #sutainability4 ul.sustainability-news-list .title {
    font-size: 13rem;
    font-weight: 900;
    margin-top: 8rem;
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2; }
    @media screen and (min-width: 768px), print {
      #sutainability4 ul.sustainability-news-list .title {
        font-size: 14rem; } }

@media screen and (min-width: 768px), print {
  #sutainability5 {
    margin-top: -20rem; } }

#sutainability5 {
  padding: 32rem 0 40rem;
  background: #fff; }
  @media screen and (min-width: 768px), print {
    #sutainability5 {
      padding: 48rem 0 64rem; } }
  #sutainability5 #sibling-pages {
    margin: 0; }

/*------------------------------------------*/
@media screen and (max-width: 767.98px) {
  #materiality-process .scrollable .scrollable-content {
    width: 220%;
    max-width: 220%; } }
#materiality-process .scrollable-content ol.steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 24rem;
  margin: 0;
  padding: 0;
  list-style: none;
  width: 100%;
  white-space: normal; }
  #materiality-process .scrollable-content ol.steps li {
    margin: 0;
    padding: 0; }
  #materiality-process .scrollable-content ol.steps h3 {
    text-align: center;
    font-size: 14rem; }
    @media screen and (min-width: 768px), print {
      #materiality-process .scrollable-content ol.steps h3 {
        font-size: 24rem; } }
  #materiality-process .scrollable-content ol.steps p {
    font-size: 13rem;
    line-height: 1.84; }
    @media screen and (min-width: 768px), print {
      #materiality-process .scrollable-content ol.steps p {
        font-size: 14rem; } }

#materiality-concept .grid {
  margin-top: 24rem;
  display: grid;
  grid-gap: 24rem; }
  @media screen and (min-width: 768px), print {
    #materiality-concept .grid {
      grid-template-columns: 584rem 1fr;
      grid-gap: 64rem;
      align-items: center; } }

@media screen and (max-width: 767.98px) {
  #materiality-identification .scrollable .scrollable-content {
    width: 180%;
    max-width: 180%; } }
@media screen and (min-width: 768px), print {
  #materiality-identification figure {
    text-align: center;
    margin-top: -16rem; }
    #materiality-identification figure img {
      width: 715rem; } }

#materiality-list .label {
  display: grid;
  grid-template-columns: 292rem 1fr 276rem;
  font-weight: 700;
  font-size: 18rem;
  margin: 0 0 -24rem; }
#materiality-list .box {
  margin-top: 32rem; }
  #materiality-list .box h3 {
    border-radius: 2rem;
    color: #fff;
    height: 44rem;
    display: flex;
    align-items: center;
    padding: 0 16rem;
    line-height: 1;
    margin: 0 0 16rem;
    position: relative; }
    @media screen and (min-width: 768px), print {
      #materiality-list .box h3 {
        height: 64rem;
        border-radius: 4rem;
        padding: 0 24rem;
        margin: 0 0 24rem; } }
    #materiality-list .box h3 span {
      display: inline-block;
      font-weight: 400;
      border-left: 1px solid #fff;
      margin-left: 1em;
      padding-left: 1em; }
  #materiality-list .box dl {
    margin: 0;
    padding: 0;
    font-size: 14rem; }
    #materiality-list .box dl > div {
      border-bottom: 1px solid #B4B4B4;
      margin: 0 0 16rem;
      padding: 0 0 16rem 16rem; }
      @media screen and (min-width: 768px), print {
        #materiality-list .box dl > div {
          display: grid;
          grid-template-columns: 292rem 1fr;
          position: relative; }
          #materiality-list .box dl > div::after {
            content: "";
            width: 292rem;
            height: 1px;
            position: absolute;
            bottom: -1px;
            left: 0;
            display: block; } }
      #materiality-list .box dl > div:last-child {
        margin: 0;
        border: none;
        padding-bottom: 0; }
        #materiality-list .box dl > div:last-child::after {
          display: none; }
    #materiality-list .box dl dt {
      margin: 0 0 8rem;
      padding: 0;
      line-height: 1.6; }
      @media screen and (max-width: 767.98px) {
        #materiality-list .box dl dt {
          margin: 0 0 8rem -16rem;
          font-size: 17rem; } }
      @media screen and (min-width: 768px), print {
        #materiality-list .box dl dt {
          font-size: 18rem; } }
      #materiality-list .box dl dt span {
        font-weight: 700;
        display: block;
        text-indent: -1.2em;
        padding: 0 0 0 1.2em; }
        #materiality-list .box dl dt span::before {
          content: "●";
          display: inline-block;
          text-indent: 0;
          width: 1.2em; }
    #materiality-list .box dl dd {
      margin: 0;
      padding: 0; }
      @media screen and (max-width: 767.98px) {
        #materiality-list .box dl dd::before {
          content: "主な活動内容";
          font-weight: 700;
          margin-left: -16rem;
          display: block; } }
      @media screen and (min-width: 768px), print {
        #materiality-list .box dl dd {
          display: grid;
          grid-template-columns: 1fr 276rem;
          grid-gap: 32rem; } }
    #materiality-list .box dl ul {
      margin: 0 0 8rem;
      padding: 0;
      font-size: 13rem;
      list-style: none; }
      @media screen and (min-width: 768px), print {
        #materiality-list .box dl ul {
          font-size: 16rem; } }
      #materiality-list .box dl ul li {
        margin: 0;
        padding: 0 0 0 1em;
        text-indent: -1em; }
        #materiality-list .box dl ul li::before {
          content: "・";
          display: inline-block;
          width: 1em;
          text-indent: 0; }
    @media screen and (max-width: 767.98px) {
      #materiality-list .box dl figure::before {
        content: "関連するSDGs";
        font-weight: 700;
        margin: 0 0 4rem -16rem;
        display: block; } }
    #materiality-list .box dl figure > span {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      grid-gap: 12rem; }
      @media screen and (min-width: 768px), print {
        #materiality-list .box dl figure > span {
          grid-gap: 12rem;
          display: flex;
          justify-content: flex-end; } }
      @media screen and (min-width: 768px), print {
        #materiality-list .box dl figure > span img {
          width: calc((100% - 24rem) / 3); } }
  #materiality-list .box.environment h3 {
    background: url("../images/sustainability/environment_line.webp") no-repeat center center/cover; }
  #materiality-list .box.environment dl > div::after {
    background: #37C086; }
  #materiality-list .box.environment dt span:before {
    color: #37C086; }
  #materiality-list .box.social h3 {
    background: url("../images/sustainability/social_line.webp") no-repeat center center/cover; }
  #materiality-list .box.social dl > div::after {
    background: #0082E6; }
  #materiality-list .box.social dt span:before {
    color: #0082E6; }
  #materiality-list .box.governance h3 {
    background: url("../images/sustainability/governance_line.webp") no-repeat center center/cover; }
  #materiality-list .box.governance dl > div::after {
    background: #FB9100; }
  #materiality-list .box.governance dt span:before {
    color: #FB9100; }
  #materiality-list .box.governance dl > div:last-child {
    border: none;
    padding-bottom: 0; }
    #materiality-list .box.governance dl > div:last-child::after {
      display: none; }

/*------------------------------------------*/
#wellbeing-workstyle .hw-small2,
#wellbeing-health .hw-small2 {
  margin-top: 40rem !important; }
  @media screen and (min-width: 768px), print {
    #wellbeing-workstyle .hw-small2,
    #wellbeing-health .hw-small2 {
      margin-top: 64rem !important; } }
@media screen and (max-width: 767.98px) {
  #wellbeing-workstyle .scrollable .scrollable-content,
  #wellbeing-health .scrollable .scrollable-content {
    width: 660rem;
    max-width: 660rem; } }
@media screen and (min-width: 768px), print {
  #wellbeing-workstyle .scrollable,
  #wellbeing-health .scrollable {
    margin-top: 32rem; } }

#wellbeing-health .wellbeing-goal {
  margin-top: 38rem; }
  @media screen and (min-width: 768px), print {
    #wellbeing-health .wellbeing-goal {
      margin-top: 46rem; } }
#wellbeing-health .declaration {
  border-radius: 8rem;
  background: rgba(0, 130, 230, 0.05);
  border: 1px solid #0082e6;
  padding: 16rem;
  margin: 24rem 0 32rem; }
  @media screen and (min-width: 768px), print {
    #wellbeing-health .declaration {
      margin: 32rem 0 48rem;
      padding: 32rem 73rem;
      border-radius: 16rem; } }
  #wellbeing-health .declaration h3 {
    margin-top: 0 !important; }
@media screen and (min-width: 768px), print {
  #wellbeing-health ul.wellbeing-case {
    grid-template-columns: repeat(2, 1fr); } }
#wellbeing-health .btns {
  justify-content: flex-start; }

#wellbeing-workstyle .grid {
  display: grid;
  grid-gap: 16rem; }
  @media screen and (min-width: 768px), print {
    #wellbeing-workstyle .grid {
      grid-template-columns: 1fr 441rem;
      grid-gap: 64rem; }
      #wellbeing-workstyle .grid figure {
        margin-top: 64rem; } }
@media screen and (min-width: 768px), print {
  #wellbeing-workstyle ul.note {
    display: table;
    margin: 0 127rem 32rem auto; } }

.wellbeing-goal {
  border-radius: 4rem;
  background: #fff;
  border: 1px solid rgba(185, 35, 41, 0.6);
  box-shadow: 0px 1rem 4rem rgba(185, 35, 41, 0.2);
  text-align: center;
  padding: 8rem; }
  @media screen and (min-width: 768px), print {
    .wellbeing-goal {
      border-radius: 8rem;
      box-shadow: 0px 2rem 8rem rgba(185, 35, 41, 0.2); } }
  .wellbeing-goal strong {
    font-size: 14rem;
    font-weight: 400;
    display: block;
    margin: 0 0 8rem; }
    @media screen and (min-width: 768px), print {
      .wellbeing-goal strong {
        font-size: 20rem; } }
    .wellbeing-goal strong small {
      font-size: 8rem;
      display: block; }
      @media screen and (min-width: 768px), print {
        .wellbeing-goal strong small {
          font-size: 14rem; } }
  .wellbeing-goal dl {
    margin: 0;
    padding: 0;
    display: grid;
    grid-gap: 8rem; }
    .wellbeing-goal dl dt {
      background: #7B292F;
      color: #fff;
      font-weight: 900;
      margin: 0;
      padding: 6rem 0;
      margin: 0 0 4rem;
      font-size: 9rem;
      line-height: 1.2;
      border-radius: 4rem; }
      @media screen and (min-width: 768px), print {
        .wellbeing-goal dl dt {
          font-size: 14rem;
          border-radius: 8rem;
          padding: 10rem 0; } }
    .wellbeing-goal dl dd {
      margin: 0;
      padding: 0;
      font-weight: 700;
      font-size: 18rem;
      line-height: 1.2; }
      @media screen and (min-width: 768px), print {
        .wellbeing-goal dl dd {
          font-size: 26rem; } }

ul.wellbeing-case {
  display: grid;
  grid-gap: 24rem;
  margin: 32rem 0 0;
  padding: 0;
  list-style: none; }
  @media screen and (min-width: 768px), print {
    ul.wellbeing-case {
      grid-gap: 32rem 24rem;
      margin: 64rem 0 16rem; } }
  ul.wellbeing-case li {
    margin: 0;
    transform: translateZ(0);
    filter: drop-shadow(0px 1rem 6rem rgba(0, 0, 0, 0.16));
    padding: 24rem 24rem;
    background: #fff;
    border-radius: 8rem;
    position: relative; }
    @media screen and (min-width: 768px), print {
      ul.wellbeing-case li {
        filter: drop-shadow(0px 2rem 6rem rgba(0, 0, 0, 0.16));
        border-radius: 16rem;
        padding: 32rem; } }
  ul.wellbeing-case i {
    position: absolute;
    top: -8rem;
    left: 8rem;
    width: 50rem; }
    @media screen and (min-width: 768px), print {
      ul.wellbeing-case i {
        width: 60rem;
        top: -16rem;
        left: 16rem; } }
  ul.wellbeing-case h4 {
    text-align: center;
    font-size: 16rem;
    margin: 0;
    height: 2.5em;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; }
    @media screen and (min-width: 768px), print {
      ul.wellbeing-case h4 {
        font-size: 20rem; } }
    ul.wellbeing-case h4 small {
      font-size: 12rem;
      display: block; }
      @media screen and (min-width: 768px), print {
        ul.wellbeing-case h4 small {
          font-size: 14rem; } }

/*------------------------------------------*/
#purpose {
  background: url("../images/philosophy/purpose_bg_sp.webp") no-repeat center bottom/cover;
  margin: -32rem 0 0 !important;
  padding: 48rem 24rem 64rem; }
  @media screen and (min-width: 768px), print {
    #purpose {
      background-image: url("../images/philosophy/purpose_bg_pc.webp");
      margin-top: -72rem !important;
      padding: 72rem 0 200rem; } }
  #purpose .grid {
    display: grid;
    grid-gap: 24rem;
    margin: 32rem 0 0; }
    @media screen and (min-width: 768px), print {
      #purpose .grid {
        grid-template-columns: 359rem 1fr;
        grid-gap: 32rem;
        font-size: 20rem;
        margin: 100rem 0 0 40rem; } }
    #purpose .grid h3 {
      margin: 0 0 32rem; }
      @media screen and (max-width: 767.98px) {
        #purpose .grid h3 {
          margin: 0 auto;
          width: 180rem; } }
    @media screen and (min-width: 768px), print {
      #purpose .grid .text {
        margin-top: 70rem; } }

#philosophy {
  background: url("../images/philosophy/philosophy_bg_sp.webp") no-repeat center bottom/cover;
  margin: 0 0 -44rem !important;
  padding: 32rem 24rem 64rem; }
  @media screen and (min-width: 768px), print {
    #philosophy {
      background-image: url("../images/philosophy/philosophy_bg_pc.webp");
      padding: 100rem 0 100rem;
      margin: 0 0 -88rem !important; } }
  #philosophy h3 {
    margin: 32rem 0;
    text-align: center; }
    @media screen and (min-width: 768px), print {
      #philosophy h3 {
        margin: 72rem auto;
        width: 873rem; } }
  #philosophy dl {
    display: grid;
    grid-gap: 24rem; }
    @media screen and (min-width: 768px), print {
      #philosophy dl {
        display: table;
        margin: -32rem auto 0; } }
    #philosophy dl > div {
      text-align: center; }
      @media screen and (min-width: 768px), print {
        #philosophy dl > div {
          display: table-row;
          align-items: center;
          text-align: left; } }
    #philosophy dl dt {
      font-family: "Inter", sans-serif;
      overflow: hidden;
      color: #7B292F;
      font-size: 22rem;
      font-weight: 700;
      margin: 0;
      padding: 0; }
      @media screen and (min-width: 768px), print {
        #philosophy dl dt {
          display: table-cell;
          padding-right: 100rem;
          padding-top: 32rem;
          font-size: 36rem;
          vertical-align: middle; } }
      #philosophy dl dt span {
        display: inline-block;
        position: relative; }
        @media screen and (max-width: 767.98px) {
          #philosophy dl dt span::before {
            content: "";
            width: 200rem;
            height: 1px;
            background: #7B292F;
            position: absolute;
            top: 50%;
            right: calc(100% + 16rem); } }
        #philosophy dl dt span::after {
          content: "";
          width: 200rem;
          height: 1px;
          background: #7B292F;
          position: absolute;
          top: 50%;
          left: calc(100% + 16rem); }
    #philosophy dl dd {
      margin: 0;
      padding: 0;
      font-weight: 700; }
      @media screen and (min-width: 768px), print {
        #philosophy dl dd {
          font-size: 24rem;
          display: table-cell;
          padding-top: 32rem;
          padding-left: 16rem;
          vertical-align: middle; } }

#motto h3 {
  margin: 32rem 0;
  text-align: center; }
  @media screen and (min-width: 768px), print {
    #motto h3 {
      margin: 72rem 0; } }
  #motto h3 img {
    height: 32rem; }
    @media screen and (min-width: 768px), print {
      #motto h3 img {
        height: 54rem; } }

/*------------------------------------------*/
.business-cases {
  margin: 32rem 0 0;
  padding: 0;
  list-style: none; }
  @media screen and (min-width: 768px), print {
    .business-cases {
      margin-top: 48rem; } }
  .business-cases .box {
    margin: 0 0 24rem;
    padding: 0 0 24rem;
    border-bottom: 1px solid #C7CAD1; }
    @media screen and (min-width: 768px), print {
      .business-cases .box {
        display: grid;
        grid-template-columns: 1fr 490rem;
        grid-gap: 48rem;
        padding: 0 73rem 32rem;
        margin: 0 0 32rem; } }
    .business-cases .box:last-child {
      margin-bottom: 0;
      padding-bottom: 0;
      border: none; }
    .business-cases .box .text {
      margin: 0 0 16rem; }
      @media screen and (min-width: 768px), print {
        .business-cases .box .text {
          display: flex;
          flex-direction: column;
          grid-gap: 20rem;
          margin: 0; } }
    .business-cases .box h3 {
      font-size: 16rem;
      margin: 0;
      display: inline-block;
      vertical-align: top;
      margin: 0 24rem 0 0; }
      @media screen and (min-width: 768px), print {
        .business-cases .box h3 {
          font-size: 24rem;
          margin: 0;
          display: block; } }
      .business-cases .box h3 + em {
        display: inline-block;
        vertical-align: top;
        color: #7B292F; }
        .business-cases .box h3 + em small {
          display: block; }
    @media screen and (min-width: 768px), print {
      .business-cases .box p {
        margin: 0; } }
    .business-cases .box .btns {
      justify-content: flex-start;
      margin-top: auto; }
      .business-cases .box .btns .btn {
        font-size: 13rem; }

/*------------------------------------------*/
@media screen and (max-width: 767.98px) {
  #renewable-energy-feature [data-scrollbar="#bar1"] .scrollable-content {
    width: 250%;
    max-width: 250%; }
  #renewable-energy-feature [data-scrollbar="#bar3"] .scrollable-content {
    padding: 16rem;
    width: 190%;
    max-width: 190%; }
  #renewable-energy-feature [data-scrollbar="#bar2"],
  #renewable-energy-feature [data-scrollbar="#bar4"] {
    margin-top: 0; }
    #renewable-energy-feature [data-scrollbar="#bar2"] .scrollable-content,
    #renewable-energy-feature [data-scrollbar="#bar4"] .scrollable-content {
      width: 175%;
      max-width: 175%; } }
@media screen and (min-width: 768px), print {
  #renewable-energy-feature [data-scrollbar="#bar2"],
  #renewable-energy-feature [data-scrollbar="#bar4"] {
    margin-top: 32rem; } }

/*------------------------------------------*/
#heavy-equipment {
  text-align: center;
  margin: 48rem 0 0; }
  @media screen and (min-width: 768px), print {
    #heavy-equipment {
      background: rgba(24, 26, 30, 0.04);
      padding: 48rem 64rem;
      border-radius: 8rem;
      margin: 64rem 0 0; } }
  #heavy-equipment h4 {
    font-size: 17rem;
    margin: 0 0 16rem; }
    @media screen and (min-width: 768px), print {
      #heavy-equipment h4 {
        font-size: 24rem;
        margin: 0  0 24rem; } }
  #heavy-equipment p {
    color: #7B292F;
    margin: 0;
    font-size: 15rem; }
    @media screen and (min-width: 768px), print {
      #heavy-equipment p {
        font-size: 20rem; } }

/*------------------------------------------*/
#technician-education .gray-frame {
  font-size: 16rem; }
  @media screen and (min-width: 768px), print {
    #technician-education .gray-frame {
      font-size: 18rem;
      padding: 48rem 100rem; }
      #technician-education .gray-frame > div {
        display: table;
        margin: 0 auto; } }
  #technician-education .gray-frame strong {
    display: block; }

/*------------------------------------------*/
#human-resources-recruit .common-table {
  width: 100%; }
  @media screen and (min-width: 768px), print {
    #human-resources-recruit .common-table {
      table-layout: fixed; } }

dl.human-resources-example {
  display: grid;
  grid-gap: 16rem; }
  @media screen and (min-width: 768px), print {
    dl.human-resources-example {
      display: flex;
      align-items: stretch; } }
  dl.human-resources-example > div {
    background: #fff;
    border-radius: 8rem;
    padding: 20rem;
    width: 100%; }
    @media screen and (min-width: 768px), print {
      dl.human-resources-example > div {
        border-radius: 16rem; } }
  dl.human-resources-example dt {
    display: flex;
    grid-gap: 12rem;
    font-weight: 700;
    color: #7B292F;
    align-items: center;
    font-size: 14rem;
    line-height: 1.3;
    margin: 0 0 8rem;
    padding: 0; }
    @media screen and (min-width: 768px), print {
      dl.human-resources-example dt {
        font-size: 24rem;
        grid-gap: 16rem;
        margin: 0 0 16rem; } }
    dl.human-resources-example dt i {
      flex-shrink: 0; }
      dl.human-resources-example dt i img {
        height: 45rem;
        width: auto; }
        @media screen and (max-width: 767.98px) {
          dl.human-resources-example dt i img {
            object-fit: contain; } }
        @media screen and (min-width: 768px), print {
          dl.human-resources-example dt i img {
            height: 54rem;
            width: auto !important; } }
    dl.human-resources-example dt small {
      display: block;
      font-weight: 500;
      font-size: 12rem; }
      @media screen and (min-width: 768px), print {
        dl.human-resources-example dt small {
          font-size: 16rem; } }
  dl.human-resources-example dd {
    margin: 0;
    padding: 0; }

/*------------------------------------------*/
@media screen and (min-width: 768px), print {
  #tcfd {
    margin: 48rem 0 48rem; } }
#tcfd figure {
  border-radius: 16rem;
  border: 1px solid #1CA9D0;
  background: #fff;
  padding: 32rem 16rem 24rem; }
  @media screen and (min-width: 768px), print {
    #tcfd figure {
      background: none;
      padding: 32rem 32rem 32rem 64rem;
      display: grid;
      align-items: center; } }
  @media screen and (min-width: 768px) and (min-width: 768px), print {
    #tcfd figure {
      grid-template-columns: 380rem 1fr;
      grid-gap: 64rem; } }

  #tcfd figure .logo {
    width: 271rem;
    margin: 0 auto 32rem; }
    @media screen and (min-width: 768px), print {
      #tcfd figure .logo {
        width: auto;
        margin: 0; } }
  @media screen and (min-width: 768px), print {
    #tcfd figure .note {
      font-size: 14rem; } }
  #tcfd figure .citation {
    display: table;
    margin: 8rem 0 0 auto; }
    @media screen and (min-width: 768px), print {
      #tcfd figure .citation {
        font-size: 14rem; } }
    #tcfd figure .citation a {
      color: #0082E6; }

@media screen and (max-width: 767.98px) {
  #tcfd-governance .scrollable-content {
    width: 170%;
    max-width: 170%; } }

@media screen and (max-width: 767.98px) {
  #tcfd-strategy .scrollable-content {
    width: 255%;
    max-width: 255%; }
    #tcfd-strategy .scrollable-content:has(table) {
      width: 820rem;
      max-width: 820rem; } }
#tcfd-strategy .scenario-toggle {
  position: relative; }
  #tcfd-strategy .scenario-toggle .scenario-on {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    transition: opacity .5s; }
    #tcfd-strategy .scenario-toggle .scenario-on.active {
      opacity: 1; }
#tcfd-strategy .scenario-toggle-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  grid-gap: 5rem; }
  @media screen and (min-width: 768px), print {
    #tcfd-strategy .scenario-toggle-btn {
      grid-gap: 8rem; } }
  #tcfd-strategy .scenario-toggle-btn > div {
    display: grid;
    grid-template-columns: 23rem 40rem;
    grid-gap: 16rem;
    align-items: center; }
    @media screen and (min-width: 768px), print {
      #tcfd-strategy .scenario-toggle-btn > div {
        grid-gap: 24rem;
        grid-template-columns: 46rem 40rem; } }
    #tcfd-strategy .scenario-toggle-btn > div.active span {
      background: #0082E6;
      height: 3rem; }
  #tcfd-strategy .scenario-toggle-btn .off {
    transform: scaleX(-1); }
  #tcfd-strategy .scenario-toggle-btn span {
    height: 1rem;
    width: 23rem;
    background: #C7CAD1;
    display: block;
    border-radius: 100rem; }
    @media screen and (min-width: 768px), print {
      #tcfd-strategy .scenario-toggle-btn span {
        width: 46rem; } }
  #tcfd-strategy .scenario-toggle-btn .icon-arrow {
    cursor: pointer;
    border: 1px solid #0082E6;
    border-radius: 100rem;
    aspect-ratio: 1;
    background: #fff;
    transition: background .5s;
    box-sizing: border-box;
    box-shadow: 0 1rem 4rem rgba(0, 0, 0, 0.16); }
    #tcfd-strategy .scenario-toggle-btn .icon-arrow svg {
      stroke: #0082E6;
      left: 50%;
      width: 50%;
      transform: translateX(-50%); }
    @media screen and (min-width: 768px), print {
      #tcfd-strategy .scenario-toggle-btn .icon-arrow:hover {
        background: #0082E6; }
        #tcfd-strategy .scenario-toggle-btn .icon-arrow:hover svg {
          stroke: #fff; } }
#tcfd-strategy table {
  border: 1px solid #ccc;
  width: 100%;
  border-collapse: collapse;
  white-space: normal; }
  #tcfd-strategy table th {
    background: #F7F7F7;
    border: 1px solid #ccc;
    color: #7B292F;
    padding: 4rem 0;
    font-weight: 400;
    text-align: center; }
  #tcfd-strategy table td {
    border: 1px solid #ccc;
    padding: 6rem 8rem; }
    @media screen and (min-width: 768px), print {
      #tcfd-strategy table td {
        padding: 8rem 12rem; } }
  #tcfd-strategy table .tate span {
    writing-mode: vertical-rl;
    line-height: 1.3;
    display: inline-block;
    white-space: pre; }
@media screen and (min-width: 768px), print {
  #tcfd-strategy #table-opportunities {
    margin-bottom: 0; } }
@media screen and (min-width: 768px), print {
  #tcfd-strategy #table-risk {
    margin-top: -1px; } }
#tcfd-strategy .table-note {
  text-align: right;
  font-size: 10rem; }
  @media screen and (min-width: 768px), print {
    #tcfd-strategy .table-note {
      font-size: 14rem; } }

@media screen and (max-width: 767.98px) {
  #tcfd-metrics .scrollable-content {
    width: 170%;
    max-width: 170%; } }
#tcfd-metrics .metrics {
  text-align: center; }
  @media screen and (min-width: 768px), print {
    #tcfd-metrics .metrics img {
      max-width: 500rem; } }
#tcfd-metrics h4 {
  color: #fff;
  display: flex;
  justify-content: space-between;
  padding: 0 16rem;
  align-items: center;
  background: no-repeat left center / cover;
  height: 42rem;
  border-radius: 4rem;
  font-size: 14rem;
  margin-bottom: 0; }
  @media screen and (min-width: 768px), print {
    #tcfd-metrics h4 {
      padding: 0 20rem;
      height: 65rem;
      border-radius: 8rem;
      font-size: 18rem; } }
  #tcfd-metrics h4 .unit {
    font-size: 10rem;
    font-weight: 400; }
    @media screen and (min-width: 768px), print {
      #tcfd-metrics h4 .unit {
        font-size: 14rem; } }
#tcfd-metrics table {
  border-collapse: collapse;
  border: 0;
  line-height: 1.6;
  font-size: 11rem;
  text-align: center;
  width: 100%;
  table-layout: fixed; }
  @media screen and (min-width: 768px), print {
    #tcfd-metrics table {
      font-size: 16rem; } }
  #tcfd-metrics table th, #tcfd-metrics table td {
    border-bottom: 1px solid #CCCCCC;
    padding: 16rem 10rem; }
    @media screen and (min-width: 768px), print {
      #tcfd-metrics table th, #tcfd-metrics table td {
        padding: 24rem 10rem; } }
  #tcfd-metrics table thead th {
    font-weight: bold; }
  #tcfd-metrics table tbody th {
    font-weight: 400; }
#tcfd-metrics .note2 {
  margin-top: -8rem;
  font-size: 10rem; }
  @media screen and (min-width: 768px), print {
    #tcfd-metrics .note2 {
      font-size: 14rem; } }
#tcfd-metrics .goals h4 {
  background-image: url("../images/tcfd/h4bg1.webp"); }
#tcfd-metrics .goals table td {
  padding: 8rem 10rem; }
  @media screen and (min-width: 768px), print {
    #tcfd-metrics .goals table td {
      padding: 20rem 10rem; } }
#tcfd-metrics .results h4 {
  background-image: url("../images/tcfd/h4bg2.webp"); }
#tcfd-metrics .results table th:first-child {
  background: #f7f7f7; }
#tcfd-metrics .results table tr.total th {
  background: #F8F0C6; }
#tcfd-metrics .results table tr.total td {
  background: #FEF6CC; }

/*------------------------------------------*/
#strategy .direction h3 {
  text-align: center;
  background: rgba(251, 208, 0, 0.6);
  border-radius: 4rem;
  font-size: 14rem;
  line-height: 2.5;
  margin-top: 24rem; }
  @media screen and (min-width: 768px), print {
    #strategy .direction h3 {
      border-radius: 8rem;
      font-size: 20rem;
      margin-top: 32rem; } }
#strategy .direction img {
  display: grid;
  margin: 8rem auto 16rem;
  width: 82rem; }
  @media screen and (min-width: 768px), print {
    #strategy .direction img {
      width: 100rem;
      margin: 8rem auto 24rem; } }
#strategy .direction p {
  text-align: center;
  font-weight: 900;
  font-size: 16rem;
  margin: 0; }
  @media screen and (min-width: 768px), print {
    #strategy .direction p {
      font-size: 24rem; } }
#strategy .direction ul {
  margin: 0 auto;
  padding: 0;
  list-style: none;
  display: table;
  font-size: 14rem; }
  @media screen and (min-width: 768px), print {
    #strategy .direction ul {
      font-size: 20rem; } }
  #strategy .direction ul li {
    margin: 0;
    padding: 0 0 0 1em;
    text-indent: -1em; }
    #strategy .direction ul li::before {
      content: "●"; }

/*------------------------------------------*/
#search-results .result-message {
  font-weight: 700; }
#search-results ul.search-results-list {
  margin: 24rem 0;
  padding: 0;
  border-top: 1px solid #ccc;
  list-style: none; }
  #search-results ul.search-results-list li {
    margin: 0;
    padding: 0;
    border-bottom: 1px solid #ccc; }
  #search-results ul.search-results-list a {
    display: block;
    text-decoration: none;
    padding: 16rem 0; }
    @media screen and (min-width: 768px), print {
      #search-results ul.search-results-list a {
        padding: 24rem 0; } }
    #search-results ul.search-results-list a h2 {
      font-size: 13rem;
      margin: 0; }
      @media screen and (min-width: 768px), print {
        #search-results ul.search-results-list a h2 {
          font-size: 16rem; } }
    #search-results ul.search-results-list a p {
      margin: 8rem 0;
      font-size: 12rem; }
      @media screen and (min-width: 768px), print {
        #search-results ul.search-results-list a p {
          font-size: 14rem; } }
    #search-results ul.search-results-list a .url {
      font-size: 12rem;
      text-decoration-line: underline;
      text-decoration-color: transparent;
      text-decoration-style: solid;
      text-decoration-thickness: 1px;
      text-underline-offset: 0.3em;
      transition: text-decoration .5s;
      overflow-wrap: anywhere;
      color: #0082E6; }
      @media screen and (min-width: 768px), print {
        #search-results ul.search-results-list a .url {
          font-size: 14rem; } }
    @media screen and (min-width: 768px), print {
      #search-results ul.search-results-list a:hover .url {
        text-decoration-color: currentColor; } }

/*------------------------------------------*/
@media screen and (min-width: 768px), print {
  #vision .hw-medium {
    margin-top: 32rem; } }

/*------------------------------------------*/
#gaisen-kaku hr {
  margin-top: 16rem; }
@media screen and (max-width: 767.98px) {
  #gaisen-kaku table thead th:nth-of-type(1) {
    width: 35%; }
  #gaisen-kaku table thead th:nth-of-type(2) {
    width: 45%; }
  #gaisen-kaku table thead th:nth-of-type(3) {
    width: 20%; } }
@media screen and (min-width: 768px), print {
  #gaisen-kaku table thead th:nth-of-type(1) {
    width: 25%; }
  #gaisen-kaku table thead th:nth-of-type(2) {
    width: 60%; }
  #gaisen-kaku table thead th:nth-of-type(3) {
    width: 15%; } }
#gaisen-kaku .photos {
  display: grid;
  grid-gap: 8rem; }
  @media screen and (min-width: 768px), print {
    #gaisen-kaku .photos {
      grid-template-columns: repeat(2, 1fr);
      margin: 24rem 0 0; } }

/*------------------------------------------*/
#diversity .anchor {
  margin: 0 32rem; }
  @media screen and (min-width: 768px), print {
    #diversity .anchor {
      margin: 0 auto; } }
  #diversity .anchor + .anchor {
    border-top: 1px solid #ccc;
    max-width: 790rem;
    margin: 16rem 32rem 0;
    padding: 16rem 0 0; }
    @media screen and (min-width: 768px), print {
      #diversity .anchor + .anchor {
        margin: 24rem auto 0;
        padding: 24rem 0 0; } }
  #diversity .anchor ul {
    margin: 0; }

#diversity-case .eruboshi {
  display: grid; }
  @media screen and (min-width: 768px), print {
    #diversity-case .eruboshi {
      grid-template-columns: 1fr 177rem;
      grid-gap: 64rem; } }
  #diversity-case .eruboshi figure {
    text-align: center; }
    #diversity-case .eruboshi figure img {
      width: 152rem; }
      @media screen and (min-width: 768px), print {
        #diversity-case .eruboshi figure img {
          width: 157rem;
          margin-top: -20rem;
          display: block; } }
#diversity-case .grid {
  display: grid;
  grid-gap: 16rem; }
  @media screen and (min-width: 768px), print {
    #diversity-case .grid {
      grid-template-columns: 1fr 495rem;
      grid-gap: 48rem; } }
#diversity-case ol.diversity-case {
  margin: 16rem 0 0;
  padding: 0;
  list-style: none; }
  @media screen and (min-width: 768px), print {
    #diversity-case ol.diversity-case {
      margin: 23rem 0 0; } }
  #diversity-case ol.diversity-case li {
    margin: 0 0 24rem;
    padding: 0 0 24rem;
    border-bottom: 1px solid #ccc;
    display: grid;
    grid-gap: 16rem; }
    @media screen and (min-width: 768px), print {
      #diversity-case ol.diversity-case li {
        grid-template-columns: 1fr 381rem;
        grid-gap: 48rem;
        margin: 0 0 32rem;
        padding: 0 0 32rem;
        align-items: center; } }
    #diversity-case ol.diversity-case li:last-child {
      margin: 0;
      padding: 0;
      border: none; }
  #diversity-case ol.diversity-case h5 {
    font-size: 16rem;
    display: grid;
    grid-template-columns: 4em 1fr;
    grid-gap: 8rem;
    align-items: flex-start;
    margin: 0; }
    #diversity-case ol.diversity-case h5 span {
      background: #fff;
      display: block;
      text-align: center;
      font-weight: 400;
      font-size: 90%;
      line-height: 1.8; }
@media screen and (min-width: 768px), print {
  #diversity-case .sub h3 {
    margin-bottom: 24rem; } }

@media screen and (min-width: 768px), print {
  #diversity-nursing .grid {
    margin-right: -72rem;
    grid-template-columns: 1fr 462rem; } }

#diversity-global table {
  width: 100%; }

/*------------------------------------------*/
.activity_box .activity_logos {
  display: block;
  margin: 24rem 0 -16rem; }
.activity_box h3 img {
  display: inline-block;
  vertical-align: baseline;
  transform: translateY(5%); }
.activity_box .frame {
  box-shadow: 0px 1rem 6rem rgba(0, 0, 0, 0.16);
  border-radius: 4rem;
  overflow: hidden;
  padding: 0 16rem 16rem;
  margin: 16rem 0 0; }
  @media screen and (min-width: 768px), print {
    .activity_box .frame {
      box-shadow: 0px 2rem 12rem rgba(0, 0, 0, 0.16);
      border-radius: 8rem;
      padding: 0 32rem 32rem;
      margin: 24rem 0 0; } }
  .activity_box .frame h4 {
    background: #7B292F;
    color: #fff;
    margin: 0 -16rem 16rem;
    padding: 8rem;
    text-align: center;
    font-size: 15rem; }
    @media screen and (min-width: 768px), print {
      .activity_box .frame h4 {
        font-size: 20rem;
        margin: 0 -32rem 32rem;
        padding: 10rem; } }
  .activity_box .frame ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-gap: 16rem; }
    @media screen and (min-width: 768px), print {
      .activity_box .frame ul {
        grid-template-columns: repeat(3, 1fr);
        text-align: center; } }
    .activity_box .frame ul li {
      display: grid;
      grid-template-columns: 80rem 1fr;
      grid-gap: 16rem;
      align-items: center; }
      @media screen and (min-width: 768px), print {
        .activity_box .frame ul li {
          display: block;
          font-size: 14rem; } }
      @media screen and (min-width: 768px), print {
        .activity_box .frame ul li figure {
          width: 144rem;
          margin: 0 auto 16rem; } }
      .activity_box .frame ul li p {
        margin: 0; }
        @media screen and (min-width: 768px), print {
          .activity_box .frame ul li p {
            text-align: center; } }
.activity_box .arrow {
  width: 100rem;
  margin: 16rem auto; }
  @media screen and (min-width: 768px), print {
    .activity_box .arrow {
      margin: 24rem auto 32rem; } }
.activity_box .goal {
  text-align: center;
  background: rgba(24, 26, 30, 0.04);
  color: #7B292F;
  font-weight: 900;
  border-radius: 100rem;
  padding: 16rem 24rem;
  font-size: 16rem; }
  @media screen and (min-width: 768px), print {
    .activity_box .goal {
      font-size: 24rem; } }
.activity_box .btns {
  margin: 16rem 0 0;
  display: block; }
  @media screen and (min-width: 768px), print {
    .activity_box .btns {
      margin: 32rem 0 0; } }
  .activity_box .btns p {
    margin: 0;
    color: #0082E6;
    text-align: center; }

#activity4 h3 img {
  width: 120rem; }
  @media screen and (min-width: 768px), print {
    #activity4 h3 img {
      width: 154rem; } }

@media screen and (min-width: 768px), print {
  #activity5 h3 {
    letter-spacing: 0.05em; } }
#activity5 h3 img {
  width: 95rem; }
  @media screen and (min-width: 768px), print {
    #activity5 h3 img {
      width: 145rem; } }

/*------------------------------------------*/
#history .history-anchor {
  margin: 0 0 32rem; }
  @media screen and (min-width: 768px), print {
    #history .history-anchor {
      margin: 0 0 64rem; } }
  #history .history-anchor ul {
    margin: 0;
    padding: 0 8rem;
    list-style: none;
    display: grid;
    grid-gap: 8rem; }
    @media screen and (min-width: 768px), print {
      #history .history-anchor ul {
        grid-template-columns: repeat(5, 1fr);
        grid-gap: 16rem; } }
    #history .history-anchor ul li {
      margin: 0;
      padding: 0; }
  #history .history-anchor a {
    display: grid;
    background: #fff;
    border: 1px solid #fff;
    box-shadow: 0 2rem 8rem rgba(0, 0, 0, 0.1), 0 2rem 8rem inset rgba(0, 0, 0, 0.05);
    border-radius: 4rem;
    grid-template-columns: 130rem 1fr 12rem;
    align-items: center;
    font-weight: 900;
    height: 56rem;
    padding: 0 16rem; }
    @media screen and (min-width: 768px), print {
      #history .history-anchor a {
        height: 140rem;
        grid-template-columns: 1fr;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        text-align: center;
        font-size: 20rem;
        padding: 0; }
        #history .history-anchor a:hover {
          text-decoration: none; } }
    #history .history-anchor a .year {
      font-family: "Inter", sans-serif;
      color: #B92329;
      letter-spacing: 0;
      font-size: 20rem;
      transform: translateY(4%); }
      @media screen and (min-width: 768px), print {
        #history .history-anchor a .year {
          font-size: 32rem;
          line-height: 1;
          margin: 0 0 16rem; } }
    #history .history-anchor a i {
      line-height: 1px; }
      @media screen and (min-width: 768px), print {
        #history .history-anchor a i {
          margin-top: 10rem; } }
      #history .history-anchor a i svg {
        width: 12rem;
        aspect-ratio: 2/1;
        stroke: #0082E6; }
        @media screen and (min-width: 768px), print {
          #history .history-anchor a i svg {
            width: 14rem; } }
#history .history-section {
  position: relative;
  padding: 0 0 32rem 30rem; }
  @media screen and (min-width: 768px), print {
    #history .history-section {
      padding: 0 0 80rem 64rem;
      display: grid;
      grid-template-columns: 1fr 576rem;
      grid-gap: 64rem;
      align-items: flex-start; } }
  #history .history-section::before {
    content: "";
    position: absolute;
    inset: 20rem 0 -20rem 9rem;
    pointer-events: none;
    border-radius: inherit;
    background: repeating-linear-gradient(0deg, transparent 0 2px, #B92329 0 4px) left/2rem auto repeat-y; }
    @media screen and (min-width: 768px), print {
      #history .history-section::before {
        inset: 40rem 0 -64rem 25rem; } }
#history h2 {
  position: relative;
  margin: 0;
  font-size: 32rem;
  font-family: "Inter", sans-serif;
  letter-spacing: 0;
  color: #B92329; }
  @media screen and (min-width: 768px), print {
    #history h2 {
      font-size: 64rem; } }
  #history h2::before {
    content: "";
    width: 10rem;
    aspect-ratio: 1;
    display: block;
    background: #7B292F;
    border: 1rem solid #fff;
    border-radius: 100rem;
    position: absolute;
    top: 50%;
    left: -25rem;
    transform: translateY(-50%);
    box-sizing: border-box;
    box-shadow: 0 0 0 5rem #B92329; }
    @media screen and (min-width: 768px), print {
      #history h2::before {
        left: -45rem;
        width: 14rem;
        border-width: 2rem;
        box-shadow: 0 0 0 10rem #B92329; } }
#history h3 {
  font-size: 19rem;
  margin: 0; }
  @media screen and (min-width: 768px), print {
    #history h3 {
      font-size: 24rem;
      line-height: 2; } }
#history h4 {
  position: relative;
  margin: 16rem 0 0;
  font-size: 16rem;
  letter-spacing: 0;
  color: #7B292F; }
  @media screen and (min-width: 768px), print {
    #history h4 {
      font-size: 18rem;
      margin: 24rem 0 8rem; } }
  #history h4::before {
    content: "";
    width: 10rem;
    aspect-ratio: 1;
    display: block;
    background: #7B292F;
    border: 1rem solid #fff;
    border-radius: 100rem;
    position: absolute;
    top: 50%;
    left: -25rem;
    transform: translateY(-50%);
    box-sizing: border-box; }
    @media screen and (min-width: 768px), print {
      #history h4::before {
        left: -45rem;
        width: 14rem;
        border-width: 2rem; } }
  #history h4::after {
    content: "";
    width: 8rem;
    height: 1px;
    position: absolute;
    top: 50%;
    left: -13rem;
    background: #7A7E86;
    display: block; }
    @media screen and (min-width: 768px), print {
      #history h4::after {
        width: 20rem;
        left: -27rem; } }
  #history h4.sub::after {
    display: none; }
#history p {
  margin: 0;
  line-height: 1.6; }
  @media screen and (min-width: 768px), print {
    #history p {
      font-size: 14rem; } }
#history .photos {
  overflow: hidden;
  margin: 32rem 0 0;
  padding: 32rem 0 0;
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 16rem; }
  @media screen and (min-width: 768px), print {
    #history .photos {
      grid-gap: 24rem;
      margin: 0;
      transform: translateY(50rem);
      padding-top: 48rem; } }
  #history .photos h5 {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 15rem;
    font-weight: 400;
    line-height: 1;
    margin: 0;
    padding: 0 0 0 8rem; }
    @media screen and (min-width: 768px), print {
      #history .photos h5 {
        font-size: 18rem; } }
    #history .photos h5::before {
      content: "";
      width: 800rem;
      height: 1px;
      position: absolute;
      top: 50%;
      right: 100%;
      background: #ccc;
      display: block; }
  #history .photos figure figcaption {
    font-size: 12rem;
    line-height: 1.6;
    margin: 4rem 0 0; }
    @media screen and (min-width: 768px), print {
      #history .photos figure figcaption {
        font-size: 14rem;
        margin: 8rem 0 0; } }

#history5 {
  padding-bottom: 0 !important; }
  #history5::before {
    bottom: 0 !important; }
  #history5 h2 {
    display: flex;
    align-items: center;
    grid-gap: 16rem; }
    #history5 h2 i {
      width: 65rem;
      height: 4rem;
      background: linear-gradient(90deg, #b92329 0%, rgba(185, 35, 41, 0) 100%);
      display: block; }
      @media screen and (min-width: 768px), print {
        #history5 h2 i {
          width: 130rem;
          height: 8rem; } }
  #history5 h3 {
    display: grid;
    grid-template-columns: 1fr 110rem;
    align-items: center; }
    @media screen and (min-width: 768px), print {
      #history5 h3 {
        display: flex; } }
    #history5 h3 i {
      border-left: 1px solid #ccc;
      padding-left: 20rem; }
      @media screen and (min-width: 768px), print {
        #history5 h3 i {
          width: 132rem;
          margin-left: 20rem;
          padding: 5rem 0 10rem 20rem; } }
  #history5 .photos {
    margin: 12rem 0 0 -30rem;
    border-top: 20rem solid #fff;
    border-left: 30rem solid #fff; }
    @media screen and (max-width: 767.98px) {
      #history5 .photos {
        padding-top: 0; } }

/*------------------------------------------*/
#management-policy .btns {
  margin: 0 32rem 48rem; }
  @media screen and (min-width: 768px), print {
    #management-policy .btns {
      margin: 0 0 64rem; } }
@media screen and (max-width: 767.98px) {
  #management-policy .btn-pdf {
    font-size: 13rem;
    width: 100%; } }
@media screen and (min-width: 768px), print {
  #management-policy .btn-pdf {
    min-width: 300rem; } }

#management-policy-vision1 .common-table {
  width: 100%;
  margin: 16rem auto 0;
  table-layout: fixed; }
  @media screen and (min-width: 768px), print {
    #management-policy-vision1 .common-table {
      width: 714rem;
      margin: 24rem auto 0; } }
  #management-policy-vision1 .common-table td {
    font-weight: 700;
    background: #FAF6F7; }
    @media screen and (min-width: 768px), print {
      #management-policy-vision1 .common-table td {
        font-size: 20rem;
        padding: 10rem; } }
    #management-policy-vision1 .common-table td small {
      display: inline-block; }
@media screen and (max-width: 767.98px) {
  #management-policy-vision1 .gray-frame {
    background: none;
    padding: 0; }
  #management-policy-vision1 .scrollable-content {
    width: 220%;
    max-width: 220%; } }

#management-policy-vision2 .common-table {
  width: 100%;
  margin: 16rem auto 0;
  table-layout: fixed; }
  @media screen and (min-width: 768px), print {
    #management-policy-vision2 .common-table {
      width: 714rem;
      margin: 24rem auto 0; } }
  #management-policy-vision2 .common-table tbody tr:first-child th {
    background: #EDCCCE;
    font-weight: 700; }
  #management-policy-vision2 .common-table tbody tr:first-child td {
    background: #F1D3D4; }
  #management-policy-vision2 .common-table th {
    text-align: center; }
  #management-policy-vision2 .common-table td {
    font-weight: 700; }
    @media screen and (min-width: 768px), print {
      #management-policy-vision2 .common-table td {
        font-size: 20rem;
        padding: 10rem; } }
    #management-policy-vision2 .common-table td small {
      display: inline-block; }
@media screen and (max-width: 767.98px) {
  #management-policy-vision2 .gray-frame {
    background: none;
    padding: 0; }
  #management-policy-vision2 .scrollable-content {
    width: 200%;
    max-width: 200%; } }

/*------------------------------------------*/
#financial1 table.common-table {
  width: 100%; }
  #financial1 table.common-table thead th {
    padding-left: 6rem;
    padding-right: 6rem; }
    @media screen and (min-width: 768px), print {
      #financial1 table.common-table thead th:first-child {
        width: 262rem; } }
  @media screen and (max-width: 767.98px) {
    #financial1 table.common-table tbody th {
      text-align: center;
      padding-left: 8rem;
      padding-right: 8rem; } }
  @media screen and (min-width: 768px), print {
    #financial1 table.common-table tbody th {
      display: flex;
      padding-top: 18rem;
      padding-bottom: 18rem;
      justify-content: space-between; } }
  #financial1 table.common-table tbody th small {
    display: block; }
  #financial1 table.common-table tbody td {
    padding-left: 4rem;
    padding-right: 4rem;
    text-align: center; }
    @media screen and (min-width: 768px), print {
      #financial1 table.common-table tbody td {
        text-align: right;
        padding-right: 20rem; } }
#financial1 dl {
  display: grid;
  grid-gap: 16rem; }
  @media screen and (min-width: 768px), print {
    #financial1 dl {
      grid-template-columns: repeat(3, 1fr); } }
  #financial1 dl > div {
    background: rgba(24, 26, 30, 0.04); }
  #financial1 dl dt {
    margin: 0 16rem;
    padding: 8rem 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 24rem;
    font-weight: 900;
    border-bottom: 1px solid #ccc;
    position: relative; }
    #financial1 dl dt::after {
      content: "";
      width: 60%;
      height: 1px;
      background: #7B292F;
      display: block;
      position: absolute;
      bottom: -1px;
      left: 0; }
    #financial1 dl dt small {
      font-size: 12rem;
      font-weight: 400; }
  #financial1 dl dd {
    padding: 16rem;
    margin: 0; }

#financial2 ul {
  margin: 0;
  padding: 0 32rem;
  list-style: none;
  display: grid;
  grid-gap: 8rem; }
  @media screen and (min-width: 768px), print {
    #financial2 ul {
      grid-template-columns: repeat(3, 1fr);
      grid-gap: 16rem;
      padding: 0; } }
  #financial2 ul li {
    margin: 0;
    padding: 0; }
  #financial2 ul a {
    width: 100%; }

/*------------------------------------------*/
#carbon-neutrality-goal .metrics {
  text-align: center; }
  @media screen and (min-width: 768px), print {
    #carbon-neutrality-goal .metrics img {
      max-width: 500rem; } }

@media screen and (min-width: 768px), print {
  #carbon-neutrality-headoffice .dropshado-offset {
    margin: 0 -18rem; } }
@media screen and (max-width: 767.98px) {
  #carbon-neutrality-headoffice .scrollable-content {
    width: 230%;
    max-width: 230%; } }
#carbon-neutrality-headoffice .gray-bg {
  background: rgba(24, 26, 30, 0.04);
  padding: 24rem 0;
  margin: 24rem 0; }
  @media screen and (min-width: 768px), print {
    #carbon-neutrality-headoffice .gray-bg {
      margin: 48rem 0;
      padding: 48rem 0; } }

#carbon-neutrality-zebzeh .grid {
  display: grid;
  grid-gap: 16rem; }
  @media screen and (min-width: 768px), print {
    #carbon-neutrality-zebzeh .grid {
      grid-gap: 48rem;
      grid-template-columns: 1fr 542rem;
      margin: 0 -72rem 0 0; } }

#carbon-neutrality-spc ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-gap: 48rem; }
  @media screen and (min-width: 768px), print {
    #carbon-neutrality-spc ul {
      grid-gap: 48rem; } }
  #carbon-neutrality-spc ul li {
    margin: 0;
    padding: 0;
    display: grid;
    grid-gap: 16rem; }
    @media screen and (min-width: 768px), print {
      #carbon-neutrality-spc ul li {
        grid-template-columns: 495rem 1fr;
        grid-gap: 32rem; } }
@media screen and (max-width: 767.98px) {
  #carbon-neutrality-spc figure {
    order: 2; } }
#carbon-neutrality-spc h3 {
  font-size: 18rem;
  margin: 0;
  padding: 0; }
  @media screen and (min-width: 768px), print {
    #carbon-neutrality-spc h3 {
      font-size: 20rem; } }
#carbon-neutrality-spc .company {
  font-size: 18rem;
  margin: 0;
  padding: 0; }
  @media screen and (min-width: 768px), print {
    #carbon-neutrality-spc .company {
      font-size: 18rem;
      margin-top: 4rem; } }
  #carbon-neutrality-spc .company::after {
    content: "";
    display: block;
    height: 1px;
    background: linear-gradient(90deg, #0082e6 0%, #37c086 100%);
    margin: 4rem 0 0; }
    @media screen and (min-width: 768px), print {
      #carbon-neutrality-spc .company::after {
        margin-top: 8rem; } }
#carbon-neutrality-spc .company2 {
  text-align: right;
  font-size: 12rem; }
  @media screen and (min-width: 768px), print {
    #carbon-neutrality-spc .company2 {
      font-size: 14rem; } }
#carbon-neutrality-spc dl {
  margin: 0 0 8rem;
  padding: 0;
  font-size: 13rem; }
  @media screen and (min-width: 768px), print {
    #carbon-neutrality-spc dl {
      font-size: 16rem; } }
  #carbon-neutrality-spc dl > div {
    padding: 4rem 0 4rem 8rem;
    display: grid;
    grid-template-columns: 93rem 1fr; }
    @media screen and (min-width: 768px), print {
      #carbon-neutrality-spc dl > div {
        grid-template-columns: 120rem 1fr;
        padding: 8rem 16rem; } }
    #carbon-neutrality-spc dl > div:nth-of-type(2n) {
      background: #F7F7F7; }
  #carbon-neutrality-spc dl dt {
    margin: 0;
    padding: 0; }
  #carbon-neutrality-spc dl dd {
    margin: 0;
    padding: 0; }
    #carbon-neutrality-spc dl dd .total {
      border-top: 1px solid #DDDDDD;
      margin-top: 2rem;
      padding-top: 2rem; }