@charset "UTF-8";
/*! Writen  by SCSS */
/*下層ページ最初のセクション上部余白を統一する際は使用してみて下さい*/
.inner_main .main_bg {
  background-image: url("../images/group/main.jpg"); }
  @media screen and (max-width: 480px) {
    .inner_main .main_bg {
      aspect-ratio: 414/419;
      background-image: url("../images/group/main_sp.jpg"); } }

.sec02,
.sec04 {
  background: rgba(118, 185, 246, 0.2); }

.sec02 {
  padding-top: clamp(50px, 6.67%, 80px);
  padding-bottom: clamp(50px, 6.67%, 80px); }
  @media screen and (max-width: 480px) {
    .sec02 {
      padding-top: 60px;
      padding-bottom: 60px; } }

.sec03 {
  padding-top: clamp(50px, 6.67%, 80px);
  padding-bottom: clamp(50px, 6.67%, 80px); }
  @media screen and (max-width: 480px) {
    .sec03 {
      padding-top: 60px;
      padding-bottom: 60px; } }

.sec04 {
  padding-top: clamp(40px, 5.84%, 70px);
  padding-bottom: clamp(40px, 5.84%, 70px); }
  @media screen and (max-width: 480px) {
    .sec04 {
      padding-top: 50px;
      padding-bottom: 50px; } }

.sec01 {
  padding-top: clamp(60px, 14.167vw, 170px); }
  @media screen and (max-width: 768px) {
    .sec01 {
      padding-top: 100px; } }
  @media screen and (max-width: 480px) {
    .sec01 {
      padding-top: 80px; } }
  .sec01 > .inner {
    padding-bottom: clamp(60px, 8.34%, 100px); }
  .sec01 .sec02_list_inner {
    align-items: flex-start; }
    @media screen and (max-width: 480px) {
      .sec01 .sec02_list_inner {
        display: block; } }
    .sec01 .sec02_list_inner .sec02_list_box_head {
      text-align: center;
      color: #fff;
      font-size: 18px;
      line-height: 1.4;
      padding: 15px 10px;
      margin-bottom: 40px; }
      @media screen and (max-width: 960px) {
        .sec01 .sec02_list_inner .sec02_list_box_head {
          font-size: 16px;
          margin-bottom: 30px; } }
      @media screen and (max-width: 768px) {
        .sec01 .sec02_list_inner .sec02_list_box_head {
          padding: 10px;
          margin-bottom: 20px; } }
    .sec01 .sec02_list_inner .sec02_list_box_l {
      width: 48.34%; }
      @media screen and (max-width: 480px) {
        .sec01 .sec02_list_inner .sec02_list_box_l {
          width: 100%;
          margin-bottom: 30px; } }
      .sec01 .sec02_list_inner .sec02_list_box_l .sec02_list_box_head {
        color: #FFF;
        background: rgba(4, 15, 97, 0.8); }
      @media screen and (max-width: 480px) {
        .sec01 .sec02_list_inner .sec02_list_box_l .sec02_list {
          display: block; } }
      .sec01 .sec02_list_inner .sec02_list_box_l .sec02_list .item:first-child {
        max-width: 190px;
        width: 32.76%; }
        @media screen and (max-width: 480px) {
          .sec01 .sec02_list_inner .sec02_list_box_l .sec02_list .item:first-child {
            width: 100%;
            margin-bottom: 15px; } }
      .sec01 .sec02_list_inner .sec02_list_box_l .sec02_list .item:last-child {
        max-width: 244px;
        width: 42.07%; }
        @media screen and (max-width: 480px) {
          .sec01 .sec02_list_inner .sec02_list_box_l .sec02_list .item:last-child {
            width: 100%; } }
    .sec01 .sec02_list_inner .sec02_list_box_r {
      width: 47.5%; }
      @media screen and (max-width: 480px) {
        .sec01 .sec02_list_inner .sec02_list_box_r {
          width: 100%; } }
      .sec01 .sec02_list_inner .sec02_list_box_r .sec02_list_box_head {
        color: #FFF;
        background: rgba(0, 73, 33, 0.8); }
      @media screen and (max-width: 480px) {
        .sec01 .sec02_list_inner .sec02_list_box_r .sec02_list {
          display: block; } }
      .sec01 .sec02_list_inner .sec02_list_box_r .sec02_list .item:first-child {
        max-width: 172px;
        width: 30.18%; }
        @media screen and (max-width: 480px) {
          .sec01 .sec02_list_inner .sec02_list_box_r .sec02_list .item:first-child {
            width: 100%;
            margin-bottom: 15px; } }
      .sec01 .sec02_list_inner .sec02_list_box_r .sec02_list .item:last-child {
        max-width: 280px;
        width: 49.13%; }
        @media screen and (max-width: 480px) {
          .sec01 .sec02_list_inner .sec02_list_box_r .sec02_list .item:last-child {
            width: 100%; } }

.group_head {
  font-size: clamp(18px, 2.09vw, 26px);
  color: #3e75af;
  line-height: 1.6;
  letter-spacing: 0.1em; }
  @media screen and (max-width: 480px) {
    .group_head {
      font-size: 22px;
      line-height: 1.8;
      letter-spacing: 0; } }
  .text_wrap .group_head {
    margin-bottom: 0.96em; }
    @media screen and (max-width: 480px) {
      .text_wrap .group_head {
        margin-bottom: 0.6em; } }
    .sec04 .text_wrap .group_head {
      margin-bottom: 0; }
      @media screen and (max-width: 480px) {
        .sec04 .text_wrap .group_head {
          margin-bottom: 0.3em; } }
  .group_head.border_head {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 0.5em; }
    @media screen and (max-width: 480px) {
      .group_head.border_head {
        line-height: 1.4; } }
    .group_head.border_head::before, .group_head.border_head::after {
      content: "";
      display: block;
      width: 1em;
      border-top: 1px solid; }
    .group_head.border_head .text {
      flex-shrink: 0; }

.sec01_head {
  max-width: 393px;
  width: 32.75%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: clamp(40px, 5%, 60px); }
  @media screen and (max-width: 480px) {
    .sec01_head {
      width: 89.32%; } }

.sec01_60_logo {
  max-width: 245px;
  width: 20.42%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: clamp(40px, 5.84%, 70px); }
  @media screen and (max-width: 480px) {
    .sec01_60_logo {
      width: 55.69%; } }

.sec01_bg_wrap {
  padding-top: clamp(25px, 3.34%, 40px);
  padding-bottom: clamp(30px, 4.17%, 50px);
  display: flex;
  align-items: center;
  justify-content: center;
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("../images/group/bg01.jpg"); }
  @media screen and (max-width: 480px) {
    .sec01_bg_wrap {
      padding-top: 6.04%;
      align-items: flex-start;
      padding-bottom: 0;
      aspect-ratio: 414 / 854;
      background-image: url("../images/group/bg01_sp.jpg"); } }
  .sec01_bg_wrap .sec01_bg_inner {
    max-width: 1211px;
    align-items: center; }
    @media screen and (max-width: 480px) {
      .sec01_bg_wrap .sec01_bg_inner {
        flex-direction: column;
        width: 100%;
        gap: 15px 0; } }
    .sec01_bg_wrap .sec01_bg_inner .image_left {
      max-width: 647px;
      width: 53.43%; }
      @media screen and (max-width: 480px) {
        .sec01_bg_wrap .sec01_bg_inner .image_left {
          width: 94.93%; } }
    .sec01_bg_wrap .sec01_bg_inner .image_right {
      max-width: 552px;
      width: 45.59%; }
      @media screen and (max-width: 480px) {
        .sec01_bg_wrap .sec01_bg_inner .image_right {
          width: 81.16%; } }

.sdgs_wrap {
  margin-top: clamp(25px, 3.34%, 40px);
  margin-bottom: clamp(50px, 6.67%, 80px);
  align-items: center; }
  @media screen and (max-width: 480px) {
    .sdgs_wrap {
      margin-top: 30px;
      margin-bottom: 60px;
      flex-direction: column;
      gap: 25px 0; } }
  .sdgs_wrap .sdgs_head {
    max-width: 406px;
    width: 33.84%; }
    @media screen and (max-width: 480px) {
      .sdgs_wrap .sdgs_head {
        width: 100%; } }
  .sdgs_wrap .sdgs_image {
    max-width: 738px;
    width: 61.5%; }
    @media screen and (max-width: 480px) {
      .sdgs_wrap .sdgs_image {
        width: 100%; } }

.sec03_bg_wrap {
  padding-top: 30px;
  padding-bottom: 30px;
  margin-bottom: 10px;
  border-radius: 10px;
  background: linear-gradient(140deg, rgba(39, 204, 197, 0.5) 0%, rgba(81, 205, 232, 0.5) 50%, rgba(112, 168, 230, 0.5) 100%); }
  @media screen and (max-width: 480px) {
    .sec03_bg_wrap {
      padding-top: 40px;
      padding-bottom: 40px;
      width: 100%; } }
  .sec03_bg_wrap .bg_inner {
    align-items: center;
    max-width: 1140px;
    width: calc(100% - 40px);
    margin-left: auto;
    margin-right: auto; }
    @media screen and (max-width: 480px) {
      .sec03_bg_wrap .bg_inner {
        width: calc(100% - 60px);
        flex-direction: column;
        gap: 30px 0; } }
    .sec03_bg_wrap .bg_inner .read {
      width: 42.11%;
      line-height: 2.19; }
      @media screen and (max-width: 480px) {
        .sec03_bg_wrap .bg_inner .read {
          width: 100%;
          line-height: 1.8; } }
    .sec03_bg_wrap .bg_inner .image_box {
      max-width: 628px;
      width: 55.09%; }
      @media screen and (max-width: 480px) {
        .sec03_bg_wrap .bg_inner .image_box {
          width: 100%; } }

.movie_box {
  margin-top: 30px;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  aspect-ratio: 16 / 9; }
  .movie_box iframe {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%; }