/*
  Members
*/
.content-title {
  font-size: 5.5rem;
  font-weight: 400;
  font-family: 'Poppins', sans-serif;
  margin-bottom: 25px; }

.wrapper + .member-box {
  margin-top: 0; }

.member-box {
  position: relative;
  margin-top: 5%; }
  .member-box .text,
  .member-box .image {
    position: relative; }
  .member-box .text p {
    width: 100%;
    line-height: 1.5; }
  .member-box .en {
    color: #b61e28;
    font-size: 1.4rem;
    font-weight: 700;
    margin-bottom: 50px; }
  .member-box .small {
    font-size: 1.3rem; }
  .member-box .name {
    font-size: 2.4rem;
    margin: 5px 0 65px; }
  .member-box .js- modal-open {
    font-family: 'Poppins', sans-serif;
    font-size: 1.3rem;
    font-weight: 700;
    cursor: pointer;
    transition: all .2s;
    -webkit-transition: all .2s; }
    .member-box .js-modal-open:hover {
      color: #b61e28; }

#founders .member-box::before {
  content: '';
  width: 83.33vw;
  height: calc(100% - 30px);
  position: absolute;
  right: 0;
  bottom: 0;
  background: #f0f0f0; }
#founders .member-box > .row {
  margin: 0 auto;
  max-width: 1200px;
  width: 100%;
  padding: 0 5.33vw; }
#founders .member-box .text {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  width: 41%; }
#founders .member-box .image {
  width: 59%;
  padding-right: 8.33%; }
#founders .member-box:nth-child(even) .image img {
  display: block;
  margin: 0 auto; }
#founders .member-box:nth-child(odd)::before {
  right: 16.77vw; }

.two-column {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  margin: 0 auto;
  width: 100%;
  max-width: 1200px;
  padding: 0 5.33vw; }
  .two-column .member-box {
    width: calc(50% - 40px);
    position: relative; }
    .two-column .member-box::before {
      content: '';
      width: 50vw;
      height: 170px;
      position: absolute;
      bottom: 0;
      left: -40px; }
    .two-column .member-box:nth-child(odd)::before {
      background: #f0f0f0; }
    .two-column .member-box:nth-child(even)::before {
      background: #e2e2e2; }
    .two-column .member-box:nth-child(1)::before, .two-column .member-box:nth-child(4)::before, .two-column .member-box:nth-child(5)::before, .two-column .member-box:nth-child(8)::before, .two-column .member-box:nth-child(9)::before, .two-column .member-box:nth-child(12)::before, .two-column .member-box:nth-child(13)::before, .two-column .member-box:nth-child(16)::before {
      width: calc(100% + 40px);
      left: 0; }
    .two-column .member-box:nth-child(3)::before, .two-column .member-box:nth-child(7)::before, .two-column .member-box:nth-child(11)::before, .two-column .member-box:nth-child(15)::before {
      left: auto;
      right: -40px; }
    .two-column .member-box:nth-child(4n)::before {
      left: -40px; }
    .two-column .member-box .en {
      font-size: 1.3rem;
      margin: 40px 0 5px; }
    .two-column .member-box .name {
      font-size: 2.0rem;
      margin: 5px 0 45px; }
    .two-column .member-box:nth-child(even) .image img {
      right: 0;
      transform: translate(0, 0); }
  .two-column .text {
    width: 240px; }
  .two-column .image {
    width: calc(100% - 240px);
    height: 100%;
    min-height: 400px;
    position: relative; }
    .two-column .image img {
      position: absolute;
      transform: translate(50%, 0);
      right: 50%;
      bottom: 0;
      max-width: none; }

.modal {
  display: none;
  height: 100vh;
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%; }
  .modal .modal__bg {
    background: rgba(0, 0, 0, 0.85);
    height: 100vh;
    position: absolute;
    width: 100%; }
  .modal .modal__content {
    background: #fff;
    border: 5px solid #b61e28;
    left: 50%;
    top: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
    width: 830px;
    max-width: 100%;
    height: 500px;
    max-height: 100%; }
  .modal a.js-modal-close {
    font-family: 'Poppins', sans-serif;
    font-size: 1.0rem;
    line-height: 50px;
    color: #fff;
    width: 50px;
    height: 50px;
    position: absolute;
    right: -5px;
    bottom: -5px;
    background: #b61e28;
    text-align: center; }
    .modal a.js-modal-close:hover {
      color: #fff; }
  .modal .row {
    margin: 0;
    padding: 0; }
    .modal .row .m-profile {
      width: calc(100% - 400px);
      overflow: hidden; }
      .modal .row .m-profile .inner {
        overflow: auto;
        height: 460px;
        padding: 50px 45px 0; }
    .modal .row .en {
      font-size: 1.3rem;
      margin-bottom: 20px; }
    .modal .row .description + .en {
      font-size: 1.1rem;
      color: #9e9e9e;
      margin: 35px 0 5px; }
    .modal .row .name {
      font-size: 2.0rem;
      font-weight: 700;
      margin: 0 0 25px; }
    .modal .row .description,
    .modal .row .p-message {
      font-size: 1.3rem;
      line-height: 1.8 !important; }
    .modal .row .m-image {
      width: 400px;
      height: 100%; }
      .modal .row .m-image img {
        vertical-align: bottom; }
  .modal .sns {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 25px; }
    .modal .sns li {
      margin-right: 12px; }
    .modal .sns li a {
      display: block;
      width: 20px;
      height: 20px;
      background-position: left center;
      background-repeat: no-repeat;
      opacity: .5;
      text-indent: -9999px; }
      .modal .sns li a:hover {
        opacity: 1; }
    .modal .sns li:nth-child(1) a {
      background-image: url("../images/members/instagram.svg"); }
    .modal .sns li:nth-child(2) a {
      background-image: url("../images/members/twitter.svg"); }

#member .row {
  margin-top: 5%; }

#member .column-4{
  position: relative; }
  #member .column-4:hover .overlay {
    opacity: 1; }
  #member .column-4 .image {
    overflow: hidden;
    position: relative; }
    #member .column-4 .image::before {
      content: '';
      padding-bottom: 100%;
      display: block; }
#member img {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }
#member .overlay {
  position: absolute;
  z-index: 50;
  top: 0;
  left: 0;
  background: rgba(137, 37, 47, 0.6);
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: all .2s;
  -webkit-transition: all .2s; }
#member .name {
  font-size: 2.0rem;
  color: #fff;
  text-align: center;
  position: absolute;
  width: 100%;
  left: 0;
  top: 50%;
  transform: translate(0, -50%); }

@media screen and (max-width: 999px) {
  .two-column .image {
    min-height: 320px; }
    .two-column .image img {
      width: auto;
      height: 100%;
      transition: all .2s;
      -webkit-transition: all .2s; }
  .two-column .text .en {
    margin-top: 10px; }

  .modal .modal__content {
    max-width: 720px;
    height: auto;
    max-height: none; }
  .modal .row .m-profile .inner {
    padding: 30px 25px 0; } }
@media screen and (max-width: 768px) {
  .content-title {
    font-size: 2.6rem; }

  .member-box {
    position: relative;
    margin-top: 8vw; }
    .member-box .en {
      font-size: 1.1rem;
      margin-bottom: 20px; }
    .member-box .small {
      font-size: 1.2rem; }
    .member-box .name {
      font-size: 2.0rem;
      margin: 0 0 45px; }
    .member-box .js-modal-open {
      font-size: 1.1rem; }

  #founders .member-box::before {
    width: calc(100% - 5.33vw);
    height: calc(100% - 15px); }
  #founders .member-box .text {
    width: 230px;
    min-height: 350px;
    padding-left: 5.33vw; }
  #founders .member-box .image {
    width: calc(100% - 210px);
    padding-right: 0;
    position: static; }
    #founders .member-box .image img {
      max-width: none;
      width: auto;
      min-height: 215px;
      height: 100%;
      position: absolute;
      bottom: 0;
      right: 3.33vw; }
  #founders .member-box:nth-child(odd)::before {
    right: 5.33vw; }

  .two-column .member-box {
    width: 100%;
    position: relative; }
    .two-column .member-box::before {
      content: '';
      width: calc(100% - 5.33vw);
      height: 85px;
      left: 0; }
    .two-column .member-box:nth-child(1)::before, .two-column .member-box:nth-child(4)::before, .two-column .member-box:nth-child(5)::before, .two-column .member-box:nth-child(8)::before, .two-column .member-box:nth-child(9)::before, .two-column .member-box:nth-child(12)::before, .two-column .member-box:nth-child(13)::before, .two-column .member-box:nth-child(16)::before {
      width: calc(100% - 5.33vw); }
    .two-column .member-box:nth-child(3)::before, .two-column .member-box:nth-child(7)::before, .two-column .member-box:nth-child(11)::before, .two-column .member-box:nth-child(15)::before {
      left: 0;
      right: auto; }
    .two-column .member-box:nth-child(4n)::before {
      left: 0; }
    .two-column .member-box .row {
      position: relative;
      min-height: 200px; }
    .two-column .member-box .p-text {
      padding-left: 5.33vw; }
    .two-column .member-box .js-modal-open {
      position: absolute;
      left: 5.33vw;
      bottom: 20px; }
    .two-column .member-box .en {
      font-size: 1.1rem;
      margin: 15px 0; }
    .two-column .member-box .name {
      font-size: 1.8rem;
      margin: 0 0 30px; }
    .two-column .member-box:nth-child(even) .image img {
      right: 50%;
      transform: translate(50%, 0); }
  .two-column .text {
    width: 240px; }
  .two-column .image {
    width: calc(100% - 240px);
    height: 100%;
    min-height: 53.33vw; }
    .two-column .image img {
      transform: translate(50%, 0);
      right: 50%; }

  .modal .modal__content {
    border: 3px solid #b61e28;
    max-width: 400px;
    width: calc(100% - 5.33vw * 2);
    height: auto;
    max-height: none; }
  .modal a.js-modal-close {
    right: -3px;
    bottom: auto;
    top: -3px; }
  .modal .row {
    flex-direction: column-reverse; }
    .modal .row .m-profile {
      width: 100%;
      padding: 10px 0; }
      .modal .row .m-profile .inner {
        overflow: auto;
        height: 250px;
        padding: 5.33vw; }
    .modal .row .en {
      font-size: 1.1rem;
      margin: 0 0 10px; }
    .modal .row .description + .en {
      font-size: 1.1rem;
      margin: 25px 0 5px; }
    .modal .row .name {
      font-size: 1.6rem;
      margin: 0 0 15px; }
    .modal .row .description,
    .modal .row .p-message {
      line-height: 1.6 !important; }
    .modal .row .m-image {
      width: 100%;
      height: 250px;
      overflow: hidden; }

  #member .row {
    margin-top: 8vw;
    margin-bottom: -30px; }
  #member .column-4 {
    width: 33.33%;
    /*padding-bottom: 30px; original*/ }
  #member img {
    width: 100%; }
  #member .overlay {
    /*position: relative; original*/
    z-index: 10;
    top: auto;
    left: auto;
    background: none;
    height: auto;
    opacity: 1;
    transition: all .2s;
    -webkit-transition: all .2s; }
  #member .name {
    /*font-size: 1.4rem;orginal*/
	  font-size: 1.2rem;
    /*font-weight: 500; orginal*/
    /*color: #282828; orginal*/
    color: #fff;
    background: rgba(137, 37, 47, 0.6); /*add*/
    text-align: center;
    position: relative;
    width: 100%;
    left: 0;
    /*top: auto;orginal*/
    top:  -24px;
    transform: translate(0, 0);
    /*padding: 15px 0 0;  orginal*/
    padding: 0;	} }
@media screen and (max-width: 640px) {
  #founders .member-box .text {
    min-height: 210px; }
  #founders .member-box .image img {
    right: 2vw; }

  .two-column .image {
    min-height: 200px; }
    .two-column .image img {
      right: 25%;
      transform: translate(25%, 0); }
  .two-column .member-box .small {
    font-size: 1.1rem; }
  .two-column .member-box:nth-child(even) .image img {
    right: 25%;
    transform: translate(25%, 0); } }