@charset "UTF-8";
/* ----関数設定---- */
/* ----------------------------------------------------------------------
トップページ
---------------------------------------------------------------------- */
#main_img {
  background: url(../images/main_img_bg@2x.webp?) center center/contain;
  max-width: 1600px;
  margin-inline: auto;
}
#main_img img.message {
  margin: 58px auto 72px;
  display: block;
  max-width: 75%;
}
#main_img p {
  color: #FFF;
  font-size: clamp(11px, calc(0.3755868545vw + 10px), 15px);
  margin: 0 5% 30px;
}
@supports not (font-size: clamp(11px, calc(0.3755868545vw + 10px), 15px)) {
  #main_img p {
    font-size: max(11px, min(calc(0.3755868545vw + 10px), 15px));
  }
}
#main_img .loop_wrap div img {
  /* aspect-ratio: 3728/370;
  background: url(../images/main_img01@2x.webp?1) no-repeat left top/contain;*/
  height: clamp(100px, calc(7.9812206573vw + 70px), 185px);
  margin-left: 0px;
	width: auto;
    max-width: unset;
}
@supports not (height: clamp(100px, calc(7.9812206573vw + 70px), 185px)) {
  #main_img .loop_wrap div img{
    height: max(100px, min(calc(7.9812206573vw + 70px), 185px));
  }
}
#main_img .loop_wrap2 div img{
  /* aspect-ratio: 3728/370;
  background: url(../images/main_img02@2x.webp?1) no-repeat left bottom/contain;*/
  height: clamp(100px, calc(7.9812206573vw + 70px), 185px);
  margin-left: 0px;
	width: auto;
    max-width: unset;
}
@supports not (height: clamp(100px, calc(7.9812206573vw + 70px), 185px)) {
  #main_img .loop_wrap2 div img {
    height: max(100px, min(calc(7.9812206573vw + 70px), 185px));
  }
}
#main_img .loop_wrap div.second,#main_img .loop_wrap2 div.second{margin-left:0px;}

#index_news {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 30px;
  max-width: 1460px;
  margin-inline: auto;
  margin-bottom: 70px;
}
#index_news .news_wrapper {
  width: 90%;
  margin-inline: auto;
}
#index_news .news_wrapper .news_categories {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: clamp(20px, calc(2.8169014085vw + 9px), 50px);
}
@supports not (margin-bottom: clamp(20px, calc(2.8169014085vw + 9px), 50px)) {
  #index_news .news_wrapper .news_categories {
    margin-bottom: max(20px, min(calc(2.8169014085vw + 9px), 50px));
  }
}
#index_news .news_wrapper .news_categories .tab {
  cursor: pointer;
  border-radius: 99999px;
  background: #e3e3e3;
  color: #04438C;
  display: inline-block;
  padding: 2px 15px;
  text-align: center;
  font-size: clamp(11px, calc(0.2816901408vw + 10px), 14px);
}
@supports not (font-size: clamp(11px, calc(0.2816901408vw + 10px), 14px)) {
  #index_news .news_wrapper .news_categories .tab {
    font-size: max(11px, min(calc(0.2816901408vw + 10px), 14px));
  }
}
#index_news .news_wrapper .news_categories .tab:hover, #index_news .news_wrapper .news_categories .tab.is-active {
  transition: all 0.2s ease-out;
  background: #04438C;
  color: #FFF;
}
#index_news .news_wrapper .news_waku .panel {
  display: none;
  flex-wrap: wrap;
  gap: 20px;
}
#index_news .news_wrapper .news_waku .panel.is-show {
  display: flex;
  animation: show 0.4s linear 0s;
}
#index_news .news_wrapper .news_waku .panel .news {
  width: 100%;
}
#index_news .news_wrapper .news_waku .panel .news a {
  display: flex;
  justify-content: space-between;
}
#index_news .news_wrapper .news_waku .panel .news a figure {
  width: 120px;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 10px;
}
#index_news .news_wrapper .news_waku .panel .news a figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#index_news .news_wrapper .news_waku .panel .news a .info {
  width: calc(100% - 140px);
}
#index_news .news_wrapper .news_waku .panel .news a .info .post_date {
  color: #999999;
  font-family: "Roboto", sans-serif;
  font-size: clamp(14px, calc(0.1877934272vw + 13px), 16px);
}
@supports not (font-size: clamp(14px, calc(0.1877934272vw + 13px), 16px)) {
  #index_news .news_wrapper .news_waku .panel .news a .info .post_date {
    font-size: max(14px, min(calc(0.1877934272vw + 13px), 16px));
  }
}
#index_news .news_wrapper .news_waku .panel .news a .info h3 {
  font-size: clamp(14px, calc(0.1877934272vw + 13px), 16px);
  line-height: 1.5;
}
@supports not (font-size: clamp(14px, calc(0.1877934272vw + 13px), 16px)) {
  #index_news .news_wrapper .news_waku .panel .news a .info h3 {
    font-size: max(14px, min(calc(0.1877934272vw + 13px), 16px));
  }
}
#index_news .news_wrapper .news_waku .panel .news a .info .tag_wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  border-top: solid 1px #CCC;
  margin-top: 10px;
  padding-top: 5px;
}
#index_news .news_wrapper .news_waku .panel .news a .info .tag_wrapper li {
  color: #999999;
  font-size: clamp(11px, calc(0.0938967136vw + 11px), 12px);
}
@supports not (font-size: clamp(11px, calc(0.0938967136vw + 11px), 12px)) {
  #index_news .news_wrapper .news_waku .panel .news a .info .tag_wrapper li {
    font-size: max(11px, min(calc(0.0938967136vw + 11px), 12px));
  }
}
#index_news .news_wrapper .news_waku .panel .news a .info .tag_wrapper li::before {
  content: "＃";
  margin-right: 3px;
  font-style: italic;
}
#index_news .news_wrapper .button {
  margin-top: clamp(30px, calc(2.5352112676vw + 20px), 57px);
}
@supports not (margin-top: clamp(30px, calc(2.5352112676vw + 20px), 57px)) {
  #index_news .news_wrapper .button {
    margin-top: max(30px, min(calc(2.5352112676vw + 20px), 57px));
  }
}
#index_news .fb_wrapper {
  width: 90%;
  margin-inline: auto;
}
#index_news .fb_wrapper .fb-page, #index_news .fb_wrapper .fb-page span, #index_news .fb_wrapper .fb-page iframe {
  width: 100% !important;
  height: 620px !important;
}

@keyframes show {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
#index_school {
  width: 90%;
  max-width: 1330px;
  margin-inline: auto;
}
#index_school h2 {
  color: #04438C;
  font-weight: bold;
  border-bottom: solid 1px #04438C;
  padding-bottom: 10px;
  margin-bottom: 10px;
  font-size: clamp(18px, calc(1.1267605634vw + 14px), 30px);
}
@supports not (font-size: clamp(18px, calc(1.1267605634vw + 14px), 30px)) {
  #index_school h2 {
    font-size: max(18px, min(calc(1.1267605634vw + 14px), 30px));
  }
}
#index_school ul {
  border-top: solid 1px #333;
  margin: 25px 0;
}
#index_school ul li a {
  display: block;
  border-bottom: solid 1px #333;
  padding: 15px 5px;
  font-weight: bold;
  background: url(../images/arrow.svg) no-repeat right 5px center/24px 9px;
}
#index_school .school, #index_school .flex-order {
  margin-bottom: 60px;
}
#index_school a.button {
  margin: 20px auto;
}

#index_banner {
  width: 90%;
  max-width: 1348px;
  margin-inline: auto;
  margin-bottom: 80px;
}
#index_banner .flex {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
#index_banner a.banner {
  aspect-ratio: 651/364;
  background-repeat: no-repeat;
  background-size: 100% auto;
  position: relative;
  display: block;
  cursor: pointer;
  width: 100%;
  background-position: center center;
  border-radius: 10px;
  transition: 0.3s;
  padding: 18px;
}
#index_banner a.banner.banner01 {
  background-image: url(../images/index_banner01@2x.webp);
}
#index_banner a.banner.banner01 h2, #index_banner a.banner.banner01 .link {
  color: #04438C;
  font-weight: bold;
}
#index_banner a.banner.banner01 .link {
  background-image: url(../images/index_banner01_arrow.svg);
}
#index_banner a.banner.banner02 {
  background-image: url(../images/index_banner02@2x.webp);
}
#index_banner a.banner.banner02 h2, #index_banner a.banner.banner02 .link {
  color: #019A4A;
}
#index_banner a.banner.banner02 .link {
  background-image: url(../images/index_banner02_arrow.svg);
}
#index_banner a.banner h2 {
  background-color: #FFF;
  display: inline-block;
  padding: 3px 10px;
  font-size: clamp(18px, calc(1.1267605634vw + 14px), 30px);
}
@supports not (font-size: clamp(18px, calc(1.1267605634vw + 14px), 30px)) {
  #index_banner a.banner h2 {
    font-size: max(18px, min(calc(1.1267605634vw + 14px), 30px));
  }
}
#index_banner a.banner p {
  color: #FFF;
  position: absolute;
  bottom: 50%;
  left: 18px;
  text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.5);
  line-height: 1.3;
  font-weight: bold;
  transform: translateY(50%);
  font-size: clamp(16px, calc(0.7511737089vw + 13px), 24px);
}
@supports not (font-size: clamp(16px, calc(0.7511737089vw + 13px), 24px)) {
  #index_banner a.banner p {
    font-size: max(16px, min(calc(0.7511737089vw + 13px), 24px));
  }
}
#index_banner a.banner .link {
  position: absolute;
  bottom: 18px;
  right: 18px;
  background-color: #FFF;
  transition: 0.3s;
  background-repeat: no-repeat;
  background-position: right 5px center;
  background-size: 15px auto;
  padding: 5px 26px 5px 14px;
  font-size: clamp(12px, calc(0.5633802817vw + 10px), 18px);
}
@supports not (font-size: clamp(12px, calc(0.5633802817vw + 10px), 18px)) {
  #index_banner a.banner .link {
    font-size: max(12px, min(calc(0.5633802817vw + 10px), 18px));
  }
}

#index_membership {
  background: url(../images/bg_gradiation.svg) no-repeat center center/cover;
  position: relative;
  padding-top: 70px;
  padding-bottom: 74px;
}
#index_membership .gradiation {
  background: url(../images/bg@2x.webp) no-repeat center center/cover;
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
}
#index_membership h2 {
  text-align: center;
  background: url(../images/title_bg_white_sp.svg) no-repeat center center/contain;
  padding: 4px;
  margin-bottom: 24px;
  width: 90%;
  margin-inline: auto;
  font-size: clamp(18px, calc(1.8779342723vw + 11px), 38px);
}
@supports not (font-size: clamp(18px, calc(1.8779342723vw + 11px), 38px)) {
  #index_membership h2 {
    font-size: max(18px, min(calc(1.8779342723vw + 11px), 38px));
  }
}
#index_membership p {
  color: #FFF;
  width: 80%;
  margin-inline: auto;
  mix-blend-mode: hard-light;
  line-height: 1.6;
  font-size: clamp(16px, calc(0.7511737089vw + 13px), 24px);
}
@supports not (font-size: clamp(16px, calc(0.7511737089vw + 13px), 24px)) {
  #index_membership p {
    font-size: max(16px, min(calc(0.7511737089vw + 13px), 24px));
  }
}
#index_membership a.link {
  background: url(../images/index_member_arrow.svg) no-repeat right 20px center/15px auto, #FFF;
  padding: 5px 26px 5px 14px;
  margin: 22px auto 0;
  display: block;
  mix-blend-mode: hard-light;
  font-size: clamp(16px, calc(0.7511737089vw + 13px), 24px);
  width: clamp(155px, calc(7.2300469484vw + 128px), 232px);
}
@supports not (font-size: clamp(16px, calc(0.7511737089vw + 13px), 24px)) {
  #index_membership a.link {
    font-size: max(16px, min(calc(0.7511737089vw + 13px), 24px));
  }
}
@supports not (width: clamp(155px, calc(7.2300469484vw + 128px), 232px)) {
  #index_membership a.link {
    width: max(155px, min(calc(7.2300469484vw + 128px), 232px));
  }
}
#index_membership::after {
  content: "";
  display: block;
  background: url(../images/index_memeber_illust.svg) no-repeat center center/contain;
  position: absolute;
  bottom: 6%;
  right: 3%;
  width: clamp(84px, calc(11.8309859155vw + 40px), 210px);
  aspect-ratio: 209/211;
}
@supports not (width: clamp(84px, calc(11.8309859155vw + 40px), 210px)) {
  #index_membership::after {
    width: max(84px, min(calc(11.8309859155vw + 40px), 210px));
  }
}

@media screen and (min-width: 768px) {
  #main_img img.message {
    max-width: 37%;
  }
  #index_news {
    gap: 0;
    justify-content: space-between;
    width: 90%;
    margin-inline: auto;
  }
  #index_news .news_wrapper {
    width: calc(100% - 360px);
    margin: 0;
  }
  #index_news .fb_wrapper {
    width: 320px;
    margin: 0;
  }
  #index_school .flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  #index_school .flex .text {
    width: 50%;
  }
  #index_school .flex .image {
    width: 46%;
  }
  #index_school .flex-order {
    display: flex;
    justify-content: space-between;
  }
  #index_school .flex-order .text {
    width: 46%;
    order: 2;
  }
  #index_school .flex-order .image {
    width: 50%;
    order: 1;
  }
  #index_banner .flex {
    justify-content: space-between;
    gap: 0;
  }
  #index_banner a.banner {
    width: 48.25%;
  }
  #index_membership h2 {
    background-image: url(../images/title_bg_white.svg);
  }
  #index_membership p {
    text-align: center;
  }
}
@media screen and (min-width: 1025px) {
  #main_img {
    background-size: cover;
  }
  #main_img p {
    text-align: center;
  }
  #index_news .news_wrapper {
    width: calc(100% - 460px);
  }
  #index_news .news_wrapper .news_waku .panel .news a:hover figure img {
    transform: scale(1.05);
  }
  #index_news .fb_wrapper {
    width: 400px;
  }
  #index_school h2 {
    padding-bottom: 15px;
    margin-bottom: 25px;
  }
  #index_school ul {
    margin-top: clamp(20px, calc(7.2289156627vw + -54px), 50px);
  }
  @supports not (margin-top: clamp(20px, calc(7.2289156627vw + -54px), 50px)) {
    #index_school ul {
      margin-top: max(20px, min(calc(7.2289156627vw + -54px), 50px));
    }
  }
  #index_school ul li a {
    padding-top: clamp(15px, calc(4.578313253vw + -32px), 34px);
    padding-bottom: clamp(15px, calc(4.578313253vw + -32px), 34px);
  }
  @supports not (padding-top: clamp(15px, calc(4.578313253vw + -32px), 34px)) {
    #index_school ul li a {
      padding-top: max(15px, min(calc(4.578313253vw + -32px), 34px));
    }
  }
  @supports not (padding-bottom: clamp(15px, calc(4.578313253vw + -32px), 34px)) {
    #index_school ul li a {
      padding-bottom: max(15px, min(calc(4.578313253vw + -32px), 34px));
    }
  }
  #index_school ul li a:hover {
    background-color: #f3f3f3;
    transition: 0.3s;
    background-position: right 2px center;
  }
  #index_school a.button {
    margin-top: 50px;
  }
  #index_school .flex {
    align-items: flex-start;
  }
  #index_school .flex .text {
    width: 45%;
  }
  #index_school .flex .image {
    width: 42.2%;
  }
  #index_school .flex-order .text {
    width: 57%;
  }
  #index_school .flex-order .image {
    width: 38.4%;
  }
  #index_banner {
    margin-bottom: 130px;
  }
  #index_banner a.banner {
    padding: clamp(18px, calc(4.8192771084vw + -31px), 38px);
  }
  @supports not (padding: clamp(18px, calc(4.8192771084vw + -31px), 38px)) {
    #index_banner a.banner {
      padding: max(18px, min(calc(4.8192771084vw + -31px), 38px));
    }
  }
  #index_banner a.banner p {
    bottom: 18px;
    left: 28px;
    transform: translateY(0);
  }
  #index_banner a.banner .link {
    background-position: right 22px center;
    background-size: 19px auto;
    padding: 9px 42px 9px 23px;
  }
  #index_banner a.banner:hover {
    background-size: 104% auto;
  }
  #index_banner a.banner:hover .link {
    background-position: right 20px center;
    color: #FFF;
  }
  #index_banner a.banner.banner01:hover .link {
    background-color: #04438C;
  }
  #index_banner a.banner.banner02:hover .link {
    background-color: #019A4A;
  }
  #index_membership a.link {
    background-position: right 25px center;
    background-size: 26px auto;
    padding: 3px 42px 3px 23px;
  }
  #index_membership a.link:hover {
    background-position: right 22px center;
    background-color: #4d4d4d;
    color: #FFF;
  }
}
@media screen and (min-width: 1100px) {
  #index_news .news_wrapper .news_waku .panel .news {
    width: calc((100% - 20px) / 3);
  }
  #index_news .news_wrapper .news_waku .panel .news a {
    display: block;
  }
  #index_news .news_wrapper .news_waku .panel .news a figure, #index_news .news_wrapper .news_waku .panel .news a .info {
    width: 100%;
  }
  #index_news .news_wrapper .news_waku .panel .news a .info .post_date {
    margin-top: 5px;
  }
}
@media screen and (min-width: 1280px) {
  #index_news {
    margin-bottom: 100px;
  }
  #index_news .news_wrapper {
    width: calc(100% - 500px);
  }
  #index_news .news_wrapper .news_waku .panel {
    gap: 40px;
  }
  #index_news .news_wrapper .news_waku .panel .news {
    width: calc((100% - 80px) / 3);
  }
  #index_news .news_wrapper .news_waku .panel .news a .info .post_date {
    margin-top: 10px;
  }
  #index_school .school {
    margin-bottom: 100px;
  }
  #index_school .flex .image {
    margin-top: 33px;
  }
  #index_school .flex-order {
    margin-bottom: 100px;
  }
  #index_membership::after {
    bottom: 10%;
    right: 10%;
  }
}
@media screen and (min-width: 1800px) {
  #index_membership::after {
    bottom: 15%;
    right: 21%;
  }
}/*# sourceMappingURL=index.css.map */