@charset "utf-8";

/*		Contents
---------------------------------------------------------------------------
	h要素（見出し）
	widget_hero（キービジュアル）
	widget_btn（ボタン）
	widget_menu（メニューボタン）
	widget_navi（ナビゲーションボタン）
	widget_dl（定義リスト）
	widget_box（ボックス）
	widget_border（枠線）
	widget_flex（カラム）
	widget_form（フォーム）
	widget_entry（投稿詳細）
	list_news（一覧：お知らせ）
	list_img（一覧：画像）
	list_indent（一覧：インデント）
	content_contact（コンテンツ：ご予約・ご相談・料金体系）
------------------------------------------------------------------------ */

/* ========================================================================
	h要素（見出し）
======================================================================== */
.h_01 {
	margin: 0 0 60px 0;
	text-align: center;
	font-size: 3.2rem;
	line-height: 1;
}

.h_01 .en {
	display: inline-block;
	padding: 0 10px;
	background: linear-gradient(transparent 0% 75%, rgba(255, 216, 0, 0.3) 75% 100%, transparent 100% 100%) no-repeat center bottom 6px;
	vertical-align: bottom;
	font-family: "adorn-garland", sans-serif;
	color: #655A4F;
}

.h_01 .ja {
	display: block;
	margin: 20px 0 0 0;
	font-family: "Noto Serif JP", serif;
}

@media screen and (max-width:767px) {
	.h_01 {
		margin: 0 0 30px 0;
		font-size: 2.0rem;
	}

	.h_01 .en {
		background: linear-gradient(transparent 0% 60%, rgba(255, 216, 0, 0.3) 60% 100%, transparent 100% 100%) no-repeat center bottom 2px;
	}

	.h_01 .ja {
		margin: 10px 0 0 0;
	}
}


/* ========================================================================
	widget_hero（キービジュアル）
======================================================================== */
.widget_hero {
	position: relative;
}


/* ----------------------------------------
	splide
---------------------------------------- */
.widget_hero .splide ul li img {
	width: 100%;
	height: 840px;
	object-fit: cover;
}

.widget_hero .splide ul li p {
	position: absolute;
	top: 250px;
	left: 50%;
	transform: translateX(-50%);
	width: 1200px;
	text-align: center;
	text-shadow: 0px 0px 10px #000000;
	font-size: 3.5rem;
	color: #FFFFFF;
	line-height: 7.5rem;
}

.widget_hero .splide ul li:nth-child(2) p {
	top: 550px;
	text-align: left;
}

.widget_hero .splide ul li:nth-child(3) p {
	top: 338px;
}

.widget_hero .splide ul li p>span {
	display: inline-block;
	position: relative;
	font-size: 4.8rem;
	line-height: 1;
}

.widget_hero .splide ul li:nth-child(1) p>span {
	margin: 30px 0 20px 0;
}

.widget_hero .splide ul li p>span::before {
	content: "";
	position: absolute;
	bottom: -10px;
	left: 10px;
	width: calc(100% - 20px);
	height: 18px;
	background: rgba(255, 255, 255, 0.2);
}

@media screen and (max-width:767px) {
	.widget_hero .splide ul li {
		height: 600px;
	}

	.widget_hero .splide ul li img {
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
	}

	.widget_hero .splide ul li p {
		top: 220px;
		left: 0;
		transform: none;
		width: 100%;
		font-size: 1.6rem;
		line-height: 3.6rem;
	}

	.widget_hero .splide ul li:nth-child(2) p {
		top: 380px;
		padding: 0 20px;
	}

	.widget_hero .splide ul li:nth-child(3) p {
		top: 260px;
	}

	.widget_hero .splide ul li p>span {
		margin: 0 0 10px 0;
		font-size: 3.2rem;
	}

	.widget_hero .splide ul li:nth-child(1) p>span {
		margin: 10px 0;
	}

	.widget_hero .splide ul li:nth-child(2) p>span {
		margin: 0 -10px 10px;
	}

	.widget_hero .splide ul li p>span::before {
		bottom: -6px;
		height: 8px;
	}
}


/* ----------------------------------------
	key
---------------------------------------- */
.widget_hero .key {
	position: relative;
	height: 840px;
	background: url(../../img/common/key2.jpg?v=2504) no-repeat center;
	background-size: cover;
}

.widget_hero .key h1 {
	position: absolute;
	bottom: 185px;
	left: 0;
	padding: 15px 20px 15px 40px;
	filter: drop-shadow(5px 5px 0 rgba(101, 90, 79, 0.5));
	background: #FFFFFF;
	font-family: "Noto Serif JP", serif;
	font-size: 3.5rem;
	font-weight: 500;
	color: #655A4F;
	line-height: 1;
}

.widget_hero .key h1::before {
	content: "";
	position: absolute;
	top: 0;
	right: -40px;
	border-style: solid;
	border-color: #FFFFFF transparent transparent transparent;
	border-width: 65px 40px 0px 0px;
}

.widget_hero .key h1 span {
	display: inline-block;
	margin: 0 0 0 20px;
	vertical-align: bottom;
	font-family: "adorn-garland", sans-serif;
	font-size: 2.4rem;
}

@media screen and (max-width:767px) {
	.widget_hero .key {
		height: 240px;
	}

	.widget_hero .key h1 {
		bottom: 25px;
		padding: 14px 10px 14px 20px;
		font-size: 1.8rem;
	}

	.widget_hero .key h1::before {
		right: -24px;
		border-width: 46px 24px 0px 0px;
	}

	.widget_hero .key h1 span {
		margin: 0 0 0 10px;
		font-size: 1.6rem;
	}
}


/* ----------------------------------------
	navi
---------------------------------------- */
.widget_hero .navi {
	display: flex;
	justify-content: center;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background: rgba(255, 255, 255, 0.9);
}

.widget_hero .navi a {
	display: flex;
	align-items: center;
	position: relative;
	height: 100px;
	padding: 0 20px;
	font-size: 1.4rem;
	font-weight: 700;
	color: #655A4F;
	text-decoration: none;
}

.widget_hero .navi a::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 20px;
	width: calc(100% - 40px);
	height: 2px;
	margin: 15px 0 0 0;
	background: none;
	transition-duration: 0.2s;
}

.widget_hero .navi a:hover::before {
	background: #655A4F;
}

@media screen and (max-width:767px) {
	.widget_hero .navi {
		display: none;
	}
}


/* ========================================================================
	widget_btn（ボタン）
======================================================================== */
.widget_btn {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	margin: 0 0 60px 0;
}

.widget_btn a,
.widget_btn button {
	display: flex;
	justify-content: center;
	align-items: center;
	min-width: 340px;
	min-height: 64px;
	padding: 10px 62px;
	background: url(../../img/common/arrow_01.png) no-repeat right 20px center #655A4F;
	background-size: 22px;
	border: 1px solid #655A4F;
	font-family: "Noto Serif JP", serif;
	font-size: 1.8rem;
	font-weight: 500;
	color: #FFFFFF;
	line-height: 2.4rem;
	text-decoration: none;
}

.widget_btn a.white {
	background-image: url(../../img/common/arrow_02.png);
	background-color: #FFFFFF;
	color: #655A4F;
}

@media screen and (max-width:767px) {
	.widget_btn {
		margin: 0 20px 40px;
	}

	.widget_btn a,
	.widget_btn button {
		min-width: auto;
		min-height: 56px;
		width: 100%;
		padding: 10px 40px;
		background-position: right 10px center;
		background-size: 20px;
		font-size: 1.6rem;
		line-height: 2.2rem;
	}
}


/* ========================================================================
	widget_menu（メニューボタン）
======================================================================== */
.widget_menu {
	margin: 0 0 30px 0;
}

.widget_menu a {
	padding: 0 0 0 26px;
	background: url(../../img/common/arrow_menu.png) no-repeat left center;
	background-size: 18px;
	font-family: "Noto Serif JP", serif;
	font-size: 1.4rem;
}

@media screen and (max-width:767px) {
	.widget_menu {
		margin: 0 0 20px 0;
	}
}


/* ========================================================================
	widget_navi（ナビゲーションボタン）
======================================================================== */
.widget_navi {
	width: 600px;
	margin: 0 auto;
	padding: 0 0 52px 0;
}

.widget_navi a {
	display: flex;
	align-items: center;
	margin: 0 0 8px 0;
	padding: 15px 56px 15px 22px;
	background: url(../../img/common/arrow_navi.png) no-repeat right 22px center;
	background-size: 14px 8px;
	border: 1px solid #655A4F;
	font-family: "Noto Serif JP", serif;
	font-weight: 500;
	color: #655A4F;
	text-decoration: none;
	transition-duration: 0.2s;
}

.widget_navi a:hover {
	opacity: 0.7;
}

.widget_navi span {
	margin: 0 0.5em 0 0;
}

@media screen and (max-width:767px) {
	.widget_navi {
		width: auto;
		padding: 0 0 32px 0;
	}

	.widget_navi a {
		padding: 12px 42px 12px 14px;
		background-position: right 14px center;
		font-size: 1.4rem;
	}
}


/* ========================================================================
	widget_dl（定義リスト）
======================================================================== */
.widget_dl {
	margin: 0 0 30px 0;
}

.widget_dl dt {
	display: inline-block;
	margin: 0 0 12px 0;
	padding: 5px 10px;
	background: #655A4F;
	font-family: "Noto Serif JP", serif;
	font-weight: 700;
	color: #FFFFFF;
	line-height: 1;
}

.widget_dl dd {
	font-size: 1.4rem;
}

@media screen and (max-width:767px) {
	.widget_dl {
		margin: 0 0 20px 0;
	}

	.widget_dl dt {
		font-size: 1.4rem;
	}
}


/* ========================================================================
	widget_box（ボックス）
======================================================================== */
.widget_box {
	display: grid;
	justify-content: center;
	margin: 0 0 60px 0;
	padding: 30px 0 10px 0;
	background: #FBF7F4;
	border: 1px solid #655A4F;
}

.widget_box p {
	margin: 0 0 20px 0;
	font-size: 1.4rem;
}

.widget_box p.lead {
	width: auto;
	text-align: center;
	font-size: 2.0rem;
	font-weight: 500;
	letter-spacing: 0.07em;
}

.widget_box .img {
	padding: 10px 0 30px 0;
	text-align: center;
}

@media screen and (max-width:767px) {
	.widget_box {
		margin: 0 0 40px 0;
		padding: 30px 20px 5px;
	}

	.widget_box p.lead {
		font-size: 1.8rem;
	}

	.widget_box .img {
		padding: 0 0 20px 0;
	}
}


/* ----------------------------------------
	check
---------------------------------------- */
.widget_box .check {
	margin: 0 auto 15px;
	font-size: 1.8rem;
}

.widget_box .check li {
	margin: 0 0 5px 0;
	padding: 0 0 0 22px;
	background: url(../../img/common/icon_check.png) no-repeat left 7px;
	background-size: 14px;
}

@media screen and (max-width:767px) {
	.widget_box .check li {
		background-position: left 5px;
		font-size: 1.6rem;
	}
}


/* ----------------------------------------
	note
---------------------------------------- */
.widget_box .note {
	margin: 0 auto 20px;
	padding: 0 0 0 1.0em;
	text-indent: -1.0em;
	font-size: 1.2rem;
}


/* ========================================================================
	widget_border（枠線）
======================================================================== */
.widget_border {
	display: flex;
	justify-content: center;
	margin: 0 0 30px 0;
}

.widget_border img,
.widget_border iframe,
.widget_border dl {
	padding: 3px;
	border: 1px solid #B1ACA6;
}

.widget_border dl {
	width: 600px;
	margin: 0 auto;
	padding: 15px 50px 12px;
	text-align: center;
}

.widget_border dl dt {
	margin: 0 0 12px 0;
	padding: 0 0 12px 0;
	border-bottom: 1px solid #B1ACA6;
	font-size: 1.4rem;
}

.widget_border dl dd img {
	padding: 0;
	border: none;
}

@media screen and (max-width:767px) {
	.widget_border {
		margin: 0 0 20px 0;
	}

	.widget_border img {
		width: 100%;
	}

	.widget_border dl {
		width: auto;
		padding: 15px 20px 12px;
	}
}


/* ========================================================================
	widget_flex（カラム）
======================================================================== */
.widget_flex {
	display: flex;
	align-items: flex-start;
}

.widget_flex>p,
.widget_flex .block {
	flex: 1;
	padding: 0 20px 0 0;
}

.widget_flex ul {
	margin: 0 0 30px 0;
}

.widget_flex .widget_border {
	width: 400px;
}

@media screen and (max-width:767px) {
	.widget_flex {
		display: block;
	}

	.widget_flex>p,
	.widget_flex .block {
		padding: 0;
	}

	.widget_flex ul {
		margin: 0 0 20px 0;
	}

	.widget_flex .widget_border {
		width: auto;
	}
}


/* ========================================================================
	widget_form（フォーム）
======================================================================== */
.widget_form .must {
	padding: 0 0 0 0.5em;
	color: #FF0000;
}

.widget_form .size_S {
	width: 110px;
}

.widget_form .size_M {
	width: 280px;
}

.widget_form p {
	text-align: center;
	font-size: 1.4rem;
}

.widget_form table th {
	width: 240px;
	text-align: left;
	font-weight: 500;
	white-space: nowrap;
}

.widget_form table td {
	font-weight: 500;
}

.widget_form table td p {
	margin: 0 0 10px 0;
	text-align: left;
	font-size: 1.6rem;
	font-weight: 500;
}

@media screen and (max-width:767px) {
	.widget_form .size_M {
		width: 100%;
	}

	.widget_form p {
		text-align: left;
	}

	.widget_form table th {
		width: auto;
	}

	.widget_form table td p {
		font-size: 1.4rem;
	}
}


/* ----------------------------------------
	check
---------------------------------------- */
.widget_form .check {
	margin: 0 0 30px 0;
	text-align: center;
}

.widget_form .check label {
	margin: 0;
	line-height: 1.5;
}

@media screen and (max-width:767px) {
	.widget_form .check {
		margin: 0 0 20px 0;
		text-align: left;
	}

	.widget_form .check label {
		display: flex;
	}

	.widget_form .check input {
		margin-right: 1.0em;
	}
}


/* ----------------------------------------
	recaptcha
---------------------------------------- */
.widget_form .recaptcha {
	font-size: 1.2rem;
}


/* ----------------------------------------
	btn
---------------------------------------- */
.widget_form .btn {
	text-align: center;
}

.widget_form .btn button {
	width: 300px;
	height: 40px;
	margin: 0 0 30px 0;
	background: #936B43;
	border-radius: 4px;
	color: #FFFFFF;
}

@media screen and (max-width:767px) {
	.widget_form .btn {
		margin: 0 20px;
	}

	.widget_form .btn button {
		width: 100%;
		margin: 0 0 20px 0;
	}
}


/* ========================================================================
	widget_entry（投稿詳細）
======================================================================== */
.widget_entry .aligncenter {
	display: block;
	margin: 0 auto 60px;
	border-radius: 30px;
}

.widget_entry .alignright {
	float: right;
	margin: 0 0 0 60px;
	border-radius: 30px;
}

.widget_entry .alignleft {
	float: left;
	margin: 0 60px 0 0;
	border-radius: 30px;
}

.widget_entry {
	padding: 0 0 30px 0;
}

.widget_entry .wp-video {
	margin: 0 auto;
}

.widget_entry h2 {
	margin: 0 0 30px 0;
	text-align: left;
}

.widget_entry p::after {
	content: "";
	display: block;
	clear: both;
}

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

	.widget_entry .aligncenter,
	.widget_entry .alignright,
	.widget_entry .alignleft {
		display: block;
		float: none;
		margin: 0 auto 40px;
	}

	.widget_entry {
		padding: 0 0 20px 0;
	}

	.widget_entry h2 {
		margin: 0 0 20px 0;
		font-size: 2.0rem;
		line-height: 3.0rem;
	}

	.widget_entry h3 {
		margin: 0 0 20px 0;
		font-size: 1.8rem;
		line-height: 2.8rem;
	}
}


/* ========================================================================
	list_news（一覧：お知らせ）
======================================================================== */
.list_news {
	padding: 0 0 44px 0;
}

.list_news li {
	display: flex;
	margin: 0 0 16px 0;
	padding: 0 0 10px 0;
	border-bottom: 1px solid #707070;
	font-size: 1.4rem;
	line-height: 2.2rem;
}

.list_news time {
	font-weight: 700;
	color: #655A4F;
}

.list_news a {
	margin: 0 0 0 14px;
	color: #655A4F;
	text-decoration: none;
}

.list_news a:hover {
	text-decoration: underline;
}

@media screen and (max-width: 767px) {
	.list_news {
		padding: 0 0 10px 0;
	}

	.list_news li {
		flex-direction: column;
		margin: 0 0 20px 0;
	}

	.list_news time {
		line-height: 1;
	}

	.list_news a {
		margin: 6px 0 0 0;
	}
}


/* ========================================================================
	list_img（一覧：画像）
======================================================================== */
.list_img {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 30px 0;
}

.list_img li {
	width: 395px;
}

.list_img span {
	display: block;
	margin: 0 0 10px 0;
	font-size: 1.4rem;
}

.list_img img {
	padding: 3px;
	border: 1px solid #B1ACA6;
}

@media screen and (max-width:767px) {
	.list_img {
		display: block;
		margin: 0;
	}

	.list_img li {
		width: auto;
		margin: 0 0 20px 0;
	}

	.list_img img {
		width: 100%;
	}
}


/* ========================================================================
	list_indent（一覧：インデント）
======================================================================== */
.list_indent {
	margin: 0 0 30px 0;
}

.list_indent li {
	padding-left: 1.0em;
	text-indent: -1.0em;
	font-size: 1.4rem;
}

@media screen and (max-width: 767px) {
	.list_indent {
		margin: 0 0 20px 0;
	}
}


/* ========================================================================
	content_contact（コンテンツ：ご予約・ご相談・料金体系）
======================================================================== */
.content_contact {
	margin-top: 40px;
}

@media screen and (max-width: 767px) {
	.content_contact {
		margin-top: 20px;
	}
}


/* ----------------------------------------
	widget_btn
---------------------------------------- */
.content_contact .widget_btn {
	justify-content: flex-start;
}

@media screen and (max-width: 767px) {
	.content_contact .widget_btn {
		justify-content: center;
	}
}


/* ----------------------------------------
	box
---------------------------------------- */
.content_contact .box {
	position: relative;
	margin: 0 0 60px 0;
	padding: 30px 0 30px 48px;
	background: url(../../img/common/bg_contact.jpg) no-repeat center top;
	background-size: cover;
	color: #FFFFFF;
}

.content_contact .box::before,
.content_contact .box::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 520px;
	height: 100%;
	background: linear-gradient(to right, rgba(101, 90, 79, 1) 0%, rgba(101, 90, 79, 0) 100%);
}

.content_contact .box::before {
	mix-blend-mode: multiply;
}

.content_contact .box>* {
	position: relative;
	z-index: 1;
}

@media screen and (max-width: 767px) {
	.content_contact .box {
		margin: 0 -20px 40px;
		padding: 180px 20px 30px;
		background-size: auto calc(100% + 50px);
		background-position: center top -50px;
	}

	.content_contact .box::before,
	.content_contact .box::after {
		width: 100%;
		height: 80%;
		background: linear-gradient(to top, rgba(101, 90, 79, 1) 0%, rgba(101, 90, 79, 0) 100%);
	}
}

@media screen and (max-width: 600px) {
	.content_contact .box {
		background-position: right -80px top -50px;
	}
}


/* clinic
---------------------------------------- */
.content_contact .box .clinic {
	display: flex;
	margin: 0 0 30px 0;
}

.content_contact .box .clinic .logo {
	margin: 0 10px 0 0;
}

.content_contact .box .clinic dl dt {
	margin: 14px 0 10px 0;
	font-size: 1.8rem;
	font-weight: 600;
	line-height: 1;
	letter-spacing: -0.01em;
}

.content_contact .box .clinic dl dd {
	font-size: 1.2rem;
	line-height: 2.0rem;
	letter-spacing: 0.06em;
}

.content_contact .box .clinic dl dd span {
	display: block;
	margin: 8px 0 0 0;
	padding: 1px 0;
	border: 1px solid #FFFFFF;
	text-align: center;
	letter-spacing: 0.1em;
}

@media screen and (max-width: 767px) {
	.content_contact .box .clinic {
		justify-content: center;
		align-items: center;
		margin: 0 0 20px 0;
	}

	.content_contact .box .clinic .logo {
		margin: 0 8px 0 0;
	}

	.content_contact .box .clinic .logo img {
		width: 80px;
	}

	.content_contact .box .clinic dl dt {
		margin: 0 0 8px 0;
		font-size: 1.6rem;
		letter-spacing: normal;
	}

	.content_contact .box .clinic dl dd {
		letter-spacing: normal;
	}
}

@media screen and (max-width: 360px) {
	.content_contact .box .clinic .logo {
		flex: 1;
	}
}


/* tel
---------------------------------------- */
.content_contact .box .tel {
	width: 340px;
	text-align: center;
}

.content_contact .box .tel dt {
	margin: 0 0 6px 0;
}

.content_contact .box .tel dd a {
	display: inline-block;
	margin: 0 0 8px 0;
	padding: 1px 0 1px 38px;
	background: url(../../img/common/icon_tel01.png) no-repeat left center;
	background-size: 30px;
	font-size: 2.8rem;
	color: #ffffff;
	line-height: 1;
	letter-spacing: 0.1em;
	text-decoration: none;
}

.content_contact .box .tel dd .tel_time {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 10px 0;
}

.content_contact .box .tel dd .tel_time:before,
.content_contact .box .tel dd .tel_time:after {
	content: "";
	width: 36%;
	height: 1px;
	display: block;
	background: #fff;
}

.content_contact .box .tel dd {
	font-size: 18px;
}


.content_contact .box .tel dd small {
	font-size: 12px;
	display: block;
	margin: 8px 0 0;
}


@media screen and (max-width: 767px) {
	.content_contact .box .tel {
		width: auto;
		font-size: 1.4rem;
	}

	.content_contact .box .tel dd a {
		padding: 0 0 0 32px;
		background-size: 24px;
		font-size: 2.4rem;
		line-height: 1;
	}

	.content_contact .box .tel dd small {
		font-size: 11px;
		display: block;
		margin: 8px 0 0;
	}
}


/* widget_btn
---------------------------------------- */
.content_contact .box .widget_btn {
	margin: 0;
}

.content_contact .box .widget_btn a {
	min-height: 56px;
	margin: 0 0 7px 0;
	padding: 0;
	background: #CBB01F;
	border: none;
	font-size: 1.5rem;
	font-weight: 700;
}

.content_contact .box .widget_btn a span {
	padding: 0 22px 0 0;
	background: url(../../img/common/arrow_03.png) no-repeat right center;
	background-size: 8px 14px;
}

@media screen and (max-width: 767px) {
	.content_contact .box .widget_btn a {
		min-height: 50px;
	}
}


/* ---------- line ---------- */
.content_contact .box .widget_btn a.line {
	margin: 0 0 26px 0;
	background: #FFFFFF;
	color: #333333;
}

.content_contact .box .widget_btn a.line span {
	padding: 1px 0 2px 37px;
	background: url(../../img/common/icon_line.png) no-repeat left center;
	background-size: 27px;
}

@media screen and (max-width: 767px) {
	.content_contact .box .widget_btn a.line {
		margin: 0 0 20px 0;
	}
}
