@charset "UTF-8";

/* core override */
@supports (display: grid) {
  svg {
    width: 100%;
    height: 100%;
  }
}

/* ==========================================================================
   INFOGRAPHICS
========================================================================== */

.annotation {
  padding-left: 1em;
  text-indent: -1em;
  font-size: 2vmin;
  line-height: 1.4;
}

.txt-block {
  margin-top: 2rem;
}

/* numeric numbers */
.num-list {
  width: 100%;
  height: 100%;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.num-list li {
  width: 8.7vw;
  height: 10vw;
  max-width: 154px;
  max-height: 204px;
  position: relative;
}
.num-list li div {
  width: 100%;
  height: 100%;
  display: block;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0;
  line-height: 0;
  background: 0 0 no-repeat;
  background-size: 100% auto;
  background-size: contain;
}
.num-list li div::after {
  content: '';
  width: 100%;
  display: block;
  padding-top: 50.796%;
}

.num-list .num_0 { background-image: url('../img/infographic/num_0.png'); }
.num-list .num_1 { background-image: url('../img/infographic/num_1.png'); }
.num-list .num_2 { background-image: url('../img/infographic/num_2.png'); }
.num-list .num_3 { background-image: url('../img/infographic/num_3.png'); }
.num-list .num_4 { background-image: url('../img/infographic/num_4.png'); }
.num-list .num_5 { background-image: url('../img/infographic/num_5.png'); }
.num-list .num_6 { background-image: url('../img/infographic/num_6.png'); }
.num-list .num_7 { background-image: url('../img/infographic/num_7.png'); }
.num-list .num_8 { background-image: url('../img/infographic/num_8.png'); }
.num-list .num_9 { background-image: url('../img/infographic/num_9.png'); }
.num-list__item.is--num_0 .num_0,
.num-list__item.is--num_1 .num_1,
.num-list__item.is--num_2 .num_2,
.num-list__item.is--num_3 .num_3,
.num-list__item.is--num_4 .num_4,
.num-list__item.is--num_5 .num_5,
.num-list__item.is--num_6 .num_6,
.num-list__item.is--num_7 .num_7,
.num-list__item.is--num_8 .num_8,
.num-list__item.is--num_9 .num_9 {
  opacity: 1;
}

/* units and decimal sign */
.num-list__item.has-dot::after {
  content: '';
  width: 30%;
  height: 20%;
  display: block;
  position: absolute;
  bottom: 0;
  right: calc(4.5% + -0.5vw);
  background: url("../img/infographic/num_dot.png") no-repeat center 0 / contain;
}

.num-list__item.has-percentage::after {
  content: '';
  width: 10vmin;
  height: 60%;
  display: block;
  position: absolute;
  bottom: 0;
  left: calc(60% + 2vw);
  background: url("../img/infographic/num_precentage.png") no-repeat center 0 / contain;
}

.num-list__item.has-case::after {
  content: '';
  width: 10rem;
  height: 11rem;
  display: block;
  position: absolute;
  bottom: 0;
  right: -10rem;
  background: url("../img/infographic/num_case.png") no-repeat center 0 / contain;
}

/* point section common*/
.pointSec {
  margin-top: 7.5%;
}

.pointSec:last-of-type {
  margin-bottom: 10rem;
}

.pointSec__ttl {
  margin-bottom: 5.5%;
  text-align: center;
  background: #a7cc45;
}

.pointSec__txt {
  font-size: 2.4vmin;
  line-height: 1.75;
}

/* tablet sensei conclusion speech */
.tabletSenseiSpeech {
  position: relative;
  margin-top: 10%;
}

.tabletSenseiSpeech__txt {
  max-width: 85%;
}

.tabletSenseiSpeech::after {
  content: '';
  width: 29%;
  max-width: 384px;
  position: absolute;
  top: -14%;
  right: -13%;
  display: block;
  padding-top: 45%;
  background: url("../img/infographic/tablet_sensei_standard_img.png") no-repeat center 0 / contain;
}

.tabletSenseiSpeech.is-happy::after {
  top: -42%;
  right: -7%;
  background: url("../img/infographic/tablet_sensei_happy_img.png") no-repeat center 0 / contain;
}

.tabletSenseiSpeech.is-showing::after {
  top: -6%;
  right: -12%;
  background: url("../img/infographic/tablet_sensei_showing_img.png") no-repeat center 0 / contain;
}

.tabletSenseiSpeech .annotation {
  max-width: 880px;
  margin-top: 1.5rem;
}

/* ------------------------------------
   Intro
------------------------------------ */
.intro__ttl {
  text-align: center;
}
.intro__leadTxt {
  margin-top: 4%;
  font-weight: bold;
  padding: 0 5%;
  font-size: 3.92vmin;
  line-height: 1.6666666666666667;
}

/* ------------------------------------
   sec01
------------------------------------ */
#pointSec1 .foodList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 2.7%;
  padding-bottom: 8%;
}

#pointSec1 .foodList > li {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#pointSec1 .foodList > li::before {
  content: '';
  width: 55%;
  max-width: 102px;
  padding-top: 55%;
  display: block;
  position: absolute;
  top: 6%;
  left: -25%;
}

#pointSec1 .foodList > li.foodList__rice::before { background: url("../img/infographic/sec1_rice_illust_bg.png") no-repeat center 0 / contain; }
#pointSec1 .foodList > li.foodList__peach::before { background: url("../img/infographic/sec1_peach_illust_bg.png") no-repeat center 0 / contain; }
#pointSec1 .foodList > li.foodList__curry::before { background: url("../img/infographic/sec1_curry_illust_bg.png") no-repeat center 0 / contain; }
#pointSec1 .foodList > li.foodList__tomato::before { background: url("../img/infographic/sec1_tomato_illust_bg.png") no-repeat center 0 / contain; }
#pointSec1 .foodList > li.foodList__meat::before { background: url("../img/infographic/sec1_meat_illust_bg.png") no-repeat center 0 / contain; }
#pointSec1 .foodList > li::after {
  content: '';
  width: 120%;
  height: 120%;
  max-width: 216px;
  position: absolute;
  top: 0;
  display: block;
  z-index: -1;
  border-radius: 100%;
  background: #daebc1;
}

#pointSec1 .foodList__itemInfo {
  position: relative;
  top: 13%;
  z-index: 40;
}

#pointSec1 .foodList__0case {
  width: 40%;
  max-width: 66px;
  position: absolute;
  display: block;
  top: 23%;
  bottom: 0;
  left: 10%;
  right: 0;
  margin: auto;
  background: url("../img/infographic/sec1_zero_case_numb.png") no-repeat center 0 / contain;
}
#pointSec1 .foodResultsBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
}

#pointSec1 .foodResultsBox__txt {
  position: relative;
  margin-top: 4%;
}
#pointSec1 .foodResultsBox__txt::after {
  content: '';
  display: block;
  padding-top: 6%;
}

#pointSec1 .foodResultsBox__numb {
  width: 50%;
  height: 100%;
  max-width: 264px;
  position: relative;
  top: -4vmin;
  right: 4%;
}

#pointSec1 .annotation {
  padding-left: 3em;
  text-indent: -3em;
}

/* ------------------------------------
   sec02
------------------------------------ */
#pointSec2 .fishRecovery {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

#pointSec2 .fishRecovery__copy {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 47%;
          flex: 0 0 47%;
}
#pointSec2 .fishRecovery__graph {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 47%;
          flex: 0 0 47%;
  position: relative;
  right: 3%;
}
#pointSec2 .fishGraph-desc {
  position: relative;
}
#pointSec2 .fishGraph-desc .fishGraph-arrows {
  width: 12.5%;
  display: inline-block;
  position: absolute;
  bottom: 2%;
  left: 35%;
  margin-left: 10%;
}
#pointSec2 .fishGraph-newRate {
  position: absolute;
  bottom: 0;
  right: 15%;
}
#pointSec2 .fishGraph-newRate .num-list__item.has-percentage::after {
  content: '';
  width: 60%;
  height: 50%;
  left: calc(60% + 2vw);
}

.fishGraph {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.fishGraph__col {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(100% / 8);
          flex: 0 0 calc(100% / 8);
  position: relative;
  padding-top: 54.6%;
  background: url("../img/infographic/sec2_graph_fish_bg.png") no-repeat center 0/100%;
}

.fishGraph__rate {
  width: 100%;
  height: 15%;
  display: block;
  position: absolute;
  top: 80%;
  left: 0;
  background: url("../img/infographic/sec2_graph_rate_null.png") no-repeat center 0 / contain;
}
.col--year2011 .fishGraph__rate {
  top: 30%;
  background: url("../img/infographic/sec2_graph_rate_2011.png") no-repeat center 0 / contain;
}
.col--year2012 .fishGraph__rate {
  top: 60%;
  background: url("../img/infographic/sec2_graph_rate_2012.png") no-repeat center 0 / contain;
}
.col--year2013 .fishGraph__rate {
  top: 80%;
  background: url("../img/infographic/sec2_graph_rate_2013.png") no-repeat center 0 / contain;
}
.col--year2014 .fishGraph__rate {
  top: 80%;
  background: url("../img/infographic/sec2_graph_rate_2014.png") no-repeat center 0 / contain;
}

.fishGraph__unit {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition: height .5s ease-out;
  transition: height .5s ease-out;
}
.col--year2011 .fishGraph__unit { background: url("../img/infographic/sec2_graph_fish_year_2011_counts_bg.png") no-repeat center 0/100%; }
.col--year2012 .fishGraph__unit { background: url("../img/infographic/sec2_graph_fish_year_2012_counts_bg.png") no-repeat center 0/100%; }
.col--year2013 .fishGraph__unit { background: url("../img/infographic/sec2_graph_fish_year_2013_counts_bg.png") no-repeat center 0/100%; }
.col--year2014 .fishGraph__unit { background: url("../img/infographic/sec2_graph_fish_year_2014_counts_bg.png") no-repeat center 0/100%; }
.fishGraph__txt {
  max-width: 48px;
  width: 65%;
  margin: 0 auto;
  text-align: center;
}

@media (min-width: 980px) {
  .fishGraph__txt {
    margin: 10% auto;
  }
}

/* ------------------------------------
   sec03
------------------------------------ */
#pointSec3 .foreignExportGraph {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 10%;
}

#pointSec3 .foreignExportGraph__crops {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
  padding-top: 45%;
  background: url("../img/infographic/sec3_graph_crops_bg.png") no-repeat center 0 / contain;
}
#pointSec3 .foreignExportGraph__liquors {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 45%;
          flex: 0 0 45%;
  padding-top: 45%;
  background: url("../img/infographic/sec3_graph_liquor_bg.png") no-repeat center 0 / contain;
}

#pointSec3 .cropsGraph {
  position: relative;
}
#pointSec3 .cropsGraph__bubbleTxt {
  width: 60%;
  position: absolute;
  top: -7%;
  right: 12%;
}
#pointSec3 .cropsGraph__counts {
  width: 100%;
  height: 90%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  position: absolute;
  bottom: 18.5%;
  right: .5%;
}
#pointSec3 .cropsGraph__counts span {
  height: 100%;
  max-width: 36px;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 6.5%;
          flex: 0 0 6.5%;
  position: relative;
  background: #000;
}
#pointSec3 .cropsGraph__counts span + span {
  margin-left: 5.1%;
}

#pointSec3 .cropsGraph__counts .year2010 { background: url("../img/infographic/sec3_graph_crops_year_2010_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .cropsGraph__counts .year2011 { background: url("../img/infographic/sec3_graph_crops_year_2011_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .cropsGraph__counts .year2012 { background: url("../img/infographic/sec3_graph_crops_year_2012_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .cropsGraph__counts .year2013 { background: url("../img/infographic/sec3_graph_crops_year_2013_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .cropsGraph__counts .year2014 { background: url("../img/infographic/sec3_graph_crops_year_2014_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .cropsGraph__counts .year2015 { background: url("../img/infographic/sec3_graph_crops_year_2015_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .cropsGraph__counts .year2016 { background: url("../img/infographic/sec3_graph_crops_year_2016_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .cropsGraph__counts .year2017 { background: url("../img/infographic/sec3_graph_crops_year_2017_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .cropsGraph__amounts {
  width: 100%;
  height: 90%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  position: absolute;
  bottom: 18.4%;
  right: .5%;
}

#pointSec3 .cropsGraph__amounts li {
  width: 45.7%;
  position: absolute;
}
#pointSec3 .cropsGraph__amounts li:nth-child(1) {
  top: 20.4%;
  left: -5.2%;
}
#pointSec3 .cropsGraph__amounts li:nth-child(2) {
  top: 79.5%;
  left: 5.3%;
}
#pointSec3 .cropsGraph__amounts li:nth-child(3) {
  top: 84.9%;
  left: 16.5%;
}
#pointSec3 .cropsGraph__amounts li:nth-child(4) {
  top: 84.4%;
  left: 28.3%;
}
#pointSec3 .cropsGraph__amounts li:nth-child(5) {
  top: 81.9%;
  left: 39.8%;
}
#pointSec3 .cropsGraph__amounts li:nth-child(6) {
  top: 69.3%;
  right: 3%;
}
#pointSec3 .cropsGraph__amounts li:nth-child(7) {
  top: 58%;
  right: -8.3%;
}
#pointSec3 .cropsGraph__amounts li:nth-child(8) {
  top: -3.4%;
  right: -21%;
}
#pointSec3 .cropsGraph__amounts li img {
  -webkit-transform: scale(0.5);
      -ms-transform: scale(0.5);
          transform: scale(0.5);
}

#pointSec3 .liquorsGraph {
  position: relative;
}
#pointSec3 .liquorsGraph__bubbleTxt {
  width: 52%;
  position: absolute;
  top: -8%;
  right: 21%;
}

#pointSec3 .liquorsGraph__counts {
  width: 100%;
  height: 90%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  position: absolute;
  bottom: 18.8%;
  right: 6.5%;
}
#pointSec3 .liquorsGraph__counts span {
  height: 100%;
  max-width: 36px;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 6.5%;
          flex: 0 0 6.5%;
  position: relative;
  background: #000;
}
#pointSec3 .liquorsGraph__counts span + span {
  margin-left: 6.3%;
}
#pointSec3 .liquorsGraph__counts .year2012 { background: url("../img/infographic/sec3_graph_liquor_year_2012_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .liquorsGraph__counts .year2013 { background: url("../img/infographic/sec3_graph_liquor_year_2013_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .liquorsGraph__counts .year2014 { background: url("../img/infographic/sec3_graph_liquor_year_2014_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .liquorsGraph__counts .year2015 { background: url("../img/infographic/sec3_graph_liquor_year_2015_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .liquorsGraph__counts .year2016 { background: url("../img/infographic/sec3_graph_liquor_year_2016_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .liquorsGraph__counts .year2017 { background: url("../img/infographic/sec3_graph_liquor_year_2017_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec3 .liquorsGraph__amounts {
  width: 100%;
  height: 90%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  position: absolute;
  bottom: 18.4%;
  right: .5%;
}
#pointSec3 .liquorsGraph__amounts li {
  width: 45.7%;
  position: absolute;
}
#pointSec3 .liquorsGraph__amounts li:nth-child(1) {
  top: 63.3%;
  left: 5.6%;
}
#pointSec3 .liquorsGraph__amounts li:nth-child(2) {
  top: 53.5%;
  left: 18.3%;
}
#pointSec3 .liquorsGraph__amounts li:nth-child(3) {
  top: 47%;
  left: 31.5%;
}
#pointSec3 .liquorsGraph__amounts li:nth-child(4) {
  top: 43.4%;
  left: 44.3%;
}
#pointSec3 .liquorsGraph__amounts li:nth-child(5) {
  top: 20.6%;
  right: -2.7%;
}
#pointSec3 .liquorsGraph__amounts li:nth-child(6) {
  top: 7.7%;
  right: -16%;
}
#pointSec3 .liquorsGraph__amounts li img {
  -webkit-transform: scale(0.5);
      -ms-transform: scale(0.5);
          transform: scale(0.5);
}
#pointSec3 .annotation {
  margin-top: 30px;
}

/* ------------------------------------
   sec04
------------------------------------ */
#pointSec4 .global {
  width: 100%;
  position: relative;
  margin-top: 3.5%;
  background: url("../img/infographic/sec4_map_global.png") no-repeat center 0 / contain;
}
#pointSec4 .global::after {
  content: '';
  display: block;
  padding-top: 45.347%;
}
#pointSec4 .global__map {
  width: 100%;
}
#pointSec4 .global__map > li {
  position: absolute;
}
#pointSec4 .global__map > li::after {
  content: '';
  display: block;
}
#pointSec4 .global__map .city-infoTxt {
  display: none;
}
#pointSec4 .global__map .city-1 {
  width: 15.381%;
  top: -1%;
  left: 28%;
  background: url("../img/infographic/sec4_global_map_01.png") no-repeat center 0 / cover;
}
#pointSec4 .global__map .city-1::after {
  padding-top: 64.577%;
}
#pointSec4 .global__map .city-2 {
  width: 10.268%;
  top: 17.2%;
  left: 43.8%;
  background: url("../img/infographic/sec4_global_map_02.png") no-repeat center 0 / cover;
}
#pointSec4 .global__map .city-2::after {
  padding-top: 116.734%;
}
#pointSec4 .global__map .city-3 {
  width: 12.070%;
  top: -1.5%;
  left: 48.3%;
  background: url("../img/infographic/sec4_global_map_03.png") no-repeat center 0 / cover;
}
#pointSec4 .global__map .city-3::after {
  padding-top: 74.652%;
}
#pointSec4 .global__map .city-4 {
  width: 9.597%;
  top: 54%;
  left: 73.5%;
  background: url("../img/infographic/sec4_global_map_04.png") no-repeat center 0 / cover;
}
#pointSec4 .global__map .city-4::after {
  padding-top: 99.563%;
}
#pointSec4 .global__map .city-5 {
  width: 14.459%;
  top: 19%;
  left: 61.5%;
  background: url("../img/infographic/sec4_global_map_05.png") no-repeat center 0 / cover;
}
#pointSec4 .global__map .city-5::after {
  padding-top: 64.637%;
}
#pointSec4 .global__map .city-6 {
  width: 10.435%;
  top: 2.5%;
  left: 70.4%;
  background: url("../img/infographic/sec4_global_map_06.png") no-repeat center 0 / cover;
}
#pointSec4 .global__map .city-6::after {
  padding-top: 102.409%;
}
#pointSec4 .global__map .city-7 {
  width: 11.483%;
  top: 13.1%;
  left: 82.4%;
  background: url("../img/infographic/sec4_global_map_07.png") no-repeat center 0 / cover;
}
#pointSec4 .global__map .city-7::after {
  padding-top: 75.547%;
}
#pointSec4 .global__map .city-india {
  width: 62.740%;
  top: 45.9%;
  left: 5%;
  background: url("../img/infographic/sec4_global_map_india.png") no-repeat center 0 / cover;
}
#pointSec4 .global__map .city-india::after {
  padding-top: 34.535%;
}

#pointSec4 .global__list {
  width: 20%;
  position: absolute;
  top: 20%;
  left: 0;
}
#pointSec4 .global__item {
  position: relative;
}
#pointSec4 .global__item .global__txt::after {
  content: '';
  display: block;
  padding-top: 18%;
}
#pointSec4 .global__item--1 .global__txt { background: url("../img/infographic/sec4_global_txt_01.png") no-repeat 0 0 / contain; }
#pointSec4 .global__item--2 .global__txt { background: url("../img/infographic/sec4_global_txt_02.png") no-repeat 0 0 / contain; }
#pointSec4 .global__item--3 .global__txt { background: url("../img/infographic/sec4_global_txt_03.png") no-repeat 0 0 / contain; }
#pointSec4 .global__item--4 .global__txt { background: url("../img/infographic/sec4_global_txt_04.png") no-repeat 0 0 / contain; }
#pointSec4 .global__item--5 .global__txt { background: url("../img/infographic/sec4_global_txt_05.png") no-repeat 0 0 / contain; }
#pointSec4 .global__item--6 .global__txt { background: url("../img/infographic/sec4_global_txt_06.png") no-repeat 0 0 / contain; }
#pointSec4 .global__data {
  width: 20%;
  height: 48%;
  position: absolute;
  top: 0;
  left: 112%;
  display: inline-block;
  vertical-align: middle;
}
#pointSec4 .global__data::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background: #3ba6d8;
}
#pointSec4 .global__annotations {
  position: absolute;
  bottom: 0;
  left: 0;
}

#pointSec4 .local {
  width: 100%;
  position: relative;
  margin-top: 2%;
  margin-bottom: 10%;
  background: url("../img/infographic/sec4_map_local.png") no-repeat center 0/ contain;
}
#pointSec4 .local::after {
  content: '';
  display: block;
  padding-top: 28.2481%;
}
#pointSec4 .local__descBalloon {
  width: 17.722%;
  position: absolute;
  top: -5%;
  left: 30.9%;
  background: url("../img/infographic/sec4_local_desc_balloon.png") no-repeat center 0 / cover;
}
#pointSec4 .local__descBalloon::after {
  content: '';
  display: block;
  padding-top: 99.796%;
}
#pointSec4 .local__map {
  width: 100%;
}
#pointSec4 .local__map > li {
  position: absolute;
}
#pointSec4 .local__map > li::after {
  content: '';
  display: block;
}
#pointSec4 .local__map .city-infoTxt {
  display: none;
}
#pointSec4 .local__map .location-1 {
  width: 9.681%;
  top: -2%;
  left: 44.5%;
  background: url("../img/infographic/sec4_local_map_01.png") no-repeat center 0 / cover;
}
#pointSec4 .local__map .location-1::after {
  padding-top: 83.116%;
}
#pointSec4 .local__map .location-2 {
  width: 10.854%;
  top: 55%;
  right: 63%;
  background: url("../img/infographic/sec4_local_map_02.png") no-repeat center 0 / cover;
}
#pointSec4 .local__map .location-2::after {
  padding-top: 45.945%;
}
#pointSec4 .local__map .location-3 {
  width: 12.196%;
  top: 25%;
  right: 58.6%;
  background: url("../img/infographic/sec4_local_map_03.png") no-repeat center 0 / cover;
}
#pointSec4 .local__map .location-3::after {
  padding-top: 43.642%;
}
#pointSec4 .local__map .location-4 {
  width: 9.597%;
  top: 72.7%;
  right: 42.9%;
  background: url("../img/infographic/sec4_local_map_04.png") no-repeat center 0 / cover;
}
#pointSec4 .local__map .location-4::after {
  padding-top: 115.720%;
}
#pointSec4 .local__map .location-5 {
  width: 10.142%;
  top: 42%;
  right: 45.5%;
  background: url("../img/infographic/sec4_local_map_05.png") no-repeat center 0 / cover;
}
#pointSec4 .local__map .location-5::after {
  padding-top: 53.305%;
}
#pointSec4 .local__map .location-6 {
  width: 12.531%;
  top: 70.7%;
  right: 27.7%;
  background: url("../img/infographic/sec4_local_map_06.png") no-repeat center 0 / cover;
}
#pointSec4 .local__map .location-6::after {
  padding-top: 39.799%;
}
#pointSec4 .local__map .location-7 {
  width: 11.902%;
  top: 8%;
  right: 29%;
  background: url("../img/infographic/sec4_local_map_07.png") no-repeat center 0 / cover;
}
#pointSec4 .local__map .location-7::after {
  padding-top: 41.901%;
}
#pointSec4 .local__map .location-fdnps {
  width: 13.327%;
  top: 38.5%;
  right: 23.8%;
  background: url("../img/infographic/sec4_local_map_fdnps.png") no-repeat center 0 / cover;
}
#pointSec4 .local__map .location-fdnps::after {
  padding-top: 47.798%;
}
#pointSec4 .local__list {
  width: 20%;
  position: absolute;
  top: 0;
  left: 0;
}
#pointSec4 .local__item {
  position: relative;
}
#pointSec4 .local__item .local__txt::after {
  content: '';
  display: block;
  padding-top: 18%;
}
#pointSec4 .local__item--1 .local__txt { background: url("../img/infographic/sec4_local_txt_01.png") no-repeat 0 0 / contain; }
#pointSec4 .local__item--2 .local__txt { background: url("../img/infographic/sec4_local_txt_02.png") no-repeat 0 0 / contain; }
#pointSec4 .local__item--3 .local__txt { background: url("../img/infographic/sec4_local_txt_03.png") no-repeat 0 0 / contain; }
#pointSec4 .local__item--4 .local__txt { background: url("../img/infographic/sec4_local_txt_04.png") no-repeat 0 0 / contain; }
#pointSec4 .local__item--5 .local__txt { background: url("../img/infographic/sec4_local_txt_05.png") no-repeat 0 0 / contain; }
#pointSec4 .local__item--6 .local__txt { background: url("../img/infographic/sec4_local_txt_06.png") no-repeat 0 0 / contain; }
#pointSec4 .local__item--7 .local__txt { background: url("../img/infographic/sec4_local_txt_07.png") no-repeat 0 0 / contain; }
#pointSec4 .local__item--8 .local__txt { background: url("../img/infographic/sec4_local_txt_08.png") no-repeat 0 0 / contain; }
#pointSec4 .local__data {
  width: 20%;
  height: 48%;
  position: absolute;
  top: 0;
  left: 112%;
  display: inline-block;
  vertical-align: middle;
}
#pointSec4 .local__data::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background: #3ba6d8;
}
#pointSec4 .local__annotations {
  position: absolute;
  bottom: 0;
  left: 0;
}

#pointSec4 .tabletSenseiSpeech::after {
  top: -60%;
}

#pointSec4 .radiationAssessment__copy {
  padding-top: 12%;
}

#pointSec4 .radiationAssessment__doseResults {
  margin-top: 2%;
}

#pointSec4 .doseResults {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

#pointSec4 .doseResults__item {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 30%;
          flex: 0 0 30%;
}

#pointSec4 .doseResults__results {
  margin-top: 4%;
}

#pointSec4 .aboutMeasurements {
  margin: 6rem 0;
  margin: 6% 0;
  padding: 5.5% 8%;
  border-radius: 2.5%;
  border: 3px solid #a6e2ff;
}

#pointSec4 .aboutMeasurements__units {
  margin-top: 4%;
}
#pointSec4 .aboutMeasurements__units li ~ li {
  margin: 6% 0;
}

#pointSec4 .aboutMeasurements .annotation {
  margin-top: 4%;
}

#pointSec4 .txt-block {
  max-width: 840px;
}

/* ------------------------------------
   sec05
------------------------------------ */
#pointSec5 .touristRecovery {
  width: 100%;
  margin-top: 8%;
}
#pointSec5 .touristRecovery::after {
  content: '';
  display: block;
  clear: both;
}
#pointSec5 .touristRecovery__graph-box {
  float: left;
  width: 50%;
}

#pointSec5 .tourismGraph {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
  position: relative;
  padding-top: 91.5%;
  background: url("../img/infographic/sec5_graph_tourism_bg.png") no-repeat center 0 / contain;
}

#pointSec5 .tourismGraph__counts {
  width: 71.8%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  position: absolute;
  bottom: 18.5%;
  right: 3%;
}
#pointSec5 .tourismGraph__counts span {
  height: 100%;
  max-width: 26px;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 6.5%;
          flex: 0 0 6.5%;
  position: relative;
  background: #000;
}
#pointSec5 .tourismGraph__counts span + span {
  margin-left: 6.9%;
}

#pointSec5 .tourismGraph__counts .year2010 { background: url("../img/infographic/sec5_graph_tourism_year_2010_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec5 .tourismGraph__counts .year2011 { background: url("../img/infographic/sec5_graph_tourism_year_2011_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec5 .tourismGraph__counts .year2012 { background: url("../img/infographic/sec5_graph_tourism_year_2012_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec5 .tourismGraph__counts .year2013 { background: url("../img/infographic/sec5_graph_tourism_year_2013_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec5 .tourismGraph__counts .year2014 { background: url("../img/infographic/sec5_graph_tourism_year_2014_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec5 .tourismGraph__counts .year2015 { background: url("../img/infographic/sec5_graph_tourism_year_2015_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec5 .tourismGraph__counts .year2016 { background: url("../img/infographic/sec5_graph_tourism_year_2016_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec5 .tourismGraph__counts .year2017 { background: url("../img/infographic/sec5_graph_tourism_year_2017_counts_bg.png") no-repeat center 100% / 100%; }
#pointSec5 .tourismGraph__counts .year2018 { background: url("../img/infographic/sec5_graph_tourism_year_2018_counts_bg.png") no-repeat center 100% / 100%; }

#pointSec5 .tourismGraph__amounts {
  width: 100%;
  height: 90%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  position: absolute;
  bottom: 18.4%;
  right: .5%;
}

#pointSec5 .tourismGraph__amounts li {
  width: 45.7%;
  position: absolute;
}
#pointSec5 .tourismGraph__amounts li:nth-child(1) {
  top: 9.9%;
  left: -4.2%;
}
#pointSec5 .tourismGraph__amounts li:nth-child(2) {
  top: 66.5%;
  left: 5.3%;
}
#pointSec5 .tourismGraph__amounts li:nth-child(3) {
  top: 63.9%;
  left: 15.5%;
}
#pointSec5 .tourismGraph__amounts li:nth-child(4) {
  top: 60.4%;
  left: 24.3%;
}
#pointSec5 .tourismGraph__amounts li:nth-child(5) {
  top: 54.9%;
  left: 33.8%;
}
#pointSec5 .tourismGraph__amounts li:nth-child(6) {
  top: 42.8%;
  right: 11%;
}
#pointSec5 .tourismGraph__amounts li:nth-child(7) {
  top: 24%;
  right: 1.5%;
}
#pointSec5 .tourismGraph__amounts li:nth-child(8) {
  top: 0;
  right: -7%;
}#pointSec5 .tourismGraph__amounts li:nth-child(9) {
  top: -2.5%;
  right: -19%;
}
#pointSec5 .tourismGraph__amounts li img {
  -webkit-transform: scale(0.5);
      -ms-transform: scale(0.5);
          transform: scale(0.5);
}

#pointSec5 .touristRecovery__copy-box {
  float: left;
  margin-left: 2%;
  width: 45%;
}
#pointSec5 .touristRecovery__copy .tourismRecoverCopyTxt__num {
  display: block;
  margin: 0 auto;
}
#pointSec5 .touristRecovery__copy .tourismRecoverCopyTxt .annotation {
  margin-top: 5%;
  margin-left: 2%;
  font-size: 1.8vmin;
}

#pointSec5 .touristBestAttractions {
  width: 90%;
  margin-top: 10px;
  background: url("../img/infographic/sec5_tourist_best_locations_fig.png") no-repeat 0 0 / contain;
}
#pointSec5 .touristBestAttractions::after {
  content: '';
  display: block;
  padding-top: 56.2%;
}

#pointSec5 .tabletSenseiSpeech {
  margin-top: -3%;
}
#pointSec5 .tabletSenseiSpeech__txt {
  max-width: 100%;
}

#pointSec5 .tabletSenseiSpeech::after {
  width: 50%;
  top: -161%;
  right: -7%;
  -webkit-transform: scale(1.15);
      -ms-transform: scale(1.15);
          transform: scale(1.15);
}

@media (min-width: 980px) {
  #pointSec5 .touristRecovery {
    margin-top: 4%;
  }
  #pointSec5 .tourismGraph__counts {
    width: 100%;
    height: 90%;
  }
  #pointSec5 .tourismGraph__counts span + span {
    margin-left: 2.9%;
  }
  #pointSec5 .touristRecovery__copy .tourismRecoverCopyTxt .annotation {
    margin-top: 8%;
    margin-left: 20px;
  }
  #pointSec5 .tourismGraph__counts span + span {
    margin-left: 5%;
  }
}


/* ------------------------------------
    Scene Animations
------------------------------------ */
/* tablet sensei animations */
.js .tabletSenseiSpeech::after {
  opacity: 0;
  -webkit-transform: translate3d(20px, 20px, 0);
          transform: translate3d(20px, 20px, 0);
  -webkit-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.js .tabletSenseiSpeech__txt {
  opacity: 0;
  -webkit-transform: scale3d(0, 0, 0);
          transform: scale3d(0, 0, 0);
  -webkit-transform-origin: 100% 50%;
      -ms-transform-origin: 100% 50%;
          transform-origin: 100% 50%;
  -webkit-transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.is-animated .tabletSenseiSpeech::after {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}

.is-animated .tabletSenseiSpeech__txt {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}

/* Section 1 */
.js .foodList,
.js .foodResultsBox,
.js .foodList__itemInfo > p {
  opacity: 0;
  -webkit-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.js .foodList > li::before {
  opacity: 0;
  -webkit-transform: scale3d(2, 2, 2) translateY(50%);
          transform: scale3d(2, 2, 2) translateY(50%);
  -webkit-transition: all .5s  ease-out;
  transition: all .5s  ease-out;
}
.js .foodList > li::after {
  opacity: 0;
  -webkit-transform: scale3d(0, 0, 0);
          transform: scale3d(0, 0, 0);
  -webkit-transition: all 0.5s cubic-bezier(0.75, -0.5, 0, 1.75);
  transition: all 0.5s cubic-bezier(0.75, -0.5, 0, 1.75);
}

.js .foodList .foodList__0case {
  opacity: 0;
  -webkit-transform: scale3d(0, 0, 0);
          transform: scale3d(0, 0, 0);
  -webkit-transition: all 0.5s cubic-bezier(0.47, 0, 0.745, 0.715);
  transition: all 0.5s cubic-bezier(0.47, 0, 0.745, 0.715);
}

.js .foodList > li:nth-child(1)::after,
.js .foodList > li:nth-child(1)::before,
.js .foodList > li:nth-child(1) .foodList__itemInfo > p {
  -webkit-transition-delay: 0.1s;
          transition-delay: 0.1s;
}
.js .foodList > li:nth-child(1) .foodList__0case {
  -webkit-transition-delay: 0.15s;
          transition-delay: 0.15s;
}

.js .foodList > li:nth-child(2)::after,
.js .foodList > li:nth-child(2)::before,
.js .foodList > li:nth-child(2) .foodList__itemInfo > p {
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}
.js .foodList > li:nth-child(2) .foodList__0case {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}

.js .foodList > li:nth-child(3)::after,
.js .foodList > li:nth-child(3)::before,
.js .foodList > li:nth-child(3) .foodList__itemInfo > p {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}
.js .foodList > li:nth-child(3) .foodList__0case {
  -webkit-transition-delay: 0.45s;
          transition-delay: 0.45s;
}

.js .foodList > li:nth-child(4)::after,
.js .foodList > li:nth-child(4)::before,
.js .foodList > li:nth-child(4) .foodList__itemInfo > p {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
.js .foodList > li:nth-child(4) .foodList__0case {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}

.js .foodList > li:nth-child(5)::after,
.js .foodList > li:nth-child(5)::before,
.js .foodList > li:nth-child(5) .foodList__itemInfo > p {
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
}
.js .foodList > li:nth-child(5) .foodList__0case {
  -webkit-transition-delay: 0.75s;
          transition-delay: 0.75s;
}

.js .foodResultsBox__txt {
  opacity: 0;
  -webkit-transform: translateX(-10%);
      -ms-transform: translateX(-10%);
          transform: translateX(-10%);
  -webkit-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.js .foodResultsBox__numb {
  opacity: 0;
  -webkit-transform: scale3d(2, 2, 2);
          transform: scale3d(2, 2, 2);
  -webkit-transform-origin: 50% 50%;
      -ms-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
  -webkit-transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
  -webkit-transition-delay: .5s;
          transition-delay: .5s;
}

.is-animated.foodList,
.is-animated .foodList__itemInfo > p, .is-animated.foodResultsBox {
  opacity: 1;
}

.is-animated.foodList > li::before {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1) translateY(0);
          transform: scale3d(1, 1, 1) translateY(0);
}

.is-animated.foodList > li::after {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}

.is-animated.foodList .foodList__0case {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}

.is-animated .foodResultsBox__txt {
  opacity: 1;
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0);
}

.is-animated .foodResultsBox__numb {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}

/* Section 2 */
.js .fishGraph-desc,
.js .fishGraph-arrows polygon,
.js .fishGraph {
  opacity: 0;
  -webkit-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.js .fishGraph-desc {
  -webkit-transform: translateX(-100px);
      -ms-transform: translateX(-100px);
          transform: translateX(-100px);
  -webkit-transition-delay: .6s;
          transition-delay: .6s;
}

.js .fishGraph-arrows polygon:nth-child(1) {
  -webkit-transition-delay: .8s;
          transition-delay: .8s;
}
.js .fishGraph-arrows polygon:nth-child(2) {
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}

.js .fishGraph-newRate {
  -webkit-transition-delay: .2s;
          transition-delay: .2s;
}

.js .fishGraph__unit {
  height: 0;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  -webkit-transition: height 1s ease-out;
  transition: height 1s ease-out;
}

.js .fishGraph__rate {
  -webkit-transform: scale3d(0, 0, 0);
          transform: scale3d(0, 0, 0);
  -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

.col--year2012 .fishGraph__unit {
  -webkit-transition-delay: .2s;
          transition-delay: .2s;
}
.col--year2013 .fishGraph__unit {
  -webkit-transition-delay: .4s;
          transition-delay: .4s;
}
.col--year2014 .fishGraph__unit {
  -webkit-transition-delay: .6s;
          transition-delay: .6s;
}
.col--year2012 .fishGraph__rate {
  -webkit-transition-delay: .4s;
          transition-delay: .4s;
}
.col--year2013 .fishGraph__rate {
  -webkit-transition-delay: .6s;
          transition-delay: .6s;
}
.col--year2014 .fishGraph__rate {
  -webkit-transition-delay: .8s;
          transition-delay: .8s;
}
.col--year2015 .fishGraph__rate {
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}
.col--year2016 .fishGraph__rate {
  -webkit-transition-delay: 1.1s;
          transition-delay: 1.1s;
}
.col--year2017 .fishGraph__rate {
  -webkit-transition-delay: 1.15s;
          transition-delay: 1.15s;
}
.col--year2018 .fishGraph__rate {
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s;
}

.is-animated .fishGraph-desc,
.is-animated .fishGraph-arrows polygon,
.is-animated .fishGraph-newRate,
.is-animated .fishGraph {
  opacity: 1;
}

.is-animated .fishGraph-desc {
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0);
}

.is-animated .fishGraph__unit {
  height: 100%;
}

.is-animated .fishGraph__rate {
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}

/* Section 3 */
.js #pointSec3 .cropsGraph,
.js #pointSec3 .liquorsGraph {
  opacity: 0;
  -webkit-transition: all .2s ease-out;
  transition: all .2s ease-out;
}

.js #pointSec3 .cropsGraph__bubbleTxt {
  opacity: 0;
  -webkit-transform: translateY(-30%);
      -ms-transform: translateY(-30%);
          transform: translateY(-30%);
  -webkit-transition: all .5s ease-out 1s;
  transition: all .5s ease-out 1s;
}

.js #pointSec3 .cropsGraph__counts span {
  -webkit-transform: scaleY(0);
      -ms-transform: scaleY(0);
          transform: scaleY(0);
  -webkit-transform-origin: 0 100%;
      -ms-transform-origin: 0 100%;
          transform-origin: 0 100%;
  -webkit-transition: -webkit-transform .5s ease-out;
  transition: -webkit-transform .5s ease-out;
  transition: transform .5s ease-out;
  transition: transform .5s ease-out, -webkit-transform .5s ease-out;
}
.js #pointSec3 .cropsGraph__counts .year2010 {
  -webkit-transition-delay: .2s;
          transition-delay: .2s;
}
.js #pointSec3 .cropsGraph__counts .year2011 {
  -webkit-transition-delay: .3s;
          transition-delay: .3s;
}
.js #pointSec3 .cropsGraph__counts .year2012 {
  -webkit-transition-delay: .4s;
          transition-delay: .4s;
}
.js #pointSec3 .cropsGraph__counts .year2013 {
  -webkit-transition-delay: .5s;
          transition-delay: .5s;
}
.js #pointSec3 .cropsGraph__counts .year2014 {
  -webkit-transition-delay: .6s;
          transition-delay: .6s;
}
.js #pointSec3 .cropsGraph__counts .year2015 {
  -webkit-transition-delay: .7s;
          transition-delay: .7s;
}
.js #pointSec3 .cropsGraph__counts .year2016 {
  -webkit-transition-delay: .8s;
          transition-delay: .8s;
}
.js #pointSec3 .cropsGraph__counts .year2017 {
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}

.js #pointSec3 .cropsGraph__amounts li {
  -webkit-transform: scale3d(0, 0, 0);
          transform: scale3d(0, 0, 0);
  -webkit-transition: -webkit-transform .5s ease-out;
  transition: -webkit-transform .5s ease-out;
  transition: transform .5s ease-out;
  transition: transform .5s ease-out, -webkit-transform .5s ease-out;
}

.js #pointSec3 .cropsGraph__amounts li:nth-child(1) {
  -webkit-transition-delay: 0.1s;
          transition-delay: 0.1s;
}
.js #pointSec3 .cropsGraph__amounts li:nth-child(2) {
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}
.js #pointSec3 .cropsGraph__amounts li:nth-child(3) {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}
.js #pointSec3 .cropsGraph__amounts li:nth-child(4) {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
.js #pointSec3 .cropsGraph__amounts li:nth-child(5) {
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
}
.js #pointSec3 .cropsGraph__amounts li:nth-child(6) {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}
.js #pointSec3 .cropsGraph__amounts li:nth-child(7) {
  -webkit-transition-delay: 0.7s;
          transition-delay: 0.7s;
}
.js #pointSec3 .cropsGraph__amounts li:nth-child(8) {
  -webkit-transition-delay: 0.8s;
          transition-delay: 0.8s;
}

.js #pointSec3 .liquorsGraph__bubbleTxt {
  opacity: 0;
  -webkit-transform: translateY(-30%);
      -ms-transform: translateY(-30%);
          transform: translateY(-30%);
  -webkit-transition: all .5s ease-out 1s;
  transition: all .5s ease-out 1s;
}

.js #pointSec3 .liquorsGraph__counts span {
  -webkit-transform: scaleY(0);
      -ms-transform: scaleY(0);
          transform: scaleY(0);
  -webkit-transform-origin: 0 100%;
      -ms-transform-origin: 0 100%;
          transform-origin: 0 100%;
  -webkit-transition: -webkit-transform .5s ease-out;
  transition: -webkit-transform .5s ease-out;
  transition: transform .5s ease-out;
  transition: transform .5s ease-out, -webkit-transform .5s ease-out;
}
.js #pointSec3 .liquorsGraph__counts .year2012 {
  -webkit-transition-delay: .2s;
          transition-delay: .2s;
}
.js #pointSec3 .liquorsGraph__counts .year2013 {
  -webkit-transition-delay: .4s;
          transition-delay: .4s;
}
.js #pointSec3 .liquorsGraph__counts .year2014 {
  -webkit-transition-delay: .5s;
          transition-delay: .5s;
}
.js #pointSec3 .liquorsGraph__counts .year2015 {
  -webkit-transition-delay: .6s;
          transition-delay: .6s;
}
.js #pointSec3 .liquorsGraph__counts .year2016 {
  -webkit-transition-delay: .7s;
          transition-delay: .7s;
}
.js #pointSec3 .liquorsGraph__counts .year2017 {
  -webkit-transition-delay: .8s;
          transition-delay: .8s;
}

.js #pointSec3 .liquorsGraph__amounts li {
  -webkit-transform: scale3d(0, 0, 0);
          transform: scale3d(0, 0, 0);
  -webkit-transition: -webkit-transform .5s ease-out;
  transition: -webkit-transform .5s ease-out;
  transition: transform .5s ease-out;
  transition: transform .5s ease-out, -webkit-transform .5s ease-out;
}
.js #pointSec3 .liquorsGraph__amounts li:nth-child(1) {
  -webkit-transition-delay: 0.1s;
          transition-delay: 0.1s;
}
.js #pointSec3 .liquorsGraph__amounts li:nth-child(2) {
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}
.js #pointSec3 .liquorsGraph__amounts li:nth-child(3) {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}
.js #pointSec3 .liquorsGraph__amounts li:nth-child(4) {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
.js #pointSec3 .liquorsGraph__amounts li:nth-child(5) {
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
}
.js #pointSec3 .liquorsGraph__amounts li:nth-child(6) {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}
.js #pointSec3 .liquorsGraph__amounts li:nth-child(7) {
  -webkit-transition-delay: 0.7s;
          transition-delay: 0.7s;
}

#pointSec3 .is-animated .cropsGraph,
#pointSec3 .is-animated .liquorsGraph {
  opacity: 1;
}

#pointSec3 .is-animated .cropsGraph__bubbleTxt,
#pointSec3 .is-animated .liquorsGraph__bubbleTxt {
  opacity: 1;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}

#pointSec3 .is-animated .cropsGraph__counts span,
#pointSec3 .is-animated .liquorsGraph__counts span {
  -webkit-transform: scaleY(1);
      -ms-transform: scaleY(1);
          transform: scaleY(1);
}

#pointSec3 .is-animated .cropsGraph__amounts li,
#pointSec3 .is-animated .liquorsGraph__amounts li {
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}

/* Section 4 */
.js .global__map,
.js .global__list,
.js .local__map,
.js .local__list {
  opacity: 0;
  -webkit-transition: all .2s ease-out;
  transition: all .2s ease-out;
}

.js .local__descBalloon {
  -webkit-transform: scale3d(0, 0, 0);
          transform: scale3d(0, 0, 0);
  -webkit-transition: -webkit-transform .4s ease-out 1s;
  transition: -webkit-transform .4s ease-out 1s;
  transition: transform .4s ease-out 1s;
  transition: transform .4s ease-out 1s, -webkit-transform .4s ease-out 1s;
}

.js .global__map > li,
.js .local__map > li {
  -webkit-transform: scale3d(0, 0, 0);
          transform: scale3d(0, 0, 0);
  -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  transition: -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}

.js .global__list > li,
.js .local__list > li {
  opacity: 0;
  -webkit-transform: translateX(50px);
      -ms-transform: translateX(50px);
          transform: translateX(50px);
  -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}

.js .global__data::after,
.js .local__data::after {
  -webkit-transform: scaleX(0);
      -ms-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transform-origin: 0 0;
      -ms-transform-origin: 0 0;
          transform-origin: 0 0;
  -webkit-transition: -webkit-transform .5s ease-in-out 2s;
  transition: -webkit-transform .5s ease-in-out 2s;
  transition: transform .5s ease-in-out 2s;
  transition: transform .5s ease-in-out 2s, -webkit-transform .5s ease-in-out 2s;
}

.js .doseResults__map {
  opacity: 0;
  -webkit-transform: scale3d(1.5, 1.5, 1.5);
          transform: scale3d(1.5, 1.5, 1.5);
  -webkit-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}

.js .doseResults__results {
  opacity: 0;
  -webkit-transform: translateY(40px);
      -ms-transform: translateY(40px);
          transform: translateY(40px);
  -webkit-transition: all .5s ease-in-out .5s;
  transition: all .5s ease-in-out .5s;
}

.is-animated .global__map,
.is-animated .global__list,
.is-animated .local__map,
.is-animated .local__list {
  opacity: 1;
}

.is-animated .global__map > li {
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}
.is-animated .global__map > li:nth-child(1) {
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}
.is-animated .global__map > li:nth-child(2) {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
.is-animated .global__map > li:nth-child(3) {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}
.is-animated .global__map > li:nth-child(4) {
  -webkit-transition-delay: 0.8s;
          transition-delay: 0.8s;
}
.is-animated .global__map > li:nth-child(5) {
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}
.is-animated .global__map > li:nth-child(6) {
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s;
}
.is-animated .global__map > li:nth-child(7) {
  -webkit-transition-delay: 1.4s;
          transition-delay: 1.4s;
}

.is-animated .global__list > li {
  opacity: 1;
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0);
}
.is-animated .global__list > li:nth-child(1) {
  -webkit-transition-delay: 0.25s;
          transition-delay: 0.25s;
}
.is-animated .global__list > li:nth-child(2) {
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
}
.is-animated .global__list > li:nth-child(3) {
  -webkit-transition-delay: 0.75s;
          transition-delay: 0.75s;
}
.is-animated .global__list > li:nth-child(4) {
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}
.is-animated .global__list > li:nth-child(5) {
  -webkit-transition-delay: 1.25s;
          transition-delay: 1.25s;
}
.is-animated .global__list > li:nth-child(6) {
  -webkit-transition-delay: 1.5s;
          transition-delay: 1.5s;
}
.is-animated .global__list > li:nth-child(7) {
  -webkit-transition-delay: 1.75s;
          transition-delay: 1.75s;
}

.is-animated .global__item--1 .global__data::after {
  -webkit-transform: scaleX(0.5);
      -ms-transform: scaleX(0.5);
          transform: scaleX(0.5);
}
.is-animated .global__item--2 .global__data::after {
  -webkit-transform: scaleX(0.4);
      -ms-transform: scaleX(0.4);
          transform: scaleX(0.4);
}
.is-animated .global__item--3 .global__data::after {
  -webkit-transform: scaleX(0.7);
      -ms-transform: scaleX(0.7);
          transform: scaleX(0.7);
}
.is-animated .global__item--4 .global__data::after {
  -webkit-transform: scaleX(1);
      -ms-transform: scaleX(1);
          transform: scaleX(1);
}
.is-animated .global__item--5 .global__data::after {
  -webkit-transform: scaleX(0.7);
      -ms-transform: scaleX(0.7);
          transform: scaleX(0.7);
}
.is-animated .global__item--6 .global__data::after {
  -webkit-transform: scaleX(1.2);
      -ms-transform: scaleX(1.2);
          transform: scaleX(1.2);
}

.is-animated .local__descBalloon {
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}

.is-animated .local__map > li {
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}
.is-animated .local__map > li:nth-child(1) {
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}
.is-animated .local__map > li:nth-child(2) {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
.is-animated .local__map > li:nth-child(3) {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}
.is-animated .local__map > li:nth-child(4) {
  -webkit-transition-delay: 0.8s;
          transition-delay: 0.8s;
}
.is-animated .local__map > li:nth-child(5) {
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}
.is-animated .local__map > li:nth-child(6) {
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s;
}
.is-animated .local__map > li:nth-child(7) {
  -webkit-transition-delay: 1.4s;
          transition-delay: 1.4s;
}

.is-animated .local__list > li {
  opacity: 1;
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0);
}

.is-animated .local__list > li:nth-child(1) {
  -webkit-transition-delay: 0.25s;
          transition-delay: 0.25s;
}
.is-animated .local__list > li:nth-child(2) {
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
}
.is-animated .local__list > li:nth-child(3) {
  -webkit-transition-delay: 0.75s;
          transition-delay: 0.75s;
}
.is-animated .local__list > li:nth-child(4) {
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}
.is-animated .local__list > li:nth-child(5) {
  -webkit-transition-delay: 1.25s;
          transition-delay: 1.25s;
}
.is-animated .local__list > li:nth-child(6) {
  -webkit-transition-delay: 1.5s;
          transition-delay: 1.5s;
}
.is-animated .local__list > li:nth-child(7) {
  -webkit-transition-delay: 1.75s;
          transition-delay: 1.75s;
}
.is-animated .local__list > li:nth-child(8) {
  -webkit-transition-delay: 2s;
          transition-delay: 2s;
}
.is-animated .local__list > li:nth-child(9) {
  -webkit-transition-delay: 2.25s;
          transition-delay: 2.25s;
}
.is-animated .local__item--1 .local__data::after {
  -webkit-transform: scaleX(0.4);
      -ms-transform: scaleX(0.4);
          transform: scaleX(0.4);
}
.is-animated .local__item--2 .local__data::after {
  -webkit-transform: scaleX(1.5);
      -ms-transform: scaleX(1.5);
          transform: scaleX(1.5);
}
.is-animated .local__item--3 .local__data::after {
  -webkit-transform: scaleX(0.4);
      -ms-transform: scaleX(0.4);
          transform: scaleX(0.4);
}
.is-animated .local__item--4 .local__data::after {
  -webkit-transform: scaleX(0.5);
      -ms-transform: scaleX(0.5);
          transform: scaleX(0.5);
}
.is-animated .local__item--5 .local__data::after {
  -webkit-transform: scaleX(0.7);
      -ms-transform: scaleX(0.7);
          transform: scaleX(0.7);
}
.is-animated .local__item--6 .local__data::after {
  -webkit-transform: scaleX(0.9);
      -ms-transform: scaleX(0.9);
          transform: scaleX(0.9);
}
.is-animated .local__item--7 .local__data::after {
  -webkit-transform: scaleX(0.6);
      -ms-transform: scaleX(0.6);
          transform: scaleX(0.6);
}
.is-animated .local__item--8 .local__data::after {
  -webkit-transform: scaleX(0.7);
      -ms-transform: scaleX(0.7);
          transform: scaleX(0.7);
}

.is-animated .doseResults__map {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}

.is-animated .doseResults__results {
  opacity: 1;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}

/* Section 5 */
.js #pointSec5 .tourismGraph,
.js #pointSec5 .tourismRecoverRate {
  opacity: 0;
  -webkit-transition: all .2s ease-out;
  transition: all .2s ease-out;
}

.js #pointSec5 .tourismGraph__counts span {
  -webkit-transform: scaleY(0);
      -ms-transform: scaleY(0);
          transform: scaleY(0);
  -webkit-transform-origin: 0 100%;
      -ms-transform-origin: 0 100%;
          transform-origin: 0 100%;
  -webkit-transition: -webkit-transform .5s ease-out;
  transition: -webkit-transform .5s ease-out;
  transition: transform .5s ease-out;
  transition: transform .5s ease-out, -webkit-transform .5s ease-out;
}

.js #pointSec5 .tourismGraph__counts .year2010 {
  -webkit-transition-delay: .2s;
          transition-delay: .2s;
}
.js #pointSec5 .tourismGraph__counts .year2011 {
  -webkit-transition-delay: .3s;
          transition-delay: .3s;
}
.js #pointSec5 .tourismGraph__counts .year2012 {
  -webkit-transition-delay: .4s;
          transition-delay: .4s;
}
.js #pointSec5 .tourismGraph__counts .year2013 {
  -webkit-transition-delay: .5s;
          transition-delay: .5s;
}
.js #pointSec5 .tourismGraph__counts .year2014 {
  -webkit-transition-delay: .6s;
          transition-delay: .6s;
}
.js #pointSec5 .tourismGraph__counts .year2015 {
  -webkit-transition-delay: .7s;
          transition-delay: .7s;
}
.js #pointSec5 .tourismGraph__counts .year2016 {
  -webkit-transition-delay: .8s;
          transition-delay: .8s;
}
.js #pointSec5 .tourismGraph__counts .year2017 {
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}
.js #pointSec5 .tourismGraph__counts .year2018 {
  -webkit-transition-delay: 1.3s;
          transition-delay: 1.3s;
}

.js #pointSec5 .tourismGraph__amounts li {
  -webkit-transform: scale3d(0, 0, 0);
          transform: scale3d(0, 0, 0);
  -webkit-transition: -webkit-transform .5s ease-out;
  transition: -webkit-transform .5s ease-out;
  transition: transform .5s ease-out;
  transition: transform .5s ease-out, -webkit-transform .5s ease-out;
}
.js #pointSec5 .tourismGraph__amounts li:nth-child(1) {
  -webkit-transition-delay: 0.1s;
          transition-delay: 0.1s;
}
.js #pointSec5 .tourismGraph__amounts li:nth-child(2) {
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}
.js #pointSec5 .tourismGraph__amounts li:nth-child(3) {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}
.js #pointSec5 .tourismGraph__amounts li:nth-child(4) {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
.js #pointSec5 .tourismGraph__amounts li:nth-child(5) {
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
}
.js #pointSec5 .tourismGraph__amounts li:nth-child(6) {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}
.js #pointSec5 .tourismGraph__amounts li:nth-child(7) {
  -webkit-transition-delay: 0.7s;
          transition-delay: 0.7s;
}
.js #pointSec5 .tourismGraph__amounts li:nth-child(8) {
  -webkit-transition-delay: 0.8s;
          transition-delay: 0.8s;
}
.js #pointSec5 .tourismGraph__amounts li:nth-child(9) {
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s;
}

#pointSec5 .is-animated .tourismGraph {
  opacity: 1;
}
#pointSec5 .is-animated .tourismGraph__counts span {
  -webkit-transform: scaleY(1);
      -ms-transform: scaleY(1);
          transform: scaleY(1);
}
#pointSec5 .is-animated .tourismGraph__amounts li {
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}

.js #pointSec5 .tourismRecoverCopyTxt {
  opacity: 0;
  -webkit-transform: translateY(25%);
      -ms-transform: translateY(25%);
          transform: translateY(25%);
  -webkit-transition: all .5s ease-in-out .5s;
  transition: all .5s ease-in-out .5s;
}


#pointSec5 .is-animated .tourismGraph,
.is-animated .tourismRecoverRate {
  opacity: 1;
}

#pointSec5 .is-animated .tourismRecoverCopyTxt {
  opacity: 1;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}

#pointSec5 .tabletSenseiSpeech__txt {
  transition-delay: 1s;
  transition: opacity .3s ease-out,
              transform .3s ease-out .3s;
}
#pointSec5 .is-animated .tabletSenseiSpeech__txt {
  opacity: 1;
  transform-origin: 50% 50%;
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}

@media (min-width: 980px) {
  .l-section__body {
    max-width: 1180px;
  }
  #pointSec1 .foodResultsBox__numb img {
    position: absolute;
  }
  .fishGraph__col + .fishGraph__col {
    margin-left: 1%;
  }
  #pointSec5 .touristRecovery__copy .tourismRecoverRate {
    -webkit-transform: scale(0.8);
        -ms-transform: scale(0.8);
            transform: scale(0.8);
  }
  #pointSec5 .touristRecovery__copy .tourismRecoverRate .num-list {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  #pointSec5 .tabletSenseiSpeech::after {
    right: 0;
  }
}


/* ==========================================================================
   MEDIA QUERIES
========================================================================== */
/* mobile / tablet landscape orientation */
@media all and (orientation: landscape) and (max-width: 979px) {
  .wrapper {
    padding-top: 10px;
  }
  .gHeader {
    display: none;
  }
  .pageContents {
    margin-top: 30px;
  }
}

@media (max-width: 100vmin) {
  .annotation {
    font-size: 2vmin;
    padding-left: 3em;
    text-indent: -3em
  }
  .pointSec__txt {
    font-size: 2.4vmin;
  }

  .annotation-list li {
    font-size: 2vmin;
    line-height: 1.4;
  }
  .annotation-list-1 li {
    padding-left: 3em;
  }
  .annotation-list-2 {
    padding-left: 2em;
    position: relative;
  }
  .annotation-list-2::before {
    content: '(注)';
    display: block;
    position: absolute;
    top: 2px;
    left: 0;
    font-size: 2vmin;
  }
  .annotation-list-2 li {
    padding-left: 1em;
    text-indent: -1em;
  }
  .pointSec:last-of-type {
    margin-bottom: 30px;
  }
}

@media (min-width: 800px) {
  .annotation {
    font-size: 20px;
  }
  .annotation-list li {
    font-size: 20px;
    line-height: 1.4;
  }
  .annotation-list-1 li {
    padding-left: 3em;
  }
  .annotation-list-2 {
    padding-left: 3.5em;
    position: relative;
  }
  .annotation-list-2::before {
    content: '(注)';
    display: block;
    position: absolute;
    top: 5px;
    left: 0;
    font-size: 20px;
  }
  .annotation-list-2 li {
    padding-left: 1em;
    text-indent: -1em;
  }
}

@media all and (min-width: 980px) {
  .txt-block {
    margin-top: 5rem;
  }
  .tabletSenseiSpeech {
    margin-top: 5rem;
  }
  .tabletSenseiSpeech::after {
    right: -10%;
  }
}

@media (min-width: 1000px) {
  .pointSec__txt {
    font-size: 24px;
  }
}

@media all and (max-width: 979px) {
  .tabletSenseiSpeech::after {
    width: 26%;
    top: 0;
    right: -6%;
  }
  .tabletSenseiSpeech.is-happy::after {
    top: -30%;
    right: -3%;
  }
  .tabletSenseiSpeech.is-showing::after {
    top: -7%;
    right: -5%;
  }
  #pointSec1 .foodList > li {
    -webkit-transform: scale(0.8);
        -ms-transform: scale(0.8);
            transform: scale(0.8);
  }
}

@media (max-width: 306.12245px) {
  .intro__leadTxt {
    font-size: 12px;
  }
}

@media (min-width: 765.30612px) {
  .intro__leadTxt {
    font-size: 30px;
  }
}

@media all and (-ms-high-contrast: none) and (min-width: 980px) {
  #pointSec1 .foodList > li::after {
    left: -20px;
  }
}

@media (max-width: 979px) {
  #pointSec1 .foodResultsBox__numb {
    top: -1.2vmin;
    margin-left: 6%;
  }
}