@charset "UTF-8";

:root {
    --text-pink: #e8308f;
    --back-pink:#f562a1;
    --fnt-brown:#634c15;
    --fnt-red:#db3843;
    --contents-wd: 90%;
    --font-14: 0.875rem;
    --font-18: 1.125rem;
    --font-20: 1.25rem;
    --font-22:1.375rem;
    --font-24:1.5rem;
    --font-28: 1.75rem;
    --font-30: 1.875rem;
    --font-36: 2.25rem;
    --font-38:2.375rem;
    --font-40:2.5rem;
    --font-44:2.75rem;
    --font-sans:'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
    --font-400:400
}

html{

        font-family: "Noto Serif JP", serif;
        font-optical-sizing: auto;
        font-weight: 500;
        font-style: normal;
        color: #3a3012;
        /* font-size: clamp(0.9rem, 0.95rem + 0.4vw, 1rem); */
        line-height: 1.6;
        scroll-behavior: smooth;
}

.attend{ font-family: 'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif; font-weight: 400; font-size: 12px;}
.wrapper{width: 90%; max-width: 980px; padding: 5% 0; margin: 0 auto;}

.fnt_red{color: var(--fnt-red); font-weight: 600;}
.caution {
	font-size: 0.5em;/*　文字サイズ調整 */
	vertical-align: top;  /* 文字の位置調整 */
}

.sp-only{display: none;}

a:hover{opacity: .8;}

.head{ position: fixed; right: 2%;  z-index: 1000; top: 2%; }
.flattery{display: flex; align-items: center; width: 40%; max-width: 400px; gap : 0 10px; justify-content: center;}
.flattery_area{display: none;}

.kv{
    background: url(../images/body/fv_bg.webp) center/cover no-repeat;
}

.kv h1{max-width: 980px; margin: 0 auto;}
.kv .attend{
    margin-top: 10px;
    width: 80%;
    max-width: 800px; margin: 0 auto
}


.btn_area {margin: 4% 0;}
.btn_area p{
    color: #fff; text-align: center;  padding: 3% 0;
}


.yoyaku_btn{
    width: 70%;
    max-width: 700px;
    margin: 0 auto 3%;
    background: linear-gradient(0deg, #d80c18 16.49%, #d80c18 81.25%);
    border-radius: 100px;
    position: relative;
    animation: btnup 3s ease-in-out infinite;
    overflow: hidden;
}

.yoyaku_btn a{
    position:  relative;
    overflow: hidden;
}
.yoyaku_btn a::after {
    content: '';
    position: absolute;
    top: 10%;
    left: -20%;
    width: 50px;
    height: 70%;
    transform: scale(2) rotate(20deg);
    background-image: linear-gradient(100deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, .5) 100%, rgba(255, 255, 255, 0) 0%);
    animation: kirakira 2.5s ease-in-out infinite;
  }
  @keyframes kirakira {
    from { left: -5%; opacity:0} 10% { left: 105%; opacity:10} 100% { left: 105%; opacity:100}
  }
  @keyframes btnup {
    from, 100%{transform: scale(1);}  50%{ transform: scale(1.075);}
  }

.yoyaku_btn p{font-size: var(--font-36); position: relative;}
.salon_btn p{font-size: var(--font-28); position: relative;}

.yoyaku_btn p::before, .salon_btn p::before{
    content: '';
  width: 15px;
  height: 15px;
  border: 0;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: 7%;
  bottom: 0;
  margin: auto;
}

.salon_btn{
    width: 60%;
    max-width: 500px;
    margin: 0 auto;
    background-color:#bb9f5b ;
    border-radius: 100px;
}

.nayami{ margin: 5% 0 0;}

.tbc_message{
    width: 90%; max-width: 980px;margin: 0 auto;
    text-align: center; font-size: var(--font-44);
    padding: 3% 0 5%;}
.tbc_message .fnt_red{font-size: 46px;}


/* PLAN */

.body_plan_text{
    text-align: center; font-size: var(--font-28); background: url(../images/body/red_bg.webp) left/cover no-repeat;
    color: #fff;
    padding: 3% 0;
    line-height: 1.5;
}

.body_plan .wrapper{padding: 3% 0; }

.body_plan_course{
    border: solid 1px var(--fnt-red);
}

.body_plan_course:first-child{
    margin-bottom: 50px;
}

.body_plan_course:nth-child(2){
    margin-bottom: 30px;
}

.body_plan_cource_ttl{background-color: #db3843; color: #fff; text-align: center; font-size: var(--font-28); padding: 10px 0;}
.body_plan_cource_desc{padding: 2% 0 3%;}
.body_plan_cource_desc .att{color: var(--fnt-red); text-align: center; font-size: var(--font-22); margin-top: 3%;}
.body_plan_cource_desc picture{width: 80%; margin:  0 auto; display: block;}

.body_plan_cource_desc .attend{
    text-align: right;
    width: 90%;
    margin-top: 10px;
}


/* technique */
.technique{background: #fdf8ed;}
.technique_intro .ttl{border-bottom: 1px solid #bb9f5b; text-align: center; width: 70%; margin: 0 auto; font-size: var(--font-30); padding-bottom: 10px;}
.technique_intro_con{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 20px;
    margin-top: 20px;
}
.technique_intro_con_text{font-size: var(--font-22); line-height: 1.8; width: 70%;}
.technique_intro_con_img{width: 30%;}
.technique_intro_desc{
    background-color: #fff;
    border: dashed 1px #bb9f5b;
    padding: 3%;
    font-family: 'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif; font-weight: 400;
    font-size: var(--font-18);
    line-height: 1.6;

}
.technique_intro_desc span{font-weight: 400;}

.technique_about{margin-top: 5%; background-color: #fff; text-align: center; padding-bottom: 5%;}
.technique_about h3{
    text-align: center;
    background-color:#bb9f5b;
    position: relative;
    color: #fff;
    padding: 2%;
    font-size: var(--font-24);
}

.technique_about h3::after{
    content: '';
    position: absolute;
    top: 100%;
    left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%);
    width: 0;
    height: 0;
    border-top: 30px solid #bb9f5b;
    border-left: 10vw solid transparent;
    border-right: 10vw solid transparent;
}

.technique_about_massage{
    margin-top: 5%;
    font-size: var(--font-18);
    line-height: 1.6;
}
.technique_about_massage span{font-size: var(--font-28);}
.technique_about_img{
    width: 70%;
    margin: 30px auto;
}

.technique_about_text_sub{
    font-size: var(--font-22);
    color: var(--fnt-brown);
    margin-bottom: 1%;
}

.technique_about_text_desc{font-size: var(--font-18);}



/* STEP */
.step{background-color:#f7eff0; position: relative; margin-bottom: 7%;}
.step::after{
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 90px 50vw 0 50vw;
    border-color: #f7eff0 transparent transparent transparent;
    position: absolute;
    bottom: -90px;
    left: 0;
}
.step p{
    font-family: 'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
    font-weight: 400;
}
.step span{font-weight: 400;}
.step .ttl,.point .ttl{text-align: center; font-size: var(--font-38);margin-bottom: 4%;}

.step_item{background-color: #fff; padding: 4%;}
.step_item_ttl{
    font-size: var(--font-28);
    margin-bottom: 10px;
    font-weight: 500;
    color: var(--fnt-red);
    display: flex;
    align-items: center;
    gap: 0 20px;
    margin-bottom: 20px;
}
.step_item_ttl_img{width: 8%;}


.step_list{display: flex; flex-direction: column; gap: 30px 0;}
.step_item_desc{
    display: flex;
    gap: 0 20px;
}
.step_item_desc span{font-weight: 400;}
.step_item_desc_img{width: 30%;}

.step_item_desc_text,.step_item_desc_text_only{font-size: var(--font-20); line-height: 1.6;width: 70%;}
.step_item_desc_text_only{width: 100%;}
.step_item_desc .attend{margin-top: 20px; font-size: 1rem;}

.step_item_point{
    background-color: #bb9f5b; color: #fff;
    font-family: 'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
    font-weight: 400;
    text-align: center;
    padding: 10px;
    margin-top: 30px;
    font-size: var(--font-18);
}

.step_item_desc_flex{
    display: flex;
    gap: 0 40px;
    width: 90%;
    margin: 30px auto 0;
}
.step_item_desc_flex_box{
    width: 50%;
}

.step_item_desc_flex_box p{
    font-size: var(--font-18);
    line-height: 1.6;
    margin-top: 10px;
}

.step_item_desc_op{
    border: solid 1px #bb9f5b;
    margin: 50px 0 0;
    padding: 4%;
}

.step_item_desc_op_ttl{
    text-align: center;
    font-size: var(--font-22);
    border-bottom: 1px solid #bb9f5b;
    width: 80%;
    margin: 0 auto;
    padding-bottom: 3px;
}

.step_item_desc_op .step_item_desc_flex_arrow{
    width: 50px;
    margin-top: 25%;
}
.step_item_desc_op .step_item_desc_flex{width: 80%; margin: 40px auto 0;}



.staff_comment{
    width: 80%; max-width: 980px; margin: 0 auto;
    padding: 3% 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.staff_comment_img{width: 20%;}
.staff_comment p{width: 70%; font-size: var(--font-36); text-align: center;}
.staff_comment span{font-size: var(--font-44);}

.step_item .attend{margin-top: 20px;}



/* offer */
.offer_wrapper{
    background: url(../images/facial/fv_bg.webp) center/cover no-repeat;
    padding-bottom: 50px;
}
.offer_wrapper .attend{
    width: 90%;
    max-width: 980px;
    margin: 0 auto;

}
.offer_con{width: 90%; max-width: 980px; margin: 0 auto; padding: 3% 0;}




/* ordermade */

.ordermade{
    background-color:#bb9f5b ;
    padding: 5% 0;
}
.ordermade .wrapper{
    background: #fff;
    padding: 5% ;
}


.ttl_sub{
    text-align: center;  margin: 10px 0 30px;
    background-color: #db3843;
    color: #fff;
    text-align: center;
    font-size: var(--font-28);
    padding: 10px 0;
}


.ordermade .ttl{width: 90%; margin: 0 auto;}
.ordermade_innner{
    border: dashed 2px #d57592;
    text-align: center;
    padding: 4% 8%;
    margin-top: 5%;
}

.ordermade_innner p{
    font-size: var(--font-24);
    margin-bottom: 30px;
}

.ordermade_img{width: 90%; margin: 0 auto;}

.salon_staff{
    color: #634c15;
    text-align: center;
    font-size: var(--font-28);
}


.ordermade .package {
    margin-top: 5%;
}

.ordermade .package a{
    display: block;
    background-color: #bb9f5b;
    color: #fff;
    text-align: center;
    font-size: var(--font-22);
    padding: 1%;
    position: relative;
    width: 60%;
    margin: 0 auto;
}

.package a::after {
    content: "▼";
    font-size: 0.9em;
    transform: all .3s;
    position: absolute;
    right: 10%;
}

.package_desc{
    text-align: center;
    font-family: var(--font-sans);
    font-weight: var(--font-400);
    margin-top: 2%;
}

.package_step_list{
    margin-top: 3%;
    display: flex;
    flex-direction: column;
    gap: 30px 0;
}

.package_step_item{
    display: flex;
    gap: 0 30px;
    background-color: #fff;
    padding: 3%;
    border: 1px solid #bb9f5b;
}
.package_step_item_img{width: 35%;}
.package_step_item_desc{width: 65%;}
.package_step_item_desc_ttl{font-size: var(--font-24); color: var(--fnt-brown); font-weight: var(--font-400);}
.package .plus_img{width: 50px; margin: 0 auto;}


/* monitor */

.monitor{
    background: url(../images/body/red_bg2.webp) center/cover; padding: 5% 0;
}
.monitor .ttl{color: #fff; font-size: var(--font-38); text-align: center;  margin-bottom: 3%;}
.monitor .wrapper{background-color: #fff; padding:5% 4% ;}


.monitor_item_desc{
    display: flex;
    gap: 0 30px;
}
.monitor_item_desc .monitor_item_people{
    width: 40%;
}
.monitor_item_desc .monitor_item_chart{
    width: 60%;
}
.monitor_item_desc .chart_name{width: 99.7%; margin-bottom: 20px; display: block;}
.monitor_item_desc .chart_name.sp-only{display: none!important;}



.monitor_item_comment{
    display: flex;
    gap: 0 30px;
    align-items: center;
    border: 1px #bb9f5b solid;
    padding: 2%;
    margin: 3% 0 1%;


}
.monitor_item_comment p{width: 80%; font-family: "Kiwi Maru", serif; font-weight: 300; font-style: normal;}
.monitor_item_comment picture{width: 20%;}

.plus_key{
    background-color: #ffe6e9;
    padding: 5% 3% 0;
    margin-top: 5%;
}
.plus_key_ttl{text-align: center; font-size: var(--font-24); border-bottom: 1px solid var(--fnt-red); width: 85%; margin: 0 auto;}
.plus_key_ttl span{font-size: var(--font-30);}
.plus_key_desc{display: flex; justify-content: center; align-items: center; gap: 0 20px; margin: 2% auto 0; width: 90%;}
.plus_key_desc picture{width: 20%;}
.plus_key_desc p{width: 80%; font-family: var(--font-sans); font-weight: var(--font-400); font-size: var(--font-18); line-height: 1.6;}

.monitor_another_inner {
    margin: 5% auto;
    text-align: center;
}
.monitor_another_inner .attend{text-align: left; }
.pcg_staff {width: 70%; margin: 0 auto;}
.monitor_another_inner a {
    display: block;
    padding: 1.2%;
    color: #fff;
    font-weight: bold;
    font-size: var(--font-24);
    background: var(--fnt-red);
    position: relative;
}
.monitor_another_inner a::after {
    content: "▼";
    font-size: 0.9em;
    transform: all .3s;
    position: absolute;
    right: 10%;


}
.monitor_another_inner a.action::after { content: "▲";}
.monitor_another_inner .step_list{padding: 3% 3% 5%;}
.pull{display: none;  text-align: left;}
.monitor_another_inner .monitor_item{margin-top: 50px;}


/* course */
.course{background: #fdf8ed; }

.course_item{ background: #fff; padding: 6% 5%; border: dashed 1px #bb9f5b;}
.course_item#course1{
margin-bottom: 50px;
}
.course .body_plan_cource_desc .attend{
    text-align: left;
    margin-top: 20px;
    width: 100%;
}
.course .body_plan_cource_desc .attend_price{text-align: right; width: 85%;}

.course .body_plan_cource_desc .attend span{font-size:1rem;}
.course_advice{
    border: dashed 1px #bb9f5b;
    padding: 3%;
}
.course_advice picture{
    width: 90%;
    margin: 0 auto;
    display: block;
}

.course_point{margin-top: 5%;}
.course_point_ttl{background-color: #634c15; position: relative; color: #fff; text-align: center; padding: 3%; font-size: var(--font-24);}
.course_point_ttl::after{
    content: '';
    position: absolute;
    top: 100%;
    left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%);
    width: 0;
    height: 0;
    border-top: 30px solid #634c15;
    border-left: 8vw solid transparent;
    border-right: 8vw solid transparent;
}

.course_point_text{margin: 6% 0 3%; font-size: var(--font-20);}
.course_point_desc{display: flex;align-items: center; gap: 0 50px; justify-content: center;}
.course_point_desc_img p{text-align: center; font-family: var(--font-sans); font-weight: var(--font-400); margin-top: 5px;}
.course_point_desc_img{width: 40%;}
.course_point_desc_text{margin-top: -30px; width: 60%;}
.course_point_desc_text .becouse{font-family: var(--font-sans); font-weight: var(--font-400); font-size: var(--font-24); position: relative; display: inline-block;}

.course_point_desc_text .becouse:before, .course_point_desc_text .becouse::after{
    content: '';
    position: absolute;
    top: 50%;
    display: inline-block;
    width: 30px;
    height: 2px;
    background-color: #634c15;
    -webkit-transform: rotate(-120deg);
    transform: rotate(-120deg);

}
.course_point_desc_text .becouse::before{
    left: -50%;

}

.course_point_desc_text .becouse::after{
    right: -50%;
    -webkit-transform: rotate(-60deg);
    transform: rotate(-60deg);
}

.course_point_desc_text .course_point_desc_care{
    font-size: var(--font-20);
    margin-left: -20px;
    margin-top: 10px;
}
.course_point_desc_text .course_point_desc_care span{
    font-size: var(--font-28);
}





/* map */
 /*======area============================================================*/

 .mv_area {display: flex; width: 100%; margin: 0 auto 2%;} .mv_area video{width:100%}
 .mv_area dd{width: 48%; margin: 0 1%; overflow: hidden; border-radius: 8px;}
  /*======map============================================================*/

.map .wrapper{
    padding-top: 8%;
}

.map_inner{
    border: solid 1px #3a3012;
    position: relative;
    padding: 0 4% 5%;
}
.map .ttl{
    font-size: var(--font-36);
    text-align: center;
    margin-top: 5%;
}
.map .ttl .fnt_pink{
    font-size: var(--font-44);
}

.map_sub_ttl{
    text-align: center;
    background: #fff;
    position: absolute;
    top: -25px;
    left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%);
    font-size: var(--font-30);
    padding: 0 40px;
}

 .map_view { text-align: center;  position: relative; z-index: 5;}
 .map_comment {position: absolute; left: 10%; top: 18%; font-size: var(--font-28); text-align: center;}
 .map_comment .fnt_red{font-size: var(--font-30);}
 .map_wrap.map_2{width: 100%;}

 .sp_map{display: block;} .pc_map{display: none;}
 .mapbtn li {position: absolute; width: 11%;}
 .hokkaido {right: 10%; top: 4%;}
 .kanto {bottom: 17%; right: 22%; top: inherit;}
 .tohoku {top: 32%; right: 20%;} .hokuriku {top: 36%; right: 39%;}
 .hokuriku {top: 36%; right: 38%;} .tokyo {bottom: 14%; right: 27%; top: inherit;}
 .tokai {right: 43%;  bottom: 18%;} .chugoku {top: 50%; left: 12%;} .kansai { left: 30%; top: 47%;} .okinawa {left: 4%; bottom: 13%;} .maplink {padding: 3% 5% 5%;}
 .maplink li {border-bottom: dotted 1px #7ecbf5; font-size: 15px; color: #388dbc;}
 .maplink li a {display: block; padding: 1%; position: relative;}
 .maplink li a::after { content: " "; left: 4px; box-sizing: border-box;  width: 5px; height: 5px; border: 5px solid transparent; border-left: 5px solid #388dbc;  vertical-align: top; position: absolute; left: 95%; top: 28%;}
 figure.map_bg, .map_wrap.map_2 figure.map_bg { position: absolute; left: 5%;  top: 11%; width: 60%;  margin: 0;}
 @media (min-width: 600px) {
         .sp_map{display: none;} .pc_map{display: block;}
     }


/* TEL */

.tel_area{
    width: 80%;
    max-width: 800px;
    margin: 5% auto 5%;
    border: solid 1px #bb9f5b;
    padding: 2% 4% ;
}

.tel_area a{
    /* pointer-events: none; */
    text-decoration: none;
    color: #3a3012;
}

.telbox{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 30px;
}

.telbox_message{
    font-size: var(--font-22);
    border-right: 1px solid #634c15;
    padding-right: 20px;
}

.footer_sp{display: none;}
.tel_area .number { font-size: var(--font-30); letter-spacing: 0.05em; line-height: 1;}
.tel_area p{margin-top: 5px;}



/* footer */
.footer_attend{background-color: #f7f7f7;}
.footer_attend .attend:first-child{margin-bottom: 20px;}
.footer_attend h4{margin-bottom: 3px;}
.footer_attend .attend p{ line-height: 1.6;}

.lp_footer{
    width: 90%;
    max-width: 980px;
    margin: 0 auto;
    padding: 4% 0;
}

.lp_footer_logo{
    width: 20%;
    margin: 0 auto 20px;
}

.footer_link{
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
}

.footer_link a{
    color: #333;
    font-family: 'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
    font-weight: 400;
    position: relative;
    padding-left: 20px;
    display: inline-block;
}

.footer_link a::before{

        content: '';
        width: 6px;
        height: 6px;
        border: 0;
        border-top: solid 1px #333;
        border-right: solid 1px #333;
        transform: rotate(45deg);
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        margin: auto;
}

.footer_link a:hover{
    color: var(--fnt-pink);
}

.lp_footer .copy{
    text-align: center;
    font-family: 'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
    font-size: var(--font-14);
    font-weight: 400;
    margin-top: 5%;

}

.slide-arrow {display: none!important;}

/* タブレット用 */
@media screen and (max-width: 1024px) {
    .yoyaku_btn p{font-size: var(--font-30);}
    .nayami .ttl,.counseling h2{width: 60%;}
    .nayami_box{width: 70%;}
    .nayami_cause_text{ font-size: var(--font-20); line-height: 1.6;}
    .body_plan_text,.body_plan_cource_ttl,.ttl_sub{font-size: var(--font-20);}


    .tbc_message{font-size: var(--font-30); line-height: 1.3;}
    .tbc_message .fnt_pink{font-size: var(--font-36);}

    .body_plan .wrapper { padding: 4% 0;}
    .body_plan_course:first-child {margin-bottom: 30px;}
    .technique_intro .ttl{
        width: 90%;
        font-size: var(--font-28);
    }
    .technique_intro_con_text{font-size: var(--font-18);}
    .technique_intro_desc{font-size: 1rem;}
    .technique_about h3{font-size: var(--font-22);}

    .staff_comment{width: 90%;}
    .step_item_desc_ttl{font-size: var(--font-24);}
    .step_item_desc_text{font-size: var(--font-18);}
    .step_item_desc .attend{font-size: var(--font-14);}
    .step_list{gap: 20px;}
    .step_item_ttl{font-size: var(--font-22);}
    .step_item_desc_flex_box p{font-size: 1rem;}
    .step_item_desc_text, .step_item_desc_text_only {font-size: var(--font-18);}
    .balance_box{width: 80%;}
    .step .ttl, .point .ttl{font-size: var(--font-30);}
    .step .ttl{ margin-bottom: 30px;}
    .arrow{    margin: 4% auto;}
    .point .tbc_message{font-size: var(--font-24);}
    .tbc_message .fnt_pink{font-size: var(--font-30);}
    .point .staff_comment { width: 80%;}
    .counseling_item_desc_ttl{font-size: var(--font-24); margin-bottom: 10px;}
    .voice .ttl{font-size: var(--font-28);}
    .voice_list{margin-top: 40px;}
    .map_sub_ttl{padding: 0 30px; font-size: var(--font-24);}
    .map .ttl{font-size: var(--font-30);}
    .map .ttl .fnt_pink { font-size: var(--font-36);}
    .map_comment{font-size: var(--font-18);}
    .counseling_intro{margin-top: 1%;}
    .counseling_item{padding: 3%;}
    .tbc_message2{margin: 1% auto;}
    .ordermade_img{width: 80%;}
    .ordermade_innner p{font-size: var(--font-22);}
    .voice .ttl:before, .voice .ttl::after{ width: 80px;}
    .tel_area{width: 90%;}

    .monitor .ttl{font-size: var(--font-30);}
    .staff_comment p{font-size: var(--font-28);}
    .staff_comment span{font-size: var(--font-36);}
    .plus_key_ttl{font-size: var(--font-20); width: 95%;}
    .plus_key_ttl span{font-size: var(--font-24);}
    .plus_key_desc p{font-size: 1rem;}
    .plus_key_desc picture {width: 25%;}
    .monitor_another_inner a{font-size: var(--font-20);}
    .course_point_ttl{font-size: var(--font-20);}
    .course_point_text{font-size: var(--font-18);}
    .course_point_desc_img p{font-size: var(--font-14);}
    .course_point_desc_text .becouse{font-size: var(--font-20);}
    .course_point_desc_text .course_point_desc_care{font-size: var(--font-18);}
    .course_point_desc_text .course_point_desc_care span{font-size: var(--font-24);}
    .body_plan_cource_desc .att{font-size: var(--font-20);}
    .package_step_item_desc_ttl{font-size: var(--font-20);}
    .course .body_plan_cource_desc .attend_price{width: 100%;}


}



/* スマートフォン用 */

@media screen and (max-width: 768px) {
    .wrapper{
        width: 95%;
        padding: 9% 0;
    }

    .pc-only{display: none;}

    .attend{font-size: 9px; line-height: 1.6;}

    .flattery_area{
        background-color: rgba(236, 236, 224, .8);
        height: 60px;
        position: fixed; width:100%;  z-index: 999; bottom: 0;
    }

    .head{
        position: fixed; width:95%;  z-index: 999; bottom: 10px; top: inherit;
        left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%);
    }
    .kv{padding-bottom: 9%;}
    .kv .attend{width: 90%; margin-top: 3%;}
    .yoyaku_btn{width: 90%; margin-bottom: 5%;}
    .yoyaku_btn p{font-size: var(--font-22);}
    .yoyaku_btn p::before,.salon_btn p::before{width: 10px; height: 10px;}
    .salon_btn{width: 80%;}
    .salon_btn p{font-size: var(--font-20);}
    .btn_area{margin: 7% auto 9%;}
    .nayami_box{width: 80%;}
    .nayami .ttl, .counseling h2 {width: 90%;}
    .nayami_cause{width: 95%;}
    .nayami_cause_text{ font-size: 1rem; line-height: 1.6;}
    .nayami_cause_sample{width: 60%;}
    .nayami_cause_text{width: 100%; text-align: center;}

    .tbc_message .fnt_red{font-size: var(--font-36);}

    .arrow{width: 20%; margin: 5% auto;}
    .balance_box{width: 95%;}

    .body_plan .wrapper{padding: 6% 0;}
    .body_plan_cource_desc picture{width: 90%;}
    .body_plan_cource_desc{padding: 2% 0 4%;}
    .body_plan_course:nth-child(2){    margin-bottom: 10px;}
    .body_plan_course:first-child{margin-bottom: 25px;}


    .technique_intro_con{align-items: flex-start; margin-bottom: 20px;}
    .technique_intro_desc{font-size: var(--font-14);}

    .technique_about{margin: 7% 0 0;}
    .technique_about h3{font-size: var(--font-18); line-height: 1.4;}
    .technique_about h3::after{border-top: 15px solid #bb9f5b;}
    .technique_about_massage{font-size: 1rem;}
    .technique_about_massage span { font-size: var(--font-24);}
    .technique_about_img{width: 95%; margin: 20px auto;}
    .technique_about_text_sub{font-size: var(--font-20);}
    .technique_about_text{padding: 0 2%;}
    .technique_about_text_desc{font-size: 1rem; text-align: left;}
    .step .ttl, .point .ttl{font-size: var(--font-24); margin-bottom: 20px; }
    .step_item{padding: 5% 4%;}
    .step_item_img,.step_item_desc{width: 100%;}
    .step .ttl::after,.point .ttl::after{width: 20%;}
    .step_item_desc_ttl{margin: 10px 0 5px; font-size: var(--font-20);}
    .step_item_desc_text{font-size: 1rem;}
    .step_item_desc .attend{font-size: 12px; margin-top: 10px;}

    .step_item_ttl_img{width: 13%;}
    .step_item_ttl{font-size: var(--font-18); gap: 0 8px;}
    .step_item_ttl h3{width: 87%; line-height: 1.3;}
    .step_item_desc{gap: 0 10px;}
    .step_item_desc_img{width:50% ;}
    .step_item_desc_text{width: 70%;}
    .step_item_point{font-size: 1rem; line-height: 1.4; padding: 5px;}
    .step_item_desc_text, .step_item_desc_text_only{font-size: 1rem;}
    .step_item_desc_flex{width: 100%; gap: 0 20px; margin: 20px auto 0;}
    .step_item_desc_flex_box p{font-size: 13px;}
    .step_item .attend{margin-top: 10px;}
    .step_item_desc_sub{margin-top: 10px;}
    .step_item_desc_op{margin: 20px 0 0;}
    .step_item_desc_op_ttl{width: 100%; font-size: var(--font-18); line-height: 1.5;}
    .step_item_desc_op .step_item_desc_flex{width: 95%; margin-top: 20px; gap: 0 10px;}
    .step_item_desc_op .step_item_desc_flex_arrow {width: 25px;}
    .step::after{
        border-width: 40px 50vw 0 50vw;
        bottom: -40px;
    }
    .staff_comment_img{width: 25%;}

    .staff_comment{width: 100%; }

    .ttl_area p{font-size: var(--font-18);}


    .monitor .ttl{font-size: var(--font-22);}
    .monitor_item_comment{flex-direction: row-reverse; gap: 0 10px; align-items: flex-start; padding: 5% 3%; margin-top: 20px;}
    .monitor_item_comment picture{width: 40%; margin-top: 10px;}

    .monitor_item_desc{ flex-direction: column; gap: 20px 0;}
    .monitor_item_desc .monitor_item_people{width: 90%; margin: 0 auto;}
    .monitor_item_desc .monitor_item_chart{width: 100%;}
    .plus_key{margin: 7% 0;}
    .plus_key_ttl{font-size: var(--font-18); }
    .plus_key_ttl span{font-size: var(--font-22); line-height: 1.3;}
    .plus_key_desc{width: 100%; gap: 0 10px;}
    .plus_key_desc picture{width: 50%; margin-left: -10px; }

    .course_item{padding: 6% 4%;}
    .course_item .body_plan_cource_desc picture{width: 100%;}
    .course .body_plan_cource_desc .attend span{font-size: var(--font-12);}
    .course .body_plan_cource_desc .attend{margin-top: 10px;}
    .course_advice{border: none; padding: 0; margin-top: 10px;}
    .course_advice picture{width: 100%;}
    .course_point_ttl{font-size: 15px; line-height: 1.4; padding: 3% 1%;}
    .course_point_ttl::after{border-top: 15px solid #634c15;}
    .course_point_text{font-size: 1rem;}

    .course_item#course1{margin-bottom: 30px;}
    .body_plan_cource_desc .att{font-size:1rem;}

    .monitor_item_desc .chart_name.pc-only{display: none!important;}
    .monitor_item_desc .chart_name.sp-only{display: block!important; margin-bottom: 0;}
.slick-slide{padding: 0 5px; position: relative;}

.slide-arrow {
    display: block!important;
    cursor: pointer;
    margin: auto;
    position: absolute;
    top:3%;
    width: 8%;
    z-index: 1;
  }
  .prev-arrow {
    left: -20px;
  }
  .next-arrow {
    right: -20px;
  }






    .offer_con{padding: 0; width: 100%;}
    .offer_wrapper .attend{margin-top: 3%;}
    .offer_wrapper{padding-bottom: 9%;}

    .package a{font-size: var(--font-18); padding: 3%;}
    .package a::after{right: 5%;}
    .package .step_list{padding: 6% 3%;}

    .counseling{margin-bottom: -25%;}
    .counseling_item{margin-top: 5%; padding: 7% 3%;}
    .counseling_item_con{flex-direction: column-reverse;}
    .counseling_item_desc{width: 100%; text-align: center;}
    .counseling_item_desc_ttl{font-size: var(--font-22); margin-top: 0;}
    .counseling_item_desc_text{font-size: 1rem;}
    .counseling_item_img{width: 80%; margin: 20px auto ;}
    .counseling_hada{ gap: 0 10px; margin-top: 0;}
    .counseling_hada_img{width: 30%;}
    .counseling_hada_desc{font-size: var(--font-14);}

    .course_point_desc{flex-direction: column-reverse;}
    .course_point_desc_text{margin: 0 ; width: 100%; text-align: center;}
    .course_point_desc_text .course_point_desc_care{margin: 0; font-size: 1rem;}
    .course_point_desc_text .course_point_desc_care span{font-size: var(--font-20);}
    .course_point_desc_text .becouse{font-size: 1rem;}
    .course_point_desc_text .becouse:before, .course_point_desc_text .becouse::after{
        height: 1px;
        width: 20px;
    }
    .course_point_desc_img{width: 100%; display: flex; gap:0 10px; margin-top: 10px;}
    .course_point_desc_img div{width: 40%;}
    .course_point_desc_img p{width: 60%; text-align: left;}
    .package_desc{font-size: 11px; letter-spacing: -0.5px;}




    .ordermade{padding: 9% 0;}
    .ordermade .wrapper{padding: 5% 3% 7%;}
    .sub_ttl_ashirai{width: 50px;}
    .ttl_sub{font-size: var(--font-14); margin: 10px 0;}
    .ordermade .ttl{width: 90%;}
    .ordermade_innner{padding: 4%; border: dashed 1px #d57592;}
    .ordermade_innner p{font-size: var(--font-14); margin-bottom: 20px;}
    .ordermade_img{width: 95%;}
    .salon_staff{font-size: var(--font-18);}
    .ordermade .attend{margin: 20px 0;}
    .ordermade .package a{width: 90%; font-size: 1rem;}

    .package_step_item{ flex-direction: column-reverse; padding: 5% 3%;}
    .package_step_item_desc{width: 100%; text-align: center;}
    .package_step_item_img{width: 80%; margin: 10px auto 0;}
    .package .plus_img{width: 30px;}
    .package_step_list{gap: 20px 0;}
    .package_step_item_desc_ttl{margin-bottom: 5px;}

    .map .wrapper{padding: 10% 0;}
    .map_sub_ttl{font-size: 1rem; padding: 5px 0; width: 250px; top: -3%;}
    .map .ttl{font-size: var(--font-18); margin-top: 7%;}
    .map .ttl .fnt_pink{font-size: var(--font-20);}
    .map_comment{top: 15%; left: 5%; text-align: left;}
    .map_view{margin: 10% 0 5%;}
    .map_comment .fnt_red{font-size: var(--font-18);}
    .map_inner{padding: 0 3% 5%;}

    .number_under{font-size: var(--font-14);}
    .telbox_message{font-size: var(--font-18);}
    .tel_area{width: 95%; padding: 5%; margin: 9% auto;}



    .lp_footer{padding: 7% 0;}
    .lp_footer_logo{width: 50%; max-width: 200px; margin-bottom: 7%;}
    .footer_link{
        flex-direction: column; gap: 5px;
        align-items: flex-start;
        margin: 5px;
        font-size: var(--font-14);
    }

    .foote_line{
        border-bottom: 1px solid #aeaeae;
        width: 100%;
    }


    .lp_footer .copy{margin: 10% 0 18%;}

}


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

    .sp-only{display: block;}
    .counseling_hada_img{width: 40%;}

    .telbox{flex-direction: column;}
    .telbox_message{border-right: none; padding: 0;  border-bottom: 1px solid #a5a5a5;}
    .telbox_num{text-align: center;}

    .tel_area p{margin-bottom: 5px;}
    .voice_item_text{font-size: var(--font-14);}
    .map_comment{font-size: var(--font-14); }
    .nayami_cause{width: 95%; flex-direction: column; padding:7% 5% ;}
    .nayami_cause_text{margin-top: 5%;}
    .nayami_cause_sample {
        width: 80%;
    }

    .tbc_message{font-size: var(--font-22); line-height: 1.4; padding: 5% 0;}
    .body_plan_text, .body_plan_cource_ttl, .ttl_sub{font-size: 15px; line-height: 1.7; padding: 5px 0;}

    .technique_intro .ttl{
        width: 100%;
        font-size: 17px;
        padding-bottom: 0;
    }

    .technique_intro_con_text{font-size: var(--font-14); line-height: 1.6;}
    .staff_comment p{font-size: var(--font-20);}
    .staff_comment span{font-size: var(--font-24);}
    .monitor_item_comment p{font-size: var(--font-14);}
    .plus_key_desc p{font-size: var(--font-14);}












}