@charset "utf-8";
/* CSS Document */

/* 国名タイトル */
.country_tit {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #09f;
  width: 100%;
}
.country_tit span {
  color: #09f;
  font-size: 3.2rem;
}
@media screen and (max-width: 639px){
  .country_tit img {
    max-width: 60px;
  }
  .country_tit span {
    font-size: 2.4rem;
  }
}

/* 画像共通 */
.country_img {}
  .country_img img {
    width: 100%;
    height: auto;
  }
.country_img .cap {
  display: block;
  background-color: #eee;
  padding: 10px;
  color: #666;
  font-size: 1.4rem;
}

/* country_main_img */
.country_main_img {
  margin-top: 10px;
}

/* 基礎データ */
.country_data {
  background: #fff;
  padding: 2% 3%;
  border-radius: 20px;
  margin-top: 5%;
	margin-right: 5%;
  margin-bottom: 5%;
	margin-left: 5%;
  border: #b29380 solid 10px
}
.country_data .country_data_tit {
  border-bottom: #816561 solid 1px;
  padding-bottom: 1.5%;
  margin-bottom: 3.5%;
  color: #816561;
  font-size: 1.8rem;
  font-weight: bold;
}
.country_data .country_data_inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.country_data .country_data_inner .country_data_map {
  border-radius: 3px;
  border: 1px solid #816561;
  max-width: 282px;
}
.country_data .country_data_inner .country_data_map img {
  border-radius: 3px;
  width: 100%;
  height: auto;
}
.country_data .country_data_inner .country_data_list {
  width: calc(100% - 300px);
}
.country_data .country_data_inner .country_data_list ul {}
.country_data .country_data_inner .country_data_list ul li {
  margin-bottom: 10px;
}
.country_data .country_data_inner .country_data_list ul li .item {
  display: inline-block;
  border-radius: 100vh;
  background-color: #b29380;
  margin-right: 10px;
  padding: 1px 10px;
  color: #fff;
}
.country_data .note {
  margin-top: 10px;
  font-size: 1.2rem;
}

@media screen and (max-width: 639px){
  .country_data .country_data_inner .country_data_map {
    margin: 0 auto;
  }
  .country_data .country_data_inner .country_data_list {
    width: 100%;
    margin-top: 20px;
  }
  .country_data .country_data_inner .country_data_list ul li {
    font-size: 1.4rem;
  }
  .country_data .country_data_inner .country_data_list ul li .data {
    display: inline-block;
    width: 100%;
    margin-top: 4px;
  }
}

/* country_sec */
.country_sec {}
.country_sec_tit {
  border-bottom:1px solid #09f;
  color: #09F;
  font-size: 3.0rem;
  font-weight: normal;
  margin-top: 10%;
  margin-right: 5%;
  margin-bottom: 2.5%;
  margin-left: 5%;
  padding-bottom: 5px;
  text-align: center;
}
.country_sec_img {
  max-width: 640px;
  margin: 0 auto 5%;
}
.country_txt p {
  margin-top: 0%;
  margin-right: 5%;
  margin-bottom: 3%;
  margin-left: 5%;
}
@media screen and (max-width: 639px){
  .country_sec_tit {
    font-size: 2.4rem;
  }
  .country_sec_img {
    margin-right: 5%;
    margin-left: 5%;
  }
}

/* country_movie */
.country_movie {
  margin-top: 80px;
}
.country_movie_tit {
  color: #002060;
  margin-right: 5%;
  margin-left: 5%;
  font-size: 2.4rem;
  font-weight: normal;
  text-align: center;
}
.country_movie_inner {
  max-width: 560px;
  margin: 16px auto 0;
}
.country_movie_inner p {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.country_movie_inner p iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
@media screen and (max-width: 639px){
  .country_movie {
    margin-top: 50px;
  }
  .country_movie_tit {
    font-size: 2.0rem;
  }
  .country_movie_inner {
    margin: 16px 5% 0;
  }
}

/* country_case */
.country_case {
  border-radius: 20px;
  background-color: #DCEEFC;
  max-width: 640px;
  margin: 30px auto 0;
  padding-bottom: 30px;
}
.country_case_tit {
  border-radius: 20px 20px 0 0;
  background-color: #09f;
  padding: 10px 20px;
  color: #fff;
  font-size: 2.0rem;
  font-weight: bold;
  text-align: center;
}

@media screen and (min-width: 640px){
  .country_case_inner {}
  .country_case_inner .country_case_img {
    border-radius: 10px;
  }
  /* コートジボワール */
  .country_case_cote .country_case_inner .country_case_img.case_img01 {
    position: relative;
    width: 60%;
    transform: rotate(-15deg);
    margin: 30px auto 0 -40px;
    z-index: 3;
  }
  .country_case_cote .country_case_inner .country_case_img.case_img02 {
    position: relative;
    width: 60%;
    transform: rotate(8deg);
    margin: -200px -60px 0 auto;
    z-index: 2;
  }
  .country_case_cote .country_case_inner .country_case_img.case_img03 {
    position: relative;
    width: 80%;
    margin: -50px auto 0;
    z-index: 1;
  }
  .country_case_inner .country_case_img img {
    border-radius: 10px;
    width: 100%;
    height: auto;
  }
  /* コンゴ民主共和国 */
  .country_case_congodemo .country_case_inner .country_case_img.case_img01 {
    width: 86%;
    transform: rotate(-4deg);
    margin: 10px auto 0;
  }
  .country_case_congodemo .country_case_inner .country_case_img.case_img03 {
    width: 80%;
    margin: 50px auto 0;
    color: #09f;
  }
}
@media screen and (max-width: 639px){
  .country_case_tit {
    padding: 10px 10px;
    font-size: 1.6rem;
  }
  .country_case {
    margin: 30px 5% 0;
    padding-bottom: 20px;
  }
  .country_case_inner .country_case_img {
    border-radius: 10px;
    margin: 20px 20px 0;
  }
  .country_case_inner .country_case_img img {
    border-radius: 10px;
    width: 100%;
    height: auto;
  }
  /* コートジボワール */
  .country_case_cote .country_case_inner .country_case_img.case_img01 {
    position: relative;
    transform: rotate(-15deg);
    z-index: 3;
  }
  .country_case_cote .country_case_inner .country_case_img.case_img02 {
    position: relative;
    transform: rotate(8deg);
    z-index: 2;
  }
  .country_case_cote .country_case_inner .country_case_img.case_img03 {
    position: relative;
    transform: rotate(-5deg);
    z-index: 1;
  }
  /* コンゴ民主共和国 */
  .country_case_congodemo .country_case_inner .country_case_img.case_img01 {
    transform: rotate(-4deg);
  }
  .country_case_congodemo .country_case_inner .country_case_img.case_img03 {
    width: 86%;
    color: #09f;
    margin: 30px auto 0;
    font-size: 1.4rem;
  }
}

/* country_reportcard */
.country_reportcard {
  border-radius: 20px;
  background-color: #DCEEFC;
  margin: 0 5%;
  padding: 20px;
}
.country_reportcard_tit {
  border-bottom: 1px solid #002060;
  color: #002060;
  font-size: 1.8rem;
  font-weight: normal;
}
.reportcard_issue {
  margin-top: 4px;
  color: #002060;
  text-align: right;
}
.country_reportcard_inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 20px;
}
.reportcard_img {
  width: 30%;
}
  .reportcard_img img {
    width: 100%;
    height: auto;
  }
.reportcard_content {
  width: 65%;
}
.reportcard_content dt {
  display: inline-block;
  border-radius: 100vh;
  background-color: #002060;
  margin-top: 20px;
  margin-bottom: 10px;
  padding: 1px 10px;
  color: #fff;
}
.reportcard_content li {
  margin-bottom: 12px;
}
.reportcard_content a {
  display: inline-block;
  margin-left: 20px;
}
.reportcard_content a:before {
  display: inline-block;
  font-family: "Font Awesome 5 Free";
  content: "\f152";
  font-weight: 900;
  color: #002060;
  text-indent: -20px;
}
.reportcard_content a .fa-file-pdf {
  color: #ff2116;
  background-color: #fff;
}

@media screen and (max-width: 639px){
  .reportcard_img {
    width: 60%;
    margin: 0 auto;
  }
  .reportcard_content {
    width: 100%;
    margin-top: 20px;
  }
  .reportcard_content li {
    font-size: 1.4rem;
  }
}

/* btn_info */
@media screen and (max-width: 639px){
  .btn_info {
    margin-right: 5%;
    margin-left: 5%;
  }
}
