@media screen and (min-width: 769px) {
  .sado {
    margin: 0 auto;
    padding: 5rem 0 20rem;
    width: 100rem; } }
.sado__data {
  position: relative;
  padding: 40vw 2rem 5rem; }
  @media screen and (min-width: 769px) {
    .sado__data {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      flex-flow: row-reverse;
      position: static;
      margin: 0 0 5rem;
      padding: 0; } }
@media screen and (min-width: 769px) {
  .sado__wrap {
    width: 65rem; } }
.sado__ttl {
  margin: 0 0 3rem;
  padding: 0 0 1rem;
  font-size: 2rem;
  text-align: right;
  border-bottom: .1rem solid #707070;
  overflow: hidden;
  animation: sado__ttl .5s ease 0s 1 normal forwards running; }
  @media screen and (min-width: 769px) {
    .sado__ttl {
      font-size: 4rem; } }
  .sado__ttl-txt {
    display: inline-block;
    transform: translate(100%, 0);
    animation: sado__ttl-txt .5s ease 2s 1 normal forwards running; }
.sado__txt {
  line-height: 2.5;
  opacity: 0;
  animation: sado__txt .5s ease 2.5s 1 normal forwards running; }
.sado__logo {
  position: absolute;
  top: 2rem;
  left: 2rem; }
  @media screen and (min-width: 769px) {
    .sado__logo {
      position: static; } }
  .sado__logo-img {
    width: 40vw;
    animation: sado__logo-img 2s ease 0s 1 normal forwards running; }
    @media screen and (min-width: 769px) {
      .sado__logo-img {
        width: 30rem; } }

@keyframes sado__logo-img {
  0% {
    filter: blur(60px); }
  100% {
    filter: blur(0); } }
@keyframes sado__ttl {
  0% {
    transform: translate(-100%, 0); }
  100% {
    transform: translate(0, 0); } }
@keyframes sado__ttl-txt {
  0% {
    transform: translate(100%, 0); }
  100% {
    transform: translate(0, 0); } }
@keyframes sado__txt {
  0% {
    opacity: 0;
    transform: translate(0, 5rem); }
  100% {
    opacity: 1;
    transform: translate(0, 0); } }
.about {
  padding: 0 0 10rem; }
  @media screen and (min-width: 769px) {
    .about {
      padding: 0 0 20rem; } }
  @media screen and (min-width: 769px) {
    .about__ttl {
      font-size: 6rem; } }
  @media screen and (min-width: 769px) {
    .about__list {
      display: flex;
      justify-content: space-between;
      margin: 0 auto;
      width: 100rem; } }
  .about__item {
    margin: 0 4rem 3rem;
    padding: 0 0 3rem;
    border-bottom: .1rem solid #707070;
    text-align: center; }
    @media screen and (min-width: 769px) {
      .about__item {
        margin: 0;
        padding: 0 2rem;
        width: calc(33.333% - 4.1rem);
        border-right: .1rem solid #707070;
        border-bottom: none; } }
    @media screen and (min-width: 769px) {
      .about__item:nth-child(2).fade {
        transition: all .5s .7s; } }
    .about__item:nth-child(3) {
      border: none; }
      @media screen and (min-width: 769px) {
        .about__item:nth-child(3).fade {
          transition: all .5s 1.2s; } }
  .about__img {
    margin: 0 0 3rem;
    width: 90%;
    max-width: 30rem; }
  .about__sub-ttl {
    margin: 0 0 2rem;
    font-size: 2rem; }
    @media screen and (min-width: 769px) {
      .about__sub-ttl {
        font-size: 3rem; } }
  .about__txt {
    text-align: left;
    line-height: 2.5; }

.tuition {
  padding: 10rem 0 0;
  background: #5C6754; }
  @media screen and (min-width: 769px) {
    .tuition {
      margin: 0 auto 5rem;
      padding: 0; } }
  @media screen and (min-width: 769px) {
    .tuition__data {
      display: flex;
      justify-content: space-between; } }
  @media screen and (min-width: 769px) {
    .tuition__block1 {
      position: relative;
      order: 1;
      width: 33.333%; } }
  .tuition__ttl {
    position: relative;
    margin: 0 4rem 5rem;
    padding: calc(100% - 8rem) 0 0;
    background: #FFF; }
    @media screen and (min-width: 769px) {
      .tuition__ttl {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0;
        padding: 0;
        width: 20rem;
        height: 20rem; } }
    .tuition__ttl-txt {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      font-size: 4rem;
      letter-spacing: 1px; }
      @media screen and (min-width: 769px) {
        .tuition__ttl-txt {
          font-size: 3rem; } }
      .tuition__ttl-txt::after {
        content: "tuition";
        position: absolute;
        left: 50%;
        bottom: -4rem;
        transform: translate(-50%, 0);
        font-size: 1.5rem;
        letter-spacing: 2px; }
        @media screen and (min-width: 769px) {
          .tuition__ttl-txt::after {
            bottom: -2rem;
            font-size: 1rem; } }
  .tuition__block2 {
    padding: 0 4rem 10rem;
    color: #FFF; }
    @media screen and (min-width: 769px) {
      .tuition__block2 {
        position: relative;
        order: 3;
        padding: 0 4rem;
        width: calc(33.333% - 8rem); } }
    @media screen and (min-width: 769px) {
      .tuition__block2-wrap {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 24rem; } }
  .tuition__txt {
    font-size: 2rem;
    text-align: center; }
    @media screen and (min-width: 769px) {
      .tuition__txt {
        font-size: 3rem; } }
    .tuition__txt--big {
      display: block;
      padding: 1rem 0 2rem;
      font-size: 3rem; }
      @media screen and (min-width: 769px) {
        .tuition__txt--big {
          font-size: 4rem; } }
    .tuition__txt--small {
      font-size: 1.5rem; }
    .tuition__txt--attention {
      font-size: 1.5rem;
      line-height: 2; }
  .tuition__price {
    margin: 2rem auto;
    padding: 2rem 0 1rem;
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
    width: 22rem; }
    .tuition__price-list {
      display: flex;
      justify-content: space-between;
      flex-flow: wrap; }
    .tuition__price-ttl {
      margin: 0 0 1rem;
      width: 4em; }
      .tuition__price-ttl::after {
        content: ":"; }
    .tuition__price-data {
      margin: 0 0 1rem;
      width: calc(100% - 4em); }
  .tuition__block3 {
    overflow: hidden; }
    @media screen and (min-width: 769px) {
      .tuition__block3 {
        order: 2;
        width: 33.333%; } }

.school-day {
  margin: 0 0 10rem;
  padding: 10rem 0 0;
  background: #B1B7C9; }
  @media screen and (min-width: 769px) {
    .school-day {
      margin: 0 auto 20rem;
      padding: 0; } }
  @media screen and (min-width: 769px) {
    .school-day__data {
      display: flex;
      justify-content: space-between; } }
  @media screen and (min-width: 769px) {
    .school-day__block1 {
      position: relative;
      order: 1;
      width: 33.333%; } }
  .school-day__ttl {
    position: relative;
    margin: 0 4rem 5rem;
    padding: calc(100% - 8rem) 0 0;
    background: #FFF; }
    @media screen and (min-width: 769px) {
      .school-day__ttl {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0;
        padding: 0;
        width: 20rem;
        height: 20rem; } }
    .school-day__ttl-txt {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      font-size: 4rem;
      letter-spacing: 1px; }
      @media screen and (min-width: 769px) {
        .school-day__ttl-txt {
          font-size: 3rem; } }
      .school-day__ttl-txt::after {
        content: "schoolday";
        position: absolute;
        left: 50%;
        bottom: -4rem;
        transform: translate(-50%, 0);
        font-size: 1.5rem;
        letter-spacing: 2px; }
        @media screen and (min-width: 769px) {
          .school-day__ttl-txt::after {
            bottom: -2rem;
            font-size: 1rem; } }
  .school-day__block2 {
    padding: 0 4rem 10rem;
    color: #FFF; }
    @media screen and (min-width: 769px) {
      .school-day__block2 {
        position: relative;
        order: 3;
        padding: 0 4rem;
        width: calc(33.333% - 8rem); } }
    @media screen and (min-width: 769px) {
      .school-day__block2-wrap {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%); } }
  .school-day__txt {
    font-size: 2rem;
    text-align: center; }
    @media screen and (min-width: 769px) {
      .school-day__txt {
        font-size: 3rem; } }
    .school-day__txt--big {
      display: block;
      padding: 1rem 0 2rem;
      font-size: 3rem; }
      @media screen and (min-width: 769px) {
        .school-day__txt--big {
          font-size: 3rem; } }
    .school-day__txt--small {
      font-size: 1.5rem; }
      @media screen and (min-width: 769px) {
        .school-day__txt--small {
          font-size: 1.5rem; } }
  .school-day__price {
    padding: 2rem 0 0; }
    .school-day__price-list {
      display: flex;
      justify-content: space-between;
      flex-flow: wrap;
      margin: 0 auto;
      width: 22rem; }
    .school-day__price-ttl {
      width: 4em; }
      .school-day__price-ttl::after {
        content: ":"; }
    .school-day__price-data {
      width: calc(100% - 4em); }
  .school-day__block3 {
    overflow: hidden; }
    @media screen and (min-width: 769px) {
      .school-day__block3 {
        order: 2;
        width: 33.333%; } }
