*{
	background-repeat: no-repeat;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

:root{
	--c-main: #9D894A;
	--c-sub: #6C1D29;
	--text: #333333;
	--gothic: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, "ＭＳ Ｐゴシック", sans-serif;
	--mincho: "游明朝","Yu Mincho",YuMincho,"Hiragino Mincho ProN" , "Noto Serif JP", serif;
}

html{
	font-size: 62.5%;
	scroll-behavior: smooth;
}

body{
	background-color: #F8F6F0;
	color: var(--text);
	font-family: var(--gothic);
	font-size: 1.6rem;
}

table{
	border-collapse: collapse;
	border-spacing: 0;
}

ul,
ol{
	list-style: none;
}

li{
	position: relative;
}

input,
textarea{
	font-family: var(--gothic);
}

button{
	cursor: pointer;
}

a{
	color: var(--c-main);
	display: inline-block;
	position: relative;
	text-decoration: none;
	transition: 0.2s;
}

img{
	display: block;
	height: auto;
	max-width: 100%;
	transition: 0.4s;
}

::before,
::after{
	transition: 0.2s;
}


.mincho{
	font-family: var(--mincho)
}

.bold{
	font-weight: 700;
}

.center{
	text-align: center;
}

.right{
	text-align: right;
}


.flex_box{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.inner{
	margin-left: auto;
	margin-right: auto;
	max-width: 1200px;
	width: calc(100% - 30px);
}


.link_btn a{
	background-color: var(--c-main);
	border-radius: 5px;
	color: #fff;
	display: block;
	font-family: var(--mincho);
	font-size: 1.8rem;
	max-width: 35rem;
	padding: 18px 30px 18px 20px;
	text-align: center;
	width: 100%;
}

.link_btn a:hover{
	background-color: #C9B574;
}

.link_btn a::after{
	border-top: solid 3px #fff;
	border-right: solid 3px #fff;
	content: '';
	height: 8px;
	margin-top: -2px;
	position: absolute;
	right: 20px;
	top: 50%;
	transform: rotate(45deg) translateY(-50%);
	width: 8px;
}

.link_btn.center a{
	margin-left: auto;
	margin-right: auto;
}

.sp{
	display: none;
}

#page_top{
	height: 80px;
	position: fixed;
	right: 15px;
	bottom: 15px;
	width: 80px;
	z-index: 10;
}

#page_top a{
	background-color: var(--c-sub);
	border: 2px solid #fff;
	border-radius: 999px;
	display: block;
	height: 100%;
	width: 100%;
}

#page_top a::before{
	border-top: solid 6px #fff;
	border-right: solid 6px #fff;
	content: '';
	height: 15px;
	margin-top: -7.5px;
	margin-left: 4px;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: rotate(-45deg) translate(-50%,-50%);
	width: 15px;
}

/*--- ↓ under 1024px ↓ ---------------------------------*/
@media screen and (max-width: 1024px){
	#page_top{
		bottom: 80px;
	}
}


/*--- ↓ under 767px ↓ ---------------------------------*/
@media screen and (max-width: 767px) {
	.pc{
		display: none !important;
	}
	
	.sp{
		display: block;
	}
	
	#page_top{
		height: 60px;
		width: 60px;
	}
	
	#page_top a::before{
		border-top: solid 3px #fff;
		border-right: solid 3px #fff;
		height: 10px;
		margin-top: -5px;
		margin-left: 2px;
		width: 10px;
	}
}




/*========================================

header

========================================*/
header{
	background-color: #FCFCFC;
	padding-bottom: 25px;
	position: sticky;
	top: 0;
	width: 100%;
	z-index: 100;
}

header .inner{
	position: relative;
}

.header_inner{
	align-items: center;
	display: flex;
	justify-content: space-between;
	padding-bottom: 30px;
	
}

.header_inner .header_logo,
.footer_logo{
	color: var(--c-main);
}

.header_inner .header_logo a p,
.footer_logo a p{
	font-size: clamp(1.2rem,1.23vw,1.6rem);
}

.header_inner .header_logo .logo,
.footer_logo .logo{
	font-size: clamp(2rem,3.08vw,4rem);
	font-weight: 400;
	letter-spacing: 0.02em;
	line-height: 1.2em;
}


.header_inner .tel{
	color: var(--c-sub);
}

.header_inner .tel span{
	font-size: 125%;
}

.header_inner nav{
	align-items: center;
	display: flex;
	margin-top: 10px;
}

.header_nav ul{
	display: flex;
	justify-content: space-between;
}

.header_nav ul li{
	border-left: 1px solid var(--c-main);
	text-align: center;
	width: 20%;
}

.header_nav ul li:last-child{
	border-right: 1px solid var(--c-main);
}

.header_nav ul li a{
	color: var(--text);
	font-size: clamp(1.4rem,1.23vw,1.6rem);
	font-weight: 500;
	padding: 5px 2px;
}

.header_nav ul li a:hover{
	color: var(--c-main);
}

.header_nav ul li a:hover::before{
	background-color: var(--c-main);
	content: "";
	height: 2px;
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	width: 100%;
}

.font-size_controls{
	align-items: center;
	display: flex;
	font-weight: 500;
	margin-left: clamp(30px,4.17vw,5rem);
}

.font-size_controls button{
	background-color: #fff;
	border: none;
	font-family: var(--gothic);
	font-weight: 400;
	padding: 3px 14px;
}

.font-size_controls button.is-active{
	background-color: var(--c-sub);
	color: #fff;
}

.font-size_controls button:first-of-type{
	border-radius: 10px 0 0 10px;
	margin-left: 14px;
}

.font-size_controls button:last-of-type{
	border-radius: 0 10px 10px 0;
	margin-right: 15px;
}

#fix-cta{
	display: none;
}

/*--- ↑ over 1025px ↑ ---------------------------------*/
@media screen and  (min-width: 1025px) {
	.hamburger_only_menu{
		display: none;
	}
	
	#main-header.is-scrolled{
    	animation: headerSlideDown 0.4s ease forwards;
		padding-top: 10px;
		padding-bottom: 1.5rem;
	}
	
	#main-header.is-scrolled .header_inner{
		align-items: flex-start;
		padding-bottom: 20px;
	}
	
	#main-header.is-scrolled .header_inner .header_logo{
		width: 46%;
	}
	
	#main-header.is-scrolled .header_inner .header_logo a{
		display: flex;
		flex-wrap: wrap;
	}
	
	#main-header.is-scrolled .header_inner .header_logo a .logo{
		font-size: clamp(2rem,2.31vw,3rem);
		width: 100%;
	}
	
	#main-header.is-scrolled .header_inner .header_logo a p{
		font-size: clamp(1.2rem,1.08vw,1.3rem);
		margin-right: 15px;
	}
	
	#main-header.is-scrolled .header_inner .header_logo p:first-of-type{
		color: var(--text);
		display: inline-block;
		margin-right: 0;
		order: 3;
	}
	
	#main-header.is-scrolled .header_inner nav{
		align-items: center;
	}
	
	#main-header.is-scrolled .header_inner nav .instagram_link{
		position: absolute;
		bottom: 0;
		right: 0;
		z-index: 5;
	}
	
	#main-header.is-scrolled .header_inner .font-size_controls button:last-of-type{
		margin-right: 0;
	}
	
	#main-header.is-scrolled .header_nav{
		position: absolute;
		right: 0;
		bottom: -2px;
		width: 70%;
	}
	
	#main-header.is-scrolled .header_nav ul{
		justify-content: flex-end;
		margin-right: 45px;
	}
	
	#main-header.is-scrolled .header_nav li{
		border: none !important;
		margin-left: clamp(1.5px,1vw,3rem);
		width: auto;
	}
	
	#main-header.is-scrolled .header_nav li a{
		font-size: 1.4rem;
	}
	
	.hamburger_btn{
		display: none;
	}
	
}
@keyframes headerSlideDown {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(0); }
}

/*--- ↓ under 1024px ↓ ---------------------------------*/
@media screen and (max-width: 1024px){
	header{
		padding-bottom: 0;
	}
	
	header .inner{
		width: 100%;
	}
	
	.header_inner{
		background-color: #F8F6F0;
		height: 95px;
		padding: 10px;
		position: relative;
	}
	
	.header_inner nav{
		display: none;
	}
	
	.hamburger_btn{
		background-color: var(--c-sub);
		border-radius: 5px;
		color: #fff;
		cursor: pointer;
		font-family: var(--mincho);
		height: 55px;
		position: absolute;
		top: 20px;
		right: 15px;
		width: 55px;
	}
	
	.hamburger_btn::after{
		content: "\30E1\30CB\30E5\30FC";
		font-size: 12px;
		font-weight: 600;
		position: absolute;
		bottom: 3px;
		left: 3px;
	}
	
	.hamburger_btn span{
		background-color: #fff;
		height: 3px;
		position: absolute;
		left: 10px;
		transition: 0.2s;
		width: 34px;
	}
	.hamburger_btn span:nth-child(1){
		top: 10px;
	}
	.hamburger_btn span:nth-child(2){
		top: 19px;
		width: 28px;
	}
	.hamburger_btn span:nth-child(3){
		top: 28px;
	}
	
	.hamburger_btn.active span:nth-child(1){
		top: 18px;
		transform: rotate(45deg);
	}
	.hamburger_btn.active span:nth-child(2){
		opacity: 0;
	}
	.hamburger_btn.active span:nth-child(3){
		top: 18px;
		transform: rotate(-45deg);
	}
	
	
	.header_nav{
		background-color: #FCFCFC;
		display: none;
		height: calc(100vh - 95px);
		overflow: auto;
		padding-left: 15px;
		padding-right: 15px;
		padding-bottom: 30px;
		position: absolute;
		top: 95px;
		left: 0;
		width: 100%;
		z-index: 5;
	}
	
	.header_nav.active{
		display: block;
	}
	
	.header_nav ul{
		display: block;
	}
	
	.header_nav ul li{
		border: none;
		text-align: left;
		width: 100%;
	}
	
	.header_nav ul li a{
		border-bottom: 1px solid var(--c-main);
		display: block;
		font-size: 2.2rem;
		padding: 20px 5px;
	}
	
	.header_nav ul li a::before{
		display: none;
	}
	
	.header_nav ul li:last-child{
		border: none;
	}
	
	.hamburger_only_menu .link_btn{
		margin-top: 20px;
	}
	
	.hamburger_only_menu .link_btn a,
	#fix-cta .link_btn a{
		font-size: 1.9rem;
		font-weight: 600;
		padding: 18px 20px;
	}
	
	.hamburger_only_menu .link_btn.tel a::before,
	#fix-cta .link_btn.tel a::before{
		background-image: url("../images/common/icon_tel.svg");
		background-size: contain;
		border: none;
		content: "";
		display: inline-block;
		height: 29px;
		margin-right: 8px;
		position: relative;
		top: -2px;
		left: 0;
		right: auto;
		bottom: auto;
		transform: translate(0);
		vertical-align: middle;
		width: 19px;
	}
	
	
	.hamburger_only_menu .instagram_link img{
		height: 40px;
		margin-left: 20px;
		margin-right: 5px;
		width: 40px;
	}
	
	.hamburger_only_menu .flex_box{
		align-items: flex-start;
		justify-content: center;
		margin-top: 30px;
	}
	
	.hamburger_only_menu{
		margin-left: auto;
		margin-right: auto;
		max-width: 300px;
		width: 100%;
	}
	
	.hamburger_only_menu .opening_hours .head{
		color: var(--c-main);
		font-size: 2.2rem;
	}
	
	#fix-cta{
		display: flex;
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		z-index: 5;
	}
	
	#fix-cta .link_btn{
		width: 50%;
	}
	
	#fix-cta .link_btn a{
		border-radius: 0;
		height: 100%;
		max-width: 100%;
		padding: 18px 10px;
	}
	
	#fix-cta .link_btn a::after{
		display: none;
	}
	
	#fix-cta .link_btn.tel a{
		border-right: 1px solid #fff;
	}
}


/*========================================

mainvisual

========================================*/
#mainvisual{
	height: clamp(530px,80.42vw,965px);
	position: relative;
}

#mainvisual img{
	height: 100%;
	object-fit: cover;
	width: 100%;
}

#mainvisual .mainvisual_text{
	align-items: center;
	display: flex;
	flex-flow: column;
	height: 55%;
	justify-content: space-between;
	letter-spacing: 0.05em;
	position: absolute;
	top: 50%;
	left: 50%;
	text-align: center;
	text-shadow: 0px 0px 10px #fff,
				 0px 0px 10px #fff;
	transform: translate(-50%,-50%);
	z-index: 1;
}

#mainvisual .mainvisual_text .top{
	color: var(--c-sub);
	font-size: clamp(27px,5.25vw,6.3rem);
}

#mainvisual .mainvisual_text .top span{
	font-size: clamp(42px,7.33vw,8.8rem);
	font-weight: 600;
	line-height: 1em;
}

#mainvisual .mainvisual_text .bottom{
	color: #54382D;
	font-size: clamp(27px,4.42vw,5.3rem);
	font-weight: 600;
	letter-spacing: 0.05em;
}

#sub_mv,
.parts_between{
	height: 300px;
}

#sub_mv img,
.parts_between img{
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.breadcrumbs{
	margin-top: 20px;
	margin-bottom: 20px;
}

.breadcrumbs a{
	text-decoration: underline;
}

/*--- ↓ under 767px ↓ ---------------------------------*/
@media screen and (max-width: 767px) {
	
}

/*========================================

Footer

========================================*/
footer{
	padding-top: 50px;
}

.f-salon .catch{
	color: var(--c-sub);
	font-family: var(--mincho);
	font-size: 2.3rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	margin-bottom: 50px;
	text-align: center;
}

.f-salon .img_box{
	width: 48%;
}

.f-salon .text_box{
	width: 50%;
}

.f-salon .footer_logo{
	margin-bottom: 40px;
}

.f-salon table{
	width: 100%;
}

.f-salon table tr{
	background-image : linear-gradient(to right, var(--c-main) 3px, transparent 3px);
	background-repeat: repeat-x;
	background-position: left bottom;
	background-size: 6px 1px;
	display: flex;
	padding: 20px 0;
}

.f-salon table th,
.f-salon table td{
	font-size: 1.8rem;
	display: block;
	line-height: 1.8em;
}

.f-salon table th{
	color: #F5886E;
	text-align: left;
	width: 105px;
}

.f-salon table td{
	width: calc(100% - 105px);
}

.f-salon table td small{
	font-size: 1.4rem;
}

footer #sns{
	background-color: var(--c-main);
	margin-top: 45px;
	padding: 15px;
}

footer #sns .inner{
	align-items: center;
	display: flex;
	gap: 15px;
	justify-content: center;
}

footer #sns a:hover{
	opacity: 0.5;
}

footer .copyright{
	padding: 20px;
	text-align: center;
}

/*--- ↓ under 1024px ↓ ---------------------------------*/
@media screen and (max-width: 1024px){
	footer{
		padding-bottom: 70px;
	}
}


/*--- ↓ under 767px ↓ ---------------------------------*/
@media screen and (max-width: 767px){
	.f-salon .img_box,
	.f-salon .text_box{
		width: 100%;
	}
	
	.f-salon .footer_logo{
		margin-top: 30px;
		margin-bottom: 0;
	}
	
	.footer_logo .logo{
		font-size: 30px;
	}
	
	.f-salon table tr{
		flex-wrap: wrap;
	}
	
	.f-salon table th,
	.f-salon table td{
		width: 100%;
	}
	
	.f-salon table td{
		font-size: 16px;
	}
	
	footer #sns{
		padding: 20px;
	}
	
	footer #sns .inner{
		gap: 20px;
	}
	
	footer #sns a img{
		height: 40px;
		object-fit: contain;
		width: 40px;
	}
	
}

/*========================================

TOP+下層共通パーツ

========================================*/
.course{
	margin-bottom: 95px;
}

.course h3,
#page .course h3{
	background-color: var(--c-main);
	border-radius: 5px;
	color: #fff;
	font-family: var(--mincho);
	font-size: clamp(22px,2.33vw,2.8rem);
	margin-bottom: 30px;
	padding: 18px 20px;
}

.course h4{
	font-size: 2.3rem;
	font-weight: 700;
	line-height: normal !important;
	margin-bottom: 30px;
}
#page .course h4{
	color: var(--c-sub);
	margin-top: 20px;
	margin-bottom: 10px;
}

.course .flex_box{
	align-items: flex-start;
}

.course .img_box,
.course .text_box{
	margin-bottom: 20px;
	width: 48%;
}

.course .text_box p:not([class]){
	line-height: 1.9em;
}

.course .text_box .catch{
	color: var(--c-main);
	font-family: var(--mincho);
	font-size: clamp(20px,1.92vw,2.3rem);
	margin-bottom: 30px;
	line-height: 1.5em !important;
}
#page .course .text_box .catch{
	font-size: 2.3rem;
	margin-bottom: 18px;
}

.course .text_box .price{
	background-color: #EAE5D3;
	border-radius: 5px;
	font-size: clamp(20px,2.17vw,2.6rem);
	font-family: var(--mincho);
	margin-bottom: 50px;
	padding: 8px 20px;
}
#page .course .text_box .price{
	font-size: 2.6rem;
	margin-bottom: 18px;
}

.course .text_box ul li{
	font-size: 1.8rem;
	margin-bottom: 20px;
	padding-left: 25px;
}
#page .course .text_box ul li{
	font-size: 1.6rem;
	margin-bottom: 5px;
	padding-left: 1em;
}

.course .text_box ul li::before{
	background-color: var(--c-sub);
	border-radius: 999px;
	content: "";
	height: 13px;
	position: absolute;
	top: 0.8rem;
	left: 0;
	width: 13px;
}

#page .course .text_box ul li::before{
	background-color: var(--text);
	height: 4px;
	width: 4px;
	top: 1.1rem;
}

.course .text_box ul li:last-child{
	margin-bottom: 0;
}

.course ol{
	counter-reset: ol_list;
}

.course ol li{
	background-color: #fff;
	border: 1px solid #C8AC4D;
	border-radius: 5px;
	color: #C8AC4D;
	font-size: 2.4rem;
	font-weight: 700;
	margin-bottom: 35px;
	padding: 30px 25px;
	padding-left: 115px;
}

.course ol li::before{
	background-color: #C8AC4D;
	border-radius: 999px;
	color: #fff;
	content: counter(ol_list);
	counter-increment: ol_list;
	font-size: 30px;
	font-family: var(--mincho);
	height: 60px;
	line-height: 61px;
	position: absolute;
	top: 3.7rem;
	left: 25px;
	text-align: center;
	width: 60px;
}

.course ol li p{
	color: var(--text);
	font-size: 2rem;
	font-weight: 400;
}

.course .remarks{
	background-color: #fff;
	border: 1px solid #C8AC4D;
	border-radius: 5px;
	font-size: 2rem;
	padding: 20px 25px;
}

#page .course .remarks p{
	line-height: 2em;
}

.course .slide_img figcaption{
	font-size: 1.8rem;
	margin-top: 5px;
	text-align: center;
}

.course .slide_img .notes{
	font-size: 1.8rem;
}

.course .slick-dots{
	display: flex;
	justify-content: center;
	margin: 20px 0;
}

.course .slick-dots button{
	background-color: #C6C6C6;
	border: none;
	border-radius: 999px;
	font-size: 0;
	height: 15px;
	margin: 0 5px;
	width: 15px;
}

.course .slick-dots .slick-active button{
	background-color: var(--c-main);
}

.course .slide_img .slick-arrow{
	background-color: #fff;
	border: 1px solid var(--c-main);
	border-radius: 5px;
	font-size: 0;
	height: 120px;
	position: absolute;
	top: 45%;
	transform: translateY(-50%);
	transition: 0.2s;
	width: 50px;
	z-index: 1;
}

.course .slide_img .slick-arrow:active{
	margin-top: 3px;
}

.course .slide_img .slick-arrow::before{
	border: 15px solid transparent;
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}

.course .slide_img .slick-arrow.slick-prev{
	left: -25px;
}

.course .slide_img .slick-arrow.slick-prev::before{
	border-right: 15px solid var(--c-main);
	margin-left: -7px;
}


.course .slide_img .slick-arrow.slick-next{
	right: -25px;
}

.course .slide_img .slick-arrow.slick-next::before{
	border-left: 15px solid var(--c-main);
	margin-left: 7px;
}

/*--- ↓ under 767px ↓ ---------------------------------*/
@media screen and (max-width: 767px){
	.course{
		margin-bottom: 45px;
	}
	
	.course .img_box{
		width: 100%;
	}
	
	.course .text_box{
		width: 100%;
	}
	
	.course .text_box .catch{
		text-align: center;
	}
	#page .course .text_box .catch{
		text-align: left;
	}
	
	.course .text_box ul{
		margin-bottom: 50px;
	}
	#page .course .text_box ul{
		margin-bottom: 0;
	}
	
	.course ol li{
		font-size: 18px;
		margin-bottom: 28px;
		padding: 15px 25px 20px;
	}
	
	.course ol li::before{
		display: none;
	}
	
	.course ol li span{
		display: block;
		padding-top: 16px;
		padding-bottom: 16px;
		padding-left: 75px;
		position: relative;
	}
	
	.course ol li span::before{
		background-color: #C8AC4D;
		border-radius: 999px;
		color: #fff;
		content: counter(ol_list);
		counter-increment: ol_list;
		font-size: 30px;
		font-family: var(--mincho);
		height: 55px;
		line-height: 56px;
		position: absolute;
		top: 50%;
		left: 0;
		text-align: center;
		transform: translateY(-50%);
		width: 55px;
	}
	
	.course ol li p{
		font-size: 16px;
	}
	
	.course .remarks{
		font-size: 16px;
		padding: 20px 25px;
	}
	
	.course .slide_img .slick-arrow{
		height: 80px;
		width: 33px;
	}
	
	.course .slide_img .slick-arrow::before{
		border: 10px solid transparent;
	}
	
	.course .slide_img .slick-arrow.slick-prev {
		left: -16px;
	}
	.course .slide_img .slick-arrow.slick-prev::before{
		border-right: 10px solid var(--c-main);
	}
	
	.course .slide_img .slick-arrow.slick-next {
		right: -16px;
	}
	.course .slide_img .slick-arrow.slick-next::before{
		border-left: 10px solid var(--c-main);
	}
}


/*========================================

TOP

========================================*/
h2.h2_style{
	color: var(--c-main);
	font-family: var(--mincho);
	font-size: clamp(14px,1.67vw,2rem);
	font-weight: 400;
	margin-bottom: 60px;
	text-align: center;
}

h2.h2_style::before{
	content: attr(data-en);
	display: block;
	font-size: clamp(35px,4.17vw,5rem);
	font-weight: 600;
	letter-spacing: 0.1em;
}

#front-page section{
	padding-top: 65px;
	padding-bottom: 110px;
}

#front-page section p{
	line-height: 1.9em;
}

.line_bnr{
	align-items: center;
	background: linear-gradient(274deg,rgba(241, 218, 218, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(241, 218, 218, 1) 100%);
	border-radius: 10px;
	margin: 60px auto 70px;
	max-width: 80rem;
	padding: 15px 30px;
}

.line_bnr .text_box{
	padding-left: 20px;
	width: 70%;
}

.line_bnr .text_box p{
	font-size: 2.3rem;
	line-height: normal !important;
	margin-bottom: 27px;
}

.line_bnr .text_box .gold{
	color: var(--c-main);
	font-family: var(--mincho);
	font-weight: 600;
	font-size: 3.2rem;
	letter-spacing: 0.1em;
	margin-bottom: 0;
}

.line_bnr .img_box{
	width: 30%;
}


#front-page #top_concept{
	background-color: #FCFCFC;
}

#front-page #top_concept .flex_box{
	align-items: flex-start;
}

#front-page #top_concept .text_box{
	width: 52%;
}

#front-page #top_concept .concept_img{
	width: 45%;
}

#front-page #top_concept .concept_img img{
	box-shadow: 6px 6px 6px rgba(0,0,0,0.23);
	width: 100%;
}

#front-page #top_concept .text_box p{
	font-size: clamp(16px,1.5vw,1.8rem);
	margin-bottom: 2em;
}

#front-page #top_concept .text_box p.catch,
#front-page #top_concept .concept_img  p.catch{
	color: var(--c-sub);
	font-size: clamp(20px,2.17vw,2.6rem);
	font-weight: 600;
	margin-bottom: clamp(20px,3.33vw,40px);
}


#front-page #top_menu .top_menu_inner{
	background-image: url("../images/top/bg_menu.webp");
	background-size: cover;
	padding-top: 60px;
	padding-bottom: 100px;
}

#front-page #top_menu .flex_item{
	background-color: #fff;
	padding: 22px;
	width: 32%;
}

#front-page #top_menu .flex_item h3{
	color: var(--c-main);
	font-family: var(--mincho);
	font-size: 2.6rem;
	font-weight: 400;
	margin-top: 15px;
	margin-bottom: 45px;
	text-align: center;
}

#front-page #top_menu .flex_item h4{
	font-size: 1.6rem;
	margin-top: 25px;
	margin-bottom: 1.5em;
}

#front-page #top_menu .flex_item p{
	line-height: 1.75em;
}

#front-page #top_menu .link_btn{
	margin-top: 5px;
	width: 100%;
}

#front-page #top_course{
	width: calc(95% - 30px);
}

/*--- ↓ under 767px ↓ ---------------------------------*/
@media screen and (max-width: 767px){
	.line_bnr{
		padding: 38px 12px;
		margin: 45px 0;
	}
	
	.line_bnr .img_box{
		display: none;
	}
	
	.line_bnr .text_box{
		padding-left: 0;
		width: 100%;
	}
	
	.line_bnr .text_box .gold{
		font-size: 24px;
    	letter-spacing: 0;
	}
	
	.line_bnr .text_box p{
		font-size: 16px;
		text-align: center;
	}
	
	.line_bnr .text_box .link_btn a{
		background-color: #06C755;
		margin-left: auto;
		margin-right: auto;
		padding: 18px 30px 15px 20px;
	}
	
	.line_bnr .text_box .link_btn a::before{
		background-image: url("../images/common/icon_line-green.svg");
		background-repeat: no-repeat;
		background-size: contain;
		content: "";
		display: inline-block;
		height: 40px;
		margin-right: 20px;
		vertical-align: middle;
		width: 40px;
	}
	
	h2.h2_style{
		margin-bottom: 30px;
	}
	
	#front-page section{
		padding-top: 50px;
    	padding-bottom: 50px;
	}
	
	#front-page #top_concept .flex_box{
		flex-flow: column-reverse;
	}
	
	#front-page #top_concept .concept_img,
	#front-page #top_concept .text_box{
		width: 100%;
	}
	
	#front-page #top_concept .concept_img img{
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50px;
		width: 90%;
	}
	
	#front-page #top_menu .top_menu_inner{
		background: none;
		padding: 0;
	}
	
	#front-page #top_menu .flex_item{
		margin-bottom: 30px;
		width: 100%;
	}
	
	#front-page #top_course{
		width: calc(100% - 40px);
	}
}


/*========================================

下層共通

========================================*/
#page section{
	padding-top: 90px;
	padding-bottom: 90px;
}

#page section.bg_white{
	background-color: #fff;
}

#page .page_title,
#archive .page_title,
#single .page_title{
	color: var(--c-main);
	font-family: var(--mincho);
	font-size: clamp(36px,4.88vw,5rem);
	letter-spacing: 0.02em;
	margin-bottom: clamp(50px,9.77vw,100px);
	text-align: center;
}

#page .h2_style{
	color: var(--c-main);
	font-family: var(--mincho);
	margin-bottom: clamp(40px,5.86vw,60px);
	text-align: center;
}

#page .h2_style h2{
	font-size: clamp(32px,4.88vw,5rem);
	font-weight: 700;
	letter-spacing: 0.05em;
}

#page .h2_style .small{
	font-size: clamp(14px,1.67vw,2rem);
	font-weight: 400;
}

#page h3,
.h3_style{
	color: var(--c-sub);
	font-family: var(--mincho);
	font-size: clamp(21px,3.42vw,3.5rem);
	line-height: 1.4em;
	margin-bottom: clamp(25px,2.93vw,30px);
}


.anchor_box{
	gap: clamp(20px,3.13vw,40px);
	justify-content: center;
}

.anchor_box .link_btn{
	margin-bottom: 15px;
	width: 22%;
}

.anchor_box .link_btn a,
#more_btn a{
	font-family: var(--mincho);
	font-size: 20px;
	height: 100%;
	max-width: 270px;
	padding: 18px 20px 30px;
}

.anchor_box .link_btn a::after,
#more_btn a::after{
	border-top: none;
	border-right: solid 2px #fff;
	border-bottom: solid 2px #fff;
	top: auto;
	left: 50%;
	right: auto;
	bottom: 15px;
	transform: translateX(-50%) rotate(45deg);
}

/*--- ↓ under 767px ↓ ---------------------------------*/
@media screen and (max-width: 767px){
	#page section{
		padding-top: 50px;
		padding-bottom: 50px;
	}
	
	.anchor_box{
		gap: 0;
	}
	
	.anchor_box .link_btn{
		width: 100%;
	}
	
	.anchor_box .link_btn a{
		margin-left: auto;
		margin-right: auto;
	}
}

/*========================================

はじめてのお客様へ

========================================*/

.first-page#greetings .intro .text_box{
	width: 59%;
}

.first-page#greetings .intro .img_box{
	width: 40%;
}

.first-page#greetings .intro .text_box p,
.first-page#greetings .border_box .text_box p{
	font-size: clamp(16px,2.15vw,2.2rem);
	line-height: 1.9em;
	margin-bottom: 1em;
}

.first-page#greetings .intro .img_box p{
	line-height: 1.9em;
	margin-top: 10px;
}

.first-page#greetings .border_box{
	border: 1px solid var(--c-main);
	margin-top: 50px;
	padding: 40px 30px;
}

.first-page#greetings .border_box:nth-of-type(2n+1){
	flex-flow: row-reverse;
}

.first-page#greetings .border_box .img_box{
	width: 29%;
}

.first-page#greetings .border_box .text_box{
	width: 65%;
}

.first-page#flow .intro_text{
	font-size: clamp(16px,1.76vw,1.8rem);
	line-height: 2em;
	text-align: center;
}

.first-page#flow .flow_item {
	margin-top: 50px;
}

.first-page#flow .flow_item .img_box{
	width: 38%;
}

.first-page#flow .flow_item .text_box{
	width: 60%;
}

.first-page#flow .flow_item .text_box h3{
	color: var(--c-main);
	font-size: 2.3rem;
}

.first-page#flow .flow_item .text_box p{
	font-size: clamp(16px,1.76vw,1.8rem);
	line-height: 1.8em;
	margin-bottom: 25px;
}

.first-page#flow .flow_item .text_box p .bold{
	color: var(--c-sub);
}

.first-page#flow .flow_item .text_box .link_btn{
	margin-bottom: 25px;
}


.first-page#faq dl{
	background-color: #fff;
	border: 1px solid var(--c-main);
	border-radius: 5px;
	cursor: pointer;
	margin-bottom: 30px;
	padding: 35px 20px 35px 40px;
}

.first-page#faq dl dt,
.first-page#faq dl dd{
	font-size: 1.8rem;
	line-height: 1.7em;
	padding-left: 100px;
	position: relative;
}

.first-page#faq dl dt{
	color: var(--c-main);
	font-weight: 700;
}

.first-page#faq dl:hover dt{
	text-decoration: underline;
}
.first-page#faq dl.open:hover dt{
	text-decoration: none;
}

.first-page#faq dl dd{
	padding-top: 50px;
}


.first-page#faq dl dt::before,
.first-page#faq dl dd::before{
	border-radius: 5px;
	display: block;
	font-family: var(--mincho);
	font-size: 3.5rem;
	line-height: 5rem;
	height: 5rem;
	text-align: center;
	position: absolute;
	top: 0;
	left: 0;
	width: 5rem;
}

.first-page#faq dl dt::before{
	background-color: var(--c-main);
	color: #fff;
	content: "Q";
	top: -1rem;
}
.first-page#faq dl dd::before{
	border: 1px solid var(--c-main);
	color: var(--c-main);
	top: 40px;
	content: "A";
}

/*--- ↓ under 767px ↓ ---------------------------------*/
@media screen and (max-width: 767px){
	
	.first-page#greetings .intro{
		flex-flow: column-reverse;
	}
	
	.first-page#greetings .intro .img_box,
	.first-page#greetings .intro .text_box,
	.first-page#greetings .border_box .img_box,
	.first-page#greetings .border_box .text_box,
	.first-page#flow .flow_item .img_box,
	.first-page#flow .flow_item .text_box{
		width: 100%;
	}
	
	.first-page#anchor .anchor_box .link_btn a,
	#more_btn a{
		margin-left: auto;
		margin-right: auto;
	}
	
	.first-page#greetings .intro .text_box{
		margin-top: 66px;
	}
	
	.first-page#greetings .intro .text_box h3{
		text-align: center;
	}
	
	.first-page#greetings .border_box .text_box{
		margin-top: 20px;
	}
	
	.first-page#greetings .border_box:nth-of-type(2n+1){
		flex-wrap: wrap;
	}
	
	.first-page#greetings .border_box_wrap,
	.more_box_wrap,
	#more_btn.is-active{
		display: none;
	}
	
	.first-page#greetings .border_box{
		padding: 30px 15px;
	}
	
	.first-page#flow .intro_text{
		text-align: left;
	}
	
	.first-page#flow .flow_item .text_box{
		display: flex;
		flex-flow: column;
		margin-top: 20px;
	}
	
	.first-page#flow .flow_item .text_box p{
		margin-bottom: 0;
	}
	
	.first-page#flow .flow_item .text_box .link_btn{
		margin-top: 30px;
		order: 1;
	}
	
	.first-page#flow .flow_item .text_box h3{
		margin-bottom: 15px;
	}
	
	.first-page#faq dl dt,
	.first-page#faq dl dd{
		font-size: 16px;
		padding-left: 80px;
	}
	
	.first-page#faq dl dd{
		padding-top: 35px;
	}
	
	.first-page#faq dl dd::before{
		top: 30px;
	}
	
}


/*========================================

メニュー・料金

========================================*/
.menu-page#anchor{
	padding-bottom: 30px;
}

.menu-page#anchor .page_title{
	margin-bottom: 40px;
}

.menu-page#anchor p{
	font-size: 2rem;
	line-height: 2em;
	margin-bottom: 80px;
}

.menu-page#rose .h2_style h2,
.menu-page#rose .course h4{
	color: #C58092;
}

.menu-page#rose .h2_style h2 span{
	margin-left: 15px;
	margin-right: 15px;
}

.menu-page#rose .h2_style h2 span::before,
.menu-page#rose .h2_style h2 span::after{
	background-repeat: no-repeat;
	background-image: url("../images/menu/icon_rose.png");
	background-position: center;
	background-size: contain;
	display: inline-block;
	content: "";
	height: 1.5em;
	vertical-align: middle;
	position: relative;
	top: -0.1em;
	width: 1.5em;
}

.menu-page#rose .course h3{
	background-color: #C58092;
}

.menu-page#rose .course .text_box .price{
	background-color: #FFE8ED;
}


/*========================================

サロン紹介

========================================*/
.salon-page#intro{
	padding-bottom: 0;
}

.salon-page#intro h2,
.salon-page#intro .h2_style p{
	text-align: left;
	line-height: 1.2em;
}

.salon-page#intro h2 span,
.salon-page#intro .h2_style p span{
	font-size: 80%;
}

.salon-page#intro .h2_style p{
	font-size: clamp(2.2rem,3.08vw,4rem);
	font-weight: 700;
	line-height: 1.5em;
	margin-bottom: 0;
}

.salon-page#intro h3{
	margin-top: 50px;
}

.salon-page#intro p{
	line-height: 2.2em;
	margin-bottom: 2em;
}


.salon-page#staff{
	padding-top: 30px;
}
.salon-page#staff .img_box{
	width: 35%;
}

.salon-page#staff .text_box{
	width: 63%;
}

.salon-page#staff .text_box .name .en{
	color: var(--c-main);
	font-size: clamp(50px,4.38vw,5.6rem);
	line-height: 1.2em;
}

.salon-page#staff .text_box .name .ja{
	font-size: clamp(22px,1.95vw,2.5rem);
	padding-bottom: 35px;
}

.salon-page#staff .text_box table tr{
	border-bottom: 1px solid #707070;
	display: flex;
	flex-wrap: wrap;
	padding: 15px 0;
}

.salon-page#staff .text_box table th{
	color: var(--c-sub);
	display: block;
	flex-shrink: 0;
	font-size: 2.2rem;
	padding-right: 5px;
	text-align: left;
	width: 165px;
}

.salon-page#staff .text_box table td{
	display: block;
	font-size: 2rem;
	width: calc(100% - 165px);
}


.salon-page#voice > p{
	margin-bottom: clamp(30px,6.25vw,80px);
}


.salon-page .tmp_bnr{
	background: linear-gradient(274deg,rgba(241, 218, 218, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(241, 218, 218, 1) 100%);
	border-radius: 10px;
	margin-top: 7rem;
	margin-left: auto;
	margin-right: auto;
	max-width: 725px;
	padding: 2px 15px 15px;
	position: relative;
	width: 100%;
}

.salon-page .tmp_bnr .img_box{
	color: var(--c-main);
	font-size: 1.8rem;
	font-weight: bold;
	text-align: center;
	position: absolute;
	top: 10px;
	right: 15px;
	width: 25%;
}

.salon-page .tmp_bnr .img_box img{
	margin-left: auto;
	margin-right: auto;
}

.salon-page .tmp_bnr .head{
	color: var(--c-sub);
	font-family: var(--mincho);
	font-size: 2.4rem;
	font-weight: 700;
	padding: 45px 0 20px 30px;
	width: 70%;
}

.salon-page .tmp_bnr .link_btn{
	margin-left: 30px;
	padding-bottom: 20px;
	width: 70%;
}

.salon-page#promise ol{
	counter-reset: promise;
	margin-left: auto;
	margin-right: auto;
	max-width: 1000px;
	padding-left: 130px;
	width: 100%;
}

.salon-page#promise ol li{
	align-content: center;
	background-image : linear-gradient(to right, #9D894A 3px, transparent 3px);
	background-repeat: repeat-x;
	background-position: left bottom;
	background-size: 6px 1px;
	color: #54382D;
	font-family: var(--mincho);
	font-size: clamp(22px,2.11vw,2.7rem);
	font-weight: 700;
	margin-bottom: 35px;
	min-height: 92px;
}

.salon-page#promise ol li::before{
	background-image: url("../images/salon/icon_heart.png");
	color: #BF2E0B;
	content: counter(promise);
	counter-increment: promise;
	display: block;
	height: 92px;
	line-height: 92px;
	position: absolute;
	top: 0;
	left: -130px;
	text-align: center;
	width: 101px;
}

.salon-page#promise ol li .marker{
	 background:linear-gradient(transparent 70%, #FFD3C8 70%);
}

/*--- ↓ under 767px ↓ ---------------------------------*/
@media screen and (max-width: 767px){
	.salon-page#staff .img_box,
	.salon-page#staff  .text_box,
	.post_box a,
	.post_box a .text_box{
		width: 100%;
	}
	
	.salon-page#staff .text_box{
		margin-top: 17px;
	}
	
	.salon-page#staff .text_box table th{
		font-size: 18px;
		width: 125px;
	}
	
	.salon-page#staff .text_box table td{
		font-size: 16px;
		width: calc(100% - 125px);
	}
	
	.salon-page#staff .img_box img,
	.post_box a .img_box,
	.salon-page#promise ol li::before{
		margin-left: auto;
		margin-right: auto;
	}
	
	.post_box a{
		display: block;
	}
	
	.post_box a .img_box{
		margin-bottom: 22px;
	}
	
	.salon-page .tmp_bnr{
		margin-top: 30px;
		padding-top: 15px;
	}
	
	.salon-page .tmp_bnr .img_box{
		margin: 17px 0;
		position: static;
		width: 100%;
	}
	
	.salon-page .tmp_bnr .head,
	.salon-page .tmp_bnr .link_btn{
		padding: 0;
		margin-left: auto;
		width: 100%;
	}
	
	.salon-page .tmp_bnr .head{
		font-size: 19px;
		text-align: center;
	}
	
	.salon-page#promise ol{
		padding-left: 0;
	}
	
	.salon-page#promise ol li{
		min-height: 1px;
		padding-bottom: 15px;
	}
	
	.salon-page#promise ol li::before{
		font-size: 35px;
		margin-bottom: 10px;
		position: static;
	}
}

/*========================================

archive

========================================*/
.post_box a{
	display: flex;
	justify-content: space-between;
	margin-bottom: 50px;
	padding: 20px;
	width: 48%;
}

.post_box a .img_box{
	aspect-ratio: 1/1;
	flex-shrink: 0;
	height: 160px;
	overflow: hidden;
	width: 160px;
}

.post_box a .img_box img{
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.post_box a .text_box{
	width: calc(100% - 180px);
}

.post_box a .text_box .date,
#blog_content_inner .date{
	font-size: 1.6rem;
	margin-bottom: 15px;
}

.post_box a .text_box .title{
	color: var(--text);
	margin-bottom: 15px;
}

.post_box a .text_box .category span,
#blog_content_inner .category span{
	background-color: #EAE5D3;
	border-radius: 999px;
	color: var(--c-main);
	margin-right: 10px;
	padding: 2px 18px;
}

.post_box a:hover .date,
.post_box a:hover .title{
	color: var(--c-main);
	text-decoration: underline;
}


#index_content_inner{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

#index_content_inner .page_title{
	width: 100%;
}

#index_content_inner #post_list_wrap{
	width: calc(100% - 330px);
}

#index_content_inner .post_box a{
	background-color: #fff;
	margin-bottom: 30px;
}

#index_content_inner #side_bar{
	width: 300px;
}

#index_content_inner #side_bar .side_content{
	margin-bottom: 20px;
}

#index_content_inner #side_bar .side_content .side_title{
	background-color: var(--c-main);
	border-radius: 5px;
	color: #fff;
	font-family: var(--mincho);
	font-size: 2rem;
	font-weight: 700;
	padding: 5px;
}


#index_content_inner #side_bar .side_content ul li{
	margin: 10px 0;
}

#index_content_inner #side_bar .side_content ul li a{
	color: var(--text);
}

#index_content_inner #side_bar .side_content ul li a:hover{
	color: var(--c-main);
	text-decoration: underline;
}

.nav-links,
.blogpage_link{
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
	margin-bottom: 50px;
}

.nav-links .page-numbers,
.blogpage_link > div a{
	background-color: #fff;
	border: 1px solid var(--c-main);
	color: var(--c-main);
	font-family: var(--mincho);
	font-size: 20px;
	font-weight: 700;
	height: 40px;
	line-height: 40px;
	padding: 5px;
	text-align: center;
	width: 40px;
}

.nav-links .page-numbers.current{
	background-color: var(--c-main);
	color: #fff;
}

.blogpage_link > div a{
	background-color: var(--c-main);
	color: #fff;
	font-size: 18px;
	max-width: 200px;
	height: auto;
	transition: 0.2s;
	width: 100%;
}
.blogpage_link > div a:hover{
	opacity: 0.5;
}

.blogpage_link > div a{
	color: #fff;
}


/*--- ↓ under 767px ↓ ---------------------------------*/
@media screen and (max-width: 767px){
	.post_box a,
	.post_box a .text_box,
	#index_content_inner #post_list_wrap,
	#index_content_inner #side_bar{
		width: 100%;
	}


	.post_box a .img_box{
		margin-left: auto;
		margin-right: auto;
	}
	
	.post_box a{
		display: block;
	}
	
	.post_box a .img_box{
		margin-bottom: 22px;
	}
}

/*========================================

詳細ページ

========================================*/
#blog_content_inner{
	background-color: #fff;
	padding: 20px;
}

#blog_content_inner h1{
	font-size: 2.4rem;
	font-family: var(--mincho);
	margin-top: 15px;
    margin-bottom: 15px;
}


#blog_content_inner .date{
	color: var(--c-main);
	display:block;
	margin-bottom: 15px;
}

#blog_content_inner article,
#blog_content_inner .eye_catching{
	margin-top: 50px;
}

#blog_content_inner article p{
	margin-bottom: 2.5em;
}

#blog_content_inner article a{
	text-decoration: underline;
	word-break: break-all;
}
#blog_content_inner article a:hover{
	opacity: 0.5;
}

#blog_content_inner article h2{
    border-left: 10px solid var(--c-sub);
	color: var(--c-sub);
    font-size: 2.5rem;
    font-weight: 700;
    margin-top: 50px;
    margin-bottom: 45px;
    padding: 5px 0 5px 15px;
}

#blog_content_inner article h3{
    border-bottom: 2px solid var(--c-sub);
    font-size: 2.2rem;
    font-weight: 700;
    margin-top: 50px;
	margin-bottom: 30px;
    padding-bottom: 10px;
}

#blog_content_inner article h4{   
	border-top: 2px dashed var(--c-sub);
    border-bottom: 2px dashed var(--c-sub);
    font-size: 1.8rem;
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 10px 0;
}

#blog_content_inner article h5{
    font-size: 1.6rem;
    margin-top: 30px;
    margin-bottom: 30px;
    position: relative;
    padding-left: 2rem;
}

#blog_content_inner article h5::before{
	content: '';
    background-color: var(--c-sub);
    border-radius: 50%;
    height: 1.6rem;
	position: absolute;
	top: 0.3em;
    left: 0;
    width: 1.6rem;
}

#blog_content_inner article h6{
    font-size: 1.6rem;
    margin-top: 30;
    margin-bottom: 20px;
}

#blog_content_inner article img{
	object-fit: cover;
}

#blog_content_inner article table{
	border: 1px solid #333333;
	margin: 30px 0;
}
#blog_content_inner article th{
	padding: 10px;
	background-color:#EAE5D3;
}
#blog_content_inner article td{
	border: 1px solid #333333;
	padding: 10px;
}

#blog_content_inner article ol,
#blog_content_inner article ul{
	margin: 30px 0;
}

#blog_content_inner article ol{
	list-style-type: decimal;
}

#blog_content_inner article ul{
	list-style-type: disc;
}

#blog_content_inner article li{
	margin-left: 25px;
	margin-bottom: 6px;
}

#blog_content_inner article li::marker{
	color: var(--c-sub);
}