/*==============================================
variables
==============================================*/
/* main-color */
/* sub-color */
/* bg-color */
/* text-color */
/* contents width */
/* mixin */
.font-line {
  display: block;
}

/* function */
/*==============================================
ecotechnology
==============================================*/
/*
* hero
* past-article

*/
/* hero
----------------------- */
.hero {
  background: url(../../common/img/bg_ecotechnology.jpg);
  padding-top: 40px;
}

.hero__title {
  margin: 0 auto 3.75%;
  width: 70.33333%;
}

.hero__lead {
  font-size: 1.8rem;
  margin-bottom: 3.75%;
  text-align: center;
}

.hero .hero-text {
  top: 50%;
  width: 466px;
}

.hero .hero-text__leaf {
  display: inline-block;
  left: -20px;
  position: relative;
  width: 23.39056%;
}

.hero .hero-text__leaf .leaf-num {
  left: 33.02752%;
  position: absolute;
  top: 15.05376%;
  width: 36.69725%;
}

.hero .hero-text__leaf .leaf-num__img {
  vertical-align: top;
  width: 100%;
}

.hero .hero-text__sub {
  width: 98.92704%;
}

.hero--vol9 .hero-text__main {
  width: 124.46352%;
}

.hero--vol9 .hero-text__sub {
  width: 129.39914%;
}

.hero--vol12 .hero-text {
  width: 50%;
  right: 5%;
  top: 11%;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}

.hero--vol12 .hero-text__leaf {
  width: 18.13311%;
}

.hero--vol12 .hero-text__sub {
  width: 67.83333%;
}

.hero--vol13 .hero-text {
  width: 56%;
  top: 7.5%;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}

.hero--vol13 .hero-text__leaf {
  width: 17.13311%;
}

.hero--vol13 .hero-text__sub {
  width: 100.83333%;
}

.hero--vol14 .hero-text {
  width: 56%;
  left: 5%;
  top: 38%;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}

.hero--vol14 .hero-text__leaf {
  width: 17.13311%;
}

.hero--vol14 .hero-text__sub {
  width: 100.83333%;
}

.hero--vol15 .hero-text {
  width: 56%;
  left: 5%;
  top: 40%;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}

.hero--vol15 .hero-text__leaf {
  width: 17.13311%;
}

.hero--vol15 .hero-text__sub {
  width: 91.66667%;
}

.hero--vol16 .hero-text {
  width: 50%;
  left: 5%;
  top: 25%;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}

.hero--vol16 .hero-text__leaf {
  width: 17.13311%;
}

.hero--vol16 .hero-text__sub {
  width: 66.66667%;
  width: 61.66667%;
}

.hero--vol17 .hero-text {
  width: 56%;
  left: 5%;
  top: 25%;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}

.hero--vol17 .hero-text__leaf {
  width: 17.13311%;
}

.hero--vol17 .hero-text__sub {
  width: 66.66667%;
  width: 61.66667%;
}

.hero--vol18 .hero-text {
  width: 56%;
  left: 5%;
  top: 3%;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}

.hero--vol18 .hero-text__leaf {
  width: 17.13311%;
}

.hero--vol18 .hero-text__sub {
  width: 66.66667%;
}

.hero--vol19 .hero-text {
  width: 56%;
  left: 5%;
  top: 27%;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}

.hero--vol19 .hero-text__leaf {
  width: 17.13311%;
}

.hero--vol19 .hero-text__sub {
  width: 61.66667%;
}

.hero--vol21 .hero-text {
  top: 43%;
}

.hero--vol22 .hero-text {
  left: 10%;
  top: 50%;
}

.hero--vol23 .hero-text {
  left: 10%;
  top: 60%;
}

.hero--vol23 .hero-text__sub {
  width: 129.8%;
}

.hero--vol24 .hero-text {
  left: 10%;
  top: 65%;
}

.hero--vol24 .hero-text__sub {
  width: 135.6%;
}

.hero--vol26 .hero-text {
  left: 10%;
  top: 65%;
}

.hero--vol26 .hero-text__sub {
  width: 135.6%;
}

.hero--vol27 .hero-text {
  left: 53%;
  top: 60%;
}

.hero--vol27 .hero-text__sub {
  width: 106.8%;
}

.hero__figure {
  height: 0;
  padding-top: 43.33333%;
  position: relative;
}

.hero__figure a {
  display: block;
  left: 0;
  position: absolute;
  top: 0;
  height: 100%;
}

.hero__figure a:hover path {
  fill: #fff;
}

.hero__img {
  background: rgba(255, 255, 255, 0.01);
  margin-top: -2.08333%;
  width: 100%;
}

.hero__imginner {
  position: relative;
  height: 520px;
  overflow: hidden;
}

.hero .contents__inner {
  padding-top: 6.66667%;
  padding-bottom: 5%;
}

@media only screen and (max-width: 1400px) {
  .hero .hero-text {
    width: 33.28571vw;
  }
  .hero .hero-text__sub {
    width: 139.27039%;
  }
}

@media only screen and (max-width: 767px) {
  .hero {
    padding-top: 0;
  }
  .hero__title {
    margin: 0 auto 5.33333vw;
    width: 75.06667vw;
  }
  .hero__lead {
    font-size: 3.73333vw;
    margin-bottom: 7.33333vw;
    text-align: left;
  }
  .hero__lead br {
    display: none;
  }
  .hero__imginner {
    height: auto;
  }
  .hero .hero-text {
    bottom: 5%;
    left: 3.33333vw;
    top: auto;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    width: 62.13333vw;
  }
  .hero .hero-text__sub {
    width: 91.20172%;
  }
  .hero .hero-text__leaf {
    left: 0;
    margin-bottom: 5px;
    width: 11.46667vw;
  }
}

@media only screen and (max-width: 767px) and (orientation: landscape) {
  .hero .hero-text__leaf .leaf-num {
    top: 1.33333vw;
  }
}

@media only screen and (max-width: 767px) {
  .hero .hero-text__main .arrow {
    top: 50%;
    right: -3%;
    width: 2.66667vw;
  }
  .hero--vol9 .hero-text__main {
    width: 124.46352%;
  }
  .hero--vol9 .hero-text__sub {
    width: 122.3176%;
  }
  .hero--vol13 .hero-text {
    width: 83%;
    right: 5%;
    top: 11%;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
  }
  .hero--vol13 .hero-text__sub {
    width: 67.83333%;
  }
  .hero--vol14 .hero-text {
    right: 5%;
    top: 46%;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
  }
  .hero--vol14 .hero-text__sub {
    width: 78.33333%;
  }
  .hero--vol15 .hero-text {
    right: 5%;
    top: 55%;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
  }
  .hero--vol15 .hero-text__sub {
    width: 108.33333%;
  }
  .hero--vol16 .hero-text {
    right: 5%;
    top: 45%;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
  }
  .hero--vol16 .hero-text__sub {
    width: 78.33333%;
  }
  .hero--vol17 .hero-text {
    right: 5%;
    top: 35%;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
  }
  .hero--vol17 .hero-text__sub {
    width: 61.66667%;
  }
  .hero--vol18 .hero-text {
    right: 5%;
    top: .5%;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
  }
  .hero--vol18 .hero-text__sub {
    width: 61.66667%;
  }
  .hero--vol19 .hero-text {
    right: 5%;
    top: 45%;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
  }
  .hero--vol19 .hero-text__sub {
    width: 78.33333%;
  }
  .hero--vol22 .hero-text__sub {
    width: 78.33333%;
  }
  .hero--vol23 .hero-text {
    bottom: 10%;
  }
  .hero--vol23 .hero-text__main {
    width: 107.29614%;
  }
  .hero--vol23 .hero-text__sub {
    width: 128.75536%;
  }
  .hero--vol26 .hero-text {
    bottom: 15%;
  }
  .hero--vol26 .hero-text__main {
    width: 89.05579%;
  }
  .hero--vol26 .hero-text__main .arrow {
    right: -30%;
  }
  .hero--vol26 .hero-text__sub {
    width: 128.75536%;
  }
  .hero--vol27 .hero-text {
    bottom: 15%;
  }
  .hero--vol27 .hero-text__main {
    width: 122.103%;
  }
  .hero--vol27 .hero-text__main .arrow {
    right: -10%;
  }
  .hero--vol27 .hero-text__sub {
    width: 114.59227%;
  }
  .hero__figure {
    padding-top: 88.8vw;
  }
  .hero__figure a {
    margin-top: 0;
  }
  .hero__img {
    margin-top: 0;
  }
  .hero .contents__inner {
    padding-top: 10.66667vw;
    padding-bottom: 8.66667vw;
  }
}

.hero-text {
  left: 40px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.hero-text--right {
  left: auto;
  right: 5%;
}

.hero-text--left-bottom {
  top: auto;
  bottom: -4.28571vw;
}

.hero-text--left-bottom02 {
  top: auto;
  bottom: -22.5%;
  left: 60px !important;
}

@media only screen and (max-width: 767px) {
  .hero-text--left-bottom02 {
    left: 3.33333vw !important;
  }
}

/* past-article
----------------------- */
.past-article__headline {
  margin: 0 auto 3.75%;
  width: 13.66667%;
}

.past-article__list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.past-article__item {
  margin-bottom: 5%;
  width: 48.25%;
}

.past-article__a {
  display: block;
  position: relative;
}

.past-article__a img {
  width: 100%;
}

.past-article__edition {
  height: 87px;
  position: absolute;
  right: 10px;
  top: 0;
  width: 80px;
}

.past-article__sdgs {
  height: 56px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  bottom: -15px;
  right: 10px;
}

.past-article .contents__inner {
  padding-top: 5%;
  padding-bottom: 3.33333%;
}

.edge_lt15 .past-article__item {
  margin-bottom: 40px;
}

@media only screen and (max-width: 767px) {
  .edge_lt15 .past-article__item {
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 1400px) {
  .past-article__edition {
    width: 5.71429vw;
  }
}

@media only screen and (max-width: 767px) {
  .past-article__headline {
    margin-bottom: 6.66667vw;
    width: 21.46667vw;
  }
  .past-article__item {
    margin-bottom: 9.33333vw;
    text-align: center;
    width: 100%;
  }
  .past-article__edition {
    width: 10.66667vw;
  }
  .past-article__sdgs {
    height: 8.26667vw;
    bottom: -10px;
  }
  .past-article .contents__inner {
    padding-top: 10vw;
    padding-bottom: 0;
  }
}

/*# sourceMappingURL=../../map/ecotechnology/css/ecotechnology.css.map */
