@charset "UTF-8";
@media screen and (max-width: 640px) {
  /**************************

  	スマートフォン用css

  ***************************/
  body {
    width: 100%;
    margin: 0;
  }
  .sp {
    display: block;
  }
  .pc {
    display: none;
  }
  .pc-br {
    display: none;
  }
  .sns-line {
    height: 40px;
    padding: 10px 10px;
  }
  .tipper-customer .object,
  .section-5 .object {
    width: 25vw;
    z-index: 1;
  }
  .tipper-customer .object-1,
  .section-5 .object-1 {
    left: 3vw;
    bottom: -5vw;
  }
  .tipper-customer .object-1 img,
  .section-5 .object-1 img {
    width: 80%;
  }
  .tipper-customer .object-2,
  .section-5 .object-2 {
    right: 5vw;
    bottom: 7vw;
  }
  .tipper-customer .object-2 img,
  .section-5 .object-2 img {
    width: 100%;
  }
  .tipper-customer .object-3,
  .section-5 .object-3 {
    left: 5vw;
    top: 8vw;
  }
  .tipper-customer .object-3 img,
  .section-5 .object-3 img {
    width: 90%;
  }
  .tipper-customer .object-4,
  .section-5 .object-4 {
    right: -1vw;
    top: 16vw;
  }
  .tipper-customer .object-4 img,
  .section-5 .object-4 img {
    width: 90%;
  }
  /*
      About FIT TIP
  ----------------------------------*/
  .section-1::after {
    padding-top: 100%;
  }
  .section-1 {
    padding: 16px;
  }
  .section-1 h2 {
    font-size: 2.4rem;
  }
  .section-1 h2::before {
    width: 240px;
  }
  .section-1 .about-instructor {
    right: 0;
    left: 0;
    margin: auto;
    width: 90vw;
    top: 20vw;
  }
  .section-1 .about-text {
    width: auto;
    top: unset;
    bottom: 6vw;
    left: 5vw;
  }
  .section-1 .about-text p {
    font-size: 1.4rem;
    line-height: 160%;
  }
  .app-link .inner p {
    text-align: center;
    font-size: 1.6rem;
  }
  .app-link .inner figure img {
    width: 80%;
    margin: 0 auto;
  }
  .app-link .inner .link-button-outside {
    display: block;
  }
  .app-link .inner .linlink-button {
    margin-top: 8px;
  }
  .app-link .inner .linlink-button img {
    width: 30vw;
  }
  /*
      FIT TIP の便利な機能
  ----------------------------------*/
  .section-2 {
    background-position: 30%;
  }
  .section-2 h2 {
    font-size: 2.4rem;
  }
  .section-2 h2::before {
    width: 240px;
  }
  .section-2 .function .flex {
    display: block;
  }
  .section-2 .function .flex div {
    margin: 0 auto 48px;
  }
  /*
      TIPPER (利用者)の声を
      聞いてください
  ----------------------------------*/
  .section-3 h3 {
    font-size: 2.4rem;
  }
  /*
      こんなあなたにオススメ
  ----------------------------------*/
  .section-4 ul li {
    border-left: solid 4px #fff;
  }
  .section-4 .osusume-1 ul {
    left: 20vw;
  }
  .section-4 .osusume-3 ul {
    left: 25vw;
  }
  /*
      FIT TIPの使い方
  ----------------------------------*/
  .section-5 h4 {
    font-size: 2.4rem;
  }
  .section-5 .separation .pc-left .item {
    margin: 32px auto;
  }
  .section-5 .separation .pc-left .item .number {
    width: 70%;
  }
  .section-5 .separation .pc-left .item p br {
    display: none;
  }
  .section-5 .separation .pc-left .item .left-area {
    width: 80%;
  }
  .section-5 .sp-separation h5 {
    margin-top: 32px;
  }
  .section-5 .sp-separation .use-sp img {
    display: block;
    margin: 24px auto 64px;
    width: 70%;
  }
  .section-5 > p {
    font-size: 1.4rem;
  }
  /*
      FIT TIPの使い方(インストラクター)
  ----------------------------------*/
  .section-6 h4 {
    font-size: 2.4rem;
  }
  .section-6 .item {
    display: block;
  }
  .section-6 .item .left-area {
    text-align: center;
  }
  .section-6 .item .left-area p {
    display: inline-block;
    text-align: left;
    font-size: 1.6rem;
  }
  .section-6 .item .left-area p br {
    display: none;
  }
  .section-6 .item .left-area span {
    font-size: 1.4rem;
    display: inline-block;
    text-align: left;
  }
  .section-6 .item .left-area .glay {
    display: inline-block;
    text-align: left;
  }
  .section-6 .item .right-area img {
    display: block;
    margin: 24px auto 64px;
    width: 80%;
  }
  .section-6 .object {
    width: 25vw;
    z-index: 1;
  }
  .section-6 .object-3 {
    left: 5vw;
    top: 8vw;
  }
  .section-6 .object-3 img {
    width: 90%;
  }
  .section-6 .object-4 {
    right: -1vw;
    top: 16vw;
  }
  .section-6 .object-4 img {
    width: 90%;
  }
  /*
      質問はありますか？
  ----------------------------------*/
  .section-7 .question-list .item p {
    padding-left: 32px;
    margin-bottom: 24px;
  }
  .section-7 .question-list .item p img {
    top: 4px;
  }
}
/*-- スマートフォン用cssここまで --*//*# sourceMappingURL=responsive.css.map */