@charset "utf-8";

/* about
---------------------------------------------------*/
#mainContent .all_area {
  margin-top: 50px;
}
#mainContent .tab_container {
  border-bottom: 1px solid #bbb;
}
#mainContent .tab_area {
  width: min(100%, 820px);
  margin: 0 auto;
  overflow: hidden;
  display: flex;
  gap: 20px;
  justify-content: center;
}

#mainContent .tab_area li {
  width: calc((100% - (20px * 2)) / 3);
  max-width: 260px;
  font-size: 2.4em; /*24px*/
  font-weight: bold;
  text-align: center;
  padding: 22px 0;
  background-color: var(--c-lightGray02);
  cursor: pointer;
  color: var(--c-darkGray01);
}

#mainContent .tab_area li.select {
  color: #fff;
  background-color: var(--c-black02);
}

#mainContent .content_area .img {
  text-align: center;
}
#mainContent .content_area .img img {
  width: 100%;
  height: auto;
  /* max-width: 870px; */
  display: block;
  margin: 0 auto;
}

#mainContent #sec03 .img + h3 {
  margin-top: 50px;
}

#mainContent #sec02 .img {
  margin-top: 40px;
  margin-bottom: 50px;
}

@media only screen and (max-width: 768px) {
  #mainContent .all_area {
    margin-top: 30px;
  }

  #mainContent .tab_area {
    gap: 16px;
  }

  #mainContent .tab_area li {
    width: calc((100% - (16px * 2)) / 3);
    font-size: 1.5em; /*15px*/
    padding: 16px 0;
  }
  #mainContent .content_area .img img {
    max-width: 435px;
  }

  #mainContent #sec03 .img + h3 {
    margin-top: 25px;
  }

    #mainContent #sec02 .img {
      margin-top: 20px;
      margin-bottom: 25px;
    }
}