
header img{
    width: 100%;
}

#members{
    background-color: #fff;
}



    #members h1 {
        border-bottom: 3px solid #4D4840;
        color: #4D4840;
    }
    #members p.desc{
        margin: 80px auto;
       font-size: 20px;
       display: block;
       text-align: center;
       max-width: 1000px;
       width: 90%;
       
    }

    @media screen and (max-width: 700px) {
        #members p.desc{
            margin: 40px auto;
           font-size: 18px;
        }
    }


    .member_wrap{
        max-width: 1000px;
        width: 90%;
    }

    .member-block02 {
        flex-direction: column;
    }
    @media screen and (max-width: 700px) {
        .member-block02 {
         padding-top: 0;
        }
    }


    .member-block02 .flex{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        row-gap: 60px;
        width: 90%;
        margin-inline: auto;
    }
    @media screen and (max-width: 700px) {
        .member-block02 .flex{
            row-gap: 40px;
        }
    }

    .member-block02 .year-group{
        margin-bottom: 80px;
    }


    .member-block02 .year-group h2{
        font-size: 34px;
        border-top: 2px solid #333;
        text-align: center;
        position: relative;
        margin-bottom: 60px;
        padding-bottom: 10px;
    }


    .click_btn {
        position: absolute;
    right: 0;
    top: calc(50% - 5.5px);
    width: 25px;
    height: 25px;
        display: block;
        transition: 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
        cursor: pointer;
        will-change: transform;
      }
      @media screen and (max-width: 700px) {
        .click_btn {
          top: calc(50% - 15.5px);
        }
    }



      .click_btn:before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 75%;
        height: 3px;
        border-radius: 10px;
        background: #000;
        display: block;
      }
      .click_btn:after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 3px;
        height: 75%;
        border-radius: 10px;
        background: #000;
        display: block;
        transition: 0.3s cubic-bezier(0.76, 0, 0.24, 1);
        will-change: transform;
      }



      .click_btn.active:after {
        transform: translate(-50%, -50%) rotate(90deg);
      }

      .stay .click_btn:after {
        transform: translate(-50%, -50%) rotate(90deg);
      }

      .stay .click_btn.active:after {
        transform: translate(-50%, -50%) rotate(0deg);
      }

      





    @media screen and (max-width: 700px) {
        .member-block02 .year-group h2{
padding: 0 0 10px;
        }
    
    }
    
    .member-block02 .year-group h2:before,
    .member-block02 .year-group h2:after {
    position: absolute;
    left: 50%;
    content: "";
    height: 0;
    width: 0;
}


.member-block02 .year-group h2:before {
    bottom: 100%;
    border: 9px solid;
    border-color: transparent;
    border-bottom-color: #333;
    margin-left: -9px;
}

.member-block02 .year-group h2:after {
    bottom: 99%;
    border: 7px solid;
    border-color: transparent;
    border-bottom-color: white;
    margin-left: -7px;
}


    .member-block02 .year-group h2.open{
        font-size: 34px;
        border-top: 0px;
        border-bottom: 2px solid #333;
        text-align: center;
        position: relative;
        margin-bottom: 60px;
        padding-bottom: 10px;
    }
    .member-block02 .year-group h2.open:before,
    .member-block02 .year-group h2.open:after{
    position: absolute;
    left: 50%;
    content: "";
    height: 0;
    width: 0;
}

.member-block02 .year-group h2.open:before{
    top: 100%;
    border: 9px solid;
    border-color: transparent;
    border-top-color: #333;
    margin-left: -9px;
}

.member-block02 .year-group h2.open:after{
    top: 99%;
    border: 7px solid;
    border-color: transparent;
    border-top-color: white;
    margin-left: -7px;
}
    


#members .profile{
 width: 45%;
}
@media screen and (max-width: 700px) {
    #members .profile{
        width: 100%;
       }
}


    #members .profile p {
        text-align: center;
        font-size: 18px;
        color: #4D4840;
    }


    /*====================================================================
 .accordion_one
====================================================================*/
 .accordion_one {
    max-width: 1024px;
    margin: 0 auto;
  }
   .accordion_one .accordion_header {
    font-size: 26px;
    font-weight: bold;
    padding: 20px 11%;
    text-align: center;
    position: relative;
    z-index: +1;
    cursor: pointer;
    transition-duration: 0.2s;
  }
  
   .accordion_one .accordion_header:hover {
    opacity: .8;
  }
   .accordion_one .accordion_header .i_box {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    right: 5%;
    width: 40px;
    height: 40px;
    border: 1px solid #fff;
    margin-top: -20px;
    box-sizing: border-box;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transform-origin: center center;
    transition-duration: 0.2s;
  }
   .accordion_one .accordion_header .i_box .one_i {
    display: block;
    width: 18px;
    height: 18px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transform-origin: center center;
    transition-duration: 0.2s;
    position: relative;
  }
   .accordion_one .accordion_header.open .i_box {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
   .accordion_one .accordion_header .i_box .one_i:before,  .accordion_one .accordion_header .i_box .one_i:after {
    display: flex;
    content: '';
    background-color: #fff;
    border-radius: 10px;
    width: 18px;
    height: 4px;
    position: absolute;
    top: 7px;
    left: 0;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    transform-origin: center center;
  }
   .accordion_one .accordion_header .i_box .one_i:before {
    width: 4px;
    height: 18px;
    top: 0;
    left: 7px;
  }
   .accordion_one .accordion_header.open .i_box .one_i:before {
    content: none;
  }
   .accordion_one .accordion_header.open .i_box .one_i:after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
   .accordion_one .accordion_inner {
    display: none;
  }
  .stay .accordion_inner{
      display: block;
  }
  
   .accordion_one .accordion_inner p.txt_a_ac {
    margin: 0;
  }
  @media screen and (max-width: 1024px) {
     .accordion_one .accordion_header {
      font-size: 18px;
    }
  }
  @media screen and (max-width: 767px) {
     .accordion_one .accordion_header {
      font-size: 16px;
      text-align: left;
      padding: 15px 60px 15px 15px;
    }
  }