@charset "UTF-8";

.en{
	font-family: "Cormorant Garamond", serif;
	font-weight: 500;
	font-optical-sizing: auto;
	font-style: normal;
}
.shippori{
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
}

.noto_sans {
	font-family: "Noto Sans JP", sans-serif;
	font-weight:400;
}

*{
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
html{
	font-size: 62.5%;
	overflow-x: hidden;
}
body{
	font-family: "Noto Serif JP", "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝B" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-size: 1.6rem;
	color: #333;
	position: relative;
	line-height: 1;
	-webkit-text-size-adjust: 100%;
	overflow-x: hidden;
}
p{
	font-size: 1.7rem;
	line-height: 1.8235;
}
img{
	border:none;
	-webkit-backface-visibility: hidden;
}
ul,ol{
	list-style: none;
}
li{
	list-style-type: none;
}

a{
	text-decoration: none;
	color: #333;
	transition: .3s all ease;
}


.pic img,
.pic picture,
.pic source,
.pic a{
	display: block;
	width: 100%;
}
.pic img{
	height: 100%;
	object-fit: cover;
	font-family: "object-fit: cover;";
}
table{
	border-collapse: collapse;
	table-layout: fixed;
	width: 100%;
}
.outer{
	padding-left: min(5rem, 3.66vw);
	padding-right: min(5rem, 3.66vw);
	width: 100%;
	position: relative;
}
.inner{
	max-width: 102.4rem;
	position: relative;
	margin: 0 auto;
	width: 100%;
}


input,
select,
textarea{
	font-family: 游ゴシック, YuGothic, メイリオ, Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
	-o-appearance: none;
	border: none;
	border-radius: 0;
	font-size: 1.6rem;
}
select::-ms-expand{
	display: none;
}
.block{
	display: block;
}
/* +++font-weight+++ */
.bold,
.bold *{
	font-weight: 700;
}
.medium,
.medium *{
	font-weight: 500;
}
.semi-bold,
.semi-bold *{
	font-weight: 600;
}
.normal,
.normal *{
	font-weight: 400;
}


/* +++flex+++ */
.flex{
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
}
.a-items_center{
	align-items: center;
}
.a-items_end{
	align-items: flex-end;
}
.s-between{
	justify-content: space-between;
}
.column{
	flex-direction: column;
}
.flex_all_center{
	justify-content: center;
	align-items: center;
}
.jc_center{
	justify-content: center;
}

/* +++text color+++ */
.text-white,
.text-white *{
	color: #fff !important;
}
.text-gold-gradient,
.text-gold-gradient{
	background: linear-gradient(45deg, #998b4d 0%, #bdb168 75%, #c6b96d 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	text-fill-color: transparent;
}
.text-gold,
.text-gold *{
	color: #b7ac5f !important;
}
.text-center{
	text-align: center;
}

/* +++bg-color+++ */
.bg-white{
	background: #fff;
}

/* +++ #header +++ */
#header{
	height: 7rem;
	z-index: 99999;
	position: relative;
	position: sticky;
	left: 0;
	top: -7rem;
	transition: .4s all ease;
	width: 100%;
}
#header.fixed{
	position: fixed;
	left: 0;
	top: -7rem;
	background: #fff;
	transform: translateY(6.9rem);
}
#header .inner{
	height: 100%;
	max-width: 120rem;
}
#header .logo{
	width: 24.6rem;
}
.logo *{
	width: 100%;
	display: block;
}

/* +++ nav +++ */
nav{
	padding-right: 1.5rem;
	line-height: 1;
}
#global-navi{
	padding-right: 1rem;
	border-right: 1px solid #ccc;
	margin-right: min(3.6rem, 3vw);
}
#global-navi a:hover{
	color: #998b4d;
}
#global-navi li{
	margin-right: min(3.6rem, 3vw);
}
nav .tel-button dt{
	display: block;
	margin-bottom: 1rem;
	font-size: 87.5%;
}
nav .tel-button:before{
	content: "";
	display: block;
	width: 4rem;
	height: 4rem;
	background-color: #b7ac5f;
	background-image: url(../images/tel-icon-white01.svg);
	background-repeat: no-repeat;
	background-size: 37.5% auto;
	background-position: center;
	margin-right: 1.4rem;
	border-radius: 50%;
}


/* +++ #menu-button +++ */
@media screen and (min-width: 769px){
	#menu-button{
		display: none;
	}
}

@media screen and (max-width: 1180px) and (min-width: 769px){
	#header{
		height: 12rem;
		top: -12rem;
	}
	#header .inner{
		max-width: 100%;
		align-items: flex-start;
		padding: 1.5rem 0;
		justify-content: space-between;
	}

	nav{
		padding-right: 0;
		width: 100%;
		margin-top: 1.2rem;
		justify-content: space-between !important;
	}
	#global-navi{
		padding-right: 0;
		margin-right: 2.4vw;
		justify-content: space-between;
		padding-right: 2.4vw;
		width: calc(100% - 2.4vw - 15.7rem);
	}

	#global-navi li{
		margin-right: 2.6vw;
	}
	nav .tel-button{
		margin-right: 0;
		margin-left: 0;
	}

	#header.fixed{
		top: -12rem;
		transform: translateY(12rem);
	}
/*
	#header .tel-button{
		font-size: 1.4rem;
	}
	nav .tel-button:before {
		width: 3.6rem;
		height: 3.6rem;
		margin-right: .5rem;
	}

*/
}





/* +++main+++ */
main{
	display: block;
}




/* +++ common parts +++ */

/* +++ .sec +++ */
.sec{
	padding-top: 12rem;
	padding-bottom: 12rem;
}

/* +++ .sec-title01 +++ */
.sec-title01:before{
	content: attr(data-en);
	display: block;
	font-size: 2rem;
	letter-spacing: .075em;
	margin-bottom: 3rem;
	color: #b7ac5f;
	font-weight: 500;
}
.sec-title01{
	font-size: 3.2rem;
	font-weight: 600;
	letter-spacing: .075em;
}

/* +++ .sec-title02 +++ */
.sec-title02:after{
	content: "";
	display: block;
	background: linear-gradient(-90deg, #c2bc9a 0%, #ada578 27%, #998f56 81%);
	width: 100%;
	height: 1px;
	position: absolute;
	left: 0;
	bottom: 0;
}
.sec-title02{
	font-size: 2.6rem;
	font-weight: 600;
	letter-spacing: .05em;
	padding-bottom: 1.2rem;
	position: relative;
	margin-bottom: 2.5rem;
}

/* +++ .sec-title03 +++ */
.sec-title03{
	font-size: 1.9rem;
	font-weight: 600;
	letter-spacing: .05em;
}
.sec-title03:before{
	content: "";
	display: block;
	width: 3.1rem;
	height: 4.3rem;
	background: url(../images/title-icon01.svg) no-repeat;
	background-position: center;
	background-size: 100% auto;
	margin-right: 1.5rem;
}

/* +++hover style+++ */
.zoom-animation{
	transition: .5s all ease;
}
a:hover.zoom-animation{
	transform: scale(1.05);
	box-shadow: 0 0 4rem rgba(0,0,0,.05) !important;
}
.zoom-pic{
	transition: .5s all ease;
}
a:hover .zoom-pic{
	transform: scale(1.05);
	box-shadow: 0 0 4rem rgba(0,0,0,.05) !important;
}

/* +++button01+++ */
.button01{
	font-size: 1.8rem;
	line-height: 1;
}
.button01 .icon{
	width: 5.2rem;
	height: 5.2rem;
	background: #b7ac5f;
	border-radius: 50%;
	margin-right: 2rem;
	position: relative;
}
.button01 .icon img{
	display: block;
	width: 42%;
	position: relative;
	z-index: 9;
}
.button01 .icon:after{
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	border-radius: 50%;
	background: #00b2a6;
	z-index: 2;
	transition: .4s all ease;
	transform: scale(0);
	opacity: 0;
}
.button01:hover .icon:after{
	transform: scale(1);
	opacity: 1;
}
/* +++ #footer +++ */
.clinic-info{
	background: linear-gradient(180deg, #fff 0%, #f3f2ea 91.247%, #f3f2ea 100%);
	overflow: hidden;
	position: relative;
}
.clinic-info h2{
	font-size: 2.5rem;
	letter-spacing: .1em;
	padding-top: 2rem;
}
.clinic-detail{
	width: 42.857%;
}
.consultation-hours{
	width: 53.571%;
}
.clinic-info .logo{
	user-select: none;
	position: absolute;
	left: -7.2rem;
	top: 5.8rem;
	width: 46.6rem;
	z-index: 1;
}
.clinic-info .inner{
	max-width: 112rem;
	padding: 16rem 0 8rem;
	z-index: 2;
}
.clinic-info p{
	padding: 3rem 0;
	line-height: 1.666;
	letter-spacing: .1em;
}
#access{
	width: 100%;
	height: 39.6rem;
}
#access>iframe{
	display: block;
	width: 100%;
	height: 100%;
}
#footer .button01{
	margin-right: 3rem;
	margin-bottom: 1.5rem;
}
#footer .clinic-detail li:nth-of-type(1){
	width: 100%;
	margin-right: 0;
}
footer .button01 .icon{
	width: 4.4rem;
	height: 4.4rem;
	margin-right: 1.5rem;
}
footer .button01 dt{
	font-size: 88.888888%;
	margin-bottom: .8rem;
}
.button01 .tel-icon img,
.button01 .map-icon img{
	width: 38.636%;
}
.button01 .insta-icon{
	background: #595440;
}
.button01 .insta-icon img{
	width: 54.545%;
}
footer table{
	margin-bottom: 3rem;
}
footer tr{
	border-bottom: 1px solid #c3af80;
}
footer tr th:nth-of-type(1),
footer tr td:nth-of-type(1){
	width: 35%;
	text-align: left;
}
footer th,
footer td{
	padding-top: 3rem;
	padding-bottom: 3rem;
	text-align: center;
	vertical-align: top;
}
footer th{
	font-size: 1.8rem;
	font-weight: 600;
}
footer td{
	font-size: 1.7rem;
	font-weight: 600;
}
footer tr th:not(:nth-of-type(1)),
footer tr td:not(:nth-of-type(1)){
	padding-left: 1.6rem;
	padding-right: 1.6rem;
}
.consultation-hours dt,
.consultation-hours dd{
	margin-bottom: 1.6rem;
	line-height: 1.5294;
	font-size: 1.7rem;
}
.consultation-hours dt:after{
	content: "：";
	display: inline;
}
footer .description{
	padding-left: 1.5em;
}
.sitemap{
	background: linear-gradient(0deg, #595440 0%, #7b7456 40%, #847c5b 100%);
	padding-top: 7rem;
	padding-bottom: 2.5rem;
}
.sitemap .inner{
	padding-bottom: 14rem;
	padding-left: 4.8rem;
	padding-right: 4.8rem;
	line-height: 2.375;
	letter-spacing: .1em;
}
.sitemap .inner>ul:nth-of-type(1){
	width: 24%;
}
.sitemap .inner>ul:nth-of-type(2){
	width: 59%;
}
.sitemap .inner>ul:nth-of-type(3){
	width: 17%;
}
.sitemap li a{
	position: relative;
}

.sitemap .child li a:after{
	left: -2.2em;
}
.sitemap>.flex>ul>li>a{
	position: relative;
}
.sitemap>.flex>ul>li>a:before{
	content: "";
	display: block;
	width: calc(100% + .5em);
	height: 1px;
	position: absolute;
	left: -.25em;
	top: .7em;
	background: #c7b383;
	transition: .3s all ease;
	transform: scaleX(0);
	transform-origin: left top;
}
.sitemap>.flex>ul>li>a:hover:before{
	transform: scaleX(100%);
}
.sitemap .child{
	padding-left: 1em;
}
.sitemap .child li a{
	position: relative;
	padding-left: 2rem;
}
.sitemap .child li a:before{
	content: "";
	width: 1.1rem;
	height: 1px;
	position: absolute;
	display: block;
	background: #c7b383;
	position: absolute;
	left: 0;
	top: .65em;
	transition: .3s all ease;
}
.sitemap .child li a:hover:before{
	width: 100%;
	right: 0;
}
.sitemap .child:nth-of-type(1){
	padding-right: 1.8em;
}

#copyrights{
	font-size: 1.4rem;
	letter-spacing: .075em;
}


/* +++page top+++ */
#page-top{
	width: 6rem;
	display: block;
	position: fixed;
	bottom: 6rem;
	right: min(5rem, 3.66vw);
	z-index: 999999;
	visibility: hidden;
	opacity: 0;
	transition: .3s all ease;
}
#page-top.visible{
	visibility: visible;
	opacity: 1;
}

@media screen and (max-width: 768px){
	#menu-button{
		width: 3.5rem;
		height: 100%;
		display: block;
		position: absolute;
		right: 0;
		top: 0;
		font-size: 1.4rem;
		border: none;
		background: transparent;
		cursor: pointer;
		outline: none;
	}
	#menu-button>span{
		width: 100%;
		height: 1px;
		background: #333;
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		top: 40%;
		margin: auto;
		transition: .3s all ease;
		margin-bottom: 2em;
	}
	#menu-button>span:nth-of-type(1){
		transform: translateY(-6px);
	}
	#menu-button>span:nth-of-type(3){
		transform: translateY(6px);
	}

	.opened #menu-button>span:nth-of-type(1){
		transform: translateY(0) rotate(30deg);
	}
	.opened #menu-button>span:nth-of-type(3){
		transform: translateY(0) rotate(-30deg);
	}
	.opened #menu-button>span:nth-of-type(2){
		transform: translateX(50%);
		opacity: 0;
		visibility: hidden;
	}

	#menu-button div{
		position: absolute;
		left: 0;	
		right: 0;
		bottom: 20%;
		margin: auto;
		text-align: center;
	}
	#menu-button div span{
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		text-align: center;
		letter-spacing: .1em;
	}
	#menu-button .close{
		display: none;
	}
	.opened #menu-button .close{
		display: block;
	}
	.opened #menu-button .menu{
		display: none;
	}
}





@media screen and (max-width: 768px){
	html{
		font-size: 2.6666666666vw; /* 375pxの時に10px相当 */
	}
	body{
		font-size: 1.6rem;
		overflow-x: hidden;

	}
	.outer{
		padding-left: 2rem;
		padding-right: 2rem;
	}
	.inner{
		max-width: 100%;
	}
	p{
		font-size: 1.6rem;
	}
	main{
		overflow: hidden;
	}

/* +++ #header +++ */
	#header{
		height: 5rem;
		position: fixed !important;
		left: 0;
		top: 0 !important;
		transform: translateY(0) !important;
		background: #fff;
		z-index: 9999999;
	}
	#header .inner{
		height: 100%;
		max-width: 100%;
	}
	#header .logo{
/*
		width: 16rem;
*/
		width: 20rem;
	}
	#menu-button{
		width: 3rem;
		font-size: 1.2rem;
		color: #333;
	}
	#menu-button>span{
		width: 3rem;
		top: 35%;
	}
	#menu-button>span:nth-of-type(1){
		transform: translateY(-.4rem);
	}
	#menu-button>span:nth-of-type(3){
		transform: translateY(.4rem);
	}

/* +++ nav +++ */
	nav{
		background: #fff;
		padding: 6.5rem 2rem 4.5rem;
		line-height: 1;
		position: fixed;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		height: 100vh;
		align-items: flex-start !important;
		width: 100%;
		overflow: auto;
		visibility: hidden;
		opacity: 0;
		transition: .3s all ease;
	}
	.opened nav{
		opacity: 1;
		visibility: visible;
	}
	#global-navi{
		display: block;
		padding-right: 0;
		border-right: none;
		margin-right: 0;
		width: 100%;
	}
	#global-navi li{
		margin-right: 0;
		width: 100%;
		border-bottom: 1px solid #ccc;
	}
	#global-navi li a{
		padding: 1.8rem 0;
		display: block;
	}
	#header .tel-button{
		font-size: 1.8rem;
		letter-spacing: .1em;
		padding: 1.8rem 1.5rem;
		justify-content: center;
		width: 100%;
		border: 1px solid #ccc;
		margin-top: 2.1rem;
	}
	nav .tel-button:before{
		content: "";
		display: block;
		width: 4rem;
		height: 4rem;
		background-color: #b7ac5f;
		background-image: url(../images/tel-icon-white01.svg);
		background-repeat: no-repeat;
		background-size: 37.5% auto;
		background-position: center;
		margin-right: 1.4rem;
		border-radius: 50%;
	}

	nav .child{
		padding-bottom: 1.5rem;
		display: none;
	}
	nav .child li{
		border: none !important;
	}
	nav .child li a{
		padding: 1.5rem 0 1.5rem 1.8rem !important;
	}
	nav .parent{
		position: relative;
	}
	nav .toggle-button{
		width: 4rem;
		height: 4rem;
		position: absolute;
		right: 0;
		top: .6rem;
	}
	nav .toggle-button:before{
		content: "+";
		display: block;
		font-size: 125%;
	}
	nav .toggle-button.active:before{
		content: "-";
	}
	nav li:not(.parent) a{
		background: url(../images/arrow-gold01.svg) no-repeat;
		background-position: right 1.5rem center;
		background-size: auto .8em;
	}

/* +++ .sec +++ */
	.sec{
		padding-top: 6rem;
		padding-bottom: 6rem;
	}

/* +++button01+++ */
	.button01{
		font-size: 1.6rem;
	}
	.button01 .icon{
		width: 3.6rem;
		height: 3.6rem;
		margin-right: 1rem;
	}


/* +++ .sec-title01 +++ */
	.sec-title01:before{
		font-size: 1.3rem;
		margin-bottom: 1.2rem;
	}
	.sec-title01{
		font-size: 2.4rem;
		font-weight: 600;
	}

/* +++ .sec-title02 +++ */
	.sec-title02{
		font-size: 2rem;
		padding-bottom: 1rem;
		margin-bottom: 2rem;
	}

/* +++ .sec-title03 +++ */
	.sec-title03{
		font-size: 1.7rem;
	}
	.sec-title03:before{
		width: 1.8rem;
		height: 2.4rem;
		margin-right: .8rem;
	}



/* +++ #footer +++ */
	.clinic-info h2{
		font-size: 2.4rem;
		padding-top: 0;
	}
	.clinic-detail{
		width: 100%;
		margin-bottom: 1.6rem;
	}
	.consultation-hours{
		width: 100%;
	}
	.clinic-info .logo{
		left: -1.5rem;
		top: 2.4rem;
		width: 61.8%;
	}
	.clinic-info .inner{
		max-width: 100%;
		padding: 6rem 0 4.5rem;
		display: block;
	}
	.clinic-info p{
		padding: 1.8rem 0;
	}
	#access{
		width: 100%;
		height: calc(100vw / 3 * 2);
	}
	#footer .button01{
		margin-right: 0;
		margin-bottom: 2.4rem;
	}
	#footer .clinic-detail ul{
		justify-content: space-between;
	}
	#footer .clinic-detail li{
		width: calc(50% - .75rem);
	}
	#footer .clinic-detail li:nth-of-type(1){
		width: 100%;
	}
	footer .button01 .icon{
		width: 3.6rem;
		height: 3.6rem;
		margin-right: 1rem;
	}
	footer table{
		margin-bottom: 1.8rem;
	}

	footer tr th:nth-of-type(1),
	footer tr td:nth-of-type(1){
		width: 35%;
		text-align: left;
	}
	footer th,
	footer td{
		padding-top: 1.5rem;
		padding-bottom: 1.5rem;
		text-align: center;
		vertical-align: top;
	}
	footer th{
		font-size: 1.6rem;
	}
	footer td{
		font-size: 1.5rem;
	}
	footer tr th:not(:nth-of-type(1)),
	footer tr td:not(:nth-of-type(1)){
		padding-left: 1.2rem;
		padding-right: 1.2rem;
	}
	.consultation-hours dt,
	.consultation-hours dd{
		margin-bottom: 1.5rem;
		font-size: 1.5rem;
	}
	.consultation-hours dt{
		max-width: 6em;
	}
	.consultation-hours dd{
		width: calc(100% - 6em);
	}
	footer .description{
		padding-left: 0;
	}
	.sitemap{
		padding-top: 3rem;
		padding-bottom: 2.4rem;

	}
	.sitemap .inner{
		padding-bottom: 0;
		padding-left: 2rem;
		padding-right: 2rem;
		line-height: 1.35;
		font-size: 1.4rem;
		justify-content: space-between;
	}
	.sitemap .inner>ul{
		width: calc(50% - 1rem) !important;
	}
	.sitemap .inner>ul{
		display: flex;
		flex-wrap: wrap;
	}
	.sitemap .inner>ul>li{
		width: 100%;
		margin-bottom: 2rem;
	}
/*
	.sitemap .inner>ul:nth-of-type(2){
		width: 100%;
	}
	.sitemap .inner>ul:nth-of-type(3){
		width: 100%;
	}
*/
	.sitemap .inner>ul>li.parent{
		width: 100%;
	}
	.sitemap .inner>ul>li div.flex{
		display: flex;
		width: 100%;
	}
	.sitemap .child{
		padding: 0;
		width: 100%;
	}
	.sitemap .child li{
		width: 100%;
		padding: 0;
		letter-spacing: 0;
		margin-top: 2rem;
	}
	.sitemap .child:nth-of-type(1){
		padding-right: 0;
	}
	#copyrights{
		font-size: 1.2rem;
		margin-top: 2.2rem;
	}


/* +++page top+++ */
	#page-top{
		width: 4.5rem;
		bottom: 4.5rem;
		right: 2rem;
	}
}




@media screen and (min-width: 769px){
	.pc-none{
		display: none !important;
	}
	.pc-event-none{
		pointer-events: none;
	}
}
@media screen and (max-width: 768px){
	.sp-none{
		display: none !important;
	}
}