@charset "utf-8";

.page-id-36, .page-id-1752 {
  
  /*　画像入りヘッダーの設定
  ================================================================================*/
  .main-header {
    background-repeat: no-repeat;
    background-size: cover;
    height: 60vh;
    display: flex;
    align-items: center;
  }
  .main-header h2 {
    width: 100%;
    font-size: 4.5vw;
    color: #ffffff;
    font-weight: bold;
    text-shadow: 1px 1px 10px #000000;
    text-align: center;
    font-style: italic;
  }



  /*　全体設定
  ================================================================================*/
  .members-list {
    padding-left: 40px;
    padding-right: 40px;
  }
  .members-area {
    margin-top: 100px;
  } 
  .members-area h2 {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
    position: relative;
    display: none;
  }
  .members-area .graybox {
    display: none;
  }
  .members-area:has(li) h2 {
    display: block;
  }
  .members-area:has(li) .graybox {
    display: block;
  }
  .graybox {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
  }
  .graybox-inner {
    display: grid;
    grid-template-columns: repeat(auto-fit, 300px);
    row-gap: 50px;
    justify-content: center;
    padding: 40px;
  }
  .members-inner {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .name {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    margin-top: 5px;
    opacity: 1;
    line-height: 1.1;
  }
  .name:hover {
    opacity: 1;
    text-decoration: underline;
    transition-duration: 0.3s;
    color: #93c80e;
  }
  .position {
    font-size: 16px;
    text-align: center;
    line-height: 1.3;
    margin-top: 5px;
  }
  .profile-links {
    display: block;
    position: absolute;
    z-index:3;
    top:35%;
    left:20%;
    width: 60%;
    height: 40px;
    transition:0.3s;
    background-color: transparent;
    border: solid 2px rgb(255, 255, 255, 0.6);
    border-radius: 7px;
    color: rgb(255, 255, 255, 0.9);
    opacity: 0;
    text-align: center;
    padding-top: 11px;
    font-family: 'Montserrat' sans-serif;
    font-weight: bold;
    font-size: 12px;
    padding-bottom: 10px;
  }
  .profile-links a {
    display: inline-block;
    width: 100%;
    height: 100%;
    font-family: 'Montserrat' sans-serif;
    font-weight: bold;
  }
  .members-inner:hover .profile-links {
    transition-duration: 0.3s;
    opacity: 1;
  }
  .members-inner:hover .name {
    color: #93c80e;
    opacity: 1;
    text-decoration: underline;
    transition-duration: 0.3s;
  }
  .members-inner:hover img {
    filter:blur(5px);
    transition-duration: 0.3s;
  }
  .profile-links:hover {
    background-color: rgb(147, 200, 14, 0.85);
    transition-duration: 0.3s;
    border: solid 2px rgb(255, 255, 255, 0.6);
    cursor: pointer;
  }

  /*　スタッフの設定
  ================================================================================*/
  .staff {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .staff img {
    width: 200px;
    height: auto;
  }


  /*　同窓生の設定
  ================================================================================*/
  .alumni-buttons {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 150px;
    gap: 0;
  }
  .alumni-show {
    border: 2px solid #2C2E2C;
  }
  .alumni-hidden {
    border: 2px solid #2C2E2C;
  }
  .alumni-show.not-selected a {
    background-color: #ffffff !important;
    color: #2C2E2C;
  }
  .alumni-hidden.not-selected a {
    background-color: #ffffff !important;
    color: #2C2E2C;
  }
  .alumni-show.not-selected.mouseover a {
    background-color: #2C2E2C !important;
    color: #ffffff;
  }
  .alumni-hidden.not-selected.mouseover a {
    background-color: #2C2E2C !important;
    color: #ffffff;
  }
  .alumni-show.mouseover a {
    background-color: #ffffff !important;
    color: #2C2E2C;
  }
  .alumni-hidden.mouseover a {
    background-color: #ffffff !important;
    color: #2C2E2C;
  }
  .alumni.noshow {
    display: none;
  }
  .alumni .graybox-inner li {
    text-align: center;
  }
  .alumni .graybox-inner {
    display: grid;
    grid-template-columns: repeat(auto-fit, 230px);
  }




  /*　================================================================================
  タブレット設定（iPad Mini（768✖︎1024）〜 iPad Pro（1024✖︎1336））
  ================================================================================　*/
  @media (max-width: 1050px) {

    /*　ナビゲーション設定
    ================================================================================*/
    .site-menu ul li:nth-child(3) {
      color:#93c80e;
      font-weight: bold;
    }
    .site-menu ul li:nth-child(3)::after {
      content: '';
      display: block;
      width: 100%;
      height: 3px;
      background-color:#93c80e;
      margin-top: 5px;
      margin-left: 0%;
      visibility: visible;
    }



    /*　画像入りヘッダーの設定
    ================================================================================*/
    .main-header {
      /* background-repeat: no-repeat;
      background-size: cover; */
      height: 40vh;
      /* display: flex;
      align-items: center; */
    }
    .main-header h2 {
      /* width: 100%; */
      font-size: 6.5vw;
      /* color: #ffffff;
      font-weight: bold;
      text-shadow: 1px 1px 10px #000000;
      text-align: center;
      font-style: italic; */
    }



    /*　全体設定
    ================================================================================*/
    /* .members-list {
      padding-left: 40px;
      padding-right: 40px;
    } */
    /* .members-area {
      margin-top: 100px;
    }  */
    .members-area h2 {
      font-size: 44px !important;
      /* max-width: 1000px;
      margin-left: auto;
      margin-right: auto;
      margin-bottom: 15px;
      position: relative; */
      /* display: none; */
    }
    /* .members-area .graybox {
      display: none;
    } */
    /* .members-area:has(li) h2 {
      display: block;
    } */
    /* .members-area:has(li) .graybox {
      display: block;
    } */
    .graybox {
      /* max-width: 1000px;
      margin-left: auto;
      margin-right: auto; */
      padding-bottom: 40px;
    }
    .graybox-inner {
      /* display: grid; */
      grid-template-columns: repeat(auto-fit, 280px);
      row-gap: 70px;
      /* justify-content: center;
      padding: 40px; */
    }
    /* .members-inner {
      position: relative;
      display: flex;
      flex-direction: column;
    } */
    .name {
      /* display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; */
      font-size: 24px;
      /* margin-top: 5px;
      opacity: 0.6;
      line-height: 1.1; */
    }
    /* .name:hover {
      opacity: 1;
      text-decoration: underline;
      transition-duration: 0.3s;
      color: #93c80e;
    } */
    /* .position {
      font-size: 16px;
      margin-top: 5px;
    } */
    .profile-links {
      /* display: block;
      position: absolute;
      z-index:3; */
      top: 102%;
      left: -10%;
      width: 120%;
      height: 40px;
      /* transition:0.3s; */
      background-color: rgb(255, 255, 255, 1);
      border: none;
      border-radius: 0px;
      color: #2C2E2C;
      opacity: 1;
      text-align: left;
      padding-top: 7px;
      padding-left: 20px;
      padding-bottom: 10px;
      /* font-family: 'Montserrat' sans-serif; */
      /* font-weight: bold; */
      font-size: 20px;
    }
    .profile-links::before {
      display: block;
      content: "";
      width: 15px;
      height: 3px;
      background: #2C2E2C;
      transform: rotate(40deg);
      position: absolute;
      top: 13px;
      right: 5px;
    }
    .profile-links::after {
      display: block;
      content: "";
      width: 15px;
      height: 3px;
      background: #2C2E2C;
      transform: rotate(-40deg);
      position: absolute;
      bottom: 15px;
      right: 5px;
    }
    /* .profile-links a {
      display: inline-block;
      width: 100%;
      height: 100%;
      font-family: 'Montserrat' sans-serif;
      font-weight: bold;
    } */
    /* .members-inner:hover .profile-links {
      transition-duration: 0.3s;
      opacity: 1;
    } */
    /* .members-inner:hover .name {
      color: #93c80e;
      opacity: 1;
      text-decoration: underline;
      transition-duration: 0.3s;
    } */
    /* .members-inner:hover img {
      filter:blur(5px);
      transition-duration: 0.3s;
    } */
    .members-inner:hover .profile-links {
      background-color: rgb(147, 200, 14, 0.85);
      transition-duration: 0.3s;
      border: solid 2px rgb(255, 255, 255, 0.6);
      cursor: pointer;
      transition-duration: 0.3s;
    }
    .members-inner:hover .profile-links::before {
      /* display: block;
      content: "";
      width: 15px;
      height: 3px;
      background: #2C2E2C;
      transform: rotate(40deg);
      position: absolute; */
      top: 12px;
      /* right: 5px; */
      transition-duration: 0.3s;
    }
    .members-inner:hover .profile-links::after {
      /* display: block;
      content: "";
      width: 15px;
      height: 3px;
      background: #2C2E2C;
      transform: rotate(-40deg);
      position: absolute; */
      bottom: 12px;
      /* right: 5px; */
      transition-duration: 0.3s;
    }
    /* .profile-links:hover {
      background-color: rgb(147, 200, 14, 0.85);
      transition-duration: 0.3s;
      border: solid 2px rgb(255, 255, 255, 0.6);
      cursor: pointer;
    } */
    .profile-links:hover::before {
      /* display: block;
      content: "";
      width: 15px;
      height: 3px;
      background: #2C2E2C;
      transform: rotate(40deg);
      position: absolute; */
      top: 12px;
      /* right: 5px; */
      transition-duration: 0.3s;
    }
    .profile-links:hover::after {
      /* display: block;
      content: "";
      width: 15px;
      height: 3px;
      background: #2C2E2C;
      transform: rotate(-40deg);
      position: absolute; */
      bottom: 12px;
      /* right: 5px; */
      transition-duration: 0.3s;
    }


    /*　スタッフの設定
    ================================================================================*/
    /* .staff {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
    } */
    /* .staff img {
      width: 200px;
      height: auto;
    } */


    /*　同窓生の設定
    ================================================================================*/
    /* .alumni-buttons {
      max-width: 1000px;
      margin-left: auto;
      margin-right: auto;
      margin-top: 150px;
      gap: 0;
    } */
    .alumni-show {
      border: 2px solid #2C2E2C;
      width: calc(50% - var(--wp--style--block-gap, .5em)*.75) !important;
    }
    .alumni-hidden {
      border: 2px solid #2C2E2C;
      width: calc(50% - var(--wp--style--block-gap, .5em)*.75) !important;
    }
    /* .alumni-show.not-selected a {
      background-color: #ffffff !important;
      color: #2C2E2C;
    } */
    /* .alumni-hidden.not-selected a {
      background-color: #ffffff !important;
      color: #2C2E2C;
    } */
    /* .alumni-show.not-selected.mouseover a {
      background-color: #2C2E2C !important;
      color: #ffffff;
    } */
    /* .alumni-hidden.not-selected.mouseover a {
      background-color: #2C2E2C !important;
      color: #ffffff;
    } */
    /* .alumni-show.mouseover a {
      background-color: #ffffff !important;
      color: #2C2E2C;
    } */
    /* .alumni-hidden.mouseover a {
      background-color: #ffffff !important;
      color: #2C2E2C;
    } */
    /* .alumni.noshow {
      display: none;
    } */
    /* .alumni .graybox-inner li {
      text-align: center;
    } */
    /* .alumni .graybox-inner {
      display: grid;
      grid-template-columns: repeat(auto-fit, 230px);
    } */
  }



  /*　================================================================================
  スマホ設定
  ================================================================================　*/
  @media (max-width: 750px) {

    /*　ナビゲーション設定
    ================================================================================*/
    .site-menu ul li:nth-child(3) {
      color:#93c80e;
      font-weight: bold;
    }
    .site-menu ul li:nth-child(3)::after {
      content: '';
      display: block;
      width: 100%;
      height: 3px;
      background-color:#93c80e;
      margin-top: 5px;
      margin-left: 0%;
      visibility: visible;
    }


    /*　画像入りヘッダーの設定
    ================================================================================*/
    .main-header {
      /* background-repeat: no-repeat;
      background-size: cover; */
      height: 30vh;
      /* display: flex;
      align-items: center; */
    }
    .main-header h2 {
      /* width: 100%; */
      font-size: 8vw;
      /* color: #ffffff;
      font-weight: bold;
      text-shadow: 1px 1px 10px #000000;
      text-align: center;
      font-style: italic; */
    }


    /*　全体設定
    ================================================================================*/
    .members-list {
      padding-left: 20px;
      padding-right: 20px;
    }
    .members-area {
      margin-top: 50px;
    } 
    .members-area h2 {
      font-size: 20px !important;
      /* max-width: 1000px;
      margin-left: auto;
      margin-right: auto; */
      margin-bottom: 20px;
      /* position: relative; */
      display: none;
      width: calc(100% + 10px);
    }
    /* .members-area .graybox {
      display: none;
    } */
    /* .members-area:has(li) h2 {
      display: block;
    } */
    /* .members-area:has(li) .graybox {
      display: block;
    } */
    .graybox {
      /* max-width: 1000px;
      margin-left: auto;
      margin-right: auto; */
      padding-bottom: 40px;
    }
    .graybox-inner {
      /* display: grid; */
      grid-template-columns: repeat(auto-fit, 280px);
      row-gap: 70px;
      column-gap: 50px;
      /* justify-content: center; */
      padding-top: 0px;
    }
    .graybox-inner li {
      margin-top: 32px;
    }
    /* .members-inner {
      position: relative;
      display: flex;
      flex-direction: column;
    } */
    .name {
      /* display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; */
      font-size: 16px;
      /* margin-top: 5px;
      opacity: 0.6;
      line-height: 1.1; */
    }
    /* .name:hover {
      opacity: 1;
      text-decoration: underline;
      transition-duration: 0.3s;
      color: #93c80e;
    } */
    /* .position {
      font-size: 16px;
      margin-top: 5px;
    } */
    .profile-links {
      /* display: block;
      position: absolute;
      z-index:3; */
      top: 102%;
      left: -10%;
      width: 120%;
      height: 30px;
      /* transition:0.3s; */
      background-color: rgb(255, 255, 255, 1);
      border: none;
      border-radius: 0px;
      color: #2C2E2C;
      opacity: 1;
      text-align: left;
      padding-top: 7px;
      padding-left: 20px;
      padding-bottom: 10px;
      /* font-family: 'Montserrat' sans-serif; */
      /* font-weight: bold; */
      font-size: 16px;
    }
    .profile-links::before {
      /* display: block;
      content: ""; */
      width: 13px;
      height: 3px;
      /* background: #2C2E2C;
      transform: rotate(40deg);
      position: absolute; */
      top: 11px;
      /* right: 5px; */
    }
    .profile-links::after {
      /* display: block;
      content: ""; */
      width: 13px;
      height: 3px;
      /* background: #2C2E2C;
      transform: rotate(-40deg);
      position: absolute; */
      bottom: 9px;
      /* right: 5px; */
    }
    /* .profile-links a {
      display: inline-block;
      width: 100%;
      height: 100%;
      font-family: 'Montserrat' sans-serif;
      font-weight: bold;
    } */
    /* .members-inner:hover .profile-links {
      transition-duration: 0.3s;
      opacity: 1;
    } */
    /* .members-inner:hover .name {
      color: #93c80e;
      opacity: 1;
      text-decoration: underline;
      transition-duration: 0.3s;
    } */
    /* .members-inner:hover img {
      filter:blur(5px);
      transition-duration: 0.3s;
    } */
    .members-inner:hover .profile-links {
      background-color: rgb(147, 200, 14, 0.85);
      transition-duration: 0.3s;
      border: none;
      cursor: pointer;
      transition-duration: 0.3s;
      color: #ffffff;
    }
    .members-inner:hover .name {
      opacity: 0.6;
      color: inherit;
      text-decoration: none;
      transition-duration: 0.3s;
    }
    .members-inner:hover img {
      filter:none;
    }
    .members-inner:hover .profile-links::before {
      /* display: block;
      content: "";
      width: 15px;
      height: 3px;
      transform: rotate(40deg);
      position: absolute; */
      top: 11px;
      /* right: 5px; */
      transition-duration: 0.3s;
      color: #ffffff;
      background: #ffffff;
    }
    .members-inner:hover .profile-links::after {
      /* display: block;
      content: "";
      width: 15px;
      height: 3px;
      transform: rotate(-40deg);
      position: absolute; */
      bottom: 9px;
      /* right: 5px; */
      transition-duration: 0.3s;
      color: #ffffff;
      background: #ffffff;
    }
    .profile-links:hover {
      background-color: rgb(147, 200, 14, 0.85);
      transition-duration: 0.3s;
      border: solid 2px rgb(255, 255, 255, 0.6);
      cursor: pointer;
      color: #ffffff;
    }
    .profile-links:hover::before {
      /* display: block;
      content: "";
      width: 15px;
      height: 3px;
      background: #2C2E2C;
      transform: rotate(40deg);
      position: absolute; */
      top: 12px;
      /* right: 5px; */
      background: #ffffff;
      color: #ffffff;
      transition-duration: 0.3s;
    }
    .profile-links:hover::after {
      /* display: block;
      content: "";
      width: 15px;
      height: 3px;
      background: #2C2E2C;
      transform: rotate(-40deg);
      position: absolute; */
      bottom: 12px;
      /* right: 5px; */
      background: #ffffff;
      color: #ffffff;
      transition-duration: 0.3s;
    }
    .profile-links.appeal:hover {
      background-color: rgb(147, 200, 14, 0.85);
      border: none;
    }
    .appeal {
      background-color: rgb(147, 200, 14, 0.85);
      color: #ffffff;
    }
    .appeal.profile-links::before {
      background: #ffffff;
    }
    .appeal.profile-links::after {
      background: #ffffff;
    }

   
    /*　スタッフの設定
    ================================================================================*/
    /* .staff {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
    } */
    /* .staff img {
      width: 200px;
      height: auto;
    } */


    /*　同窓生の設定
    ================================================================================*/
    .alumni-buttons {
      /* max-width: 1000px;
      margin-left: auto;
      margin-right: auto; */
      margin-top: 70px;
      margin-bottom: 0px;
      /* gap: 0; */
      justify-content: center !important;
    }
    .alumni-buttons a {
      font-size: 14px !important;
    }
    .alumni-show {
      /* border: 2px solid #2C2E2C; */
      width: calc(50% - var(--wp--style--block-gap, .5em)*.75) !important;
    }
    .alumni-hidden {
      /* border: 2px solid #2C2E2C; */
      width: calc(50% - var(--wp--style--block-gap, .5em)*.75) !important;
    }
    /* .alumni-show.not-selected a {
      background-color: #ffffff !important;
      color: #2C2E2C;
    } */
    /* .alumni-hidden.not-selected a {
      background-color: #ffffff !important;
      color: #2C2E2C;
    } */
    /* .alumni-show.not-selected.mouseover a {
      background-color: #2C2E2C !important;
      color: #ffffff;
    } */
    /* .alumni-hidden.not-selected.mouseover a {
      background-color: #2C2E2C !important;
      color: #ffffff;
    } */
    /* .alumni-show.mouseover a {
      background-color: #ffffff !important;
      color: #2C2E2C;
    } */
    /* .alumni-hidden.mouseover a {
      background-color: #ffffff !important;
      color: #2C2E2C;
    } */
    /* .alumni.noshow {
      display: none;
    } */
    /* .alumni .graybox-inner li {
      text-align: center;
    } */
    .alumni .graybox-inner {
      /* display: grid;
      grid-template-columns: repeat(auto-fit, 230px); */
      row-gap: 0px;
    }
  }
}

.page-id-1752 {
  .position {
    font-size: 14px;
    /* text-align: center;
    line-height: 1.3;
    margin-top: 5px; */
  }
  .name {
    /* display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; */
    font-size: 18px;
    /* margin-top: 5px;
    opacity: 1;
    line-height: 1.1; */
  }
  .members-inner:hover .name {
    color: initial;
    opacity: 1;
    text-decoration: initial;
    /* transition-duration: 0.3s; */
  }
  .members-inner:hover img {
    filter:initial;
    /* transition-duration: 0.3s; */
  }
  .profile-links:hover {
    background-color: rgb(147, 200, 14, 0.85);
    transition-duration: 0.3s;
    border: solid 2px rgb(255, 255, 255, 0.6);
    cursor: pointer;
  }
  .name:hover {
    opacity: 1;
    text-decoration: initial;
    transition-duration: 0.3s;
    color: initial;
  }
  @media (max-width: 1050px) {
    .site-menu ul li:nth-child(2) {
      color:#93c80e;
      font-weight: bold;
    }
    .site-menu ul li:nth-child(3) {
      color: initial;
      font-weight: initial;
    }
    .site-menu ul li:nth-child(2)::after {
      content: '';
      display: block;
      width: 100%;
      height: 3px;
      background-color:#93c80e;
      margin-top: 5px;
      margin-left: 0%;
      visibility: visible;
    }
    .site-menu ul li:nth-child(3)::after {
      /* content: '';
      display: block;
      width: 100%;
      height: 3px;
      background-color:#93c80e;
      margin-top: 5px;
      margin-left: 0%; */
      visibility:hidden;
    }
  }
}