@charset "utf-8";


/* header */
header .inner { padding-top: 46px; }
header #hlogo { float: none; }

header h1 {
  position: absolute; left: 0; top: 93px; float: none; font-size: 12px;
}
#top header h1 { position: static; }
.sec_ttl { font-size: 28px; }
.reserve_box h3 {
  max-width: 400px; padding: 14px 20px 14px 40px; font-size: 20px;
}
.reserve_box h3::before { left: 9%; }

/* top トップページ
================================================================== */
#top .sec_ttl { font-size: 56px; }

#top #movie .sec_ttl, #top #access .sec_ttl { font-size: 40px; }

.en_fee {position:absolute; padding-top:20px; top:0; right:20px;
width: 120px; height:120px; text-align: center;
background:#f6c725; color:#000; font-weight:bold; line-height:27px;
border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; z-index: 9999; }
.en_fee .bottom { font-size:20px; }

#services .consul_trial .c_ttl { padding: 11px 0 16px 14px; }
#services .consul_trial .c_ttl span { width: 270px; letter-spacing: -0.5px; font-size: 13.5px; text-align: justify; }

#concept #roots .txt_box::before { border-bottom: 580px solid #f3e9d4; }


@media screen and (max-width:1450px) {
  #services .consul_trial .c_ttl { padding: 12px 0 12px 16px; }
  #services .consul_trial .c_ttl span { letter-spacing: -1px; font-size: 13px; } 
}

/* brand statement 
================================================================== */
#top #brand_statement h2 { font-size: 36px; }


/* profile プロフィール
================================================================== */
#profile .sec_ttl::before { left: 60px; bottom:40%; }
#profile .sec_ttl::after { right: 60px; bottom:40%; }
.background .img_box .img2 { margin-left: -8em; }
#pro_box .txt_box { width: 55%; margin-left: -17%; }

/* concept コンセプト
================================================================== */
#concept .detail_box h3 { padding: 40px 0 0 0; }
#concept #training .ttl_box h3::before,
#concept #massage .ttl_box h3::before { display: none; }

/* services コース紹介
================================================================== */
.en_btn a::after{ top:27px; }
#lead_box .en_fee,.services_cat .en_fee { padding-top:30px; width:150px; height:150px; }
#lead_box .en_fee { top:-70px; }
.services_cat .en_fee { top:-60px; }
#services .en_fee .bottom { font-size:25px; }

.fee { padding-top:45px; top:-85px; font-size:18px; }
.course li a { padding: 24px 0 25px; }
.course li a span.font_en { font-size:18px; font-weight:bold; font-style:normal; color:#000; }
.en_btn a { padding:20px 120px; font-size:20px; font-weight:bold; }

.bootcamp_course .explan { padding: 40px 0 0 20%; }

.services_list dt { display:table; }
.services_list h4 { margin-bottom: 7px; font-size: 200%; }
.services_list .btn { top:0px; }
.services_list .btn_reserve { top: 50px; }
.services_list .btn_detail a { min-width: 220px; }
#foundation .btn { top:-35px; }
.services_list .detail_box h5 { padding: 40px 0; }
.services_list .detail_box .en_c_option { padding: 25px 0; line-height: 1.3; }
.services_list .detail_box .c_with_subTxt { padding-top: 40px; line-height: 1.2;}
.services_list .detail_box .flow .txt { font-weight: normal; }
.services_list .detail_box .point { padding-top: 10px; }
.services_list .detail_box .point > li { margin-bottom: 16px; }
.services_list .detail_box .point .txt { width: 90%; font-size: 20px; }
/* .services_list .rec_comment { font-weight: normal; } */
.op_list > li:not(:last-child) { border-bottom: 0; }

#services #training .services_ttl span { font-size: 30px; line-height: 1.1;} 

.services_list #bodymake .box,.services_list #lb_recovery .box  ,#bootcamp .box , #t_massage .box, #t_harmony .box , #p_massage .box { margin-top: 50px; }
.services_txt { position:relative;}

.services_list #lifemake .box { margin-top: 50px; }

#services #lead_box .lead_free .line .sp_only {display: none;}

#services #lead_box .lead_free .line { text-align:center; background:none; }
#services #lead_box .lead_free .line span {display: inline;
  background: linear-gradient(transparent 60%, #f6c725 0%); font-size: 1.2em;}

/*ブートキャンプ*/
.bootcamp_details .services_list .detail_box h5 { padding-top: 46px; }
.bootcamp_details .detail_box { padding: 20px; }
.harmony .services_list .detail_box h5 { float: none; width: 100%; height: auto; margin-left: 27px; padding: 1em 0; text-align: left; background: none; }
.harmony .services_list .point_txt { margin-left: 27px; }
.bootcamp_option .detail_box .flow1:last-child { border: none; }
.bootcamp_details .reserve_box .btn { width: 80%; }
.bootcamp_details .reserve_box .btn a { padding: 30px 10%; font-size: 2em; }

/* よくある流れ */
#services .course_flow .btn { min-width: 208.8px; }
#services .services_cat .btn a { padding: 10px 55px 8px 45px; }

@media screen and (min-width:600px) {
  #ad_option .example .time { font-size:min(2.5vw,18px); }

}


@media screen and (min-width:980px) {
  #ad_option .example h5 span { width:85px; }
  #ad_option .example {max-width: none;}

}


/* location スタジオ紹介
================================================================== */
#location_lead p { max-width: 540px; margin: 10px auto; }
#location .space h4 { padding-top: 0; }
#location .space h4::before { display: none; }

/* test 上ふたつの打消し */
#location.test .space h4 { padding-top: 65px; }
#location.test .space h4::before { display: block; }

#flow .step3 figure.img2 { right:45px; }


@media screen and (max-width: 1080px) {
  header .inner { padding-top: 40px; }
  header h1 { position: static; }

  #lead_box .en_fee { padding-top:22px; top:-70px; right:0; width:125px; height:125px; }
  #services .en_fee .bottom { font-size:22px; line-height:0.9; }
  .services_cat .en_fee { padding-top:22px; right:0; width:125px; height:125px; }

  #profile .sec_ttl::before { left: -30px; }
  #profile .sec_ttl::after { right: -30px; }

  .background .img_box .img2 { margin-top: 1em; margin-left: 0; }


}

@media screen and (max-width: 980px) {
  .services_list .detail_box h5 { padding: 10px 0; }
  .services_list .detail_box .c_with_subTxt { padding-top: 10px;}
    #profile .se_box.ad_option .btn a { width: 100%; padding: 10px 0 8px; }
    #profile .sec_ttl::before { left: -80px; }
    #profile .sec_ttl::after { right: -80px; }
    #pro_box .txt_box { width: 100%; margin-left: auto; }
    #services #lead_box .lead_free .line .sp_only {display: block;}
    #ad_option .example {max-width: 800px;}
    #ad_option .example .plus::after {top: 0;}
}
@media screen and (max-width: 799px) {
  header .inner { padding-top: 14px; }
  header h1 { font-size: 12px; }
  header #lang .jp { display: block; }
  header #lang .en { display: none; }
  #top .sec_ttl { font-size: 40px; }
  #top #movie .sec_ttl { font-size: 30px; }

  .fee { padding-top:15px;}
  #ad_option .example h5 span { width:100%; }
  #ad_option .example .before {width: 100%; margin-bottom: 1em;}
  #ad_option #evolution .example .plus {width: 100%; padding-left: 0;}
  #ad_option .example .plus::after {width: 28px; height: 28px; top: -38px !important; left: calc(50% - 14px);}

  #lead_box .en_fee,.services_cat .en_fee { padding-top:20px; width:120px; height:120px; }

  .background .img_box .img2 { margin-top: 0; }

  .bootcamp_details .services_list .detail_box h5 { padding-top: 10px;  }

  .services_list figure { margin: 0 auto; }
}

/* カウンセリング
================================================================== */
#reserve .flowBox { text-align:center; }
#reserve .flowBox .txt { text-align:center; }

/*----------------------------------------------------
タブレット
-----------------------------------------------------*/
@media screen and (max-width: 769px) {
  .en_fee { padding-top:21px; line-height:26px; }
  #services .en_fee .bottom { font-size:20px; }



}/*タブレット*/

/*----------------------------------------------------
スマホ
-----------------------------------------------------*/
/*横*/
@media (min-width:667px) and (max-width:668px) {
  #trial .campTxt .fee { top:-97px; }
  .en_fee { padding-top:22px; }
  .en_fee .bottom { font-size:20px; }
  #services .services_cat .en_fee { top:-94px; right:0; }
  
}


@media screen and (max-width: 599px) {
  #services .services_cat .en_fee .bottom { font-size:15px;}


  .en_fee { padding-top:20px; width:90px; height:90px; line-height:18px; top:-10px; right:5px;}
  .en_fee .top { font-size:12px; }
  .en_fee .bottom { font-size:15px; line-height:18px; }
  #lead_box .en_fee,.services_cat .en_fee { padding-top:25px; }
  #lead_box .en_fee .bottom,.services_cat .en_fee .bottom { line-height:25px; }
  .consulBtn a { padding:15px; width:100%; }

  .course.course-btn li a {min-height: 70px;}

  #profile .sec_ttl::before { left: -160px; }
  #profile .sec_ttl::after { right: -160px; }

  #location.test .space h4 {padding-top: 32px;}

  .reserve_box h3 { max-width: none; padding: 10px 20px 14px 40px; font-size: 15px; }
  .reserve_box h3::before { left: 7%; }
  #top #services { padding-bottom: 10px; }
  #top #services .btn a { width: 100%; }
  .services_list .detail_box .point .txt { width: 80%; margin-left: 0; }
  #concept .detail_box h3 { padding: 10px 0 0 0; }
  .course li a:after { left:44%;  }
  .services_txt .en_fee { top:-50px; }
  .course li a { padding:24px 0 65px; }
  .course li a:after { bottom:10px; }

  .bootcamp_details .services_list .detail_box h5 { margin: 0; }
  .bootcamp_details .services_list .detail_box .point { width: 100%; margin: 0; }
  .bootcamp_details .reserve_box .btn { width: 100%; }
  .bootcamp_option .detail_box .flow1:last-child {  padding: 0; }
  #ad_option .example .before {margin-bottom: 0;}


  
/* カウンセリング
================================================================== */
  #reserve .flowBox .txt { text-align:left; }



}



@media screen and (max-width:425px) {

  #lead_box .en_fee,.services_cat .en_fee { padding-top:18px; width:100px; height:100px; right:0; }
  #lead_box .en_fee .bottom,.services_cat .en_fee .bottom { font-size:16px; line-height:20px; }
}


@media screen and (max-width:376px) {
  #lead_box .en_fee{ padding-top:20px; top:-76px;}
  .services_cat .en_fee { padding-top:20px; width:90px; height:90px; top:-40px; }
  .services_cat .en_fee .bottom { font-size:15px; line-height:18px; }

  .course li a { padding:25px 0 70px; }
  .course li a:after { left: 37%; bottom:5px; }
  .course li a span.font_en { font-size:14px; font-weight: normal; }
}


@media screen and (max-width: 320px) {
  #lead_box .en_fee { width:90px; height:90px; }
  #lead_box .en_fee  .bottom { font-size:15px; line-height:18px; }
  .services_cat .en_fee { top:-60px; }
  .en_fee { padding-top:15px; width:80px; height:80px;}
  .services_txt .en_fee{ top:-57px;right:0; }
}