@charset "UTF-8";
#contents {
    transition: padding-top 0.3s ease;
    background: url(img/sdgs2/bg.png) repeat-x center top #f3efea;
}
#main {
  padding-top: 0;
}

#footer {
  margin-top: 0;
}

#main h1.ttlPage,
.mv,
#main h2 {
  color: #373789;
}
.parent-ttl{
  font-weight:bold;
  font-size:24px;
  line-height: 1;
  margin-bottom: 28px;
}

#main h2 {
  text-align: center;
  margin-bottom: 60px;
}

/* Category Top */
#wrapper #header {
  background: #f3efea;
}

#wrapper #header .menu {
  background: none;
}

#bc {
  background: #f8f6f3;
  position: relative;
  top: -50px;
  z-index: 2;
  max-width: 1100px;
}
#sdgs{
  padding-bottom:1px;
}

.mv {
  background: url(img/sdgs2/hands.png) no-repeat center top;
  position: relative;
  top: -110px;
  padding: 200px 20px 0;
  text-align: center;
  margin-bottom: -80px;
  max-width: 1000px;
  margin-inline: auto;
}
.mv.top{
  padding-bottom: 140px;
}
.mv-label{
    line-height: 188.5%;
    position: absolute;
    top: 0;
    left: 0;
    right: auto;
    z-index: 1;
    background-color: rgb(244, 193, 94);
    color: #fff;
    width: 140px;
    height: 300px;
    font-size: 42px;
    font-weight: bold;
    letter-spacing: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 1000px;
    margin-inline: auto;
    padding: 30px 0 40px;
    border-radius: 0 0 20px 0;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
}

/* 749px以下 */
@media (max-width: 749px) {
  .mv {
    background-image: url(img/sdgs2/hands_sp.png);
    background-size: contain;
    padding: 100px 40px 0;
  }
  .mv.top {
    background-image: url(img/sdgs2/hands_top_sp.png);
    background-size: cover;
    padding: 100px 40px 0;
  }
  #sdgs-single dl{
    /* transform: scale(clamp(0.8, calc(100vw / 750px), 1)); */
    /* transform-origin: center; */
  }
  #sdgs-single dl dd{
    text-align:left;
  }
  .mv-label {
        width: 80px;
        top: 40px;
        border-radius: 0 20px 20px 0;
        transform: scale(clamp(0.5, calc(100vw / 750px), 1));
        transform-origin: left center; 
    }
  .sdgs-subcard::after{
    transform: scale(
      clamp(var(--scale-min, 0.6), calc(100vw / (var(--scale-base, 750) * 1px)), 1)
    );
    transform-origin: right top;
  }
  .head_ttl,table{
    transform: scale(clamp(0.7, calc(100vw / 750px), 1));
    transform-origin: center;
  }
  table{
    transform: scale(clamp(0.7, calc(100vw / 750px), 1));
    transform-origin: center left;
  }
  .not-scale{
    transform:none!important;
  }
  h3.caption{
    transform: scale(clamp(0.8, calc(100vw / 750px), 1));
    transform-origin: center bottom;
  }
}

.mv h1 {
  margin-bottom: 30px !important;
  font-size: clamp(1.75rem, 7.47vw, 3.5rem) !important;
}

.mv p {
  font-size: clamp(1.125rem, 4.8vw, 2.25rem) !important;
  line-height: 2;
  margin-bottom: auto;
  font-weight: bold;
  letter-spacing: 0.2em !important;
}

.mugen {
  position: relative;
  margin-inline: auto;
  max-width: 520px;
  min-height: 110px;
  margin-bottom: 100px;
  right: 30px;
}

.mugen img.bg {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  display: flex;
  margin-right: 72px;
}

.mugen p {
  position: absolute;
  top: 0;
  bottom: 0;
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 20px !important;
  text-align: center;
  line-height: 2 !important;
  letter-spacing: 0.2em !important;
}

.mugen .left {
  left: 0;
}

.mugen .right {
  right: -2.8px;
}

.circle-img {
  text-align: center;
  margin-bottom: clamp(3.75rem, 16vw, 7.5rem);
  padding-inline: 20px;
}
#sdgs .intro h2{
  margin-bottom:clamp(1.875rem, 8vw, 3.75rem);
}

.keyword-list ul {
  list-style: none;
  padding: 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  max-width: 950px;
  margin-inline: auto;
  gap: 20px;
  margin-bottom: clamp(5rem, 2.5rem + 10.67vw, 7.5rem);
}

.keyword-list a {
  text-decoration: none;
  padding: 10px 30px;
  line-height: 1.7;
  display: flex;
  border: 3px solid;
  color: rgb(239, 121, 25);
  border-radius: 30px;
  font-size: 20px;
  font-weight: bold;
}

.keyword-list .kw2 a {
  color: #efa619;
}

.keyword-list .kw3 a {
  color: #fe75c2;
}

.keyword-list .kw4 a {
  color: #ea5f35;
}

.keyword-list .kw5 a {
  color: #2faf80;
}

.keyword-list .kw6 a {
  color: #5cc87a;
}

.card-list ul {
  list-style: none;
  padding: 0;
}

.card-list > ul {
  display: flex;
  max-width: 950px;
  margin-inline: auto;
  gap: 20px;
  margin-bottom: clamp(3.75rem, 16vw, 7.5rem);
  flex-wrap: wrap;
}

.card-list > ul > li {
  margin-inline: auto;
  position: relative;
  margin-bottom: 60px;
}

.card-list li img {
  display: none;
  opacity: 0;
}

.card-list li.card-item:before {
  content: "";
  width: 30%;
  height: auto;
  display: block;
  background: url(img/sdgs2/card1.png) no-repeat center;
  position: absolute;
  top: -20%;
  right: 10px;
  z-index: 1;
  background-size: contain;
}

.card-list li.card-item.cat-community:before {
  background-image: url(img/sdgs2/card1.png);
  aspect-ratio: 199 / 93;
  top: -10%;
  width: 50%;
}

.card-list li.card-item.cat-kenko-keiei:before {
  background-image: url(img/sdgs2/card2.png);
  aspect-ratio: 120 / 127;
  top: -20%;
  right: 12%;
  width: 33%;
}

.card-list li.card-item.cat-environment:before {
  background-image: url(img/sdgs2/card3.png);
  aspect-ratio: 21 / 26;
  top: -25%;
  right: 14%;
}

.card-list a {
  display: flex;
  border-radius: 20px;
  background-color: rgb(255, 255, 255);
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1);
  width: 340px;
  height: 270px;
  aspect-ratio: 34 / 27;
  position: relative;
  overflow: hidden;
  padding: 30px;
  padding-top: 100px;
  text-decoration: none;
  font-size: 20px;
}

.card-list a:after {
  content: "";
  width: 60px;
  aspect-ratio: 1;
  background: url(img/sdgs2/card_arrow.svg) no-repeat center;
  background-color: #f4c15e;
  position: absolute;
  bottom: 0;
  right: 0;
  border-radius: 30px 0 0;
}

.card-list img {
  position: absolute;
  top: -20px;
  right: 0;
  display: block;
  z-index: 1;
}

.card-list a ul {
  line-height: 2;
}

.card-list a li {
  padding-left: 1.5rem;
  position: relative;
}

.card-list a li:before {
  content: "●";
  position: absolute;
  left: 0;
  color: #f4c15e;
}

.card-list .card-ttl {
  position: absolute;
  top: 0;
  left: 0;
  background-color: #f4c15e;
  color: #fff;
  padding: 20px;
  aspect-ratio: 7 / 4;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  font-weight: bold;
  letter-spacing: 0.2em;
  border-radius: 0 0 10px 0;
}

.card-list .cat-kenko-keiei .card-ttl,
.card-list .cat-kenko-keiei a:after {
  background-color: #e76f7a;
}

.card-list .cat-kenko-keiei li:before {
  color: #e76f7a;
}

.card-list .cat-environment .card-ttl,
.card-list .cat-environment a:after {
  background-color: #2faf80;
}

.card-list .cat-environment li:before {
  color: #2faf80;
}

#main .post {
  margin-bottom: 120px;
  padding-inline: 25px;
}

#main .post article {
  margin-bottom: 40px;
  padding: 0;
  max-width: 1000px;
  margin-inline: auto;
}

#main .post article time {
  background: red;
  color: #fff;
  padding: 7px 20px;
  line-height: 1;
  border-radius: 20px;
  min-width: 160px;
  text-align: center;
  max-height: 30px;
  margin-block: auto;
  margin-bottom: 10px;
}

#main .post article.cat-kenko-keiei time {
  background: #e86f7a;
}

#main .post article.cat-community time {
  background: #f4c15e;
}

#main .post article.cat-environment time {
  background: #2faf80;
}

#main .post article.cat-sekinin time {
  background: #53b7cd;
}

@media screen and (max-width: 767px) {
  #bc {
    padding: 10px;
    top: 0;
    width: calc(100% - 20px);
    z-index: 1;
  }

  #bc * {
    transform: scale(0.5);
  }
  .sdgs-panel .tel-box{
    flex-direction:column;
    /* transform: scale(
      clamp(var(--scale-min, 0.6), calc(100vw / (var(--scale-base, 750) * 1px)), 1)
    ); */
    /* transform-origin: center; */
    padding: 20px !important;
    /* white-space:nowrap; */
    width: 100%;
  }
}



@media screen and (min-width: 768px) {
  .mv h1 {
    font-size: 38px !important;
    letter-spacing: 0.2em;
  }

  .mv p {
    font-size: 24px !important;
  }

  .card-list > ul {
    /* flex-wrap: nowrap; */
    max-width: 1100px;
  }

  .card-list li.card-item:before {
    background-size: auto !important;
  }

  .card-list li.card-item.cat-community:before {
    width: 200px;
    right: 0;
  }

  .card-list li.card-item.cat-kenko-keiei:before {
    right: 40px;
    top: -60px;
    width: 120px;
  }

  .card-list li.card-item.cat-environment:before {
    right: 50px;
    top: -70px;
    width: 105px;
  }

  #wrapper #header {
    height: 130px;
    transition: height 0.3s ease;
  }

  #wrapper #header nav {
    height: 40px !important;
    transition: height 0.3s ease;
  }

  #wrapper #header .inner {
    height: 80px !important;
    transition: height 0.3s ease;
  }

  #wrapper #header .menu,
  #wrapper #header .logo img {
    height: 40px !important;
    align-items: center;
    transition: height 0.3s ease;
  }

  #wrapper #header nav .search {
    transform: scale(0.65555);
    transition: transform 0.3s ease;
  }

  #wrapper #header nav .search img {
    min-height: 10%;
    min-width: 10%;
  }

  #contents {
    padding-top: 130px;
    transition: padding-top 0.3s ease;
    background: url(img/sdgs2/bg.png) repeat-x center top #f3efea;
    background-size: contain;
    /* background-size: cover; */
  }

  body.is-scrolled #wrapper #header {
    height: 80px;
  }

  body.is-scrolled #wrapper #header .inner {
    height: 80px !important;
  }

  body.is-scrolled #wrapper #header .logo img {
    height: 32px !important;
  }

  body.is-scrolled #wrapper #header nav .search {
    transform: scale(0.58);
  }

  body.is-scrolled #contents {
    padding-top: 80px;
  }

  body.is-scrolled #bc {
    z-index: 0;
  }

  #main .post article h3 {
    flex-basis: calc(100% - 180px);
  }

  .card-list .card-ttl {
    border-radius: 0 0 30px 0;
  }
}

/* Sub Category Cards */
.sdgs-subcards {
  max-width: 1000px;
  margin-inline: auto;
  padding-inline: 25px;
  margin-bottom: 220px;
}

.sdgs-subcard {
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.08);
  /* overflow: hidden; */
  padding: 20px;
  max-width: 600px;
  position: relative;
  margin-inline: auto;
  margin-top: 200px;
  padding-block: 80px;
}
.sdgs-subcard.sdgs-subcard--3{
  padding-top: 100px;
}

.sdgs-subcard::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 80px;
  height: 80px;
  border-radius: 0 20px 0 50px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 40px;
  padding-left: 8px;
  padding-bottom: 8px;
  z-index: 0;
}

.sdgs-subcard--1::after {
  content: "1";
}

.sdgs-subcard--2::after {
  content: "2";
}

.sdgs-subcard--3::after {
  content: "3";
}

.sdgs-subcard-media {
  margin-bottom: 12px;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -60%);
  margin: auto;
  display: flex;
  justify-content: center;
  max-width: 66%;
}

.subcat-img{
  display:flex;
  justify-content:center;
  align-items:flex-end;
  margin-top: 120px;
  margin-bottom: 40px;
}
.mv .subcat-img {
  margin-top: 0px;
}
.sdgs-subcard-image {
  /* width: 100%; */
  height: auto;
}
.mv .sdgs-subcard-image {
  width: calc(100% - 40px);
  height: auto;
  max-width: 600px;
}

.sdgs-subcard-title {
  font-size: 34px;
  font-weight: bold;
  margin: 0 0 20px;
  text-align: center;
}
.sdgs-subcard-list {
  list-style: none;
  padding: 0;
  margin: 0;
  position: relative;
  z-index: 1;
  max-width: 400px;
  margin-inline: auto;
}
.sdgs-subcard-item + .sdgs-subcard-item {
  margin-top: 30px;
}
.sdgs-subcard-link {
  text-decoration: none;
  border: solid 3px;
  padding: 10px;
  display: block;
  text-align: center;
  border-radius: 60px;
  font-size: 20px;
  font-weight: bold;
  position: relative;
}
.sdgs-subcard-link::before {
  content: "";
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  padding: 10px;
  background: url(img/sdgs2/card_arrow.svg) no-repeat center;
  background-size: 56%;
  border-radius: 100%;
}

.sdgs-subcard--1 .sdgs-subcard-title,
.sdgs-subcard--1 .sdgs-subcard-link{
  color: #efa619;
}
.sdgs-subcard--1::after,
.sdgs-subcard--1 .sdgs-subcard-link::before{
  background-color: #efa619;
}

.sdgs-subcard--2 .sdgs-subcard-title,
.sdgs-subcard--2 .sdgs-subcard-link{
  color: #ef7919;
}
.sdgs-subcard--2::after,
.sdgs-subcard--2 .sdgs-subcard-link::before{
  background-color: #ef7919;
}

.sdgs-subcard--3 .sdgs-subcard-title,
.sdgs-subcard--3 .sdgs-subcard-link{
  color: #e94a1a;
}
.sdgs-subcard--3::after,
.sdgs-subcard--3 .sdgs-subcard-link::before{
  background-color: #e94a1a;
}

@media screen and (max-width: 600px) {
  .mv .subcat-img,
  .sdgs-subcard-media{
    max-width:55%!important;
    width:100%;
    margin-inline:auto; 
  }
  .mv .sdgs-subcard-image{
    width:100%;
  }
  .keyword-list{
    padding-inline:20px;
  }
  #sdgs .keyword-list a{
    font-size: clamp(0.875rem, 3.73vw, 1.75rem);
    line-height: 1.4;
  }
  .mugen {
    right: 0;
    left: 0;
    margin-inline: auto;
    margin-bottom: clamp(3.125rem, 13.33vw, 6.25rem);
    transform: scale(0.9);
  }
  .mugen img.bg {
    margin-right: auto;
  }
  .mugen p {
    font-size: 100% !important;
  }
  .mugen .left {
    left: 2%;
  }
  .mugen .right {
    right: 2%;
  }
}
@media screen and (min-width: 768px) {
  .mv .subcat-img {
    margin-top: 120px;
  }
  .mv .subcat-img.is-com3{
    margin-top: 40px;
  }
  .mv .sdgs-subcard-image {
      width: 50%;
      height: auto;
  }
  .sdgs-subcard {
    display: flex;
    gap: 60px;
    align-items: center;
    padding: 80px!important;
    margin-left: auto;
    margin-top: 60px;
    margin-left: auto;
    margin-right: 0;
  }
  .sdgs-subcard-media {
    margin-bottom: 0;
    left: -320px;
    top: auto;
    right: auto;
  }
  .sdgs-subcard--1 .sdgs-subcard-media {
    transform: translate(10px, 20px);
  }
  .sdgs-subcard--2 .sdgs-subcard-media {
    transform: translate(10px, 30px);
    top: auto;
  }
  .sdgs-subcard--3 .sdgs-subcard-media {
    transform: translate(10px, 30px);
    top: auto;
  }
  .sdgs-subcard-body {
    flex: 1;
    min-width: 0;
  }
}


#main article#sdgs-single{
  max-width: 1100px;
  margin-inline:auto;
  padding-top: 0;
  padding-inline: 0;
}
.sdgs-post-content{
  padding-inline: 24px;
}
.sdgs-relcards{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-around;
}
.sdgs-relcards{
  display:flex;
  gap:20px;
}
.sdgs-relcards .sdgs-relcard{
  background:#fff;
  border-radius:20px;
  position:relative;
  margin-top:100px;
  width:340px;
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.08);
}
.sdgs-relcards .sdgs-relcard-media{
  position:absolute;
  left: 0;
  right: 0;
  margin-inline: auto;
  margin-top: auto;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}
.sdgs-relcards .sdgs-relcard--1 .sdgs-relcard-media{
  top: -70px;
}
.sdgs-relcards .sdgs-relcard--2 .sdgs-relcard-media{
  top: -55px;
}
.sdgs-relcards .sdgs-relcard--3 .sdgs-relcard-media{
  top: -85px;
}
.sdgs-relcards .sdgs-relcard-title{
  padding:10px;
  background-color:red;
  color:#fff;
  border-radius:20px 20px 0 0;
  height:80px;
  display:flex;
  justify-content:center;
  align-items:center;
}
.sdgs-relcards .sdgs-relcard--1 .sdgs-relcard-title,
.sdgs-relcards .sdgs-relcard--1 a::before{
  background-color:#efa619;
}
.sdgs-relcards .sdgs-relcard--2 .sdgs-relcard-title,
.sdgs-relcards .sdgs-relcard--2 a::before{
  background-color:#ef7919;
}
.sdgs-relcards .sdgs-relcard--3 .sdgs-relcard-title,
.sdgs-relcards .sdgs-relcard--3 a::before{
  background-color:#e94a1a;
}
.sdgs-relcards .sdgs-relcard-list{
  margin-top:20px;
}
.sdgs-relcards .sdgs-relcard-list a{
  font-size:20px;
  text-decoration:none;
  display: block;
  line-height: 1.5;
  padding-block: 5px;
}
.sdgs-top-bnr{
  text-align:center;
  margin-top: 100px;
}
.sdgs-relcard-link{
  position:relative;
}
.sdgs-relcard-link::before {
  content: "";
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  padding: 10px;
  background: url(img/sdgs2/card_arrow.svg) no-repeat center;
  background-size: 56%;
  border-radius: 100%;
}
.sdgs-relcard-list{
  padding-inline: 20px;
  list-style:none;
}
.sdgs-relcard-item a {
  position:relative;
  padding-left:2.5rem;
}
.sdgs-relcard-item{
  text-align:left;
  margin-bottom: 10px;
}
.sdgs-relcard-item a::before {
  content: "";
  position: absolute;
  left:0;
  top: 5px;
  transform: none;
  width: 30px;
  height: 30px;
  padding: 10px;
  background: url(img/sdgs2/card_arrow.svg) no-repeat center;
  background-size: 56%;
  border-radius: 100%;
  background-color:red;
}
#sdgs-single .sdgs-section h2{
  font-size:34px;
  margin-bottom: clamp(1.563rem, 6.67vw, 3.125rem);
}

#sdgs-single .lead{
  max-width:800px;
  font-size:20px;
  font-weight:bold;
  margin-inline:auto;
  margin-bottom: clamp(2.5rem, 10.67vw, 5rem);
}
#sdgs-single section p{
  max-width:840px;
  margin-inline:auto;
  font-size: 16px;
}

#sdgs-single .cols{
  justify-content:center;
  gap: 60px;
  text-align:center;
  margin-bottom: 30px;
  flex-wrap: wrap;
}
#sdgs-single .col{
  margin-bottom:30px;
}

#sdgs-single .grid{
  margin-bottom:100px;
  text-align:center;
}
#sdgs-single .grid .grid-item:nth-child(1){
  grid-area: 1 / 1 / 2 / 2;
  margin-bottom:60px;
}
#sdgs-single .grid .grid-item:nth-child(2){
  grid-area: 1 / 2 / 2 / 3;
  margin-bottom:60px;
}
#sdgs-single .grid .grid-item:nth-child(3){
  grid-area: 2 / 1 / 3 / 2;
  margin-bottom:60px;
}
#sdgs-single .grid .grid-item:nth-child(4){
  grid-area: 2 / 2 / 3 / 3;
  margin-bottom:60px;
}

#sdgs-single .head_ttl{
  background:#efa619;
  color:#fff;
  display:table;
  margin-inline:auto;
  padding:10px;
  width:340px;
  border-radius:25px 25px 25px 0px;
  text-align:center;
  position: relative;
  margin-bottom: 30px;
}
#sdgs-single #chiiki4 .head_ttl{
  background:#ef7919;
  font-size:24px;
}
#sdgs-single #chiiki5 .head_ttl{
  background:#ef7919;
  font-size:24px;
  border-radius:25px 25px 0px 25px;
  max-width: 300px;
}
#sdgs-single #chiiki5 table{
  min-width: 700px;
  max-width:100%;
  margin-bottom: auto;
}
#sdgs-single #chiiki6 .head_ttl{
  background:#e94a1a;
}
#sdgs-single .head_ttl span{
  font-size:150%;
  margin-inline:4px;
}
#sdgs-single h3.caption{
  background:#efa619;
  color:#fff;
  display:table;
  margin-inline:auto;
  padding: 8.75px;
  width:340px;
  border-radius: 0px 25px 25px 25px;
  text-align:center;
  position: relative;
  margin-top: -30px;
  margin-bottom: -30px;
}
#sdgs-single table{
  max-width:800px;
  margin-inline:auto;
  border:solid 2px;
  background:#fff;
  text-align:center;
  font-size:18px;
  margin-bottom:80px;
  width: 100%;
}
#sdgs-single table th,
#sdgs-single table td{
  padding:10px;
}
#sdgs-single table th{
  background:#000;
  color:#fff;
  width: 240px;
}
#sdgs-single .bold{
  font-weight:bold;
}
#sdgs-single p.sdgs-caption{
  line-height:1.4375;
  margin-top: 16px;
  font-size: 20px;
}
#sdgs-single dl{
  display: table;
  margin-inline: auto;
  align-items:center;
  border-radius: 50px;
  overflow: hidden;
  width: auto;
  margin-bottom: 40px;
  background: #efa619;
  color: #fff;
  font-weight: bold;
}
#sdgs-single dl dt,
#sdgs-single dl dd{
  display: table-cell;
  font-size: clamp(0.875rem, 0.5rem + 1.6vw, 1.25rem);
  /* font-size: 20px; */
  padding: 10px clamp(0.625rem, 2.67vw, 1.25rem);
}
#sdgs-single dl dt{
  background: #ef7919;
  overflow: hidden;
  padding-left: clamp(1.25rem, 0.625rem + 2.67vw, 1.875rem);
  /* padding-left: 30px; */
  font-weight: bold;
  color: #fff;
  white-space: nowrap;
  vertical-align: middle;
}
#sdgs-single .mb0{
  margin-bottom:0;
}
#sdgs-single .mb60{
  margin-bottom:60px;
}
#sdgs-single .mb80{
  margin-bottom:80px;
}
.align-center{
  text-align:center;
}
.align-right{
  text-align:right;
}
.full-window,.full-window img{
  width: 100vw;
  margin-left: calc(50% - 50vw);
}
#chiiki1 .sdgs-media{
  margin-bottom:20px;
}
#chiiki1 .full-window{
  margin-top:100px;
  margin-bottom:100px;
}
#chiiki3 .sdgs-steps{
  text-align:center;
  padding:0;
  margin-bottom: 60px;
}
#chiiki3 .sdgs-steps li{
  background-color: #efa619;
  display:block;
  margin-inline:auto;
  margin-bottom:20px;
  padding:10px;
  border-radius:40px;
  max-width:400px;
  padding-inline:40px;
  position:relative;
  font-size:20px;
  font-weight: bold;
  color:#fff;
}
#chiiki3 .sdgs-steps li:nth-child(2){
  background-color: #ef7919;
}
#chiiki3 .sdgs-steps li:nth-child(3){
  background-color: #e94a1a;
}
#chiiki3 .sdgs-steps li:not(:last-child):before{
  content:"";
  padding:20px;
  background:url(img/sdgs2/community/flow1_l.svg)no-repeat center;
  position:absolute;
  left:-24px;
  bottom:-24px;
}
#chiiki3 .sdgs-steps li:not(:last-child):after{
  content:"";
  padding:20px;
  background:url(img/sdgs2/community/flow1_r.svg)no-repeat center;
  position:absolute;
  right:-24px;
  bottom:-24px;
}
#chiiki3 .sdgs-steps li:nth-child(2):before{
  background-image:url(img/sdgs2/community/flow2_l.svg);
}
#chiiki3 .sdgs-steps li:nth-child(2):after{
  background-image:url(img/sdgs2/community/flow2_r.svg);
}
.sdgs-panel{
  background:#fff;
  padding:40px 90px;
  border-radius:20px;
  margin-bottom:100px;
}
#chiiki3 .sdgs-panel{
  padding-inline: clamp(1.875rem, -1.25rem + 13.33vw, 5rem);
}
.sdgs-panel p span{
  display:block;
  padding-left:30px;
  position:relative;
}
.sdgs-panel p span::before{
  content:"1";
  width:24px;
  height:24px;
  aspect-ratio:1;
  background:red;
  color:#fff;
  position:absolute;
  left:0;
  display:flex;
  justify-content:center;
  align-items:center;
  border-radius:100%;
  top:0;
  bottom:0;
  margin:auto;
}
.sdgs-panel p span:nth-child(1):before{
  content:"1";
  background-color:#f4c15e;
}
.sdgs-panel p span:nth-child(2):before{
  content:"2";
  background-color:#ef7919;
}
.sdgs-panel p span:nth-child(3):before{
  content:"3";
  background-color:#e94a1a;
}
.sdgs-panel p span:nth-child(4):before{
  content:"4";
  background-color:#ef7919;
}
.sdgs-panel p span:nth-child(5):before{
  content:"5";
  background-color:#f4c15e;
}
.sdgs-panel ul{
  padding-left:0;
}
.sdgs-panel li{
  position:relative;
  padding-left:30px;
  list-style:none;
}
.sdgs-panel li::before{
  content:"";
  width:20px;
  height:20px;
  aspect-ratio:1;
  background:#e94a1a;
  color:#fff;
  position:absolute;
  left:0;
  display:flex;
  justify-content:center;
  align-items:center;
  border-radius:100%;
  top:0;
  bottom:0;
  margin:auto;
}

.sdgs-panel h3{
  text-align:center;
  color:#373789;
  font-size: 24px!important;
  margin-bottom: 30px!important;
}
.sdgs-panel .tel-box{
  background-color: rgb(239, 166, 25);
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
  color:#fff;
  padding:40px 60px;
  display:flex;
  flex-wrap: wrap;
  justify-content: space-around;
  align-items: center;
  border-radius:20px;
  font-weight:bold;
}

.sdgs-tel-label{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  font-size:26px;
}
.sdgs-tel-label span{
  font-size: 76.9%;
}
.sdgs-tel-label{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  font-size: clamp(1.125rem, 0.625rem + 2.13vw, 1.625rem);
}
.sdgs-tel-number{
  font-size: clamp(1.75rem, 1.125rem + 2.67vw, 2.375rem);
  font-weight:bold;
  background: url(img/sdgs2/community/tel.svg)no-repeat center left;
  padding-left: clamp(2.375rem, 1.625rem + 3.2vw, 3.125rem);
  background-size: clamp(1.75rem, 1.125rem + 2.67vw, 2.375rem);
  white-space: nowrap;
}
#sdgs-single .scroll-table{
    overflow-x:scroll;
  }
  #sdgs-single .scroll-table table,
  #sdgs-single .scroll-table td,
  #sdgs-single .scroll-table th{
    width:auto;
    white-space:nowrap;
  }
@media screen and (max-width: 500px){
  .sdgs-subcards {
    margin-bottom: 100px;
  }
  .sdgs-subcard{
    padding-top:80px;
    padding-bottom:40px;
    margin-top: 100px;
  }
  .sdgs-subcard-title{
    font-size: clamp(1.438rem, 6.13vw, 2.875rem);
  }
  .sdgs-subcard-link{
    padding-left: 30px;
    font-size:clamp(1rem, 4.27vw, 2rem)
  }
  .sdgs-subcard-media {
    max-width: 70%;
  }
  
  .sdgs-relcards{
    padding-inline: 24px;
    /* gap: 0; */
  }
  .sdgs-relcards .sdgs-relcard{
    max-width: 400px;
    width:100%;
    border-radius: 10px;
    margin-top:clamp(4.688rem, 20vw, 9.375rem);
  }
  .sdgs-relcards .sdgs-relcard.sdgs-relcard--2{
    margin-top:clamp(3.75rem, 16vw, 7.5rem);
  }
  #main .ttlPage{
    font-size:clamp(1.75rem, 7.47vw, 3.5rem);
    padding-inline: 0;
  }
  #main .sdgs-relcard-title{
    font-size:clamp(1.438rem, 6.13vw, 2.875rem);
    border-radius: 10px 10px 0 0;
  }
  #main .sdgs-relcard ul{
    margin-bottom:20px;
  }
  .sdgs-top-bnr{
    margin-top:clamp(2.5rem, 10.67vw, 5rem);
    padding-inline: 16px;
  }
  #sdgs-single .sdgs-section h2{
    font-size:clamp(1.438rem, 6.13vw, 2.875rem);
    margin-bottom: clamp(1.875rem, 8vw, 3.75rem);
  }
  .parent-ttl,
  #sdgs-single p{
    font-size:clamp(1rem, 4.27vw, 2rem);
  }
  #sdgs-single .lead{
    font-size:clamp(1.063rem, 4.53vw, 2.125rem);
  }
}
@media screen and (min-width:768px ){
  br.sp{
    display:none;
  }
  #sdgs-single table{
    min-width:500px;
  }
  #sdgs-single .sdgs-col table{
    margin-top:auto;
  }
  #sdgs-single .cols{
    display:flex;
    align-items: center;
  }
  #sdgs-single .col{
    margin-bottom: 0px;
  }
  #sdgs-single .grid{
    display:grid;
    gap: 60px;
  }
  #main #sdgs-single .grid .sdgs-grid-item{
    margin-bottom:0;
  }
}
@media screen and (min-width:1100px ){
  #sdgs-single .cols{
    flex-wrap: nowrap;
  }
}