@charset "UTF-8";

/* =============================================================================

Relation CSS

地域とのつながり用CSS「.rs-×××」

上記はここに記述する

============================================================================= */

/* 冒頭文
----------------------------------------------------------------------------- */
.rs-desc {
  margin-bottom:10.0rem;
  @media (width > 767px) {
  }
  @media (width <= 767px) {
    margin-bottom:4.0rem;
  }
}

/* セクション
----------------------------------------------------------------------------- */
.rs-sections {
  display:grid;
  gap:10.0rem;
  @media (width > 767px) {
  }
  @media (width <= 767px) {
    gap:6.0rem;
  }

  .s {

  }
  .s > .l-heading-C {
    display:flex;
    gap:2.4rem;
    margin-bottom:2.4rem;
    line-height:1;
    @media (width > 767px) {
      font-size:1.8rem;
    }
    @media (width <= 767px) {
      flex-direction: column;
      gap:.6rem;
      margin-left:.5rem;
      margin-bottom:1.2rem;
      font-size:1.4rem;
    }
    .en {
    }
    .ja {
      font-size:1.6rem;
      @media (width <= 767px) {
        font-size:1.2rem;
      }
    }
  }
  .s_c {
    display:grid;
    @media (width > 767px) {
      grid-template-rows:auto 1fr;
      grid-template-columns:49.0rem 46.0rem;
      grid-template-areas:
        "heading img"
        "text img"
      ;
      column-gap: 6.0rem;
      padding:6.0rem 3.0rem 3.0rem 6.0rem;
    }
    @media (width <= 767px) {
      grid-template-rows:auto 1fr;
      grid-template-columns:1fr 12.0rem;
      grid-template-areas:
        "heading img"
        "text text"
      ;
      align-items: start;
      row-gap: 1.6rem;
      padding-block:2.5rem 4.0rem;
    }
  }
  .s_c_heading {
    grid-area:heading;
    font-size:2.8rem;
    font-weight: 700;
    line-height:1.6;
    letter-spacing: .05em;
    @media (width > 767px) {
      margin-bottom:3.6rem;
    }
    @media (width <= 767px) {
      display:grid;
      align-items: center;
      min-height:3lh;
      font-size:1.6rem;
    }
  }
  .s_c_img {
    grid-area:img;
    @media (width > 767px) {
      margin-top:-10.8rem;
    }
    @media (width <= 767px) {
      margin-top:-7.6rem;
      margin-right:-4.5rem;
    }
    img {
      @media (width <= 767px) {
        border-top-right-radius:0;
        border-bottom-right-radius:0;
      }
    }
  }
  .s_c_t {
    grid-area:text;
    line-height:2;
    letter-spacing: 0;
  }
  .s_c_t_example {
    margin-top:1lh;
    font-size:1.4rem;
    @media (width <= 767px) {
      margin-top:1em;
      font-size:1.1rem;
      line-height:1.8;
    }
  }
}


/* SelectorName
----------------------------------------------------------------------------- */
.rs-SelectorName {
  @media (width > 767px) {
  }
  @media (width <= 767px) {
  }
}
