@charset "UTF-8";
/*----------------------------------------

	APPROACH CSS

-----------------------------------------*/
@media screen and (min-width: 769px) {
  .social,
  .environment {
    scroll-margin-block-start: 130px;
  }
}
@media screen and (max-width: 768px) {
  .social,
  .environment {
    scroll-margin-block-start: 76px;
  }
}
.social .c-title02,
.environment .c-title02 {
  margin-inline: auto;
}
.social .font28_22,
.environment .font28_22 {
  font-weight: var(--font-medium);
  line-height: 1.5;
}
@media screen and (min-width: 769px) {
  .social .font28_22,
  .environment .font28_22 {
    letter-spacing: 0.02em;
  }
}
@media screen and (max-width: 768px) {
  .social .font28_22,
  .environment .font28_22 {
    letter-spacing: 0.03em;
  }
}
.social .font24_18,
.environment .font24_18 {
  font-weight: var(--font-medium);
}
@media screen and (min-width: 769px) {
  .social .font24_18,
  .environment .font24_18 {
    line-height: 1.5;
  }
}
@media screen and (max-width: 768px) {
  .social .font24_18,
  .environment .font24_18 {
    line-height: 2;
  }
}
.social .font20_16,
.environment .font20_16 {
  font-weight: var(--font-medium);
}
@media screen and (min-width: 769px) {
  .social .font20_16,
  .environment .font20_16 {
    line-height: 1.5;
    letter-spacing: 0.03em;
  }
}
@media screen and (max-width: 768px) {
  .social .font20_16,
  .environment .font20_16 {
    line-height: 2;
    letter-spacing: 0;
  }
}
.social p.font16_14,
.environment p.font16_14 {
  font-weight: var(--font-regular);
  line-height: 2;
}

/*----------------------------------------
	- 社会への取り組み
-----------------------------------------*/
@media screen and (min-width: 769px) {
  .social {
    padding-block-start: 60px;
    margin-block-start: 90px;
  }
}
@media screen and (max-width: 768px) {
  .social {
    padding-block-start: 7.5vw;
    margin-block-start: 14vw;
  }
}
@media screen and (min-width: 769px) {
  .social .hiv {
    margin-block-start: 77px;
  }
}
@media screen and (max-width: 768px) {
  .social .hiv {
    margin-block-start: 13.5vw;
  }
}
@media screen and (min-width: 769px) {
  .social .hiv .font28_22 + .font16_14 {
    margin-block-start: 40px;
  }
}
@media screen and (max-width: 768px) {
  .social .hiv .font28_22 + .font16_14 {
    margin-block-start: 6.25vw;
  }
}
.social .hiv .box01 {
  display: grid;
}
@media screen and (min-width: 769px) {
  .social .hiv .box01 {
    margin-block-start: 60px;
    grid-template-columns: 59.091% 1fr 10.636%;
    grid-template-rows: 1fr auto auto 1fr;
  }
}
@media screen and (max-width: 768px) {
  .social .hiv .box01 {
    margin-block-start: 7.5vw;
    grid-template-columns: 1fr 17.25vw;
  }
}
@media screen and (min-width: 769px) {
  .social .hiv .box01 figure:nth-of-type(1) {
    grid-column: 1/2;
    grid-row: 1/5;
    margin-inline: 0 7.6%;
  }
}
@media screen and (max-width: 768px) {
  .social .hiv .box01 figure:nth-of-type(1) {
    grid-column: 1/3;
    grid-row: 3/4;
  }
}
@media screen and (min-width: 769px) {
  .social .hiv .box01 .font24_18 {
    grid-column: 2/4;
    grid-row: 2/3;
  }
}
@media screen and (max-width: 768px) {
  .social .hiv .box01 .font24_18 {
    grid-column: 1/2;
    grid-row: 1/2;
  }
}
@media screen and (min-width: 769px) {
  .social .hiv .box01 .font16_14 {
    grid-column: 2/3;
    grid-row: 3/4;
    margin-block-start: 30px;
  }
}
@media screen and (max-width: 768px) {
  .social .hiv .box01 .font16_14 {
    grid-column: 1/2;
    grid-row: 2/3;
    margin-block: 3.75vw 6vw;
  }
}
.social .hiv .box01 figure:nth-of-type(2) {
  height: -moz-fit-content;
  height: fit-content;
}
@media screen and (min-width: 769px) {
  .social .hiv .box01 figure:nth-of-type(2) {
    grid-column: 3/4;
    grid-row: 3/5;
    margin-block: auto 0;
  }
}
@media screen and (max-width: 768px) {
  .social .hiv .box01 figure:nth-of-type(2) {
    grid-column: 2/3;
    grid-row: 1/3;
    margin-block: auto 1.25vw;
  }
}
.social .hiv .box02 {
  display: grid;
}
@media screen and (min-width: 769px) {
  .social .hiv .box02 {
    margin-block-start: 60px;
    grid-template-columns: 1fr 54.545%;
    grid-template-rows: 1fr auto auto 1fr;
    gap: 0 4.545%;
  }
}
@media screen and (max-width: 768px) {
  .social .hiv .box02 {
    margin-block-start: 7.5vw;
  }
}
@media screen and (min-width: 769px) {
  .social .hiv .box02 figure {
    grid-column: 2/3;
    grid-row: 1/5;
  }
}
@media screen and (max-width: 768px) {
  .social .hiv .box02 figure {
    grid-column: 1/2;
    grid-row: 3/4;
    margin-block-start: 6vw;
  }
}
@media screen and (min-width: 769px) {
  .social .hiv .box02 .font24_18 {
    grid-column: 1/2;
    grid-row: 2/3;
  }
}
@media screen and (max-width: 768px) {
  .social .hiv .box02 .font24_18 {
    grid-column: 1/2;
    grid-row: 1/2;
  }
}
@media screen and (min-width: 769px) {
  .social .hiv .box02 .font16_14 {
    grid-column: 1/2;
    grid-row: 3/4;
    margin-block-start: 30px;
  }
}
@media screen and (max-width: 768px) {
  .social .hiv .box02 .font16_14 {
    grid-column: 1/2;
    grid-row: 2/3;
    margin-block-start: 3.75vw;
  }
}
.social .education {
  background-color: var(--color-snow);
}
@media screen and (min-width: 769px) {
  .social .education {
    margin-block-start: 140px;
    padding-block: 100px;
  }
}
@media screen and (max-width: 768px) {
  .social .education {
    margin-block-start: 20vw;
    padding-block: 20vw;
  }
}
@media screen and (min-width: 769px) {
  .social .education .font24_18 {
    margin-block-start: 60px;
  }
}
@media screen and (max-width: 768px) {
  .social .education .font24_18 {
    margin-block-start: 7.5vw;
  }
}
@media screen and (min-width: 769px) {
  .social .education p.font16_14 {
    margin-block-start: 30px;
  }
}
@media screen and (max-width: 768px) {
  .social .education p.font16_14 {
    margin-block-start: 3.75vw;
  }
}
.social .education p:has(a) {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  line-height: 1;
}
@media screen and (min-width: 769px) {
  .social .education p:has(a) {
    margin-block-start: 64px;
  }
}
@media screen and (max-width: 768px) {
  .social .education p:has(a) {
    margin-block-start: 8vw;
  }
}
@media screen and (min-width: 769px) {
  .social .fund {
    margin-block-start: 138px;
  }
}
@media screen and (max-width: 768px) {
  .social .fund {
    margin-block-start: 20vw;
  }
}
@media screen and (min-width: 769px) {
  .social .fund .font28_22 + .font16_14 {
    margin-block-start: 40px;
  }
}
@media screen and (max-width: 768px) {
  .social .fund .font28_22 + .font16_14 {
    margin-block-start: 7.5vw;
  }
}
@media screen and (min-width: 769px) {
  .social .fund .box01 {
    margin-block-start: 60px;
    display: grid;
    grid-template-columns: 1fr 47.727%;
    grid-template-rows: auto auto auto 1fr;
    gap: 0 4.545%;
  }
}
@media screen and (max-width: 768px) {
  .social .fund .box01 {
    margin-block-start: 7.5vw;
  }
}
@media screen and (min-width: 769px) {
  .social .fund .box01 figure {
    grid-column: 2/3;
    grid-row: 1/5;
  }
}
@media screen and (max-width: 768px) {
  .social .fund .box01 figure {
    margin-block-start: 6vw;
  }
}
@media screen and (min-width: 769px) {
  .social .fund .box01 .font16_14 {
    margin-block-start: 30px;
  }
}
@media screen and (max-width: 768px) {
  .social .fund .box01 .font16_14 {
    margin-block-start: 3.75vw;
  }
}
@media screen and (min-width: 769px) {
  .social .fund .box01 .font24_18:nth-of-type(1) {
    margin-block-start: 10px;
  }
}
@media screen and (min-width: 769px) {
  .social .fund .box01 .font24_18:nth-of-type(3) {
    margin-block-start: 50px;
  }
}
@media screen and (max-width: 768px) {
  .social .fund .box01 .font24_18:nth-of-type(3) {
    margin-block-start: 7.5vw;
  }
}
.social .fund .box01 + .font16_14 {
  font-weight: var(--font-medium);
  text-align: center;
}
@media screen and (min-width: 769px) {
  .social .fund .box01 + .font16_14 {
    margin-block-start: 84px;
  }
}
@media screen and (max-width: 768px) {
  .social .fund .box01 + .font16_14 {
    margin-block-start: 8vw;
  }
}
.social .fund p:has(a) {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  line-height: 1;
}
@media screen and (min-width: 769px) {
  .social .fund p:has(a) {
    margin-block-start: 36px;
  }
}
@media screen and (max-width: 768px) {
  .social .fund p:has(a) {
    margin-block-start: 5vw;
  }
}
.social .sports {
  background-color: var(--color-snow);
}
@media screen and (min-width: 769px) {
  .social .sports {
    margin-block-start: 138px;
    padding-block: 100px;
  }
}
@media screen and (max-width: 768px) {
  .social .sports {
    margin-block-start: 20vw;
    padding-block: 20vw;
  }
}
@media screen and (min-width: 769px) {
  .social .sports .font24_18 {
    margin-block-start: 60px;
  }
}
@media screen and (max-width: 768px) {
  .social .sports .font24_18 {
    margin-block-start: 7.5vw;
  }
}
@media screen and (min-width: 769px) {
  .social .sports .font24_18 + .font16_14 {
    margin-block-start: 30px;
  }
}
@media screen and (max-width: 768px) {
  .social .sports .font24_18 + .font16_14 {
    margin-block-start: 3.75vw;
  }
}
@media screen and (min-width: 769px) {
  .social .sports .box01 {
    margin-block-start: 60px;
    display: grid;
    grid-template-columns: 40.909% 1fr;
    grid-template-rows: 1fr auto auto 1fr;
    gap: 0 4.545%;
  }
}
@media screen and (max-width: 768px) {
  .social .sports .box01 {
    margin-block-start: 7.5vw;
  }
}
@media screen and (min-width: 769px) {
  .social .sports .box01 figure {
    grid-column: 1/2;
    grid-row: 1/5;
    height: -moz-fit-content;
    height: fit-content;
    margin-block: auto;
  }
}
@media screen and (min-width: 769px) {
  .social .sports .box01 .font20_16 {
    grid-column: 2/3;
    grid-row: 2/3;
  }
}
@media screen and (max-width: 768px) {
  .social .sports .box01 .font20_16 {
    margin-block-start: 6vw;
  }
}
@media screen and (min-width: 769px) {
  .social .sports .box01 .font16_14 {
    grid-column: 2/3;
    grid-row: 3/4;
    margin-block-start: 30px;
  }
}
@media screen and (max-width: 768px) {
  .social .sports .box01 .font16_14 {
    margin-block-start: 3.75vw;
  }
}

/*----------------------------------------
	- 環境への取り組み
-----------------------------------------*/
@media screen and (min-width: 769px) {
  .environment {
    padding-block-start: 60px;
    margin-block-start: 100px;
  }
}
@media screen and (max-width: 768px) {
  .environment {
    padding-block-start: 7.5vw;
    margin-block-start: 19vw;
  }
}
@media screen and (min-width: 769px) {
  .environment .yakushima {
    display: grid;
    grid-template-columns: 61.818% 1fr;
    gap: 0 4.545%;
    margin-block-start: 78px;
  }
}
@media screen and (max-width: 1000px) and (min-width: 769px) {
  .environment .yakushima {
    display: block;
  }
}
@media screen and (max-width: 768px) {
  .environment .yakushima {
    margin-block-start: 13.5vw;
  }
}
@media screen and (min-width: 769px) {
  .environment .yakushima figure {
    grid-column: 1/2;
    grid-row: 1/6;
    height: -moz-fit-content;
    height: fit-content;
    margin-block: auto;
  }
}
@media screen and (min-width: 769px) {
  .environment .yakushima .font28_22 {
    grid-column: 2/3;
    grid-row: 2/3;
  }
}
@media screen and (max-width: 1000px) and (min-width: 769px) {
  .environment .yakushima .font28_22 {
    margin-block-start: 50px;
  }
}
@media screen and (max-width: 768px) {
  .environment .yakushima .font28_22 {
    margin-block-start: 6vw;
  }
}
@media screen and (min-width: 769px) {
  .environment .yakushima > .font16_14 {
    grid-column: 2/3;
    grid-row: 3/4;
    margin-block-start: 40px;
  }
}
@media screen and (max-width: 768px) {
  .environment .yakushima > .font16_14 {
    margin-block-start: 7.5vw;
  }
}
@media screen and (min-width: 769px) {
  .environment .yakushima p:has(a) {
    grid-column: 2/3;
    grid-row: 4/5;
    margin-block-start: 24px;
  }
}
@media screen and (max-width: 768px) {
  .environment .yakushima p:has(a) {
    margin-block-start: 5vw;
  }
}
.environment .yakushima p:has(a) a::after {
  content: "";
  display: inline-block;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url(/asset/img/common/ic-tabs-black.svg);
  width: 1em;
  height: 1em;
  margin-block: auto;
  margin-inline: 0.75em 0;
}
.environment .items {
  background-color: var(--color-soapstone);
  display: grid;
}
@media screen and (min-width: 769px) {
  .environment .items {
    margin-block-start: 80px;
    grid-template-columns: 46.3% 1fr;
    grid-template-rows: 1fr auto auto 1fr;
    gap: 0 4.1%;
    padding: 50px;
  }
}
@media screen and (max-width: 1000px) and (min-width: 769px) {
  .environment .items {
    grid-template-columns: 25% 1fr;
  }
}
@media screen and (max-width: 768px) {
  .environment .items {
    margin-block-start: 12.5vw;
    padding-block: 7.5vw;
  }
}
.environment .items figure {
  display: grid;
  grid-template-columns: 1.06fr 1fr;
}
@media screen and (min-width: 769px) {
  .environment .items figure {
    gap: 0 4.32%;
    grid-column: 1/2;
    grid-row: 1/5;
    align-items: center;
    height: -moz-fit-content;
    height: fit-content;
    margin-block: auto;
  }
}
@media screen and (max-width: 1000px) and (min-width: 769px) {
  .environment .items figure {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
@media screen and (max-width: 768px) {
  .environment .items figure {
    gap: 3.75vw;
  }
}
@media screen and (min-width: 769px) {
  .environment .items .font20_16 {
    grid-column: 2/3;
    grid-row: 2/3;
  }
}
@media screen and (max-width: 768px) {
  .environment .items .font20_16 {
    margin-block-start: 6vw;
  }
}
@media screen and (min-width: 769px) {
  .environment .items .font16_14 {
    grid-column: 2/3;
    grid-row: 3/4;
    margin-block-start: 20px;
  }
}
@media screen and (max-width: 768px) {
  .environment .items .font16_14 {
    margin-block-start: 2.5vw;
  }
}