@charset "utf-8";

/*----------＝＝＝＝＝＝＝＝＝＝SP(幅895px以下)および共通設定＝＝＝＝＝＝＝＝＝＝----------*/
body .container {
    width: 100%;
    margin: 0 auto;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    color: #47300b;
}






/*----------ヘッダー----------*/
 header {
    margin: 5vw;
    position: fixed;
    z-index: 1000;    
 }


   /*ロゴ*/
     header .logo {
      width: 45vw;
      cursor: pointer;
      display: block;
    }



   /*----------ハンバーガーメニュー----------*/
       /*HBメニューの位置とサイズ*/
           .toggle-btn {
             /*位置*/
             display: block;
             position: fixed;
             top: 8vw;
             right: 8vw;
             /*サイズ*/
             width: 8vw;
             height: 8vw;

             z-index: 3;
             cursor: pointer;
            }

       /*HBメニュー棒の回転前の位置*/
           .toggle-btn span:nth-child(1) {
             top: 14%;
            }

           .toggle-btn span:nth-child(2) {
             top: 47%;
            }

           .toggle-btn span:nth-child(3) {
             bottom: 14%;
            }

       /*HBメニュー棒の回転前の設定*/
           .toggle-btn span {
             display: block;
             position: absolute;
             left: 0;
             width: 8vw;
             height: 5%;
             background-color: #47300b;
             transition: all 0.5s;
            }

       /*HBメニューの中身を非表示*/
           nav {
             display: block;
             width: 100%;
             position: fixed;
             top: 0;
             left: -30%;
             bottom: 0;
             transition: all 0.5s;
             z-index: 3;
             display: none;
            }

       /*HBメニューの中身*/
           nav .inner {
             padding: 15%;
             text-align: center;
             background:rgba(0,0,0,0.9);
             min-height:100vh;
            }

            nav .inner ul {
             list-style: none;
             margin-top: 2vw;
            }

            
            nav .inner .cv-btn {
              display: none;
            }

            nav .inner ul li a {
             display: block;
             text-decoration: none;
             color: white;
             font-size: 5vw;
             padding: 10%;
             transition-duration: 0.2s;
            }


            nav .inner img {
             display:block;
             margin: 8% auto;
            }

            nav .inner img.logo {
             width: 50%;
             margin-top: 10%;
            }

            nav .inner img.instagram {
             width: 15%;
            }


       /*HBメニュークリック時のホバー*/
           .toggle-btn:hover {
             background-color: #e4e4e4;
             opacity: 0.4;
             border-radius: 10%;
            }

       /*HBメニューの棒の回転*/
           .open .toggle-btn span:nth-child(1) {
             transform: translateY(2.8vw) rotate(-315deg);
            }

           .open .toggle-btn span:nth-child(2) {
             opacity: 0;
            }

           .open .toggle-btn span:nth-child(3) {
             transform: translateY(-2.8vw) rotate(315deg);
            }

       /*HBメニューの棒の回転後*/
            .open .toggle-btn span {
             background-color: white;
            } 

       /*HBメニューの中身を表示*/
           .open nav {
             left: 0;
             opacity: 1;
             display: block;
            }

       /*HBメニューの中身クリック時のホバー*/
           nav .inner ul li a:hover {
             background-color: #e4e4e4;
            }
   /*----------ハンバーガーメニュー終了----------*/

/*----------ヘッダー終了----------*/






/*----------メインビジュアル----------*/

  /*背景画像*/
    #mv { 
     background: url(../img/MV_SP.png);
     background-repeat: no-repeat;
     background-position: top;
     background-size: cover;
    }

  /*背景画像上に載せるコンテンツ*/
    #mv .text-wrap {
     display: flex;
     justify-content: center;
     flex-direction: column;
     text-align: center;
     padding: 5vw;
    }


   /*受賞マーク*/
     #mv .text-wrap .award {
       margin-top: 20vw;
       width: 35vw;
       text-align: left;
      }


   /*キャッチコピー*/
      #mv .text-wrap .catch-copy {
        margin-top: 5vw;
        font-size: 12vw; 
        text-shadow: 2px 2px 3px white;
        line-height: 1.2;
      }

      #mv .text-wrap .catch-copy span {
        font-size: 8vw; 
      }


   /*3つの丸*/
      #mv .text-wrap .service {
        margin-top: 5vw;
        /*丸を横並びに*/
        display: flex;
        /*丸を等間隔に配置*/
        justify-content: space-between;
      }

      #mv .text-wrap .service .service1, .service2, .service3 {
        /*丸*/
        width: 27vw;
        height: 27vw;
        background: white;
        opacity: 0.9;
        border-radius: 100%;
        box-shadow: 3px 3px 5px 0px rgba(255,255,255,0.5) inset,-3px -3px 5px 0px rgba(0,0,0,0.3) inset;
        /*丸の中の文字*/
        display: flex;
        justify-content: center;
        align-items: center;
        line-height: normal;
        font-size: 4vw;
      }


   /*CVボタン*/
      #mv .text-wrap .cv-btn-wrap {
        margin-top: 10%;
      }

      /*マイクロコピー部分*/
        #mv .text-wrap .cv-btn-wrap .cv-copy {
          font-size: 3.3vw;
          font-weight: bold;
          color: #e26239;
          background-color: #feff99;
        }

        #mv .text-wrap .cv-btn-wrap .cv-copy span {
          font-size: 5vw;
        }

      /*ボタン部分*/
        #mv .text-wrap .cv-btn-wrap .cv-btn a {
          /*ボタン*/
          border-radius: 100vh;
          background: rgb(226,98,57);
          background: linear-gradient(0deg, rgba(226,98,57,1) 0%, rgba(224,139,112,1) 100%);
          padding: 4% 0;
          display: block;
          max-width: 100%;
          box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
          margin: 2% 0;
          position: relative;
          /*文字*/
          font-size: 4.5vw;
          font-weight: bold;
          color: white;
          text-decoration: none;
          }
            
          #mv .text-wrap .cv-btn-wrap .cv-btn a:hover {
            z-index: 200;
            display: block;
            background: rgb(226,98,57);
            background: linear-gradient(180deg, rgba(226,98,57,1) 0%, rgba(224,139,112,1) 100%); 
            box-shadow: none;
          }

        /*ボタン内の右矢印*/
        #mv .text-wrap .cv-btn-wrap .cv-btn a::before {
         position: absolute;
         top: 0;
         bottom: 0;
         right: 5%;
         margin: auto;
         content: "";
         vertical-align: middle;
         width: 0.4em;
         height: 0.4em;
         border-top: solid 0.125em white;
         border-right: solid 0.125em white;
         transform: rotate(45deg);
        }
   /*CVボタン終了*/

/*----------メインビジュアル終了----------*/






/*----------ビフォーアフター----------*/

#before-after img.before-after-img {
  width: 100vw;
  /*画像下に出来る隙間を消去*/
  vertical-align: bottom;
}

#before-after img.before-after-img-pc {
  display: none;
}

/*----------ビフォーアフター終了----------*/







/*----------お悩み----------*/

  /*背景画像*/
    #problem { 
     background: url(../img/problem_SP.png);
     background-repeat: no-repeat;
     background-position: top;
     background-size: cover;
  }

  /*背景画像上に載せるコンテンツ*/
    #problem .text-wrap {
     display: flex;
     justify-content: center;
     flex-direction: column;
     text-align: center;
     line-height: normal;
     padding: 5vw 10vw;
    }

    /*見出し*/
      #problem .text-wrap .title {
        font-size: 5vw;
        margin-top: 5vw;
        line-height: 1.2;
      }

      #problem .text-wrap .title .span1 {
        font-size: 4vw;
      }

      #problem .text-wrap .title .span2 {
        font-size: 7vw;
        color: #ae8a33;
    }

    #problem .text-wrap .underline-img {
      margin-top: 3vw;
    }

    /*本文*/
      #problem .text-wrap .text {
       margin-top: 3vw;
       margin-bottom: 5vw;
       text-align: left;
      }

      #problem .text-wrap .text li {
       display: flex;
       vertical-align: top;
       font-size: 3.5vw;
       margin-top: 5vw;
      }

      #problem .text-wrap .text .em{
        font-size: 4.5vw;
        font-weight: bold;
        color: #ae8a33;
       }

      #problem .text-wrap .text li .checkbox-img {
       width: 8%;
       height: 8%;
       margin-right: 3%;
    }

/*----------お悩み終了----------*/







/*----------サービスの特徴----------*/

  /*背景画像*/
    #feature { 
     background: url(../img/feature.jpg);
     background-repeat: no-repeat;
     background-position: top;
     background-size: cover;
  }


  /*背景画像上に載せるコンテンツ*/
    #feature .text-wrap {
     display: flex;
     justify-content: center;
     flex-direction: column;
     text-align: center;
     line-height: normal;
     padding: 5vw 5vw;
    }


    /*見出し*/
      #feature .text-wrap .title {
       font-size: 5vw;
       margin-top: 5vw;
       line-height: 1.2;
      }

      #feature .text-wrap .title .span1 {
       font-size: 4vw;
      }

      #feature .text-wrap .title .span2 {
       font-size: 7vw;
       color: #ae8a33;
      }

      #feature .text-wrap .underline-img {
        margin-top: 3vw;
    }


    /*各BOX*/

      /*BOX上の画像*/
        #feature .text-wrap .feature-img {
          width: 45vw;
          margin-top: 8vw;
          z-index: 2;
      }

      /*BOX*/
        #feature .text-wrap .box-wrap .box-text-L, .box-text-R {
         /*形*/
         background-color: white;
         border-radius: 2%;
         border: 1px solid #ae8a33;
         /*位置*/
         margin: -30vw 5vw 0;
         /*BOX内の余白*/
         padding: 30% 3% 5%;
         /*BOX内のテキストを左詰めに*/
         text-align: left;
      }

      /*BOXの中身*/

        /*タイトル*/
          #feature .text-wrap .box-wrap .box-text-L h4, .box-text-R h4 {
            margin-top: 5vw;
            color: #ae8a33;
            font-size: 8vw;
          }

          #feature .text-wrap .box-wrap .box-text-L span, .box-text-R span {
           font-size: 4.8vw;
           vertical-align: middle;
           margin-left: 3%;
          }

        /*本文*/
        #feature .text-wrap .box-wrap .box-text-L p, .box-text-R p {
           font-size: 4vw;
           line-height: 1.5;
        }

        #feature .text-wrap .box-wrap .box-text-L p span, .box-text-R p span {
          font-size: 2vw;
          /*spanタグの行間を指定する*/
          display: block;
          line-height: 1.5;
          /*左に出来る微小な隙間を打ち消す*/
          margin-left: -0.2vw;
  }


  /*CVボタン*/
    #feature .text-wrap .cv-btn-wrap {
     margin: 10vw 0 5vw;
    }

    /*マイクロコピー部分*/
      #feature .text-wrap .cv-btn-wrap .cv-copy {
       font-size: 3.3vw;
       font-weight: bold;
       color: #e26239;
       background-color: #feff99;
      }

      #feature .text-wrap .cv-btn-wrap .cv-copy span {
       font-size: 5vw;
    }

    /*ボタン部分*/
      #feature .text-wrap .cv-btn-wrap .cv-btn a {
       /*ボタン*/
       border-radius: 100vh;
       background: rgb(226,98,57);
       background: linear-gradient(0deg, rgba(226,98,57,1) 0%, rgba(224,139,112,1) 100%);
       padding: 4% 0;
       display: block;
       max-width: 100%;
       box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
       margin: 2% 0;
       position: relative;
       /*文字*/
       font-size: 4.5vw;
       font-weight: bold;
       color: white;
       text-decoration: none;
      }
        
      #feature .text-wrap .cv-btn-wrap .cv-btn a:hover {
        z-index: 200;
        display: block;
        background: rgb(226,98,57);
        background: linear-gradient(180deg, rgba(226,98,57,1) 0%, rgba(224,139,112,1) 100%); 
        box-shadow: none;
      }

      /*ボタン内の右矢印*/
        #feature .text-wrap .cv-btn-wrap .cv-btn a::before {
         position: absolute;
         top: 0;
         bottom: 0;
         right: 5%;
         margin: auto;
         content: "";
         vertical-align: middle;
         width: 0.4em;
         height: 0.4em;
         border-top: solid 0.125em white;
         border-right: solid 0.125em white;
         transform: rotate(45deg);
        }
  /*CVボタン終了*/

/*----------サービスの特徴終了----------*/







/*----------トレーナー紹介----------*/

  /*背景*/
    #trainer {
     background-color: #fcf5e2;
     padding: 10vw 8vw;
  }

  /*背景の上に載せるコンテンツ*/
    #trainer .text-wrap {
     text-align: center; 
    }


    /*見出し*/
      /*英語*/
        #trainer .text-wrap .title span {
         font-size: 15vw;
         color: #c7ae78;
      }

      /*日本語*/
        #trainer .text-wrap .title {
         font-size: 5vw;
         margin-bottom: 5%;
    }


    /*トレーナーの写真*/    
    #trainer .text-wrap .trainer-img {
      width: 70vw;
      margin-bottom: 5%;
      box-shadow: 2vw 2vw #ae8a33;
    }


    /*トレーナー紹介文*/

      /*トレーナーの名前*/ 
        /*コピー*/ 
          #trainer .text-wrap article h5 {
           font-size: 4.5vw;
           font-weight: initial;
           margin-top: 5%;
          }
        /*名前*/ 
          #trainer .text-wrap article h4 {
           font-size: 4.2vw;
           font-weight: bold;
           padding: 3vw 0 4vw;
           border-bottom: 1px solid #47300b;
        }

      /*自己紹介文*/ 
        #trainer .text-wrap article p {
         padding: 4vw 0;
         font-size: 4vw;
         text-align: left;
         line-height: 1.5;
      }

      /*インスタリンク*/
        #trainer .text-wrap article .instagram-img {
         width: 10vw;
    }

/*----------トレーナー紹介終了----------*/






/*----------サービスの流れ----------*/
  /*背景*/
  #flow {
    background-color: #fcf1d2;
    padding: 10vw 15vw;
 }

 /*背景の上に載せるコンテンツ*/
  #flow .text-wrap {
    text-align: center; 
   }


    /*見出し*/
      /*英語*/
      #flow .text-wrap .title span {
        font-size: 15vw;
        color: #c7ae78;
     }

     /*日本語*/
      #flow .text-wrap .title {
        font-size: 5vw;
        margin-bottom: 5%;
    }


    /*白抜き部分*/
      /*全体*/
        .step-wrap {
         width: 100%;
         display: inline-block;
         line-height: 1.2;
      }
    
      /*それぞれ*/
        .step {
         margin: 0 auto;
         padding: 15% 8%;
         background-color: white;
         /*白抜き内の基本のフォントサイズ*/
         font-size: 4vw;
    }


    /*間の三角形*/
      .triangle {
       width: 0;
       height: 0;
       border-style: solid;
       border-right: 2.5vw solid transparent;
       border-left: 2.5vw solid transparent;
       border-top: 3vw solid #47300b;
       border-bottom: 0;
       margin: 3% auto;
    }


    /*白抜きの中身*/
      .step-wrap h4 {
       color:  #ae8a33;
       font-size: 4.5vw;
       margin-bottom: 5vw;
      }

      .step-img {
        width: 13vw;
        height: 13vw;
        margin-bottom: 5vw;
    }

/*----------サービスの流れ終了----------*/






/*----------料金プラン----------*/

  /*背景*/
  #price {
    background-color: #feedbd;
    padding: 10vw 12vw;
  }

 /*背景の上に載せるコンテンツ*/
    #price .text-wrap {
     text-align: center; 
    }


   /*見出し*/
      /*英語*/
        #price .text-wrap .title span {
         font-size: 15vw;
         color: #c7ae78;
      }

      /*日本語*/
        #price .text-wrap .title {
         font-size: 5vw;
         margin-bottom: 5%;
    }


    /*白抜き部分*/
      /*全体*/
        #price .text-wrap .plan-wrap {
         width: 100%;
         display: inline-block;
      }
   
      /*それぞれ*/
        #price .text-wrap .plan-wrap .plan {
         margin: 0 auto 5vw;
         padding: 15% 3%;
         background-color: white;
         /*白抜き内の基本のフォントサイズ*/
         font-size: 3.6vw;
    }


    /*白抜きの中身*/
      
      /*プラン名*/
        #price .text-wrap .plan-wrap h4 {
         color:  #ae8a33;
         font-size: 5vw;
         margin-bottom: 3vw;
      }

      
      /*アイコン*/
        #price .text-wrap .plan-wrap .plan .icon-wrap .icon-img {
         width: 6vw;
         height: 6vw;
         margin: 0 1vw 5vw;
      }


      /*価格*/
        /*小文字*/
          #price .text-wrap .plan-wrap .plan h5 {
           color: #ae8a33;

           font-weight: initial;
           margin-bottom: 5vw;
        }

        /*大文字*/
          #price .text-wrap .plan-wrap .plan h5 span {
           font-size: 9vw;
           font-weight: bold;
      }


      /*プランの説明*/
        #price .text-wrap .plan-wrap .plan .explain-1, .explain-2, .explain-3 {
         margin-bottom: 5vw;
        }

        #price .text-wrap .plan-wrap .plan .explain-1 li, .explain-2 li, .explain-3 li {
         line-height: normal;
         list-style: none;
         text-align: left;
      }


      /*こんな人におすすめ*/
        /*こんな人におすすめテキスト*/
          #price .text-wrap .plan-wrap .plan p {
           text-align: left;
           margin-bottom: 3%;
        }

        /*チェックボックス*/
          #price .text-wrap .plan-wrap .plan .checkbox-img {
           width: 6%;
           height: 6%;
           margin-right: 1%;
        }

        /*テキスト*/
          #price .text-wrap .plan-wrap .plan .recommend li {
            display: flex;
           display: flex;
           /*チェックボックスとテキストを天地中央配置*/
           vertical-align: middle;
           /*テキストの設定*/
           line-height: normal;
           list-style: none;
      }


      /*プラン3の注釈*/
        #price .text-wrap .plan-wrap .plan .explain li span.note {
         font-size: 2vw;
        }

        #price .text-wrap p.note {
         text-align: left;
         font-size: 2vw;
         line-height: 1.5;
         margin-top: -4vw;
      }

/*----------料金プラン終了----------*/






/*----------クロージング----------*/
  
  /*背景画像*/
  #close { 
    background: url(../img/closing_SP.png);
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
 }


  /*背景画像上に載せるコンテンツ*/
    #close .text-wrap {
     display: flex;
     justify-content: center;
     flex-direction: column;
     text-align: center;
     line-height: normal;
     padding: 10vw 5vw 15vw;
     /*白抜き内の基本のフォントサイズ*/
     font-size: 3.6vw;
    }


    /*吹き出し部分*/ 
      /*テキスト*/ 
        #close .text-wrap p.title {
         color: #e26239;
         font-size: 4vw;
         font-weight: bold;
         padding: 2vw;
      }

      /*吹き出し*/ 
        #close .text-wrap .underline-img {
         width: 60vw;
         margin: 0 auto 5vw;
    } 
 

    /*白抜き部分*/ 
      #close .text-wrap .box {
       /*白抜きの形*/ 
       background-color: white;
       border-radius: 3vw;
       margin: 4vw 3vw;
       /*白抜き内側の設定*/
       padding: 5% 2%;
       margin-bottom: 5vw;
       line-height: 1.5;
       font-weight: bold;
      }

      /*限定テキスト*/
        #close .text-wrap .box span.em {
         color: #e26239;
         font-weight: bold;
         font-size: 8vw;
         text-decoration: underline 2vw #feff99;
         text-underline-offset: -1vw;
         line-height: normal;
    }
 

    /*本文*/    
    #close .text-wrap p.mid {
      margin: 4vw 3vw;
   }

    /*最後の部分*/    
      #close .text-wrap p.last {
        margin: 4vw 3vw;
       color: #e26239;
       font-weight: bold;
       font-size: 4vw;
    }




    /*CVボタン*/
      #close .text-wrap .cv-btn-wrap {
       text-align: center;
       margin-top: 10%;
      }

      /*マイクロコピー*/
        #close .text-wrap .cv-btn-wrap .cv-copy {
          font-size: 3.3vw;
          font-weight: bold;
          color: #e26239;
          background-color: #feff99;
        }

        #close .text-wrap .cv-btn-wrap .cv-copy span {
          font-size: 5vw;
      }

      /*ボタン*/
        #close .text-wrap .cv-btn-wrap .cvButton a {
         font-size: 4.5vw;
         font-weight: bold;
         color: white;
         text-decoration: none;

         border-radius: 100vh;
         background: rgb(226,98,57);
         background: linear-gradient(0deg, rgba(226,98,57,1) 0%, rgba(224,139,112,1) 100%);
         padding: 4% 0;
         display: block;
         max-width: 100%;
         text-align: center;
         box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
         margin: 2% 0;
         position: relative;
        }
       
        #close .text-wrap .cv-btn-wrap .cvButton a:hover {
         z-index: 200;
         display: block;
         background: rgb(226,98,57);
         background: linear-gradient(180deg, rgba(226,98,57,1) 0%, rgba(224,139,112,1) 100%); 
         box-shadow: none;
        }

        /*ボタン内の右矢印*/
          #close .text-wrap .cv-btn-wrap .cvButton a::before {
           position: absolute;
           top: 0;
           bottom: 0;
           right: 5%;
           margin: auto;
           content: "";
           vertical-align: middle;
           width: 0.4em;
           height: 0.4em;
           border-top: solid 0.125em white;
           border-right: solid 0.125em white;
           transform: rotate(45deg);
      }

/*CVボタン終了*/

/*----------クロージング終了----------*/







/*----------フッター----------*/

  footer {
    /*背景*/
    background-color: #f6f6f6;
    padding: 10vw 12vw;
    text-align: center;
  }

    footer img {
      display:block;
      margin: 8% auto;
    }

    footer a {
      cursor: pointer;
  }

    footer .logo {
        width: 50%;
    }

    footer .instagram {
        width: 15%;
    }

    footer p {
        font-size: 3.5vw;
        padding: 2.8% 0;
    }

/*----------フッター終了----------*/

/*----------＝＝＝＝＝＝＝＝＝＝ここまでSP(幅895px以下)および共通設定＝＝＝＝＝＝＝＝＝＝----------*/










/*----------＝＝＝＝＝＝＝＝＝＝ここからPC(幅896px以上)の設定＝＝＝＝＝＝＝＝＝＝----------*/

@media screen and (min-width:896px) {

  /*----------ヘッダーPC----------*/
    header {
     margin: 0vw;
     padding: 0.5vw 10vw;  
     width: 100vw;
     /*ヘッダー帯の色*/
     background: rgba(255,255,255,.65);
     /*並べ方の設定*/
     display: flex;
     justify-content: space-between;
     align-items: center;
    }


    /*ロゴ*/
      header .logo {
       width: 12vw;
    }


    /*----------メニュー----------*/
    
      /*HBメニューを非表示*/
        .toggle-btn {        
         display: none;
      }


      /*PC用のメニューを表示*/
        
        /*メニューエリアの大きさと位置*/
          nav {
           /*メニューエリアの幅*/
           width: 60vw;
           /*positionを無効化*/
           position: initial;
           /*アニメーションを無効化*/
           transition: none;
           /*メニューを表示させる*/
           display: block;
           /*メニューエリアの位置調整*/
           margin-right: 10vw;
        }


        /*メニューエリアの中身*/       
          
          /*全体*/
            nav .inner {
             padding: 0%;
             text-align: center;
             min-height: auto;
             background-color: transparent;            
             /*右寄せに*/
             width: 50vw;
             height: 4.4vw;
             margin-right: 0;
             /*ロゴに対して天地中央配置*/
             display: flex;
             align-items: center;
             /*右詰めでメニューを並べる*/
             justify-content: flex-end
          }


          /*お問い合わせボタン以外*/
            nav .inner ul {
             display: flex;
             align-items: center;
             list-style: none;
             margin-top: 0vw;
            }

            nav .inner ul li a {
             /*文字*/
             text-decoration: none;
             color: #47300b;
             font-size: 1.2vw;
             /*アニメーションを無効化*/
             transition-duration: none;
             /*メニューアイテム同士の隙間*/
             margin-left: 1.5vw;
             /*クリックの有効範囲を拡大*/
             padding: 1vw 0;
            }

            /*メニューアイテムクリック時のホバー*/
              nav .inner ul li a:hover {
               background-color: transparent;
               color: #ae8a33;
            }

            nav .inner img {
             /*ロゴとインスタを非表示*/
             display: none;
          }


          /*お問い合わせボタン*/
            
            nav .inner .cv-btn {
             /*表示させる*/
             display: block;
             /*メニューとの隙間*/
             margin-left: 1vw;
            }

            nav .inner .cv-btn a {
             /*クリックの有効範囲をボタンいっぱいに広げる*/
             display: block;
             /*文字*/
             font-size: 1.2vw;
             font-weight: bold;
             color: white;
             text-decoration: none;
             /*ボタン*/
             max-width: 100%;
             border-radius: 100vh;
             background: rgb(226,98,57);
             background: linear-gradient(0deg, rgba(226,98,57,1) 0%, rgba(224,139,112,1) 100%);
             padding: 1vw 1.5vw;
             /*メニューとの隙間*/
             margin-left: 1vw;
            }

            nav .inner .cv-btn a:hover {
             z-index: 200;
             display: block;
             background: rgb(226,98,57);
             background: linear-gradient(180deg, rgba(226,98,57,1) 0%, rgba(224,139,112,1) 100%); 
          }

    /*----------メニュー終了----------*/

  /*----------ヘッダー終了----------*/










  /*----------メインビジュアルPC----------*/

    /*背景画像*/
      #mv { 
       background: url(../img/MV_PC.png);
       background-repeat: no-repeat;
       background-position: top;
       background-size: cover;
    }

    /*背景画像上に載せるコンテンツ*/
      #mv .text-wrap {
       padding: 5vw 10vw 0;
    }


    /*受賞マーク*/
      #mv .text-wrap .award {
       margin-top: 2vw;
       width: 13vw;
    }

    /*キャッチコピー*/
      #mv .text-wrap .catch-copy {
       margin-top: -5vw;
       font-size: 7vw; 
      }

      #mv .text-wrap .catch-copy span {
       font-size: 5vw; 
    }


    /*3つの丸*/
      #mv .text-wrap .service {
       width: 35vw;
       margin: 1vw auto 0;
      }

      #mv .text-wrap .service .service1, .service2, .service3 {
       /*丸*/
       width: 10vw;
       height: 10vw;
       /*丸の中の文字*/
       font-size: 1.5vw;
    }


    /*CVボタン*/
      #mv .text-wrap .cv-btn-wrap {
       margin: 2vw auto 1vw;
       width: 45vw;
      }

      /*マイクロコピー部分*/
        #mv .text-wrap .cv-btn-wrap .cv-copy {
         font-size: 1.5vw;
        }

        #mv .text-wrap .cv-btn-wrap .cv-copy span {
         font-size: 2.5vw;
      }

      /*ボタン部分*/
        #mv .text-wrap .cv-btn-wrap .cv-btn a {
         /*文字*/
         font-size: 2vw;
      }

       
    /*CVボタン終了*/

  /*----------メインビジュアル終了----------*/




  /*----------ビフォーアフターPC----------*/

    #before-after img.before-after-img {
     display: none;
    }

    #before-after img.before-after-img-pc {
     display: block;
     width: 100vw;
    }

  /*----------ビフォーアフター終了----------*/




  /*----------お悩みPC----------*/

  /*背景画像*/
    #problem { 
     background: url(../img/ploblem-pc.png);
     background-repeat: no-repeat;
     background-position: top;
     background-size: cover;
  }

  /*背景画像上に載せるコンテンツ*/
    #problem .text-wrap {
     padding: 1vw 5vw 3vw;
    }

    /*見出し*/
      #problem .text-wrap .title {
       font-size: 2.5vw;
       margin-top: 2.5vw;
       line-height: 1.2;
      }

      #problem .text-wrap .title .span1 {
       font-size: 2vw;
      }

      #problem .text-wrap .title .span2 {
       font-size: 3.5vw;
      }


      #problem .text-wrap .underline-img {
       margin: 0 auto;
       margin-top: 1vw;
       width: 35vw;
    }


    /*本文*/
      #problem .text-wrap .text {
       margin-top: 2vw;
       margin-bottom: 1.5vw;
       /*divを左寄せに*/
       width: 47vw;
       margin-left: auto;
      }

      #problem .text-wrap .text li {
       font-size: 1.5vw;
       margin-top: 2vw;
      }

      #problem .text-wrap .text .em{
       font-size: 2vw;
      }

      #problem .text-wrap .text li .checkbox-img {
       width: 3vw;
       height: 3vw;
       margin-right: 1.5%;
    }

  /*----------お悩み終了----------*/





  /*----------サービスの特徴PC----------*/

    /*背景画像*/
      #feature { 
       background: url(../img/feature.jpg);
       background-repeat: no-repeat;
       background-position: top;
       background-size: cover;
    }


    /*背景画像上に載せるコンテンツ*/
      #feature .text-wrap {
       display: flex;
       justify-content: center;
       flex-direction: none;
       text-align: center;
       line-height: normal;
       padding: 1vw 15vw;
      }


      /*見出し*/
        #feature .text-wrap .title {
         font-size: 2.5vw;
         margin-top: 2.5vw;
         line-height: 1.2;
        }

        #feature .text-wrap .title .span1 {
         font-size: 2vw;
        }

        #feature .text-wrap .title .span2 {
         font-size: 3.5vw;
        }

        #feature .text-wrap .underline-img {
         margin: 0 auto;
         margin-top: 1vw;
         width: 40vw;
      }


      /*各BOX*/
      
        /*flexbox*/
          .box-L, .box-R {
           display:flex;
           align-items: center;
           margin-top: 4vw;
          }
  
          .box-L {
           /*FLEXBOXの並びを左右反転*/
           flex-direction: row-reverse;
        }


        /*BOX上の画像*/
          #feature .text-wrap .feature-img {
           width: 30vw;
           margin-top: 0vw;
           z-index: 2;
        }

        /*BOX*/
          #feature .text-wrap .box-wrap .box-text-L, .box-text-R {
           /*形*/
           background-color: white;
           border-radius: 1vw;
           border: 1px solid #ae8a33;
           /*位置*/
           margin: 0;
           /*BOX内の余白*/
           padding: 0;
           /*BOX内のテキストを左詰めに*/
           text-align: left;   
           /*各BOXの縦幅を均一に*/
           height: 13vw;
          }

          #feature .text-wrap .box-wrap .box-text-L {
           /*BOX内の余白*/
           padding: 3% 10% 5% 5%;     
           margin-right: -5vw; 
          }

          #feature .text-wrap .box-wrap .box-text-R {
           /*BOX内の余白*/
           padding: 3% 5% 5% 10%;  
           margin-left: -5vw;     
        }


        /*BOXの中身*/

          /*タイトル*/
            #feature .text-wrap .box-wrap .box-text-L h4, .box-text-R h4 {
             margin-top: 0vw;
             color: #ae8a33;
             font-size: 3.5vw;
            }

            #feature .text-wrap .box-wrap .box-text-L span, .box-text-R span {
             font-size: 2vw;
             vertical-align: middle;
             margin-left: 1.5%;
          }

          /*本文*/
            #feature .text-wrap .box-wrap .box-text-L p, .box-text-R p {
             font-size: 1.15vw;
             line-height: 1.5;
             padding-left: 5.5vw;
            }

            #feature .text-wrap .box-wrap .box-text-L p span, .box-text-R p span {
             font-size: 1vw;
             /*spanタグの行間を指定する*/
             display: block;
             line-height: 1.5;
             /*左に出来る微小な隙間を打ち消す*/
             margin-left: -0.1vw;
      }


      /*CVボタン*/
        #feature .text-wrap .cv-btn-wrap {
         margin: 5vw auto 2vw;
         width: 45vw;
        }

        /*マイクロコピー*/
          #feature .text-wrap .cv-btn-wrap .cv-copy {
           font-size: 1.5vw;
          }

          #feature .text-wrap .cv-btn-wrap .cv-copy span {
           font-size: 2.5vw;
        }

        /*ボタン*/
          #feature .text-wrap .cv-btn-wrap .cv-btn a {
           /*文字*/
           font-size: 2vw;
        }

      /*CVボタン終了*/

  /*----------サービスの特徴終了----------*/








  /*----------トレーナー紹介PC----------*/

    /*背景*/
      #trainer {
       padding: 5vw 15vw 3vw;
    }

    /*背景の上に載せるコンテンツ*/   
      
      /*見出し*/
        /*英語*/
          #trainer .text-wrap .title span {
           font-size: 7vw;
        }

        /*日本語*/
          #trainer .text-wrap .title {
           font-size: 2.5vw;
      }


      /*トレーナーの写真*/    
        #trainer .text-wrap .trainer-img {
         /*左寄せに*/ 
         display: block;
         width: 30vw;
         margin-right: auto;
         box-shadow: 1vw 1vw #ae8a33;
      }


      /*トレーナー紹介文*/
        #trainer .text-wrap article {
         width: 35vw;
         margin-left: auto;
         margin-top: -33vw;
        }

        /*トレーナーの名前*/ 
          /*コピー*/ 
            #trainer .text-wrap article h5 {
             font-size: 1.7vw;
             margin-top: 0%;
          }

          /*名前*/ 
            #trainer .text-wrap article h4 {
             font-size: 2vw;
             padding: 1.5vw 0 2vw;
        }

        /*自己紹介文*/ 
          #trainer .text-wrap article p {
           padding: 2vw 0;
           font-size: 1.15vw;
        }

        /*インスタリンク*/
          #trainer .text-wrap article .instagram-img {
           width: 4vw;
      }

  /*----------トレーナー紹介終了----------*/





  /*----------サービスの流れPC----------*/
    /*背景*/
      #flow {
       padding: 5vw 10vw;
    }


    /*背景の上に載せるコンテンツ*/
      #flow .text-wrap {
       text-align: center; 
      }

      /*見出し*/
        /*英語*/
          #flow .text-wrap .title span {
           font-size: 7vw;
        }

        /*日本語*/
          #flow .text-wrap .title {
           font-size: 2.5vw;
      }


      /*白抜き部分*/
        /*全体*/
          .step-wrap {
           display: flex;
           justify-content: space-between;
           align-items: center;
        }
    
        /*それぞれ*/
          .step {
           width: 22vw;
           padding: 5% 2%;
           /*白抜き内の基本のフォントサイズ*/
           font-size: 1.15vw;
      }


      /*間の三角形*/
        .triangle {
         border-top: 0.8vw solid transparent;
         border-bottom: 0.8vw solid transparent;
         border-left: 1vw solid #47300b;
         border-right: 0;
         margin: 0 0.5vw;
      }


      /*白抜きの中身*/
        .step-wrap h4 {
         font-size: 1.8vw;
         margin-bottom: 2.5vw;
        }

        .step-img {
         width: 6.5vw;
         height: 6.5vw;
         margin-bottom: 2.5vw;
      }


  /*----------サービスの流れ終了----------*/





  /*----------料金プランPC----------*/

    /*背景*/
      #price {
       padding: 5vw 10vw;
    }

    /*背景の上に載せるコンテンツ*/
      #price .text-wrap {
       text-align: center; 
      }


      /*見出し*/
        /*英語*/
          #price .text-wrap .title span {
           font-size: 7vw;
        }

        /*日本語*/
          #price .text-wrap .title {
           font-size: 2.5vw;
      }


      /*白抜き部分*/
        /*全体*/
          #price .text-wrap .plan-wrap {
           display: flex;
           justify-content: space-between;
        }
   
        /*それぞれ*/
          #price .text-wrap .plan-wrap .plan {
           width: 23vw;
           padding: 5% 1%;
           /*白抜き内の基本のフォントサイズ*/
           font-size: 1.15vw;
      }


      /*白抜きの中身*/
      
        /*プラン名*/
          #price .text-wrap .plan-wrap h4 {
           font-size: 1.8vw;
           margin-bottom: 1.5vw;
        }

      
        /*アイコン*/
          #price .text-wrap .plan-wrap .plan .icon-wrap .icon-img {
           width: 2vw;
           height: 2vw;
           margin: 0 0.5vw 2.5vw;
        }


        /*価格*/
          /*小文字*/
            #price .text-wrap .plan-wrap .plan h5 {
             color: #ae8a33;
             font-weight: initial;
             margin-bottom: 2.5vw;
          }

          /*大文字*/
            #price .text-wrap .plan-wrap .plan h5 span {
             font-size: 4vw;
             font-weight: bold;
        }


        /*プランの説明*/

          #price .text-wrap .plan-wrap .plan .explain-1 {
            margin-bottom: 4.5vw;
           }

          #price .text-wrap .plan-wrap .plan .explain-2 {
           margin-bottom: 3vw;
          }

          #price .text-wrap .plan-wrap .plan .explain-3 {
            margin-bottom: 1.5vw;
          }

          #price .text-wrap .plan-wrap .plan .explain-1 li, .explain-2 li, .explain-3 li {
           line-height: normal;
           list-style: none;
           text-align: left;
        }


        /*こんな人におすすめ*/
          /*こんな人におすすめテキスト*/
            #price .text-wrap .plan-wrap .plan p {
             text-align: left;
             margin-bottom: 1.5%;
          }

          /*チェックボックス*/
            #price .text-wrap .plan-wrap .plan .checkbox-img {
             width: 6%;
             height: 6%;
             margin-right: 1%;
        }

        /*テキスト*/
          #price .text-wrap .plan-wrap .plan .recommend li {
            display: flex;
           display: flex;
           /*チェックボックスとテキストを天地中央配置*/
           vertical-align: middle;
           /*テキストの設定*/
           line-height: normal;
           list-style: none;
        }


        /*プラン3の注釈*/
          #price .text-wrap .plan-wrap .plan .explain li span.note {
           font-size: 1vw;
          }

          #price .text-wrap p.note {
           font-size: 1vw;
           margin-top: -4.5vw;
           margin-left: 54vw;
      }

  /*----------料金プラン終了----------*/





  /*----------クロージングPC----------*/
  
    /*背景画像*/
      #close { 
       background: url(../img/close-pc.png);
       background-repeat: no-repeat;
       background-position: top;
       background-size: cover;
    }


    /*背景画像上に載せるコンテンツ*/
      #close .text-wrap {
       padding: 5vw 10vw 2.3vw;
       /*白抜き内の基本のフォントサイズ*/
       font-size: 1.15vw;
      }


      /*吹き出し部分*/ 
        /*テキスト*/ 
          #close .text-wrap p.title {
           font-size: 1.3vw;
           padding: 0.5vw;
        }

        /*吹き出し*/ 
          #close .text-wrap .underline-img {
           width: 20vw;
           margin: 0 auto;
      } 
 

      /*白抜き部分*/ 
        #close .text-wrap .box {
         /*白抜きの形*/ 
         border-radius: 1vw;
         margin: 2vw 15vw;
         /*白抜き内側の設定*/
         padding: 2.5% 1%;
         margin-bottom: 2.5vw;
         line-height: 1.5;
        }

        /*限定テキスト*/
          #close .text-wrap .box span.em {
           font-size: 3vw;
           text-decoration: underline 1vw #feff99;
           text-underline-offset: -0.5vw;
      }
 

      /*本文*/    
        #close .text-wrap p.mid {
         margin: 1vw 1.5vw;
      }

      /*最後の部分*/    
        #close .text-wrap p.last {
         margin: 2vw 1.5vw;
         font-size: 1.3vw;
      }


      /*CVボタン*/
        #close .text-wrap .cv-btn-wrap {
         margin: 2vw auto 0.5vw;
         width: 45vw;
        }

        /*マイクロコピー*/
          #close .text-wrap .cv-btn-wrap .cv-copy {
           font-size: 1.5vw;
          }

          #close .text-wrap .cv-btn-wrap .cv-copy span {
           font-size: 2.5vw;
        }

        /*ボタン*/
          #close .text-wrap .cv-btn-wrap .cvButton a {
           /*文字*/
           font-size: 2vw;
        }

      /*CVボタン終了*/

  /*----------クロージング終了----------*/




  /*----------フッターPC----------*/

    footer {
     /*背景*/
     padding: 5vw 6vw;
    }

    footer img {
     display:block;
     margin: 2vw auto;
    }

    footer a {
     cursor: pointer;
    }

    footer .logo {
      width: 15vw;
    }

    footer .instagram {
      width: 3.5vw;
    }

    footer p {
      font-size: 1vw;
      padding: 0;
    }

  /*----------フッター終了----------*/



}


/*----------＝＝＝＝＝＝＝＝＝＝ここまでPC(幅896px以上)の設定＝＝＝＝＝＝＝＝＝＝----------*/



