@charset "UTF-8";
/* ===================================================================
CSS information

 file name  : copy.css
 author     : Ability Consultant
 style info : コピー
=================================================================== */
.con_intro, .con_philosophy .box_philosophy, .con_category, #target01, .con_contact_rsv {
  max-width: 1260px;
  margin: auto;
}
@media only screen and (max-width: 1260px) {
  .con_intro, .con_philosophy .box_philosophy, .con_category, #target01, .con_contact_rsv {
    width: 95%;
  }
}
@media print {
  .con_intro, .con_philosophy .box_philosophy, .con_category, #target01, .con_contact_rsv {
    width: 95%;
  }
}
.ie8 .con_intro, .ie8 .con_philosophy .box_philosophy, .con_philosophy .ie8 .box_philosophy, .ie8 .con_category, .ie8 #target01, .ie8 .con_contact_rsv {
  width: 95%;
}

.con_intro:after, .con_philosophy .box_philosophy:after, .con_category:after, .box_content:after {
  content: "";
  display: table;
  clear: both;
}

/* Hover animation */
/* -----------------------------------------------------------
	con_mainimg
----------------------------------------------------------- */
.con_mainimage {
  background: url(../images/sdgs/img_main.jpg) center 0 no-repeat;
}
@media only screen and (max-width: 767px) {
  .con_mainimage {
    background: url(../images/sdgs/img_main_sp.jpg) center 0 no-repeat;
  }
}
.con_mainimage .st_title {
  display: none;
}

#contents {
  font-size: 1.1em;
  /* -- box_language-- */
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #contents {
    font-size: 1.1em;
  }
}
@media only screen and (max-width: 767px) {
  #contents {
    font-size: 1em;
  }
}
#contents h4 {
  font-weight: 900;
  -webkit-transform: rotate(0.028deg);
          transform: rotate(0.028deg);
}
#contents .flex_area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 767px) {
  #contents .flex_area {
    display: block;
  }
}
#contents .large_txt {
  font-size: 158%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #contents .large_txt {
    font-size: 143%;
  }
}
@media only screen and (max-width: 767px) {
  #contents .large_txt {
    font-size: 129%;
  }
}
#contents .box_language {
  padding: 2rem 0;
  margin: 2rem auto;
  background: #f9f9f9;
  width: 50%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #contents .box_language {
    padding: 1.75rem 0;
  }
}
@media only screen and (max-width: 767px) {
  #contents .box_language {
    padding: 1.5rem 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #contents .box_language {
    margin: 1.75rem auto;
  }
}
@media only screen and (max-width: 767px) {
  #contents .box_language {
    margin: 1.5rem auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #contents .box_language {
    width: 60%;
  }
}
@media only screen and (max-width: 767px) {
  #contents .box_language {
    width: 100%;
  }
}
#contents .box_language h4 {
  text-align: center;
  font-weight: lighter;
  font-size: 158%;
  margin-bottom: 1.25rem;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #contents .box_language h4 {
    font-size: 150%;
  }
}
@media only screen and (max-width: 767px) {
  #contents .box_language h4 {
    font-size: 143%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #contents .box_language h4 {
    margin-bottom: 1.25rem;
  }
}
@media only screen and (max-width: 767px) {
  #contents .box_language h4 {
    margin-bottom: 1rem;
  }
}
#contents .box_language ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#contents .box_language ul li {
  font-size: 122%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #contents .box_language ul li {
    font-size: 115%;
  }
}
@media only screen and (max-width: 767px) {
  #contents .box_language ul li {
    font-size: 115%;
  }
}
#contents .box_language ul li a {
  text-decoration: none;
}
#contents .box_language ul li:after {
  content: '｜';
  padding: 0 .5rem;
}

.st_lg_jp_en {
  text-align: center;
  margin-bottom: 40px;
  font-weight: normal;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .st_lg_jp_en {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .st_lg_jp_en {
    margin-bottom: 0.6em;
  }
}
.st_lg_jp_en span {
  display: inline-block;
}
.st_lg_jp_en span.jp {
  font-size: 229%;
  letter-spacing: 0.07em;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .st_lg_jp_en span.jp {
    font-size: 200%;
  }
}
@media only screen and (max-width: 767px) {
  .st_lg_jp_en span.jp {
    font-size: 129%;
  }
}
.st_lg_jp_en span.en {
  font-size: 86%;
  color: #9e9e9e;
  letter-spacing: 0.15em;
  position: relative;
  z-index: 5;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .st_lg_jp_en span.en {
    font-size: 86%;
  }
}
@media only screen and (max-width: 767px) {
  .st_lg_jp_en span.en {
    font-size: 72%;
  }
}

/* ----------------------------------------------------------
　　多言語用
------------------------------------------------------------*/
.lang_class_es #target01 .box_content .box_title_sdgs .st_lg_jp_en:before {
  right: 40em !important;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .lang_class_es #target01 .box_content .box_title_sdgs .st_lg_jp_en:before {
    left: -4em;
    bottom: 2px;
  }
}
@media only screen and (max-width: 767px) {
  .lang_class_es #target01 .box_content .box_title_sdgs .st_lg_jp_en:before {
    left: -15% !important;
  }
}
.lang_class_es #target03 .box_content .box_title_sdgs .st_lg_jp_en:before {
  left: -4%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .lang_class_es #target03 .box_content .box_title_sdgs .st_lg_jp_en:before {
    left: -7%;
  }
}
@media only screen and (max-width: 767px) {
  .lang_class_es #target03 .box_content .box_title_sdgs .st_lg_jp_en:before {
    left: 3% !important;
    top: 2em;
  }
}
.lang_class_es #target03 .box_content .box_title_sdgs .st_lg_jp_en .jp:before {
  left: -8%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .lang_class_es #target03 .box_content .box_title_sdgs .st_lg_jp_en .jp:before {
    left: -15%;
  }
}
@media only screen and (max-width: 767px) {
  .lang_class_es #target03 .box_content .box_title_sdgs .st_lg_jp_en .jp:before {
    left: 0%;
  }
}
.lang_class_es #target03 .box_content .box_title_sdgs .st_lg_jp_en .jp:after {
  right: -4%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .lang_class_es #target03 .box_content .box_title_sdgs .st_lg_jp_en .jp:after {
    right: -8% !important;
  }
}
@media only screen and (max-width: 767px) {
  .lang_class_es #target03 .box_content .box_title_sdgs .st_lg_jp_en .jp:after {
    top: 45%;
    right: 0%;
    width: 10px;
  }
}

.lang_class_tw #target01 .box_content .box_title_sdgs .st_lg_jp_en:before {
  position: absolute;
  background: url(../images/sdgs/ic_3.png) no-repeat;
  width: 2.7em !important;
  height: 2.7em !important;
  content: '';
  bottom: 5px;
  right: 23em !important;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .lang_class_tw #target01 .box_content .box_title_sdgs .st_lg_jp_en:before {
    width: 2.7em;
    left: -2em !important;
    bottom: 2px;
  }
}
@media only screen and (max-width: 767px) {
  .lang_class_tw #target01 .box_content .box_title_sdgs .st_lg_jp_en:before {
    bottom: -20% !important;
    left: -3% !important;
  }
}
.lang_class_tw #target01 .box_content .box_title_sdgs .st_lg_jp_en .jp:before {
  position: absolute;
  content: '';
  display: block;
  width: 30px;
  height: 1px;
  background-color: #000;
  top: 45%;
  left: -34% !important;
}
@media only screen and (max-width: 767px) {
  .lang_class_tw #target01 .box_content .box_title_sdgs .st_lg_jp_en .jp:before {
    top: 45%;
    left: -40%;
    width: 10px;
  }
}
.lang_class_tw #target01 .box_content .box_title_sdgs .st_lg_jp_en .jp:after {
  position: absolute;
  content: '';
  display: block;
  width: 30px;
  height: 1px;
  background-color: #000;
  top: 45%;
  right: -15%;
}
@media only screen and (max-width: 767px) {
  .lang_class_tw #target01 .box_content .box_title_sdgs .st_lg_jp_en .jp:after {
    top: 45%;
    right: -20%;
    width: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .lang_class_tw #target03 .box_content .box_title_sdgs .st_lg_jp_en:before {
    left: -10%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .lang_class_tw #target03 .box_content .box_title_sdgs .st_lg_jp_en .jp:after {
    right: -8% !important;
  }
}
@media only screen and (max-width: 767px) {
  .lang_class_tw #target03 .box_content .box_title_sdgs .st_lg_jp_en .jp:after {
    top: 45%;
    right: -13%;
    width: 10px;
  }
}

@media only screen and (max-width: 767px) {
  .lang_class_ko #target01 .box_content .box_title_sdgs .st_lg_jp_en:before {
    background-size: 1.5em;
    left: -3%;
    top: 1.75em;
  }
}
@media only screen and (max-width: 767px) {
  .lang_class_ko #target01 .box_content .box_title_sdgs .st_lg_jp_en .jp:before {
    top: 45%;
    left: -10%;
    width: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .lang_class_ko #target01 .box_content .box_title_sdgs .st_lg_jp_en .jp:after {
    right: -9%;
  }
}
@media only screen and (max-width: 767px) {
  .lang_class_ko #target03 .box_content .box_title_sdgs .st_lg_jp_en:before {
    left: -4%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .lang_class_ko #target03 .box_content .box_title_sdgs .st_lg_jp_en .jp:after {
    right: -8% !important;
  }
}
@media only screen and (max-width: 767px) {
  .lang_class_ko #target03 .box_content .box_title_sdgs .st_lg_jp_en .jp:after {
    top: 45%;
    right: -10%;
    width: 10px;
  }
}

/* -----------------------------------------------------------
	con_intro
----------------------------------------------------------- */
.con_intro {
  margin: 35px auto auto;
  position: relative;
  /* &:after {
  	display: block;
  	content: '';
  	position: absolute;
  	bottom: -12px;
  	width: 100%;
  	height: 1px;
  	border-top: 1px solid $bg_line_this_whte;
  	@media only screen and (min-width: 1024px) and (max-width: 1276px) {
  		max-width: 900px;
  	}
  } */
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_intro {
    margin: 30px auto auto;
  }
}
@media only screen and (max-width: 767px) {
  .con_intro {
    margin: 1em auto auto;
  }
}
.con_intro .flex_area {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media only screen and (max-width: 767px) {
  .con_intro .flex_area {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.con_intro .flex_area .img {
  padding-right: 3.1348%;
  margin-right: 3.1348%;
  border-right: 1px solid #ccc;
}
@media only screen and (max-width: 767px) {
  .con_intro .flex_area .img {
    width: 40%;
  }
}
@media only screen and (max-width: 767px) {
  .con_intro .flex_area .img img {
    max-width: 70%;
    width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .con_intro .flex_area .img02 {
    width: 40%;
  }
}
@media only screen and (max-width: 767px) {
  .con_intro .flex_area .img02 img {
    max-width: 70%;
    width: 100%;
  }
}
.con_intro p {
  text-align: center;
}
.con_intro .txt {
  margin-top: 26px;
  font-size: 158%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_intro .txt {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .con_intro .txt {
    margin-top: 1em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_intro .txt {
    font-size: 143%;
  }
}
@media only screen and (max-width: 767px) {
  .con_intro .txt {
    font-size: 129%;
  }
}
.con_intro .txt2 {
  margin-top: 26px;
  font-size: 108%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_intro .txt2 {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .con_intro .txt2 {
    margin-top: 1em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_intro .txt2 {
    font-size: 108%;
  }
}
@media only screen and (max-width: 767px) {
  .con_intro .txt2 {
    font-size: 108%;
  }
}
.con_intro .line_img {
  margin-top: 30px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_intro .line_img {
    margin-top: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .con_intro .line_img {
    margin-top: 1em;
  }
}

.con_profile {
  background: url(../images/sdgs/img_history.jpg) center 0 no-repeat;
  margin-top: 50px;
  height: 634px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_profile {
    margin-top: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .con_profile {
    margin-top: 2em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_profile {
    height: 634px;
  }
}
@media only screen and (max-width: 767px) {
  .con_profile {
    height: auto;
  }
}
.con_profile .flex_area {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  padding-top: 7em;
  padding: 7em 0 0;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_profile .flex_area {
    padding: 7em 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .con_profile .flex_area {
    padding: 2em 0;
  }
}
.con_profile .box_txt {
  width: 42.92929%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: rgba(255, 255, 255, 0.7);
  height: 350px;
}
@media only screen and (max-width: 767px) {
  .con_profile .box_txt {
    width: 100%;
  }
}
.con_profile .box_txt .st_lg_line {
  text-align: left;
  margin-bottom: 40px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_profile .box_txt .st_lg_line {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .con_profile .box_txt .st_lg_line {
    margin-bottom: 1em;
  }
}
@media only screen and (max-width: 767px) {
  .con_profile .box_txt .st_lg_line {
    text-align: center;
  }
}
.con_profile .box_txt .txt {
  padding-left: 30px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_profile .box_txt .txt {
    padding-left: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .con_profile .box_txt .txt {
    padding-left: 1em;
  }
}
.con_profile .box_txt .txt span {
  display: block;
  margin-bottom: 15px;
  font-weight: 600;
}
@media only screen and (min-width: 1025px) {
  .con_profile .box_txt .txt span {
    font-size: 1.4em;
  }
}
@media print {
  .con_profile .box_txt .txt span {
    font-size: 1.4em;
  }
}
.ie8 .con_profile .box_txt .txt span {
  font-size: 1.4em;
}
@media only screen and (max-width: 767px) {
  .con_profile .box_txt .txt span {
    margin-bottom: 10px;
  }
}
.con_profile .box_txt .txt span.name {
  display: inline-block;
  margin-bottom: 0;
  font-size: 1.5em;
}
@media only screen and (max-width: 767px) {
  .con_profile .box_img {
    max-width: 60%;
    width: 100%;
    position: relative;
    margin: auto;
    top: -18px;
  }
}
@media only screen and (max-width: 767px) {
  .con_profile .box_img .img {
    text-align: center;
  }
}
.con_profile .box_img .txt {
  text-align: right;
  margin-top: 5px;
  margin-bottom: 10px;
}
.con_profile .box_img .img_name {
  padding-left: 60px;
}
@media only screen and (max-width: 767px) {
  .con_profile .box_img .img_name {
    max-width: 200px;
    width: 100%;
    margin-left: auto;
  }
}

.con_philosophy {
  margin-top: 75px;
  position: relative;
  overflow: hidden;
  padding-bottom: 40px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_philosophy {
    margin-top: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .con_philosophy {
    margin-top: 2.5em;
  }
}
.con_philosophy .box_philosophy {
  z-index: 1;
  border: 3px solid #aa9564;
  outline: 1px solid #aa9564;
  /* 線幅、線のスタイル、カラー */
  outline-offset: -10px;
  /* 対象の要素からの距離、マイナス(内側)にも対応 */
  background: #fff;
  z-index: 100;
}
.con_philosophy .box_philosophy:before {
  display: block;
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  width: 10000%;
  height: 10000%;
  background: #ded4ad;
  z-index: -1;
}
.con_philosophy .box_philosophy:after {
  content: '';
  position: absolute;
  width: 23em;
  height: 28em;
  background: url(../sdgs/images/img_logo03.png) no-repeat;
  right: 50%;
  bottom: 50px;
}
.con_philosophy .box_philosophy .img_logo {
  text-align: center;
  margin-top: 30px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_philosophy .box_philosophy .img_logo {
    margin-top: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .con_philosophy .box_philosophy .img_logo {
    margin-top: 1em;
  }
}
.con_philosophy .box_philosophy .txt {
  text-align: center;
  margin-bottom: 70px;
  line-height: 2.08333;
  font-size: 143%;
  position: relative;
  color: #3d030a;
  font-weight: 900;
  -webkit-transform: rotate(0.028deg);
          transform: rotate(0.028deg);
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_philosophy .box_philosophy .txt {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .con_philosophy .box_philosophy .txt {
    margin-bottom: 1.5em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_philosophy .box_philosophy .txt {
    font-size: 143%;
  }
}
@media only screen and (max-width: 767px) {
  .con_philosophy .box_philosophy .txt {
    font-size: 129%;
  }
}
@media only screen and (max-width: 767px) {
  .con_philosophy .box_philosophy .txt {
    width: 90%;
    margin-right: auto;
    margin-left: auto;
    text-align: left;
    font-weight: normal;
    line-height: 1.5625;
  }
}
.con_philosophy .box_philosophy .txt:before {
  position: absolute;
  content: '“';
  font-size: 286%;
  left: 36%;
  top: -15%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_philosophy .box_philosophy .txt:before {
    font-size: 215%;
  }
}
@media only screen and (max-width: 767px) {
  .con_philosophy .box_philosophy .txt:before {
    font-size: 129%;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1145px) {
  .con_philosophy .box_philosophy .txt:before {
    left: 32%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_philosophy .box_philosophy .txt:before {
    left: 28%;
  }
}
@media only screen and (max-width: 767px) {
  .con_philosophy .box_philosophy .txt:before {
    display: none;
  }
}
.con_philosophy .box_philosophy .txt:after {
  position: absolute;
  content: '”';
  font-size: 286%;
  bottom: -35%;
  right: 35%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_philosophy .box_philosophy .txt:after {
    font-size: 215%;
  }
}
@media only screen and (max-width: 767px) {
  .con_philosophy .box_philosophy .txt:after {
    font-size: 129%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_philosophy .box_philosophy .txt:after {
    bottom: -28%;
    right: 27%;
  }
}
@media only screen and (max-width: 767px) {
  .con_philosophy .box_philosophy .txt:after {
    display: none;
  }
}

.con_category .box_common {
  position: relative;
  width: 31.74603%;
  margin-right: 2.38095%;
  margin-top: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_category .box_common {
    margin-top: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .con_category .box_common {
    margin-top: 3em;
  }
}
@media only screen and (max-width: 767px) {
  .con_category .box_common {
    width: 100%;
  }
}
.con_category .box_common .img {
  position: absolute;
  top: -5%;
  right: 45%;
  z-index: 2;
}
@media only screen and (min-width: 1130px) and (max-width: 1246px) {
  .con_category .box_common .img {
    top: -2%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_category .box_common .img {
    top: -3%;
    right: 40%;
  }
}
@media only screen and (max-width: 767px) {
  .con_category .box_common .img {
    top: -3%;
  }
}
.con_category .box_common h4 {
  margin-top: 40px;
  text-align: center;
  -webkit-transform: rotate(0.028deg);
          transform: rotate(0.028deg);
  font-weight: 900;
  font-size: 158%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_category .box_common h4 {
    margin-top: 70px;
  }
}
@media only screen and (max-width: 767px) {
  .con_category .box_common h4 {
    margin-top: 2em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_category .box_common h4 {
    font-size: 158%;
  }
}
@media only screen and (max-width: 767px) {
  .con_category .box_common h4 {
    font-size: 129%;
  }
}
.con_category .box_common .img_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-top: 20px;
  margin-right: 7.8%;
  margin-left: 7.8%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_category .box_common .img_list {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .con_category .box_common .img_list {
    margin-top: 1em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_category .box_common .img_list {
    width: 88%;
    margin-right: auto;
    margin-left: auto;
  }
}
@media only screen and (max-width: 767px) {
  .con_category .box_common .img_list {
    width: 80%;
    margin-right: auto;
    margin-left: auto;
  }
}
.con_category .box_common .img_list li {
  margin-right: 1%;
  margin-bottom: 1%;
}
.con_category .box_common .img_list li:last-child {
  margin-right: 0;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_category .box_common .img_list li {
    width: 32%;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .con_category .box_common .img_list li {
    width: 32%;
    margin-right: 2%;
    margin-bottom: 2%;
  }
  .con_category .box_common .img_list li:nth-child(3n) {
    margin-right: 0;
  }
}
.con_category .box_common .txt_area {
  margin-top: 20px;
  margin-bottom: 20px;
  height: 207px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_category .box_common .txt_area {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .con_category .box_common .txt_area {
    margin-top: 1em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_category .box_common .txt_area {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .con_category .box_common .txt_area {
    margin-bottom: 1em;
  }
}
@media only screen and (max-width: 1024px) {
  .con_category .box_common .txt_area {
    height: auto;
  }
}
.con_category .box_common .txt_area li {
  color: #a48d57;
  list-style: initial;
  margin-left: 12.5%;
}
@media only screen and (max-width: 767px) {
  .con_category .box_common .txt_area li {
    margin-left: 10%;
  }
}
.con_category .box_common .txt_area li span {
  color: #333333;
}
.con_category .box_common .btn {
  vertical-align: middle;
  text-decoration: none;
  text-align: center;
  margin-bottom: 30px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_category .box_common .btn {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .con_category .box_common .btn {
    margin-bottom: 1em;
  }
}
.con_category .box_common .btn .icon {
  display: inline-block;
  vertical-align: text-bottom;
  width: 20px;
  height: 20px;
  line-height: 18px;
  font-size: 14px;
  color: #888888;
  border: 1px solid #888888;
  background: transparent;
  border-radius: 50%;
  text-align: center;
  margin-right: 5px;
}

.box_category01 {
  border: 2px solid #88b2a5;
  position: relative;
}
.box_category01:before {
  position: absolute;
  content: '';
  width: 120px;
  height: 1px;
  -webkit-transform: rotateZ(-38deg);
          transform: rotateZ(-38deg);
  outline: 1px solid #aa9564;
  outline-offset: 1px;
  left: 49%;
  top: -11%;
  z-index: -1;
}
@media only screen and (min-width: 1130px) and (max-width: 1246px) {
  .box_category01:before {
    width: 145px;
    top: -8%;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1129px) {
  .box_category01:before {
    width: 140px;
    left: 49%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_category01:before {
    width: 153px;
    left: 45%;
    top: -8%;
  }
}
@media only screen and (max-width: 767px) {
  .box_category01:before {
    display: none;
  }
}
.box_category01 h4 {
  color: #296e58;
  position: relative;
  font-weight: bold;
}
.box_category01 h4:before {
  position: absolute;
  content: '';
  background: url(../sdgs/images/img_icon01.png) no-repeat;
  width: 1em;
  height: 1em;
  top: 8px;
  left: 21%;
}
@media only screen and (min-width: 1130px) and (max-width: 1230px) {
  .box_category01 h4:before {
    left: 18%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_category01 h4:before {
    top: -22px;
    left: 42%;
  }
}
@media only screen and (max-width: 767px) {
  .box_category01 h4:before {
    display: none;
  }
}

.box_category02 {
  border: 2px solid #7bb1c1;
}
.box_category02:before {
  position: absolute;
  content: '';
  width: 86px;
  height: 1px;
  -webkit-transform: rotateZ(-90deg);
          transform: rotateZ(-90deg);
  outline: 1px solid #aa9564;
  outline-offset: 1px;
  top: -10%;
  left: 38%;
  z-index: -1;
}
@media only screen and (min-width: 1130px) and (max-width: 1246px) {
  .box_category02:before {
    width: 100px;
    left: 35%;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1129px) {
  .box_category02:before {
    width: 100px;
    left: 34%;
  }
}
@media only screen and (min-width: 919px) and (max-width: 1024px) {
  .box_category02:before {
    width: 100px !important;
    left: 34% !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_category02:before {
    width: 90px;
    left: 30%;
    top: -5%;
  }
}
@media only screen and (max-width: 767px) {
  .box_category02:before {
    display: none;
  }
}
.box_category02 h4 {
  color: #139fc7;
  position: relative;
  font-weight: bold;
}
.box_category02 h4:before {
  position: absolute;
  content: '';
  background: url(../sdgs/images/img_icon02.png) no-repeat;
  width: 1.5em;
  height: 1em;
  top: 8px;
  left: 17%;
}
@media only screen and (min-width: 1130px) and (max-width: 1230px) {
  .box_category02 h4:before {
    left: 13%;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1129px) {
  .box_category02 h4:before {
    left: 37%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_category02 h4:before {
    top: -22px;
    left: 42%;
  }
}
@media only screen and (max-width: 767px) {
  .box_category02 h4:before {
    display: none;
  }
}

.box_category03 {
  border: 2px solid #be94a2;
  margin-right: 0 !important;
}
.box_category03:before {
  position: absolute;
  content: '';
  width: 120px;
  height: 1px;
  -webkit-transform: rotateZ(-140deg);
          transform: rotateZ(-140deg);
  outline: 1px solid #aa9564;
  /* 線幅、線のスタイル、カラー */
  outline-offset: 1px;
  top: -12%;
  left: 20%;
  z-index: -1;
}
@media only screen and (min-width: 1130px) and (max-width: 1246px) {
  .box_category03:before {
    width: 145px;
    top: -8%;
    left: 15%;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1129px) {
  .box_category03:before {
    width: 146px;
    left: 9%;
  }
}
@media only screen and (min-width: 919px) and (max-width: 1024px) {
  .box_category03:before {
    width: 146px !important;
    left: 7% !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_category03:before {
    width: 153px;
    top: -8%;
    left: -13%;
  }
}
@media only screen and (max-width: 767px) {
  .box_category03:before {
    display: none;
  }
}
.box_category03 h4 {
  color: #a22e55;
  position: relative;
  font-weight: bold;
}
@media only screen and (max-width: 767px) {
  .box_category03 h4 {
    font-weight: normal;
  }
}
.box_category03 h4:before {
  position: absolute;
  content: '';
  background: url(../sdgs/images/img_icon03.png) no-repeat;
  width: 1.8em;
  height: 1.5em;
  top: 2px;
  left: 12%;
}
@media only screen and (min-width: 1130px) and (max-width: 1230px) {
  .box_category03 h4:before {
    left: 10%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_category03 h4:before {
    top: -30px;
    left: 42%;
  }
}
@media only screen and (max-width: 767px) {
  .box_category03 h4:before {
    display: none;
  }
}

.con_content {
  margin-bottom: 140px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_content {
    margin-bottom: 110px;
  }
}
@media only screen and (max-width: 767px) {
  .con_content {
    margin-bottom: 70px;
  }
}

.box_content .box_title_sdgs {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .box_content .box_title_sdgs .txt {
    margin-top: 1em;
  }
}
.box_content .st_lg_jp_en {
  display: inline-block;
}
.box_content .st_lg_jp_en .jp {
  position: relative;
}
.box_content .st_lg_jp_en .jp:before {
  position: absolute;
  content: '';
  display: block;
  width: 30px;
  height: 1px;
  background-color: #000;
  top: 45%;
  left: -20%;
}
@media only screen and (max-width: 767px) {
  .box_content .st_lg_jp_en .jp:before {
    top: 45%;
    left: -40%;
    width: 10px;
  }
}
.box_content .st_lg_jp_en .jp:after {
  position: absolute;
  content: '';
  display: block;
  width: 30px;
  height: 1px;
  background-color: #000;
  top: 45%;
  right: -15%;
}
@media only screen and (max-width: 767px) {
  .box_content .st_lg_jp_en .jp:after {
    top: 45%;
    right: -40%;
    width: 10px;
  }
}
.box_content h4 {
  font-size: 172%;
  border-bottom: 1px solid #aa9564;
  padding-bottom: 10px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_content h4 {
    font-size: 158%;
  }
}
@media only screen and (max-width: 767px) {
  .box_content h4 {
    font-size: 143%;
  }
}
.box_content .flex_area {
  margin-top: 40px;
  line-height: 1.8;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_content .flex_area {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .box_content .flex_area {
    margin-top: 0;
  }
}
.box_content .flex_area li {
  color: #a48d57;
  margin-left: 4%;
}
@media only screen and (max-width: 767px) {
  .box_content .flex_area li {
    margin-left: 9%;
  }
}
.box_content .flex_area li span {
  color: #333333;
}
.box_content .flex_area li table {
  color: #333333;
  width: 100%;
}
.box_content .flex_area li table tr {
  margin-top: 12px;
  display: block;
  width: 100%;
}
.box_content .flex_area li table tr.first-child {
  border-top: 1px solid #d2d2d2;
  padding-top: 15px;
}
.box_content .flex_area li table tr.last-child {
  border-bottom: 1px solid #d2d2d2;
  padding-bottom: 15px;
}
.box_content .flex_area li table tr th {
  padding-right: 10px;
  font-weight: normal;
  white-space: nowrap;
  width: 67px;
}
.box_content .flex_area li p {
  color: #333333;
}
.box_content .flex_area .txt {
  margin-top: 20px;
  font-size: 108%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_content .flex_area .txt {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .box_content .flex_area .txt {
    margin-top: 1em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_content .flex_area .txt {
    font-size: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .box_content .flex_area .txt {
    font-size: 100%;
  }
}
.box_content .box_locl_image {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 767px) {
  .box_content .box_locl_image {
    margin-top: 1em;
  }
}
.box_content .box_locl_image .txt {
  margin-top: 12px;
  margin-bottom: 20px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_content .box_locl_image .txt {
    margin-top: 12px;
  }
}
@media only screen and (max-width: 767px) {
  .box_content .box_locl_image .txt {
    margin-top: 0.3em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_content .box_locl_image .txt {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .box_content .box_locl_image .txt {
    margin-bottom: 1em;
  }
}
.box_content .box_locl_image .inner .img {
  margin-right: 5%;
}
.box_content .box_locl_image .inner02 .img {
  margin-left: 5%;
}
.box_content .box_locl_image .inner02 .txt {
  margin-left: 5%;
}

#target01 {
  margin-top: 50px;
  padding-top: 50px;
  width: 100%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target01 {
    margin-top: 40px;
  }
}
@media only screen and (max-width: 767px) {
  #target01 {
    margin-top: 2em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target01 {
    padding-top: 40px;
  }
}
@media only screen and (max-width: 767px) {
  #target01 {
    padding-top: 2em;
  }
}
#target01 .st_lg_jp_en {
  position: relative;
}
#target01 .st_lg_jp_en:before {
  position: absolute;
  background: url(../images/sdgs/ic_3.png) no-repeat;
  width: 2.5em;
  height: 2.5em;
  content: '';
  bottom: 5px;
  right: 36em;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target01 .st_lg_jp_en:before {
    left: -3em;
    bottom: 2px;
  }
}
@media only screen and (max-width: 767px) {
  #target01 .st_lg_jp_en:before {
    bottom: 0px;
    left: 11%;
  }
}
#target01 .flex_area {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target01 .flex_area {
    -webkit-box-pack: space-evenly;
        -ms-flex-pack: space-evenly;
            justify-content: space-evenly;
  }
}
@media only screen and (max-width: 767px) {
  #target01 .flex_area {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
#target01 .flex_area .flex_box {
  border: 1px solid #6c0505;
  padding: 3em 4em;
  width: 48%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target01 .flex_area .flex_box {
    padding: 3em 2em;
  }
}
@media only screen and (max-width: 767px) {
  #target01 .flex_area .flex_box {
    padding: 1em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target01 .flex_area .flex_box {
    width: 45%;
  }
}
@media only screen and (max-width: 767px) {
  #target01 .flex_area .flex_box {
    width: 95%;
  }
}
@media only screen and (max-width: 767px) {
  #target01 .flex_area .flex_box {
    margin: 3em auto 0;
  }
}
#target01 .flex_area .flex_box h4 {
  border: none;
  text-align: center;
}
#target01 .flex_area .flex_box.box_02 {
  border: 1px solid #166c05;
}
@media only screen and (max-width: 767px) {
  #target01 .flex_area .flex_box.box_02 .img {
    width: 25%;
    margin-right: 2em;
  }
}
#target01 .flex_area .img {
  max-width: 550px;
  text-align: end;
  width: 100%;
  margin: 0 auto;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target01 .flex_area .img {
    max-width: 350px;
  }
}
@media only screen and (max-width: 767px) {
  #target01 .flex_area .img {
    width: 45%;
    margin: 0 0 0 auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target01 .flex_area ul {
    margin-right: 5%;
  }
}
@media only screen and (max-width: 767px) {
  #target01 .flex_area ul {
    margin-top: 1em;
  }
}
#target01 .flex_area li {
  padding-bottom: 10px;
}
#target01 .flex_area li:last-child {
  width: 107%;
  padding-bottom: 0px;
}
@media only screen and (max-width: 767px) {
  #target01 .flex_area li:last-child {
    width: 100%;
  }
}
#target01 .flex_area .box_first {
  width: 47.46032%;
  margin-right: 6.34921%;
}
@media only screen and (max-width: 767px) {
  #target01 .flex_area .box_first {
    width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  #target01 .flex_area .box_first h4 {
    margin-top: 1em;
  }
}
#target01 .flex_area .box_last {
  width: 47.61905%;
}
@media only screen and (max-width: 767px) {
  #target01 .flex_area .box_last {
    width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  #target01 .flex_area .box_last h4 {
    margin-top: 1em;
  }
}

#target02 {
  margin-top: 70px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target02 {
    margin-top: 60px;
  }
}
@media only screen and (max-width: 767px) {
  #target02 {
    margin-top: 2em;
  }
}
#target02 .st_lg_jp_en {
  position: relative;
}
#target02 .st_lg_jp_en:before {
  position: absolute;
  background: url(../images/sdgs/img_icon02.png) no-repeat;
  width: 2.7em;
  height: 1.8em;
  content: '';
  bottom: 10px;
  left: -6%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target02 .st_lg_jp_en:before {
    bottom: 7px;
    left: 0%;
  }
}
@media only screen and (max-width: 767px) {
  #target02 .st_lg_jp_en:before {
    bottom: -4px;
    left: 9%;
  }
}
#target02 .flex_area {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
#target02 .flex_area.next_flex {
  margin-top: 0;
}
#target02 .flex_area .box_local_txt {
  width: 47.46032%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target02 .flex_area .box_local_txt {
    width: 60%;
    margin-right: 5%;
  }
}
@media only screen and (max-width: 767px) {
  #target02 .flex_area .box_local_txt {
    width: 100%;
  }
}
#target02 .flex_area .box_local_txt .color_area {
  max-width: 60px;
  width: 100%;
  text-align: center;
  background: #a48d57;
  color: #FFF;
  margin-top: 20px;
  float: left;
  display: block;
  margin-right: 27px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target02 .flex_area .box_local_txt .color_area {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  #target02 .flex_area .box_local_txt .color_area {
    margin-top: 1em;
  }
}
#target02 .flex_area .box_local_txt ul {
  margin-top: 20px;
  float: left;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target02 .flex_area .box_local_txt ul {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  #target02 .flex_area .box_local_txt ul {
    margin-top: 1em;
  }
}
#target02 .flex_area .box_local_txt ul li {
  width: 100%;
}
#target02 .flex_area .box_local_txt h4 {
  clear: both;
}
#target02 .flex_area .box_local_txt .txt02 {
  clear: both;
  padding-top: 20px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target02 .flex_area .box_local_txt .txt02 {
    padding-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  #target02 .flex_area .box_local_txt .txt02 {
    padding-top: 1em;
  }
}
#target02 .flex_area .producer {
  padding-top: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target02 .flex_area .producer {
    padding-top: 40px;
  }
}
@media only screen and (max-width: 767px) {
  #target02 .flex_area .producer {
    padding-top: 2em;
  }
}
#target02 .flex_area .info {
  margin-top: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target02 .flex_area .info {
    margin-top: 40px;
  }
}
@media only screen and (max-width: 767px) {
  #target02 .flex_area .info {
    margin-top: 2em;
  }
}
#target02 .flex_area .barrier-free {
  margin-top: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target02 .flex_area .barrier-free {
    margin-top: 40px;
  }
}
@media only screen and (max-width: 767px) {
  #target02 .flex_area .barrier-free {
    margin-top: 2em;
  }
}
#target02 .btn_normal {
  margin-top: 12px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target02 .btn_normal {
    margin-top: 12px;
  }
}
@media only screen and (max-width: 767px) {
  #target02 .btn_normal {
    margin-top: 0.5em;
  }
}
#target02 .btn_normal a {
  margin-left: 0;
  max-width: 240px;
}
@media only screen and (max-width: 767px) {
  #target02 .btn_normal a {
    max-width: 170px;
  }
}
#target02 .last {
  text-align: center;
}

#target03 {
  margin-top: 70px;
  padding-top: 70px;
  width: 100%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target03 {
    margin-top: 60px;
  }
}
@media only screen and (max-width: 767px) {
  #target03 {
    margin-top: 2em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target03 {
    padding-top: 60px;
  }
}
@media only screen and (max-width: 767px) {
  #target03 {
    padding-top: 2em;
  }
}
#target03 .st_lg_jp_en {
  position: relative;
}
#target03 .st_lg_jp_en:before {
  position: absolute;
  background: url(../images/sdgs/img_logo02.png) no-repeat;
  width: 2.9em;
  height: 3em;
  content: '';
  bottom: 10px;
  left: -7%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target03 .st_lg_jp_en:before {
    right: -16%;
  }
}
@media only screen and (max-width: 767px) {
  #target03 .st_lg_jp_en:before {
    width: 1.6em;
    height: 1.9em;
    left: 2%;
    bottom: 40px;
    background-size: cover;
  }
}
#target03 .st_lg_jp_en .jp {
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target03 .st_lg_jp_en .jp {
    font-size: 200%;
  }
}
#target03 .st_lg_jp_en .jp:before {
  position: absolute;
  content: '';
  display: block;
  width: 30px;
  height: 1px;
  background-color: #000;
  top: 45%;
  left: -14%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target03 .st_lg_jp_en .jp:before {
    left: -13%;
  }
}
@media only screen and (max-width: 767px) {
  #target03 .st_lg_jp_en .jp:before {
    top: 45%;
    left: -2%;
    width: 10px;
  }
}
#target03 .st_lg_jp_en .jp:after {
  position: absolute;
  content: '';
  display: block;
  width: 30px;
  height: 1px;
  background-color: #000;
  top: 45%;
  right: -7%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target03 .st_lg_jp_en .jp:after {
    right: -10%;
  }
}
@media only screen and (max-width: 767px) {
  #target03 .st_lg_jp_en .jp:after {
    top: 45%;
    right: -2%;
    width: 10px;
  }
}
#target03 .flex_area {
  -webkit-box-pack: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly;
}
#target03 .img {
  text-align: center;
  margin-top: 20px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target03 .img {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  #target03 .img {
    margin-top: 1em;
  }
}
@media only screen and (max-width: 767px) {
  #target03 .img {
    width: 97%;
    margin: 1em auto auto;
  }
}
#target03 .content_first {
  width: 47.46032%;
}
@media only screen and (max-width: 1024px) {
  #target03 .content_first {
    width: 100%;
  }
}
#target03 .con_bg {
  margin-top: 50px;
  padding: 7em 0 5em;
  background: #3d5836;
  color: #fff;
  width: 83%;
  margin-left: auto;
}
@media only screen and (max-width: 767px) {
  #target03 .con_bg {
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target03 .con_bg {
    padding: 5em 0 5em;
  }
}
@media only screen and (max-width: 767px) {
  #target03 .con_bg {
    padding: 3em 0 2em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target03 .con_bg {
    width: 95%;
  }
}
@media only screen and (max-width: 767px) {
  #target03 .con_bg {
    width: 100%;
  }
}
#target03 .con_bg.con_blue {
  background: #04476e;
}
#target03 .con_bg.con_red {
  background: #80213a;
}
#target03 .con_bg .title {
  width: 97%;
  margin-left: auto;
}
#target03 .con_bg .title.box_blue {
  width: 43.65079%;
}
@media only screen and (max-width: 767px) {
  #target03 .con_bg .title.box_blue {
    width: 97%;
  }
}
#target03 .con_bg .title h4 {
  border: none;
  z-index: 10;
  position: relative;
  font-size: 3em;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target03 .con_bg .title h4 {
    font-size: 2.5em;
  }
}
@media only screen and (max-width: 767px) {
  #target03 .con_bg .title h4 {
    font-size: 2em;
  }
}
#target03 .con_bg .flex_area {
  margin-top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 1024px) {
  #target03 .con_bg .flex_area {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
}
#target03 .con_bg .flex_area .con_txt {
  width: 39.68254%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target03 .con_bg .flex_area .con_txt {
    width: 90%;
    margin: 0 auto;
  }
}
@media only screen and (max-width: 767px) {
  #target03 .con_bg .flex_area .con_txt {
    width: 95%;
    margin: 0 auto;
  }
}
#target03 .con_bg .flex_area .con_txt .box_txt {
  margin: 0 auto;
}
#target03 .con_bg .flex_area .con_txt .box_txt .btn_red a {
  margin: 2em 0 2em auto;
}
#target03 .con_bg .flex_area .con_txt .txt {
  margin-bottom: 30px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target03 .con_bg .flex_area .con_txt .txt {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  #target03 .con_bg .flex_area .con_txt .txt {
    margin-bottom: 1em;
  }
}
#target03 .con_bg .flex_area .con_txt .box4 ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  flex-wrap: wrap;
}
#target03 .con_bg .flex_area .con_txt .box4 ul li {
  width: 48%;
  background-color: #fff;
  margin-left: 0%;
  margin-bottom: 4%;
  padding-left: 1em;
  padding-bottom: 1em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
#target03 .con_bg .flex_area .con_txt .box4 ul li .green {
  color: #3d5836;
}
#target03 .con_bg .flex_area .con_txt .box4 ul li .blue {
  color: #04476e;
}
#target03 .con_bg .flex_area .con_txt .box4 ul li .red {
  color: #80213a;
}
#target03 .con_bg .flex_area .con_txt .box4 ul li .img {
  width: 85%;
  text-align: end;
}
#target03 .con_bg .flex_area .img {
  margin: 0 auto;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #target03 .con_bg .flex_area .img {
    width: 80%;
  }
}
@media only screen and (max-width: 767px) {
  #target03 .con_bg .flex_area .img {
    margin: 14px auto;
  }
}
#target03 .con_bg.left {
  margin-right: auto;
  margin-left: 0;
}
#target03 .con_bg.left .flex_area {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
@media only screen and (max-width: 1024px) {
  #target03 .con_bg.left .flex_area {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
}
#target03 .center {
  margin-top: 2em;
}

.present {
  margin-top: 70px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .present {
    margin-top: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .present {
    margin-top: 2em;
  }
}
.present h4 {
  border: none;
  font-size: 193%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .present h4 {
    font-size: 179%;
  }
}
@media only screen and (max-width: 767px) {
  .present h4 {
    font-size: 143%;
  }
}
.present .txt01, .present .txt02 {
  margin-bottom: 20px;
}
@media only screen and (max-width: 767px) {
  .present .txt01, .present .txt02 {
    margin-bottom: 1em;
  }
}
.present .flex_area {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.present .box_txt {
  width: 46.03175%;
}
@media only screen and (max-width: 767px) {
  .present .box_txt {
    width: 100%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .present .tbl_primary th {
    width: 29%;
    padding: 0 0.2em 0 0em;
  }
}
.present .box_images {
  width: 44.44444%;
}
@media only screen and (max-width: 767px) {
  .present .box_images {
    width: 100%;
  }
}
.present .btn_normal {
  margin-bottom: 70px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .present .btn_normal {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .present .btn_normal {
    margin-bottom: 2em;
  }
}
.present .btn_normal a {
  display: block;
  width: 100%;
  margin: 60px auto auto;
  text-decoration: none;
  text-align: center;
  max-width: 378px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .present .btn_normal a {
    margin: 30px auto auto;
  }
}
@media only screen and (max-width: 767px) {
  .present .btn_normal a {
    margin: 2em auto auto;
  }
}
@media only screen and (max-width: 767px) {
  .present .btn_normal a {
    max-width: 313px;
    width: 90%;
  }
}

.box_gray {
  position: relative;
  width: 71.42857%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  margin-left: auto;
  margin-right: auto;
  padding: 2em 6em;
  margin-top: 70px;
  margin-bottom: 70px;
  background: #f1f1f1;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_gray {
    padding: 2em 6em;
  }
}
@media only screen and (max-width: 767px) {
  .box_gray {
    padding: 3em 0.5em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_gray {
    margin-top: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .box_gray {
    margin-top: 2em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_gray {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .box_gray {
    margin-bottom: 2em;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_gray {
    width: 90%;
  }
}
@media only screen and (max-width: 767px) {
  .box_gray {
    width: 95%;
  }
}
.box_gray:before {
  position: absolute;
  background: url(../images/sdgs/ic_earth.png) no-repeat;
  content: '';
  display: block;
  width: 95px;
  height: 95px;
  bottom: 0;
  right: 0;
}
.box_gray:after {
  position: absolute;
  background: url(../images/sdgs/ic_dtt.png) no-repeat;
  content: '';
  display: block;
  width: 50px;
  height: 43px;
  top: 10%;
  left: 4%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_gray:after {
    left: 2%;
  }
}
@media only screen and (max-width: 767px) {
  .box_gray:after {
    top: 7%;
  }
}
.box_gray p {
  margin-right: 3.80435%;
  font-size: 115%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_gray p {
    font-size: 115%;
  }
}
@media only screen and (max-width: 767px) {
  .box_gray p {
    font-size: 108%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_gray p {
    margin-right: 0;
    padding-right: 10px;
    width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .box_gray p {
    margin-top: 30px;
  }
}
.box_gray p.box_name {
  margin-top: 3.80435%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .box_gray p.box_name {
    text-align: end;
  }
}
@media only screen and (max-width: 767px) {
  .box_gray p.box_name {
    margin-top: 0;
  }
}
.box_gray ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 24px 0px;
}
@media only screen and (max-width: 767px) {
  .box_gray ul {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    width: 85%;
  }
}
.box_gray ul li {
  max-width: 113px;
  width: 100%;
  margin-right: 0.54348%;
}
@media only screen and (max-width: 767px) {
  .box_gray ul li {
    width: 24.2%;
    margin-bottom: 1%;
    margin-right: 1%;
  }
  .box_gray ul li:nth-child(4n) {
    margin-right: 0%;
  }
  .box_gray ul li:last-child {
    margin-bottom: 0;
  }
}
.box_gray ul li:last-child {
  margin-right: 0;
}

.con_contact_rsv {
  margin: 50px auto;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_contact_rsv {
    margin: 40px auto;
  }
}
@media only screen and (max-width: 767px) {
  .con_contact_rsv {
    margin: 2em auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_contact_rsv p {
    margin-left: 2%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_contact_rsv ul {
    margin-right: 2%;
  }
}

/* -----------------------------------------------------------
	lang_class_es　スペイン語
----------------------------------------------------------- */
.lang_class_es {
  font-family: 'Roboto',"SF Pro Text",Helvetica,arial,sans-serif;
}
.lang_class_es #header .box_inner .box_r > ul > li {
  display: none;
}
.lang_class_es .con_nav_bottom {
  display: none;
}
.lang_class_es #footer {
  padding-top: 0;
}
.lang_class_es #footer .box_btn {
  display: none;
}
.lang_class_es .con_search {
  display: none;
}
@media only screen and (max-width: 1024px) {
  .lang_class_es #contents {
    margin-top: 1rem;
  }
}