@charset "UTF-8";
#sustainability {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 767px) {
  #sustainability {
    padding-bottom: 40px;
  }
}
#sustainability .detail {
  width: min(100vw - 16px, 800px);
  margin: 30px 0 0 0;
  padding-bottom: 60px;
}
@media screen and (max-width: 767px) {
  #sustainability .detail {
    width: calc(100% - 28px);
    padding: 0px 8px 30px 8px;
    margin-top: 20px;
  }
}
#sustainability .contentButton {
  width: 100%;
  background-color: #e9ebef;
  padding: 40px 0 50px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 767px) {
  #sustainability .contentButton {
    padding: 20px 0;
  }
}
#sustainability .contentButton h3 {
  margin-bottom: 40px;
}
@media screen and (max-width: 767px) {
  #sustainability .contentButton h3 {
    margin-bottom: 20px;
  }
}
#sustainability .contentButton .wrapper {
  width: min(100vw, 1240px);
  padding: 0 20px;
  max-height: 520px;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  #sustainability .contentButton .wrapper {
    width: 100vw;
    height: auto;
    max-height: none;
    padding: 0px 8px;
    flex-direction: column;
  }
}
#sustainability .contentButton .wrapper .container {
  width: min(31.452vw, 390px);
  height: min(20.161vw, 250px);
  background-color: #fbfbfb;
  box-shadow: 1px 1px 6px 0px rgba(0, 0, 0, 0.5);
}
@media screen and (max-width: 767px) {
  #sustainability .contentButton .wrapper .container {
    width: 100%;
    height: auto;
    margin-bottom: 20px;
  }
}
#sustainability .contentButton .wrapper .container .imageWrapper {
  width: 100%;
  height: min(16.129vw, 200px);
  overflow: hidden;
  position: relative;
}
@media screen and (max-width: 767px) {
  #sustainability .contentButton .wrapper .container .imageWrapper {
    height: auto;
  }
}
#sustainability .contentButton .wrapper .container .imageWrapper img {
  height: 100%;
}
@media screen and (max-width: 767px) {
  #sustainability .contentButton .wrapper .container .imageWrapper img {
    width: 100%;
    height: max(49.096vw, 184.6px);
  }
}
#sustainability .contentButton .wrapper .container .buttonTitle {
  width: 100%;
  height: min(4.032vw, 50px);
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 767px) {
  #sustainability .contentButton .wrapper .container .buttonTitle {
    width: 100%;
    height: max(7.979vw, 30px);
    padding: 8px 0px;
  }
}
#sustainability .contentButton .wrapper .container:nth-of-type(1) {
  grid-column: 1/2;
  grid-row: 1/2;
}
@media screen and (max-width: 767px) {
  #sustainability .contentButton .wrapper .container:nth-of-type(1) {
    grid-column: 1/2;
    grid-row: 1/2;
  }
}
#sustainability .contentButton .wrapper .container:nth-of-type(2) {
  grid-column: 2/3;
  grid-row: 1/2;
}
@media screen and (max-width: 767px) {
  #sustainability .contentButton .wrapper .container:nth-of-type(2) {
    grid-column: 1/2;
    grid-row: 2/3;
  }
}
#sustainability .contentButton .wrapper .container:nth-of-type(3) {
  grid-column: 3/4;
  grid-row: 1/2;
}
@media screen and (max-width: 767px) {
  #sustainability .contentButton .wrapper .container:nth-of-type(3) {
    grid-column: 1/2;
    grid-row: 3/4;
    margin: 0;
  }
}
#sustainability .contentButton .wrapper .container:active {
  box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.5);
}

#sdgs {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 767px) {
  #sdgs {
    padding-bottom: 40px;
  }
}
#sdgs .title {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#sdgs .title img {
  width: min(44vw, 440px);
  margin-top: min(10vw, 100px);
}
#sdgs .introduction {
  width: min(100vw, 840px);
  padding: 0 20px 50px 20px;
  margin: 30px 0 0 0;
}
@media screen and (max-width: 767px) {
  #sdgs .introduction {
    width: 100%;
    padding: 0px 18px 30px 18px;
    margin-top: 20px;
  }
}
#sdgs .introduction .sdgsMarkWrapper {
  margin: 40px 0;
  display: flex;
  justify-content: center;
}
#sdgs .introduction .sdgsMarkWrapper img {
  width: min(18vw, 180px);
  margin-right: 50px;
}
@media screen and (max-width: 767px) {
  #sdgs .introduction .sdgsMarkWrapper img {
    width: max(23.936vw, 90px);
    margin-right: max(5.319vw, 20px);
  }
}
#sdgs .introduction .sdgsMarkWrapper img:nth-of-type(3) {
  margin: 0;
}
#sdgs .detail {
  width: 100%;
  padding: 60px 0;
  background-color: #e9ebef;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 767px) {
  #sdgs .detail {
    padding: 40px 0;
  }
}
#sdgs .detail .detailContainer {
  width: min(100vw, 840px);
  padding: 0 20px;
  margin-bottom: 80px;
}
@media screen and (max-width: 767px) {
  #sdgs .detail .detailContainer {
    width: 100%;
    padding: 0 18px;
  }
}
#sdgs .detail .detailContainer .detailTitle {
  margin-bottom: min(6vw, 60px);
  display: flex;
  align-items: flex-start;
}
@media screen and (max-width: 767px) {
  #sdgs .detail .detailContainer .detailTitle {
    margin-bottom: 40px;
    flex-direction: column;
    align-items: center;
  }
}
#sdgs .detail .detailContainer .detailTitle img {
  width: min(12vw, 120px);
  margin-right: 30px;
}
@media screen and (max-width: 767px) {
  #sdgs .detail .detailContainer .detailTitle img {
    width: max(21.277vw, 80px);
    margin: 0 0 30px 0;
  }
}
#sdgs .detail .detailContainer .detailTitle .detailTitleWrapper h4 {
  margin-bottom: 10px;
}
#sdgs .detail .detailContainer .detailText {
  margin-bottom: min(4vw, 40px);
}
@media screen and (max-width: 767px) {
  #sdgs .detail .detailContainer .detailText {
    margin-bottom: 30px;
  }
}
#sdgs .detail .detailContainer .detailText p:nth-of-type(1) {
  margin-bottom: 10px;
}
#sdgs .detail .detailContainer .detailText:nth-last-of-type(1) {
  margin-bottom: 0;
}
#sdgs .detail .detailContainer:nth-last-of-type(1) {
  margin-bottom: 0;
}
#sdgs #plusOne {
  width: 100%;
  padding: 60px 0;
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  #sdgs #plusOne {
    padding: 30px 0;
  }
}
#sdgs #plusOne .inner {
  width: min(100vw, 840px);
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#sdgs #plusOne .inner #plusOneLogo {
  width: 520px;
  margin: 10px 0 60px 0;
}
@media screen and (max-width: 767px) {
  #sdgs #plusOne .inner #plusOneLogo {
    width: max(74.468vw, 280px);
    margin-bottom: 40px;
  }
}
#sdgs #plusOne .inner h4 {
  margin-bottom: 40px;
}
@media screen and (max-width: 767px) {
  #sdgs #plusOne .inner h4 {
    margin-bottom: 30px;
  }
}
#sdgs #plusOne .inner .plusOneText {
  width: 100%;
  margin-bottom: 60px;
}
@media screen and (max-width: 767px) {
  #sdgs #plusOne .inner .plusOneText {
    margin-bottom: 30px;
  }
}
#sdgs #plusOne #mySdgs {
  width: min(100vw, 1000px);
  padding: 0 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 20px;
}
#sdgs #plusOne #mySdgs .mySdgsContainer {
  width: min(47vw, 470px);
  padding: min(3vw, 30px);
  background-color: #fbfbfb;
  box-shadow: 0px 0px 8px #808080;
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 767px) {
  #sdgs #plusOne #mySdgs .mySdgsContainer {
    width: 100%;
    padding: max(4.255vw, 16px) max(2.66vw, 10px);
  }
}
#sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsTitle {
  display: grid;
  grid-template-columns: 1fr 110px 1fr;
  margin-bottom: 8px;
}
@media screen and (max-width: 767px) {
  #sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsTitle {
    grid-template-columns: 1fr max(21.277vw, 80px) 1fr;
  }
}
#sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsTitle .blueLine {
  width: 100%; /* 任意の幅 */
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px; /* ライン間の隙間 */
}
@media screen and (max-width: 767px) {
  #sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsTitle .blueLine {
    gap: 5px;
  }
}
#sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsTitle .blueLine span {
  display: block;
  height: 1px;
  background-color: #0098d8;
  width: 100%;
}
#sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsProfileWrapper {
  padding: 0 10px;
  margin-bottom: 20px;
  display: flex;
}
#sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsProfileWrapper .pict {
  width: min(11vw, 110px);
  margin-right: 20px;
}
@media screen and (max-width: 767px) {
  #sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsProfileWrapper .pict {
    width: max(23.936vw, 90px);
    margin-right: max(2.66vw, 10px);
  }
}
#sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsProfileWrapper .mySdgsProfile {
  padding-top: 10px;
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 767px) {
  #sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsProfileWrapper .mySdgsProfile {
    padding-top: max(2.66vw, 10px);
  }
}
#sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsProfileWrapper .mySdgsProfile .companyName {
  margin-bottom: 4px;
}
#sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsProfileWrapper .mySdgsProfile .name {
  margin-bottom: 14px;
}
#sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsProfileWrapper .mySdgsProfile .sdgsContainer {
  display: flex;
  align-items: center;
}
#sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsProfileWrapper .mySdgsProfile .sdgsContainer .sdgsMark {
  width: min(6.4vw, 64px);
  margin-right: min(2vw, 20px);
}
@media screen and (max-width: 767px) {
  #sdgs #plusOne #mySdgs .mySdgsContainer .mySdgsProfileWrapper .mySdgsProfile .sdgsContainer .sdgsMark {
    width: max(12.766vw, 48px);
  }
}

#sportsSupport {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 767px) {
  #sportsSupport {
    padding-bottom: 40px;
  }
}
#sportsSupport .introduction {
  width: min(100vw, 840px);
  margin: 30px 0 0 0;
  padding: 0 20px 60px 20px;
}
@media screen and (max-width: 767px) {
  #sportsSupport .introduction {
    width: 100%;
    padding: 0px 18px 30px 18px;
    margin-top: 20px;
  }
}
#sportsSupport #tsunag,
#sportsSupport #professional {
  width: 100%;
  padding: 60px 0;
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  #sportsSupport #tsunag,
  #sportsSupport #professional {
    padding: max(7.979vw, 30px) 0;
  }
}
#sportsSupport #tsunag .inner,
#sportsSupport #professional .inner {
  width: min(100vw, 840px);
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#sportsSupport #tsunag .inner h4,
#sportsSupport #professional .inner h4 {
  margin-bottom: 50px;
}
@media screen and (max-width: 767px) {
  #sportsSupport #tsunag .inner h4,
  #sportsSupport #professional .inner h4 {
    margin-bottom: max(5.319vw, 20px);
  }
}
#sportsSupport #tsunag .inner p,
#sportsSupport #professional .inner p {
  width: 100%;
  margin-bottom: 40px;
}
@media screen and (max-width: 767px) {
  #sportsSupport #tsunag .inner p,
  #sportsSupport #professional .inner p {
    margin-bottom: max(5.319vw, 20px);
  }
}
#sportsSupport #tsunag .inner .imageWrapper,
#sportsSupport #professional .inner .imageWrapper {
  width: 100%;
  display: flex;
  column-gap: min(1.905vw, 16px);
}
@media screen and (max-width: 767px) {
  #sportsSupport #tsunag .inner .imageWrapper,
  #sportsSupport #professional .inner .imageWrapper {
    flex-wrap: wrap;
    justify-content: center;
    gap: max(4.255vw, 16px);
  }
}
#sportsSupport #tsunag .inner .imageWrapper img,
#sportsSupport #professional .inner .imageWrapper img {
  width: min(30.476vw, 256px);
}
@media screen and (max-width: 767px) {
  #sportsSupport #tsunag .inner .imageWrapper img,
  #sportsSupport #professional .inner .imageWrapper img {
    width: max(42.553vw, 160px);
  }
}
#sportsSupport #tsunag,
#sportsSupport #jaba {
  background-color: #e9ebef;
}
#sportsSupport #jaba,
#sportsSupport #agekke {
  width: 100%;
  padding: 60px 0;
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  #sportsSupport #jaba,
  #sportsSupport #agekke {
    padding: max(7.979vw, 30px) 0;
  }
}
#sportsSupport #jaba .inner,
#sportsSupport #agekke .inner {
  width: min(100vw, 840px);
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#sportsSupport #jaba .inner h4,
#sportsSupport #agekke .inner h4 {
  margin-bottom: 50px;
}
@media screen and (max-width: 767px) {
  #sportsSupport #jaba .inner h4,
  #sportsSupport #agekke .inner h4 {
    margin-bottom: max(5.319vw, 20px);
  }
}
#sportsSupport #jaba .inner .detailContainer,
#sportsSupport #agekke .inner .detailContainer {
  width: 100%;
  display: flex;
  column-gap: min(4.762vw, 40px);
}
@media screen and (max-width: 767px) {
  #sportsSupport #jaba .inner .detailContainer,
  #sportsSupport #agekke .inner .detailContainer {
    flex-direction: column;
    column-gap: 0;
    align-items: center;
  }
}
#sportsSupport #jaba .inner .detailContainer p,
#sportsSupport #agekke .inner .detailContainer p {
  width: min(69.048vw, 580px);
}
@media screen and (max-width: 767px) {
  #sportsSupport #jaba .inner .detailContainer p,
  #sportsSupport #agekke .inner .detailContainer p {
    width: 100%;
    margin-bottom: max(5.319vw, 20px);
  }
}
#sportsSupport #jaba .inner .detailContainer img,
#sportsSupport #agekke .inner .detailContainer img {
  width: min(21.429vw, 180px);
}
@media screen and (max-width: 767px) {
  #sportsSupport #jaba .inner .detailContainer img,
  #sportsSupport #agekke .inner .detailContainer img {
    width: max(42.553vw, 160px);
  }
}

#bridge100 {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 60px;
}
@media screen and (max-width: 767px) {
  #bridge100 {
    padding-bottom: 40px;
  }
}
#bridge100 .introduction {
  width: min(100vw, 840px);
  margin: 30px 0 0 0;
  padding: 0 20px 60px 20px;
}
@media screen and (max-width: 767px) {
  #bridge100 .introduction {
    width: 100%;
    padding: 0px 18px 30px 18px;
    margin-top: 20px;
  }
}
#bridge100 #bridge100Image {
  width: min(100vw, 840px);
  padding: 0 20px;
  display: grid;
  grid-template-columns: repeat(2, min(45.238vw, 380px));
  grid-template-rows: repeat(2, auto);
  column-gap: min(4.762vw, 40px);
  row-gap: min(2.381vw, 20px);
}
@media screen and (max-width: 767px) {
  #bridge100 #bridge100Image {
    width: auto;
    padding: 0 18px;
    grid-template-columns: repeat(2, max(42.553vw, 160px));
    column-gap: max(5.319vw, 20px);
  }
}
#bridge100 #bridge100Image .photoContainer img {
  width: min(45.238vw, 380px);
  height: auto;
  margin-bottom: 4px;
}
@media screen and (max-width: 767px) {
  #bridge100 #bridge100Image .photoContainer img {
    width: max(42.553vw, 160px);
  }
}/*# sourceMappingURL=sustainability.css.map */