.container {
  background: url("../../img/common/bg_concept.jpg") no-repeat 50% 100%;
  background-size: cover; }

.container-inner {
  padding-left: 50px;
  padding-right: 50px; }
  @media only screen and (max-width: 1024px) {
    .container-inner {
      padding-left: 0;
      padding-right: 0; } }
  .container-inner-txt {
    padding-bottom: 3rem; }
    .container-inner-txt p {
      font-size: 1.6rem;
      text-align: center;
      line-height: 2.5;
      padding-bottom: 3rem; }
      @media only screen and (max-width: 767px) {
        .container-inner-txt p {
          font-size: 1.3rem;
          padding: 0 1.5rem 1.5rem; }
          .container-inner-txt p:nth-last-of-type(1) {
            text-align: left;
            line-height: 1.8; } }
      .container-inner-txt p strong {
        color: #026212;
        font-size: 3.2rem;
        line-height: 1.3;
        display: inline-block;
        font-weight: 400; }
        @media only screen and (max-width: 767px) {
          .container-inner-txt p strong {
            font-size: 2.4rem;
            text-align: center; } }
        .container-inner-txt p strong b {
          font-size: 4rem;
          font-weight: 400; }
          @media only screen and (max-width: 767px) {
            .container-inner-txt p strong b {
              font-size: 3.3rem; } }
      .container-inner-txt p em {
        font-size: 2.6rem;
        font-style: normal; }
        @media only screen and (max-width: 767px) {
          .container-inner-txt p em {
            font-size: 2.4rem; } }
      .container-inner-txt p span {
        font-size: 2.6rem; }
        @media only screen and (max-width: 767px) {
          .container-inner-txt p span {
            font-size: 1.6rem; } }
  .container-inner-map {
    max-width: 930px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center; }
    @media only screen and (max-width: 1024px) {
      .container-inner-map {
        max-width: 75rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner-map {
      width: 30rem; } }

    .container-inner-map-fig {
      position: relative; }
      .container-inner-map-fig-nav ul li {
        position: absolute;
        cursor: pointer; }
        .container-inner-map-fig-nav ul li:hover .btn-spot {
          bottom: .5rem;
          transition: .5s;
          color: #74b400;
          border-color: #f29b76; }
          .container-inner-map-fig-nav ul li:hover .btn-spot:after {
            border-color: #f29b76 transparent transparent;
            transition: .5s; }
        .container-inner-map-fig-nav ul li.spot-area1 {
          left: 0;
          width: 100%;
          top: 80px;
          display: flex;
          justify-content: flex-start; }
          @media only screen and (max-width: 1024px) {
            .container-inner-map-fig-nav ul li.spot-area1 {
              top: 5.5rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner-map-fig-nav ul li.spot-area1 {
      top: 6rem; } }

          .container-inner-map-fig-nav ul li.spot-area1 .btn-spot:nth-of-type(1) {
            margin-left: 146px;
            margin-top: 0; }
            @media only screen and (max-width: 1024px) {
              .container-inner-map-fig-nav ul li.spot-area1 .btn-spot:nth-of-type(1) {
                margin-left: 11.5rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner-map-fig-nav ul li.spot-area1 .btn-spot:nth-of-type(1) {
      margin-left: 6.3rem; } }

          .container-inner-map-fig-nav ul li.spot-area1 .btn-spot:nth-of-type(2) {
            margin-left: 220px;
            margin-top: 60px; }
            @media only screen and (max-width: 1024px) {
              .container-inner-map-fig-nav ul li.spot-area1 .btn-spot:nth-of-type(2) {
                margin-top: 5rem;
                margin-left: 17.5rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner-map-fig-nav ul li.spot-area1 .btn-spot:nth-of-type(2) {
      margin-left: 8rem;
      margin-top: -2.5rem; } }

          .container-inner-map-fig-nav ul li.spot-area1 .btn-spot:nth-of-type(3) {
            margin-left: 164px;
            margin-top: 30px; }
            @media only screen and (max-width: 1024px) {
              .container-inner-map-fig-nav ul li.spot-area1 .btn-spot:nth-of-type(3) {
                margin-left: 12.2rem;
                margin-top: 3rem; } }
            @media only screen and (max-width: 767px) {
              .container-inner-map-fig-nav ul li.spot-area1 .btn-spot:nth-of-type(3) {
                margin-left: -6rem;
                margin-top: 8rem; } }
        .container-inner-map-fig-nav ul li.spot-area2 {
          left: 170px;
          top: 330px; }
          @media only screen and (max-width: 1024px) {
            .container-inner-map-fig-nav ul li.spot-area2 {
              left: 14rem;
              top: 25rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner-map-fig-nav ul li.spot-area2 {
      left: 7.5rem;
      top: 19rem; } }

        .container-inner-map-fig-nav ul li.spot-area3 {
          right: 280px;
          top: 326px; }
          @media only screen and (max-width: 1024px) {
            .container-inner-map-fig-nav ul li.spot-area3 {
              right: 22.5rem;
              top: 26rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner-map-fig-nav ul li.spot-area3 {
      right: 12.5rem;
      top: 27.5rem; } }

        .container-inner-map-fig-nav ul li.spot-area4 {
          left: 120px;
          bottom: 260px; }
          @media only screen and (max-width: 1024px) {
            .container-inner-map-fig-nav ul li.spot-area4 {
              left: 9rem;
              bottom: 21rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner-map-fig-nav ul li.spot-area4 {
      left: 5rem;
      bottom: 13rem; } }

        .container-inner-map-fig-nav ul li.spot-area5 {
          right: 108px;
          bottom: 271px; }
          @media only screen and (max-width: 1024px) {
            .container-inner-map-fig-nav ul li.spot-area5 {
              right: 8.5rem;
              bottom: 23rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner-map-fig-nav ul li.spot-area5 {
      right: 3rem;
      bottom: 22rem; } }

        .container-inner-map-fig-nav ul li .btn-spot {
          width: 70px;
          height: 70px;
          border: 9px solid #fff100;
          font-size: 10px;
          box-shadow: 0 0 1px 2px #fff;
          border-radius: 50%;
          background: #fff;
          line-height: 1;
          color: #0b861f;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          font-family: "Poppins", "Noto Sans JP", sans-serif;
          flex-shrink: 0;
          font-weight: 500;
          position: relative;
          letter-spacing: 0;
          transition: .5s;
          z-index: 1; }
          .container-inner-map-fig-nav ul li .btn-spot span {
            font-weight: 700; }
          @media only screen and (max-width: 1024px) {
            .container-inner-map-fig-nav ul li .btn-spot {
              width: 7rem;
              height: 7rem;
              border: .9rem solid #fff100;
              font-size: 1rem;
              box-shadow: 0 0 .1rem .2rem #fff; } }
          @media only screen and (max-width: 767px) {
            .container-inner-map-fig-nav ul li .btn-spot {
              width: 5rem;
              height: 5rem;
              border-width: .6rem;
              font-size: .8rem;
              box-shadow: 0 0 .1rem .15rem #fff; }
              .container-inner-map-fig-nav ul li .btn-spot span {
                font-size: 1.7rem; } }
          .container-inner-map-fig-nav ul li .btn-spot:before {
            content: "";
            border-style: solid;
            border-color: #fff transparent transparent;
            position: absolute;
            left: 50%;
            border-width: 10px 10px;
            bottom: -28px;
            margin-left: -10px;
            z-index: 1; }
            @media only screen and (max-width: 1024px) {
              .container-inner-map-fig-nav ul li .btn-spot:before {
                border-width: 1rem 1rem;
                bottom: -2.8rem;
                margin-left: -1rem; } }
            @media only screen and (max-width: 767px) {
              .container-inner-map-fig-nav ul li .btn-spot:before {
                border-width: .8rem .6rem;
                margin-left: -.6rem;
                bottom: -2.1rem; } }
          .container-inner-map-fig-nav ul li .btn-spot:after {
            content: "";
            border-style: solid;
            border-width: 10px 10px;
            border-color: #fff100 transparent transparent;
            position: absolute;
            bottom: -26px;
            left: 50%;
            margin-left: -10px;
            transition: .5s;
            z-index: 2; }
            @media only screen and (max-width: 1024px) {
              .container-inner-map-fig-nav ul li .btn-spot:after {
                border-width: 1rem 1rem;
                bottom: -2.6rem;
                margin-left: -1rem; } }
            @media only screen and (max-width: 767px) {
              .container-inner-map-fig-nav ul li .btn-spot:after {
                border-width: .8rem .6rem;
                margin-left: -.6rem;
                bottom: -1.9rem; } }
    .container-inner-map-guide {
      height: 5rem;
      background: #74b400;
      color: #fff;
      font-family: "Poppins", "Noto Sans JP", sans-serif;
      font-size: 1.5rem;
      padding: 0 2.5rem;
      position: relative;
      border-radius: 5rem;
      display: flex;
      align-items: center; }
      @media only screen and (max-width: 767px) {
        .container-inner-map-guide {
          display: block;
          text-align: center;
          font-size: 1.2rem;
          line-height: 1.3;
          height: auto;
          padding: .5rem 2.5rem; } }
      .container-inner-map-guide:after {
        content: "";
        border-style: solid;
        border-color: #74b400 transparent transparent;
        border-width: .8rem .6rem;
        position: absolute;
        left: 50%;
        margin-left: -.6rem;
        bottom: -1.5rem;
        z-index: 5; }
        @media only screen and (max-width: 767px) {
          .container-inner-map-guide:after {
            bottom: -1.2rem; } }
      .container-inner-map-guide mark {
        font-weight: 400;
        color: #fff100;
        background: none;
        display: flex;
        align-items: center; }
        @media only screen and (max-width: 767px) {
          .container-inner-map-guide mark {
            justify-content: center; } }
      .container-inner-map-guide b {
        font-size: 1.8rem;
        font-weight: 400; }
        @media only screen and (max-width: 767px) {
          .container-inner-map-guide b {
            font-size: 1.4rem; } }
      .container-inner-map-guide span {
        font-size: 2.4rem;
        font-weight: 700;
        color: #026212; }
        @media only screen and (max-width: 767px) {
          .container-inner-map-guide span {
            font-size: 1.8rem; } }

.modal-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  background: rgba(34, 51, 34, 0.9);
  padding: 6rem 5vw;
  overflow: auto;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
  box-sizing: border-box;
  z-index: 9999; }
  @media only screen and (max-width: 767px) {
    .modal-container {
      padding: 3rem .5rem 1.5rem; } }
  .modal-container:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    height: 100%; }
  .modal-container.active {
    opacity: 1;
    visibility: visible; }
.modal-body {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  max-width: 75rem;
  width: 95%; }
.modal-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4.5rem;
  height: 4.5rem;
  color: #fff;
  background: #026212;
  border-radius: 50%;
  cursor: pointer;
  position: absolute;
  top: -2.2rem;
  right: -2.2rem; }
  @media only screen and (max-width: 767px) {
    .modal-close {
      right: auto;
      left: 1rem; } }
  .modal-close span {
    font-size: 2.4rem; }
    @media only screen and (max-width: 767px) {
      .modal-close span {
        font-size: 1.8rem; } }
.modal-content {
  background: #fff;
  border: 0.8rem solid #026212;
  text-align: left; }
  @media only screen and (max-width: 767px) {
    .modal-content {
      border-width: .4rem; } }
  .modal-content-header {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-bottom: 1.5rem;
    background: rgba(116, 180, 0, 0.1);
    padding: 2.5rem;
    position: relative; }
    @media only screen and (max-width: 767px) {
      .modal-content-header {
        padding: 1.5rem 0; } }
    .modal-content-header-num {
      background: #026212;
      border-radius: 5rem;
      font-size: 1.6rem;
      color: #fff;
      height: 3rem;
      padding: 0 .8rem 0 1.5rem;
      display: flex;
      justify-content: center;
      align-items: center;
      font-family: "Poppins", "Noto Sans JP", sans-serif;
      margin-bottom: 1rem; }
      @media only screen and (max-width: 767px) {
        .modal-content-header-num {
          width: 11rem;
          height: 2.6rem;
          font-size: 1.1rem; } }
      .modal-content-header-num span {
        background: #fff;
        color: #026212;
        width: 2rem;
        height: 2rem;
        display: flex;
        justify-content: center;
        align-items: center;
        font-weight: 500;
        flex-shrink: 0;
        margin-left: .2rem;
        border-radius: 50%;
        letter-spacing: 0; }
        @media only screen and (max-width: 767px) {
          .modal-content-header-num span {
            width: 1.7rem;
            height: 1.7rem;
            font-size: 1.2rem; } }
    .modal-content-header h5 {
      font-size: 2.8rem;
      text-align: center;
      font-weight: 400;
      color: #026212; }
      .modal-content-header h5 strong {
        color: #74b400;
        font-weight: 400; }
      @media only screen and (max-width: 767px) {
        .modal-content-header h5 {
          font-size: 2rem;
          line-height: 1.4; } }
  .modal-content-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 2.5rem 2rem; }
    @media only screen and (max-width: 767px) {
      .modal-content-inner {
        flex-direction: column;
        padding: 1.5rem 1.5rem 1rem; } }
    .modal-content-inner-fig {
      border-radius: 1rem;
      border: .5rem solid #F1F7E6;
      overflow: hidden;
      max-width: 35rem; }
      @media only screen and (max-width: 767px) {
        .modal-content-inner-fig {
          border-width: .3rem; } }
    .modal-content-inner-txt {
      width: 100%;
      text-align: center;
      padding-left: 2.5rem; }
      @media only screen and (max-width: 767px) {
        .modal-content-inner-txt {
          padding: 1rem 0 0; } }
      .modal-content-inner-txt p {
        font-size: 1.7rem;
        line-height: 2.5; }
        @media only screen and (max-width: 767px) {
          .modal-content-inner-txt p {
            font-size: 1.2rem;
            line-height: 2; } }
  .modal-content-footer {
    display: flex;
    justify-content: space-between;
    padding: 0 2rem 2.5rem; }
    @media only screen and (max-width: 767px) {
      .modal-content-footer {
        padding: 0 1.1rem 1.5rem;
        align-items: stretch; } }
    .modal-content-footer li {
      width: 33.3333%;
      padding: 0 .5rem; }
      @media only screen and (max-width: 767px) {
        .modal-content-footer li {
          padding: 0 .2rem; } }
      .modal-content-footer li a {
        height: 6rem;
        display: flex;
        justify-content: center;
        align-items: center;
        background: #026212;
        font-size: 1.6rem;
        text-align: left;
        line-height: 1.2;
        letter-spacing: .1rem;
        color: #fff;
        border-radius: .5rem; }
        @media only screen and (min-width: 1025px) {
          .modal-content-footer li a:hover {
            opacity: 0.8; } }
        @media only screen and (max-width: 767px) {
          .modal-content-footer li a {
            height: 6.4rem;
            font-family: "Poppins", "Noto Sans JP", sans-serif;
            flex-direction: column;
            text-align: center;
            font-size: 1rem;
            letter-spacing: 0; } }
        .modal-content-footer li a span {
          font-size: 3.8rem;
          line-height: 1;
          font-weight: 200;
          margin-right: 1rem; }
          @media only screen and (max-width: 767px) {
            .modal-content-footer li a span {
              line-height: 3rem;
              font-size: 2.4rem;
              margin: 0; } }
          .modal-content-footer li a span.icon {
            font-size: 1em; }
          .modal-content-footer li a span img {
            width: 3.1rem; }
            @media only screen and (max-width: 767px) {
              .modal-content-footer li a span img {
                width: 2.1rem; } }
        @media only screen and (min-width: 1025px) {
          .modal-content-footer li a:hover {
            background: #026212; } }
      .modal-content-footer li:nth-of-type(1) a {
        background: #74b400; }
        @media only screen and (max-width: 767px) {
          .modal-content-footer li:nth-of-type(1) a {
            line-height: 2.4; } }
        .modal-content-footer li:nth-of-type(1) a span {
          font-size: 4.6rem; }
          @media only screen and (max-width: 767px) {
            .modal-content-footer li:nth-of-type(1) a span {
              font-size: 3rem; } }
      .modal-content-footer li:nth-of-type(3) a {
        background: #0b861f; }
