.pageTitle {
  padding-top: 118px;
}
.pageTitle h1::before, .pageTitle h1::after {
  background-image: url(../top-img/tree.svg);
  background-size: 416px 854px;
  background-position: right top;
  width: 334px;
  height: 854px;
}
.pageTitle img {
  position: relative;
  z-index: 1;
}

.slides {
  position: relative;
  margin-top: -132px;
  width: 100%;
  overflow: hidden;
}
.slides::before {
  content: "";
  position: absolute;
  z-index: 1;
  right: 50%;
  bottom: 0;
  transform: translateX(50%);
  width: 100%;
  height: 32px;
  background: url(../top-img/mv-btm.png) repeat-x center bottom;
  background-size: auto 32px;
}
.slides::after {
  content: "";
  position: absolute;
  right: 50%;
  bottom: 0;
  transform: translateX(50%);
  z-index: 1;
  width: 100%;
  height: 100px;
  background-image: url(../top-img/animal-left.svg), url(../top-img/animal-right.svg);
  background-position: left calc(50% - 604px) bottom 12px, left calc(50% + 625px) bottom;
  background-size: 154px 89px, 136px 101px;
  background-repeat: no-repeat;
}
.slides-wrapper {
  width: 1300px;
  margin: 0 auto;
  z-index: -1;
}

.slick-list {
  overflow: visible;
}

@media screen and (max-width: 767px) {
  .pageTitle {
    padding-top: 68px;
  }
  .pageTitle h1 {
    padding: 0;
  }
  .pageTitle h1::before, .pageTitle h1::after {
    background-image: url(../top-img/tree-sp.png);
    background-size: 209px 488px;
    width: 63px;
    height: 488px;
  }

  .slides {
    margin-top: -91px;
  }
  .slides::before {
    background-image: url(../top-img/mv-btm-sp.png);
    background-size: auto 22px;
    height: 22px;
  }
  .slides::after {
    background-image: url(../top-img/animal-left-sp.png), url(../top-img/animal-right-sp.png);
    background-position: 2px bottom, right 9px bottom;
    background-size: 93px 55px, 81px 61px;
    height: 61px;
    bottom: 12px;
  }
  .slides-wrapper {
    width: 100%;
  }
  .slides-item img {
    width: 100%;
    height: 447px;
    max-width: none;
    object-fit: cover;
    object-position: 50% 50%;
  }
}

.treebox {
  position: relative;
  background-color: #E3FFF5;
  background-image: url(../top-img/tree01.svg), linear-gradient(0deg, #E3FFF5 0%, #fcfffe 21.7808%, #fcfffe 68.4665%, #E3FFF5 100%);
  background-position: center 108px, 0 234px;
  background-size: auto, 100% 780px;
  background-repeat: no-repeat;
  padding: 1120px 0 52px;
}
.treebox::before {
  content: "";
  position: absolute;
  left: 0;
  top: 986px;
  width: 100%;
  height: 230px;
  background: url(../top-img/tree-btm.png) repeat-x center top;
}
.treebox::after {
  content: "";
  position: absolute;
  left: 0;
  top: 916px;
  width: 100%;
  height: 103px;
  background: url(../top-img/animal01.svg) no-repeat center top;
}
.treebox .textbox {
  position: relative;
  max-width: 800px;
  margin: 0 auto;
  padding: 46px 0;
  background-color: rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  text-align: center;
  color: #00a082;
  font-weight: bold;
  font-size: 2rem;
  line-height: 2.5;
}
@media screen and (max-width: 767px) {
  .treebox {
    background-image: url(../top-img/tree01-sp.png), linear-gradient(0deg, #E3FFF5 0%, #fcfffe 21.7808%, #fcfffe 68.4665%, #E3FFF5 100%);
    background-position: center 29px, 0 83px;
    background-size: calc(100% - 20px) auto, 100% 302px;
    padding: 118.133% 10px 78px;
  }
  .treebox::before {
    top: 97.6vw;
    width: 100%;
    height: 122px;
    background-image: url(../top-img/tree-btm-sp.png);
    background-size: 768px auto;
  }
  .treebox::after {
    width: 100%;
    left: 50%;
    top: 88.8vw;
    transform: translateX(-50%);
    background-image: url(../top-img/animal01-sp.png);
    background-size: calc(100% - 10px) auto;
    padding-top: 14.4%;
  }
  .treebox .textbox {
    padding: 28px 20px;
    text-align: left;
    font-size: 1.8rem;
    line-height: 1.944;
  }
  .treebox .textbox .spNone {
    display: none;
  }
}

.point {
  max-width: 980px;
  margin: 152px auto 0;
  position: relative;
  background-image: url(../top-img/line.svg), url(../top-img/line.svg), url(../top-img/sprout.svg);
  background-position: left top, left bottom, right 8px bottom 0;
  background-size: auto 2px, auto 2px, auto;
  background-repeat: no-repeat;
  font-size: 1.9rem;
  line-height: 1.526;
}
.point + .point {
  margin-top: 100px;
}
.point h2 {
  position: absolute;
  left: 0;
  bottom: 0;
}
.point .text {
  padding: 50px 70px 50px 250px;
}
.point ul {
  padding: 34px 70px 34px 226px;
}
.point li {
  list-style: none;
  text-indent: -1em;
  padding-left: 1em;
}
.point li + li {
  margin-top: 10px;
}
.point em {
  font-style: normal;
  font-weight: bold;
  font-size: 2rem;
  color: #e69500;
}
@media screen and (max-width: 767px) {
  .point {
    margin-top: 40px;
    background-image: url(../top-img/line.svg), url(../top-img/sprout.svg);
    background-size: auto 2px, 32px 20px;
    background-position: center bottom, right bottom;
    font-size: 1.8rem;
  }
  .point + .point {
    margin-top: 50px;
  }
  .point h2 {
    background: url(../top-img/line.svg) no-repeat center bottom;
    position: static;
  }
  .point em {
    font-size: 1.9rem;
  }
  .point .text {
    padding: 26px 10px 28px;
  }
  .point ul {
    padding: 36px 10px;
  }
}

.news {
  padding: 80px 0 96px;
}
.news .contents {
  display: flex;
  max-width: 980px;
  margin: 68px auto 0;
}
.news ul {
  list-style: none;
  flex: 0 0 730px;
  border-radius: 20px;
  background-color: #fff;
  padding: 20px 15px 0;
  position: relative;
}
_:-ms-lang(x)::-ms-backdrop, .news ul {
  max-width: 730px;
}

.news ul::before {
  content: "";
  position: absolute;
  left: 10px;
  bottom: 100%;
  background: url(../top-img/icon-tree.svg) no-repeat 0 0;
  background-size: 69px auto;
  width: 69px;
  height: 56px;
}
.news li a {
  display: flex;
  align-items: center;
  height: 62px;
  text-decoration: none;
}
.news li + li {
  background: url(../top-img/line.svg) no-repeat 0 0;
  background-size: auto 2px;
  padding-top: 2px;
}
.news .icon {
  flex: 0 0 50px;
  transition-duration: 0.3s;
}
.news .text {
  flex: 1 0 0%;
  display: flex;
}
.news .date {
  flex: 0 0 92px;
  display: block;
  margin: 0 10px;
  color: #00a000;
  font-size: 1.5rem;
}
.news .title {
  flex: 0 0 535px;
  max-width: 535px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.news .btnNews {
  flex: 0 0 235px;
  margin-left: auto;
}
.news .btnNews a {
  display: block;
  background: url(../top-img/btn-news-over.svg) no-repeat 0 0;
}
.news .btnNews a img {
  transition-duration: 0.3s;
}
@media screen and (min-width: 768px) {
  .news li a:hover .icon {
    opacity: 0.7;
  }
  .news li a:hover .title {
    text-decoration: underline;
  }
  .news .btnNews a:hover img {
    opacity: 0;
  }
}
@media (any-pointer: coarse) {
  .news li a:active .icon {
    opacity: 0.7;
  }
  .news li a:active .title {
    text-decoration: underline;
  }
  .news .btnNews a:active img {
    opacity: 0;
  }
}
@media screen and (max-width: 767px) {
  .news {
    padding: 48px 10px 78px;
  }
  .news .contents {
    display: block;
    margin-top: 60px;
  }
  .news ul {
    padding: 0 10px;
  }
  .news ul::before {
    width: 48px;
    height: 39px;
    background-size: 48px auto;
  }
  .news li a {
    padding: 18px 0 16px;
    height: auto;
  }
  .news .text {
    display: block;
  }
  .news .date {
    font-size: 1.4rem;
  }
  .news .title {
    display: block;
    margin-left: 10px;
    max-width: none;
    overflow: visible;
    white-space: normal;
    text-overflow: clip;
    font-size: 1.5rem;
  }
  .news .btnNews {
    margin-top: 20px;
    text-align: center;
  }
  .news .btnNews a {
    background-image: none;
  }
  .news .btnNews a:active {
    opacity: 0.7;
  }
  .news .btnNews a:active img {
    opacity: 1;
  }
}

.recruit {
  padding: 68px 0 98px;
}
.recruit .contents {
  max-width: 980px;
  margin: 54px auto 0;
  display: flex;
  align-items: center;
}
.recruit .textbox {
  flex: 0 0 730px;
  font-size: 2rem;
  line-height: 1.8;
}
.recruit h3 {
  margin-bottom: 24px;
}
.recruit .btnMore {
  flex: 0 0 235px;
  margin-left: auto;
}
.recruit .btnMore a {
  display: block;
  background: url(../top-img/btn-recruit-over.svg) no-repeat 0 0;
}
.recruit .btnMore a img {
  transition-duration: 0.3s;
}
@media screen and (min-width: 768px) {
  .recruit .btnMore a:hover img {
    opacity: 0;
  }
}
@media (any-pointer: coarse) {
  .recruit .btnMore a:active img {
    opacity: 0;
  }
}
@media screen and (max-width: 767px) {
  .recruit {
    padding: 48px 10px 80px;
  }
  .recruit .contents {
    display: block;
    margin-top: 44px;
    text-align: center;
  }
  .recruit .textbox {
    font-size: 1.7rem;
    line-height: 1.941;
  }
  .recruit h3 {
    margin-bottom: 20px;
  }
  .recruit .text span {
    display: block;
  }
  .recruit .btnMore {
    margin-top: 38px;
  }
  .recruit .btnMore a {
    background-image: none;
  }
  .recruit .btnMore a:active img {
    opacity: 0.7;
  }
}
@media screen and (max-width: 320px) {
  .recruit .textbox {
    font-size: 1.5rem;
  }
}

.group .catch {
  background: url(../img/line.svg) no-repeat center bottom;
  background-size: auto 2px;
  margin-bottom: 18px;
  padding-bottom: 18px;
  height: 94px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: #e69500;
  font-weight: bold;
  line-height: 1.529;
  font-size: 1.7rem;
}
.group .date {
  margin-top: 20px;
  color: #998675;
}
.group .kibo {
  color: #998675;
}
@media screen and (max-width: 767px) {
  .group h3 {
    margin-bottom: 12px;
  }
  .group .catch {
    height: auto;
    padding-bottom: 12px;
    font-size: 1.4rem;
  }
  .group li:nth-of-type(2) .catch br {
    display: none;
  }
}
@media screen and (max-width: 320px) {
  .group .catch br {
    display: none;
  }
}