body {
  overflow-x: hidden;
}
body main #staff .sec-title {
  margin-bottom: clamp(70px, 18.6vw, 140px);
}
@media screen and (min-width: 769px) {
  body main #staff .sec-title {
    margin-bottom: clamp(70px, 9.1vw, 140px);
  }
}
body main #staff .card-list {
  padding-left: 16vw;
}
@media screen and (min-width: 769px) {
  body main #staff .card-list {
    padding-left: 0;
  }
}
body main #staff .card-list .card-01 {
  margin-bottom: clamp(260px, 69.3vw, 520px);
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-01 {
    margin-bottom: clamp(70px, 9.1vw, 140px);
  }
}
body main #staff .card-list .card-01 .img-panel {
  transform: rotate(-5deg);
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-01 .img-panel {
    margin-right: 50px;
  }
}
body main #staff .card-list .card-01 .img-panel .img {
  overflow: hidden;
}
body main #staff .card-list .card-01 .img-panel .img img {
  transform: scale(2);
  transform-origin: 90% 0%;
}
body main #staff .card-list .card-01 .img-panel .panel-sticky {
  transform: rotate(-14deg);
}
body main #staff .card-list .card-01 .img-panel .panel-sticky::before {
  content: "";
  top: 150%;
  left: 40%;
  width: 250%;
  height: 250%;
  background-image: url(/img/hara/sticky_01.png);
  transform: rotate(16deg) translate(-50%, -50%);
}
body main #staff .card-list .card-01 .memo-text-01::before {
  background-image: url(/img/hara/sp_memo_01.png);
  width: clamp(240px, 64vw, 480px);
  height: clamp(220px, 58.6vw, 440px);
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-01 .memo-text-01::before {
    background-image: url(/img/hara/pc_memo_01.png);
    top: 45%;
    left: 63%;
    transform: translate(-50%, -50%);
    width: clamp(300px, 39vw, 600px);
    height: clamp(200px, 26vw, 400px);
  }
}
body main #staff .card-list .card-02 {
  margin-bottom: clamp(240px, 64vw, 480px);
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-02 {
    flex-direction: row-reverse;
    margin-bottom: clamp(80px, 10vw, 160px);
  }
}
body main #staff .card-list .card-02 .img-panel {
  transform: rotate(4deg);
  width: 60%;
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-02 .img-panel {
    transform: rotate(-3deg);
    width: 28%;
  }
}
body main #staff .card-list .card-02 .img-panel .img img {
  transform: scale(1.1);
  aspect-ratio: 11/9;
  -o-object-position: left;
     object-position: left;
}
body main #staff .card-list .card-02 .img-panel .panel-sticky {
  transform: rotate(-20deg);
  top: -10%;
  left: -20%;
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-02 .img-panel .panel-sticky {
    transform: rotate(-3deg);
    left: 10%;
    top: -10%;
  }
}
body main #staff .card-list .card-02 .img-panel .panel-sticky::before {
  background-image: url(/img/hara/sticky_02.png);
  transform: rotate(12deg);
  top: -160%;
  left: -25%;
  width: clamp(200px, 53.3vw, 400px);
  height: clamp(70px, 18.6vw, 140px);
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-02 .img-panel .panel-sticky::before {
    left: -10%;
    top: -200%;
    width: clamp(170px, 22.1vw, 340px);
    height: clamp(90px, 11.7vw, 180px);
  }
}
body main #staff .card-list .card-02 .memo-text-02 {
  top: 110%;
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-02 .memo-text-02 {
    transform: rotate(-8deg);
    margin-right: 4vw;
  }
}
body main #staff .card-list .card-02 .memo-text-02::before {
  background-image: url(/img/hara/sp_memo_02.png);
  width: clamp(240px, 64vw, 480px);
  height: clamp(220px, 58.6vw, 440px);
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-02 .memo-text-02::before {
    background-image: url(/img/hara/pc_memo_02.png);
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(6deg);
    width: clamp(300px, 39vw, 600px);
    height: clamp(250px, 32.5vw, 500px);
  }
}
body main #staff .card-list .card-03 {
  margin-bottom: clamp(260px, 69.3vw, 520px);
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-03 {
    margin-bottom: clamp(110px, 14.3vw, 220px);
  }
}
body main #staff .card-list .card-03 .img-panel {
  transform: rotate(-4deg);
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-03 .img-panel {
    width: 28%;
  }
}
body main #staff .card-list .card-03 .img-panel .img img {
  transform: scale(1.2);
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-03 .img-panel .img img {
    transform: scale(1);
    aspect-ratio: 15/16;
  }
}
body main #staff .card-list .card-03 .img-panel .panel-sticky {
  transform: rotate(-15deg);
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-03 .img-panel .panel-sticky {
    transform: rotate(-9deg);
    left: 12%;
  }
}
body main #staff .card-list .card-03 .img-panel .panel-sticky::before {
  background-image: url(/img/hara/sticky_03.png);
  top: 170%;
  left: 32%;
  width: clamp(150px, 40vw, 300px);
  height: clamp(80px, 21.3vw, 160px);
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-03 .img-panel .panel-sticky::before {
    width: clamp(150px, 19.5vw, 300px);
  }
}
body main #staff .card-list .card-03 .memo-text-03 {
  transform: rotate(-1deg);
  right: 8%;
  top: 117%;
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-03 .memo-text-03 {
    transform: rotate(0deg);
    margin-left: 40px;
  }
}
body main #staff .card-list .card-03 .memo-text-03::before {
  background-image: url(/img/hara/sp_memo_03.png);
  width: 110%;
  height: 160%;
}
@media screen and (min-width: 769px) {
  body main #staff .card-list .card-03 .memo-text-03::before {
    background-image: url(/img/hara/pc_memo_03.png);
    width: clamp(340px, 44.2vw, 680px);
  }
}
body main #headmaster .headmaster-inner .headmaster-img img {
  transform: scale(1.3);
}
body main #headmaster .headmaster-inner .headmaster-text .pink {
  text-align: center;
}/*# sourceMappingURL=style.css.map */