@charset "UTF-8";
@font-face {
  font-family: "tsunagi";
  src: url("../font/TsunagiGothic.woff") format("woff"); }
@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {
  .nijimon_list {
    image-rendering: -webkit-optimize-contrast; } }
/*********************************************/
.no_single {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  font: 4.5rem/1em "tsunagi", YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-weight: 700;
  color: #79503A;
  text-align: center; }
  .no_single span {
    color: #EE4F00; }

@media (max-width: 768px) {
  .no_single {
    font: 3rem/1em "tsunagi", YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
    font-weight: 700; } }
/*********************************************/
.main_content {
  max-width: 1920px;
  width: 100%; }
  .main_content h2 {
    width: calc(100% - 200px);
    margin: 0 auto;
    max-width: 1580px;
    margin-bottom: 120px; }

/*max-width:1280px*/
@media (max-width: 1024px) {
  .main_content h2 {
    width: calc(100% - 80px); } }
/*max-width:1024px*/
@media (max-width: 768px) {
  .main_content h2 {
    margin-bottom: 50px; } }
/*max-width:768px*/
@media (max-width: 480px) {
  .main_content h2 {
    width: calc(100% - 40px); } }
/*max-width:480px*/
/*****************************************/
.mv {
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: url("../images/staff/nijimon.svg") center center no-repeat;
  background-size: contain;
  aspect-ratio: 727/571;
  width: 95%;
  max-width: 727px;
  height: auto;
  margin: 0 auto 75px; }

/*****************************************/
.about_nijimon {
  max-width: 1000px;
  width: calc(100% - 80px);
  margin: 0 auto 150px;
  background-color: #FBF4EA;
  border-radius: 200px;
  padding: 50px 280px 55px 120px;
  position: relative; }
  .about_nijimon:before {
    background: url("../images/staff/silhouette.svg") center center no-repeat;
    background-size: contain;
    position: absolute;
    content: "";
    aspect-ratio: 268/304;
    width: 100%;
    max-width: 268px;
    height: auto;
    top: 48%;
    left: auto;
    display: block;
    right: 0;
    -webkit-transform: translate(0%, -50%);
    /* Safari用 */
    transform: translate(0%, -50%); }
  .about_nijimon h3 {
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    background: url("../images/staff/what.svg") center center no-repeat;
    background-size: contain;
    aspect-ratio: 470/57;
    width: 100%;
    max-width: 470px;
    height: auto;
    margin: 0 0 15px; }
  .about_nijimon p {
    font: 1.8rem/2em "Zen Kaku Gothic New", "Noto Sans JP", YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
    font-weight: 500;
    letter-spacing: 0.03em; }
    .about_nijimon p span {
      display: block; }

/*max-width:1280px*/
@media (max-width: 1024px) {
  .about_nijimon {
    padding: 50px 0 55px 0; }
    .about_nijimon:before {
      display: none; }
    .about_nijimon h3 {
      width: 100%;
      max-width: 470px;
      height: auto;
      margin: 0 auto 40px; }
    .about_nijimon p {
      max-width: 768px;
      margin: 0 auto;
      padding: 0 250px 0 80px;
      position: relative; }
      .about_nijimon p:before {
        background: url("../images/staff/silhouette.svg") center center no-repeat;
        background-size: contain;
        position: absolute;
        content: "";
        aspect-ratio: 268/304;
        width: 100%;
        max-width: 220px;
        height: auto;
        top: 50%;
        left: auto;
        display: block;
        right: 0;
        -webkit-transform: translate(0%, -50%);
        /* Safari用 */
        transform: translate(0%, -50%); } }
/*max-width:1024px*/
@media (max-width: 768px) {
  .about_nijimon {
    padding: 50px 40px 0;
    border-radius: 25px; }
    .about_nijimon:before {
      display: none; }
    .about_nijimon h3 {
      width: 100%;
      max-width: 470px;
      height: auto;
      margin: 0 auto 20px; }
    .about_nijimon p {
      max-width: 768px;
      margin: 0 auto;
      padding: 0 0 220px;
      position: relative;
      text-align: justify;
      text-justify: inter-ideograph; }
      .about_nijimon p br {
        display: none; }
      .about_nijimon p:before {
        background: url("../images/staff/silhouette.svg") center center no-repeat;
        background-size: contain;
        position: absolute;
        content: "";
        aspect-ratio: 268/304;
        width: 100%;
        max-width: 220px;
        height: auto;
        top: auto;
        bottom: -50px;
        left: 50%;
        display: block;
        right: auto;
        -webkit-transform: translate(-50%, 0%);
        /* Safari用 */
        transform: translate(-50%, 0%); } }
/*max-width:768px*/
@media (max-width: 480px) {
  .about_nijimon {
    width: calc(100% - 30px);
    padding: 40px 25px 0;
    border-radius: 25px; }
    .about_nijimon h3 {
      margin: 0 auto 20px; }
    .about_nijimon p {
      font: 1.6rem/2em "Zen Kaku Gothic New", "Noto Sans JP", YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
      font-weight: 500;
      padding: 0 0 200px; }
      .about_nijimon p:before {
        max-width: 200px; } }
/*max-width:480px*/
/*****************************************/
.midashi {
  margin: 0 auto 85px;
  width: fit-content;
  background-color: #F4AD3C;
  color: #fff;
  font: 3.6rem/1.8em "Noto Sans JP", YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-weight: 700;
  letter-spacing: 0.02em;
  position: relative;
  padding: 0 20px; }
  .midashi .tb {
    display: none; }
  .midashi:before {
    background: url("../images/staff/left.png") center left no-repeat;
    background-size: 100% 100%;
    position: absolute;
    content: "";
    display: block;
    left: -21px;
    top: 0;
    width: 21px;
    height: 100%; }
  .midashi:after {
    background: url("../images/staff/left.png") center left no-repeat;
    background-size: 100% 100%;
    position: absolute;
    content: "";
    display: block;
    right: -21px;
    transform: rotate(180deg);
    top: 0;
    width: 21px;
    height: 100%; }
  .midashi br {
    display: none; }

/*max-width:1280px*/
@media (max-width: 1024px) {
  .midashi {
    font: 3.6rem/1.4em "Noto Sans JP", YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
    font-weight: 700;
    letter-spacing: 0.02em;
    position: relative;
    padding: 8px 40px 10px 50px;
    height: 120px; }
    .midashi br {
      display: block; }
    .midashi:before, .midashi:after {
      background: url("../images/staff/left.png") top right repeat-y;
      background-size: 100% 60px; } }
/*max-width:1024px*/
@media (max-width: 768px) {
  .midashi {
    margin: 0 auto 65px;
    width: fit-content;
    background-color: #F4AD3C;
    color: #fff;
    font: 2.8rem/1.6em "Noto Sans JP", YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
    font-weight: 700;
    letter-spacing: 0.02em;
    position: relative;
    padding: 15px 20px 0 30px;
    height: 120px;
    text-align: center; }
    .midashi .tb {
      display: inline-block; }
    .midashi .pc {
      display: none; } }
/*max-width:768px*/
@media (max-width: 480px) {
  .midashi {
    font: 2.2rem/1.6em "Noto Sans JP", YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
    font-weight: 700;
    letter-spacing: 0.02em;
    position: relative;
    padding: 13px 20px 15px 30px;
    height: 100px; }
    .midashi:before, .midashi:after {
      background: url("../images/staff/left.png") top right repeat-y;
      background-size: 100% 50px; } }
/*max-width:480px*/
/*****************************************/
.nijimon_list {
  max-width: 1100px;
  width: calc(100% - 200px);
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  align-items: flex-start; }

.card_box {
  position: relative;
  width: calc((100% - 120px)/3);
  margin: 0 60px 60px 0;
  height: auto;
  perspective: 1000px; }
  .card_box:nth-of-type(3n) {
    margin-right: 0; }

.card {
  aspect-ratio: 55/91;
  width: 100%;
  max-width: 100%;
  height: auto;
  transition: transform 0.6s ease-in-out;
  transform-style: preserve-3d; }

.card-front,
.card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  /* 回転中に裏側が見えないようにする */
  top: 0;
  left: 0; }

.card-front {
  transform: rotateY(0deg); }

.card-back {
  transform: rotateY(180deg);
  /* 180度回転して裏側を隠す */ }

.flipped .card {
  transform: rotateY(180deg);
  /* クリック時に180度回転 */ }

.back_btn_top {
  margin-top: 20px;
  text-align: center; }

.card_box {
  font: 18px/1.2em YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; }

@media (max-width: 1280px) {
  .card_box {
    width: calc((100% - 100px)/3);
    margin: 0 50px 50px 0; } }
/*max-width:1280px*/
@media (max-width: 1024px) {
  .nijimon_list {
    width: calc(100% - 80px); }

  .card_box {
    position: relative;
    width: calc((100% - 80px)/3);
    margin: 0 40px 40px 0;
    height: auto;
    perspective: 1000px; }
    .card_box:nth-of-type(4n) {
      margin-right: 40px; }
    .card_box:nth-of-type(3n) {
      margin-right: 0; } }
/*max-width:1024px*/
@media (max-width: 768px) {
  .nijimon_list {
    -webkit-justify-content: space-between;
    justify-content: space-between; }

  .card_box {
    position: relative;
    width: calc((100% - 20px)/2);
    margin: 0 0 20px;
    height: auto;
    perspective: 1000px; }
    .card_box:nth-of-type(4n), .card_box:nth-of-type(3n) {
      margin-right: 0; } }
/*max-width:768px*/
@media (max-width: 480px) {
  .nijimon_list {
    width: calc(100% - 40px); }

  .card_box {
    position: relative;
    max-width: 280px;
    width: 100%;
    margin: 0 auto 30px;
    height: auto;
    perspective: 1000px; }
    .card_box:nth-of-type(4n), .card_box:nth-of-type(3n) {
      margin: 0 auto 20px; } }
/*max-width:480px*/