@charset "UTF-8";
/* CSS Document */
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

.fade-box {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-box.is-visible {
  opacity: 1;
  transform: translateY(0);
}

html { font-size: 62.5% !important; }

a{
	transition: 0.5s;
}
a:hover{
	filter: opacity(0.5);
	
}
.en_btn_block{
	width:100%;
	margin-top:min(20px, calc(calc(20 / 750) * 100vw));
	padding:min(25px, calc(calc(25 / 750) * 100vw)) 0;
	background:linear-gradient(180deg,#c6c6c6, #e7e7e7);
	opacity:1;
	
	text-align:center;
}
.mt0{margin-top:0;}
.en_btn_block a{
	display:block;
	width:80%;
	margin:0 auto;
	padding:min(15px, calc(calc(15 / 750) * 100vw)) 0;
	background:linear-gradient(180deg,#828282, #a7a7a7);
	border:solid 1px #FFF;
	
	text-align:center;
	font-size:min(30px, calc(calc(30 / 750) * 100vw));
	color:#FFF;
}
.en_btn_block a:hover{
	opacity:0.5;
}
/* ----------------------------------------
   font size
------------------------------------------ */
.fontS {
    font-size: min(24px, calc(calc(24 / 750) * 100vw));
}
.fontM {
    font-size: min(28px, calc(calc(28 / 750) * 100vw));
}
.fontL {
    font-size: min(36px, calc(calc(36 / 750) * 100vw));
}

html, body {
	height: 100%;
	width: 100%;
}

body {
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	color:var(--txtcolor)!important;
	line-height:1.785;
	letter-spacing:0;
	animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}


body{
    --maincolor:#7b674f;
	--txtcolor:#614d35;
}

main{
	width:100vw;
	margin:0 auto!important;
	background-color:#f9f8f0;
}
main img{
	width:100%;
}
.white{
	background:url("../image/bk_white.png") repeat-x left top;
	background-color:#FFF;
	
}
.gray{
	background:url("../image/bk_gray.png") repeat-x left top;
	background-color:#f4f4ec;
}
.hr{
	display:block;
	width:100%;
	height:min(3px, calc(calc(3 / 750) * 100vw));
	background:url("../image/t_line.png") repeat-x center top;
	background-size:100%;
	margin:min(30px, calc(calc(30 / 750) * 100vw)) 0;
}
/* Page Top ----------------*/

#page_top{
  	position:fixed; /*固定*/
  	bottom:30px; /*場所を右下に移動*/
  	right:10px; /*場所を右下に移動*/
  	display:block; /*aタグをblock要素に変更*/
  	width: min(95px, calc(calc(95 / 750) * 100vw));
  	height: min(95px, calc(calc(95 / 750) * 100vw));
    z-index:10;
}

#page_top .pt{
	display:none;
	
	width: min(95px, calc(calc(95 / 750) * 100vw));
  	height: min(95px, calc(calc(95 / 750) * 100vw));
	background:url(../image/pt.png) no-repeat center bottom;
	background-size:cover;
    
    text-indent: -9999px;
	
	transition: opacity 0.3s;
}
#page_top .pt a:hover{
  	opacity:1;
}
.js-fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.js-fade-in.is-visible {
  opacity: 1;
  transform: translateY(0);
}
@media screen and (min-width:768px) {
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
	}
	body { background-color:#e5e5d7;}
	main{
		width:750px!important;
		box-shadow: 0px 0px 9px -6px rgba(0,0,0,1.0);
	  }
	footer{width:750px!important;
		margin:0 auto;}
	a[href^="tel:"]{
		pointer-events: none;
	}
}

/* ----------------------------------------
   main
------------------------------------------ */
#main{
	position:relative;
	width:100%;
}
#main .link_box{
	position:absolute!important;
	right: 0;
	left: 0;
	bottom:14.5%;
	
	margin: 0 auto;
	width:81%;
	display:flex;
	justify-content: space-between!important;
	z-index:10!important;
}
#main .link_box span{
	width:46.5%!important;
	display:block;
}
#main .link_box span a:hover{
	filter:brightness(130%);
}
/* ----------------------------------------
   concept
------------------------------------------ */
#concept01{
	margin:0 auto;
}
#concept02{
	margin:0 auto;
}

/* ----------------------------------------
   uncor
------------------------------------------ */
#uncor_box{
	width:100%;
	padding:4% 0 3%;
	background:#7b674f;
}
#uncor_box ul{
	width:100%;
	display:flex;
	justify-content: space-between;
}
#uncor_box li{
	width:33.33%!important;
	display:block;
	padding:0 5.7%;
	display:flex;
	align-items:center;
	justify-content: center;
}
#uncor_box li:nth-child(2n){
	border-left:1px solid #FFF;
	border-right:1px solid #FFF;
	padding:0 5.5%!important;
}
#uncor_box li img{
	width:auto!important;
	max-height:183px!important;
}
#uncor_box li img.b01{
	width:86%!important;
	margin:0 auto;
}
/* ----------------------------------------
   INDIBA
------------------------------------------ */
#indiba{
	background-color:#f9f8f0;
	margin:0;
	padding:0;
}
#indiba h2{
	width:100%;
}
#indiba .read{
	display:block;
	margin:min(30px, calc(calc(30 / 750) * 100vw));
	
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
	font-style: normal;
	font-size: min(30px, calc(calc(30 / 750) * 100vw));
	
	line-height:1.73;
}
/* ----------------------------------------
   SERVICE
------------------------------------------ */
.sv_box{
	margin:min(20px, calc(calc(20 / 750) * 100vw)) min(30px, calc(calc(30 / 750) * 100vw)) min(40px, calc(calc(40 / 750) * 100vw));
	/*padding-bottom:min(20px, calc(calc(20 / 750) * 100vw));*/
	display:block;
	background-color:#FFF;
	
	box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.25)!important;
}
.pb20{
	padding-bottom:min(20px, calc(calc(20 / 750) * 100vw));
}

.sv_box h3{
	display:block;
	margin:0;
	padding:0;
}

.sv_box h4{
	display:block;
	padding:min(35px, calc(calc(35 / 750) * 100vw)) min(35px, calc(calc(35 / 750) * 100vw)) 0;
	
	font-size:min(33px, calc(calc(33 / 750) * 100vw));
	font-weight:400;
	text-align:center;
	line-height:1.63;
}
.sv_box .photo{
	display:block;
	margin:min(30px, calc(calc(30 / 750) * 100vw));
}
.sv_box span{
	display:block;
	margin:0 min(30px, calc(calc(30 / 750) * 100vw));
	line-height:1.78;
}
.sv_box .caution{
	color:#897F74;
}
/* ----------------------------------------
   FLOW
------------------------------------------ */
.flow_block{
	width:100%;
	padding:min(60px, calc(calc(60 / 750) * 100vw)) min(30px, calc(calc(30 / 750) * 100vw)) min(50px, calc(calc(50 / 750) * 100vw));
}
.flow_block h3{
	display:block;
	width:53.3%;
	margin:0 auto;
}
.flow_block p{
	display:block;
	margin-top:min(22px, calc(calc(22 / 750) * 100vw));
}
/* ----------------------------------------
   STRWNGTH
------------------------------------------ */
.strengths_block{
	background:url("../image/bk_strengths.jpg") no-repeat center top;
	background-size:100%;
	padding:min(50px, calc(calc(50 / 750) * 100vw)) min(30px, calc(calc(30 / 750) * 100vw)) min(20px, calc(calc(20 / 750) * 100vw));
}
.strengths_block h3{
	width:77.3%;
	margin:0 auto min(10px, calc(calc(10 / 750) * 100vw));
}
.strengths_block ul{
	margin:0 auto;
	padding:0;
}
.strengths_block li{
	width:100%;
	margin:min(30px, calc(calc(30 / 750) * 100vw)) auto;
	padding:min(30px, calc(calc(30 / 750) * 100vw)) min(50px, calc(calc(50 / 750) * 100vw)) min(50px, calc(calc(50 / 750) * 100vw));
	background:#FFF;
	box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.25)!important;
}
.strengths_block li h4{
	width:100%;
	display:block;
	
	text-align:center;
	font-size: min(30px, calc(calc(30 / 750) * 100vw));
	font-weight:500;
}
.strengths_block li h4::before{
	content:'';
	display:block;
	width:min(47px, calc(calc(47 / 750) * 100vw));
	height:min(40px, calc(calc(40 / 750) * 100vw));
	background:url("../image/crown.png") no-repeat center top;
	background-size:100%;
	
	margin:0 auto min(10px, calc(calc(10 / 750) * 100vw));
}
.strengths_block li h4::after{
	content:'';
	display:block;
	width:100%;
	height:min(3px, calc(calc(3 / 750) * 100vw));
	background:url("../image/t_line.png") repeat-x center top;
	background-size:100%;
	
	margin:min(30px, calc(calc(30 / 750) * 100vw)) 0 ;
}
/* ----------------------------------------
   VOICE
------------------------------------------ */
.voice_block{
	background:url("../image/bk_voice.jpg") no-repeat center top;
	background-size:cover;
	padding:min(45px, calc(calc(45 / 750) * 100vw)) min(30px, calc(calc(30 / 750) * 100vw)) min(50px, calc(calc(50 / 750) * 100vw));
}
.voice_block h3{
	width:74%;
	margin:0 auto;
}
.voice_block .box{
	width:100%;
	background-color:#FFF;
	border-radius:4px;
	padding: min(12px, calc(calc(12 / 750) * 100vw));
}
.voice_block .inner-box{
	border-radius:2px;
	border:solid min(2px, calc(calc(2 / 750) * 100vw)) var(--maincolor);
	padding:min(40px, calc(calc(40 / 750) * 100vw));
}

/* ----------------------------------------
   PRICE
------------------------------------------ */
.price_block{
	width:100%;
	padding:min(60px, calc(calc(60 / 750) * 100vw)) min(30px, calc(calc(30 / 750) * 100vw)) min(50px, calc(calc(50 / 750) * 100vw));
}
/* ----------------------------------------
   FAQ
------------------------------------------ */
.faq_block{
	width:100%;
	padding:min(60px, calc(calc(60 / 750) * 100vw)) min(30px, calc(calc(30 / 750) * 100vw)) min(50px, calc(calc(50 / 750) * 100vw));
}
.faq_block h3{
	width:100%;
	margin:0 auto min(20px, calc(calc(20 / 750) * 100vw));
}

.accordion-content {
	overflow: hidden;
	max-height: 0;
	transition: max-height 0.3s ease;
}

.js-accordion-toggle {
	position: relative;
	display: block;
	width: 100%;
	padding: min(20px, calc(calc(20 / 750) * 100vw)) 0;
	
	background-color: #FFF;
	border-top: solid 1px var(--txtcolor);
	border-left: solid 1px var(--txtcolor);
	border-right: solid 1px var(--txtcolor);
	font-size: min(28px, calc(calc(28 / 750) * 100vw));
	text-align: center;
	transition: 0.3s ease;
}

.js-accordion-toggle:hover {
	background-color: #FFF;
}

.js-accordion-toggle.is-open {
	background-color: #FFF;
}
.js-accordion-toggle::after {
	content: "+";
	position: absolute;
	right: 0.5em;
	top: 50%;
	transform: translateY(-50%);
	font-size: min(60px, calc(calc(60 / 750) * 100vw));
	color:#897f74;
	font-weight:100;
	transition: transform 0.3s ease, content 0.3s ease;
	
}

/* 開いたときは − に変更 */
.js-accordion-toggle.is-open::after {
	content: "−"; /* ハイフンより少し長い全角マイナス */
}

.accordion-content {
	background-color: #FFF;
	border-left: 1px solid var(--txtcolor);
	border-right: 1px solid var(--txtcolor);
	border-bottom: 1px solid var(--txtcolor);
	
	margin: 0 0 min(20px, calc(calc(20 / 750) * 100vw)) 0;
}

.accordion-content .box{
	border-top:solid 1px var(--txtcolor);
	padding:min(30px, calc(calc(30 / 750) * 100vw));
}
.accordion-content .box .caution{
	font-size:min(22px, calc(calc(22 / 750) * 100vw));
	display:block;
	text-align:center!important;
}
.accordion-content .box .caution b{
	color:#e28b89;
	font-weight:500;
}
.accordion-content .box .q{
	margin:min(25px, calc(calc(25 / 750) * 100vw)) 0 min(15px, calc(calc(15 / 750) * 100vw));
	font-weight:500;
	display:block;
}
.accordion-content .box .q::before{
	content:"Q";
	font-size: min(30px, calc(calc(30 / 750) * 100vw));
	color:#FFF;
	font-weight:300;
	background-color:var(--maincolor);
	padding:0 min(15px, calc(calc(15 / 750) * 100vw)) min(7px, calc(calc(7 / 750) * 100vw));
	margin-right:min(10px, calc(calc(10 / 750) * 100vw));
}
.accordion-content .box li{
	margin-bottom:min(20px, calc(calc(20 / 750) * 100vw));
}
/* ----------------------------------------
   INDIBA SALON
------------------------------------------ */
.salon{
	text-align:center!important;
	font-size: min(26px, calc(calc(26 / 750) * 100vw));
}
.salon h2{
	display:block;
	width:46.5%!important;
	margin:0 auto;
	padding:min(40px, calc(calc(40 / 750) * 100vw)) 0 min(30px, calc(calc(30 / 750) * 100vw));
}
.salon h4{
	width:80%!important;
	font-size:min(30px, calc(calc(30 / 750) * 100vw));
	font-weight:500;
	padding:min(10px, calc(calc(10 / 750) * 100vw));
	
	border-top:solid 1px var(--maincolor);
	border-bottom:solid 1px var(--maincolor);
	
	margin:0 auto min(20px, calc(calc(20 / 750) * 100vw));
}
.salon .tel{
	display:block;
	margin:min(10px, calc(calc(10 / 750) * 100vw)) auto min(25px, calc(calc(25 / 750) * 100vw));
	font-family: "Shippori Mincho", serif;
	font-weight: 400;
	font-style: normal;
	font-size:min(60px, calc(calc(60 / 750) * 100vw));
	letter-spacing:0.2rem;
	line-height:1.2;
}
.salon .entry{
	display:block;
	width:50%;
	margin:0 auto min(50px, calc(calc(50 / 750) * 100vw));
}
.salon .caution{
	display:block;
	margin:min(30px, calc(calc(30 / 750) * 100vw)) min(30px, calc(calc(30 / 750) * 100vw)) min(50px, calc(calc(50 / 750) * 100vw));
	line-height:1.6;
}
.salon .map{
	margin-top:min(10px, calc(calc(10 / 750) * 100vw));
	padding:0 min(20px, calc(calc(20 / 750) * 100vw)) min(10px, calc(calc(10 / 750) * 100vw));
	border:solid 1px var(--maincolor);
}


/* ----------------------------------------
   美BODY MAKE
------------------------------------------ */
#bodymake .read{
	display:block;
	padding:min(80px, calc(calc(80 / 750) * 100vw)) min(45px, calc(calc(45 / 750) * 100vw)) min(95px, calc(calc(95 / 750) * 100vw));
	
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
	font-style: normal;
	font-size: min(30px, calc(calc(30 / 750) * 100vw));
	
	text-align:left;
	line-height:1.7;
	
	background:url("../image/bk_bodymake.jpg") no-repeat left top;
	background-size:cover;
}
#bodymake .read h4{
	font-weight:bold;
	display:block;
	padding-bottom:min(10px, calc(10 / 750) * 100vw);
	border-bottom:solid 1px var(--maincolor);
	margin-bottom:min(15px, calc(15 / 750) * 100vw);
}
#bodymake .service{
	background:#FFF;
	padding:min(30px, calc(calc(30 / 750) * 100vw)) 0;
}
/* ----------------------------------------
   FLOW
------------------------------------------ */
#bodymake .flow_block{
	width:100%;
	padding:min(60px, calc(calc(60 / 750) * 100vw)) min(30px, calc(calc(30 / 750) * 100vw)) min(50px, calc(calc(50 / 750) * 100vw));
}
#bodymake .flow_block h3{
	display:block;
	width:52.8%;
	margin:0 auto;
}
#bodymake .flow_block p{
	display:block;
	margin-top:min(22px, calc(calc(22 / 750) * 100vw));
}
/* ----------------------------------------
   BODYMAKE SALON
------------------------------------------ */
.salon h3{
	display:block;
	width:75.86%!important;
	margin:0 auto;
	padding:min(80px, calc(calc(80 / 750) * 100vw)) 0 min(30px, calc(calc(30 / 750) * 100vw));
}
.salon .caution{
	display:block;
	margin:min(30px, calc(calc(30 / 750) * 100vw)) min(30px, calc(calc(30 / 750) * 100vw)) min(50px, calc(calc(50 / 750) * 100vw));
	line-height:1.6;
}
.salon .sns_box{
	display:flex;
	justify-content: space-between;
	width:27%;
	margin:0 auto;
	padding-bottom:min(70px, calc(calc(70 / 750) * 100vw));
	align-items:center;
}
.salon .sns_box span{
	width:42%;
	margin:0 auto;
	padding:0;
}
/* ----------------------------------------
   FOOTER
------------------------------------------ */
footer{
	width:100%;
	background-color:var(--maincolor);
	padding:min(25px, calc(calc(25 / 750) * 100vw)) 0 min(30px, calc(calc(30 / 750) * 100vw))!important;
	
	font-size: min(26px, calc(calc(26 / 750) * 100vw));
	font-weight:300;
	color:#FFF;
	text-align:center;
	line-height:0;
}



/* 20251202 Add */
#columnBtn {
	width: 220px;
	position: fixed;
	bottom: 25px;
	left: 25px;
}

#columnBtn a {
	display: block;
	width: 100%;
	line-height: 1em;
	text-decoration: none;
	color: #fff;
	position: relative;
	border-radius: 9999px;
	padding: 1em 0;
	font-size: 1.1em;
	background: #7B674F;
	text-align: center;
}

#columnBtn a::after {
	content: "";
	display: block;
	background: url("../image/side_arrow_wh.svg") center center no-repeat;
	background-size: contain;
	width: 11px;
	height: 11px;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1em;
	margin: auto;
}

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

	#columnBtn {
		bottom: 30px;
		left: 10px;
	}

}









