@charset "utf-8";
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css");

@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400..800&display=swap');


/*--------------------
common
--------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	word-wrap: break-word;
	word-break: break-all;
  }
  
  article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
  }
  
  ol, ul {
	list-style: none;
  }
  
  blockquote, q {
	quotes: none;
  }
  
  blockquote:before, blockquote:after, q:before, q:after {
	content: "";
	content: none;
  }
  
  table {
	margin: 0 auto 2.5em;
	width: 100%;
	border-collapse: collapse;
  }
  table th {
	width: 20%;
	padding: 10px 15px;
	font-weight: bold;
	text-align: left;
	border-collapse: collapse;
  }
  table td {
	padding: 10px;
	text-align: left;
	border-collapse: collapse;
  }
  
  img {
	max-width: 100%;
	height: auto;
	line-height: 0;
  }
  



/*--------------------
root
--------------------*/
:root {
	--font-en: "Sorts Mill Goudy", serif;
	--font-serif: "Noto Sans JP", serif;
	--color-text:#656565;
	--color-base: #D3C2AA;
	--color-base2: #F5F2ED;
	--btn-base: #BEA17A;
	--color-pink:#B10000;
  }
  
  .grecaptcha-badge {
	display: none;
  }
	
html {
  overflow-x: hidden;
  scroll-behavior: smooth;
}
body {
  counter-reset: number 0; 
  overflow-x: hidden;
}
a {
	color: #333;
	text-decoration: none;
	transition : ease-in .2s;
}
a:hover {
	color: var(--color-base);
	transition : ease-in .2s;
}
picture {
	display: block;
}
img{
	max-width: 100%;
	height: auto;
}
.container {
  max-width: 1536px;
	margin: auto;
  padding: 0 2%;
}
.container_m {
	width: 92%;
	max-width: 1200px;
	margin: auto;
	padding: 0 2%;
}
.container_s {
	width: 92%;
	max-width: 960px;
	margin: auto;
	padding: 0 2%;
}

.js-fadein{
	opacity: 0;
    visibility: hidden;
    transform: translateY(40px);
    transition: all 1s;
}
.is-show{
	opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}
.pc {
    display: block;
	@media (max-width: 768px) {
		display: none;
	}
}
.sp {
	display: none;
	@media (max-width: 768px) {
		display: block;
	}
}

body {
	color: #333; 
	font-family: "Noto Serif JP", serif; 
}

.eb{
	font-family: "EB Garamond", serif;
	font-style: normal;
}

header{
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 999;
  .header-in{
	position: relative;
    padding: 20px 0;
    display: flex;
    justify-content: space-between;
	align-items: center;
    max-width: 1800px;
    width: 95%;
    margin: 0 auto;
	z-index: 103;
    .l-head{
      display: flex;
	  align-items: center;
	  width: calc(100% - 80px);
      .logo{
		width: 260px;
        margin-right: 2rem;
      }
      ul{
        display: flex;
        justify-content: flex-end;
		align-items: center;
        list-style: none;
		max-height: 80px;
        padding: .8rem 1.5rem;
        border-radius: 50px;
        background: #EDEDED;
        li{
			a{
				display: block;
				padding: 0 2rem;
				transition: .3s	all ease;
				text-align: center;
				span{
					display: block;
					font-size: 18px;
					color: #928579;
					line-height: 1;
					font-family: var(--font-en);
					font-weight: 400;
					font-style: normal;
					transition: .3s	all ease;
				}
				em{
					font-family: var(--font-serif);
					font-size: 10px;
					color: #8D8D8D;
					font-style: normal;
					display: block;
					transition: .3s	all ease;
				}
				&:hover{
					span,em{
						color: #C49532;
					}
				}
			}
        }
      }
    }
    .r-head{
		display: flex;
		align-items: center;
		.tel-box{
			display: none;
		}
      .instagram{
		margin-left: 1.5rem;
		margin-right: 1rem;
        a{
          display: block;
          &:before{
            content:"\f16d";
            font-size: 3rem;
			color: var(--color-text);
            font-weight: normal;
            font-family: "Font Awesome 6 Free","Font Awesome 6 Brands";
          }
		  &:hover {
			  opacity: 0.8;
		  }
        }
      }
      .hamburger-button{
        width: 50px;
        height: 50px;
		border-radius: 50%;
		background: #fff;
        margin-right: 0;
        margin-left: auto;
        cursor: pointer;
        padding-top: 15px;
      }
	  .hamburger-lines {
		position: relative;
		width: 50%;
		margin: auto;
		height: 20px;
		-webkit-transition-duration: 300ms;
		transition-duration: 300ms;
		.line {
			position: absolute;
			right: 0;
			left: 0;
			display: block;
			width: 100%;
			height: 2px;
			margin: auto;
			border-radius: 30px;
			-webkit-transition-duration: 300ms;
			transition-duration: 300ms;
			background-color: #656565;
			&:nth-child(1) {
				top: 0;
			}
			&:nth-child(2) {
				bottom: 0;
				width: 80%;
				left: 0;
				right: auto;
			}
			&:nth-child(3) {
				top: 50%;
				left: 0;
				right: auto;
				width: 65%;
				transform: translateY(-50%);
			}
		}
	  }
    }
  }
  .ham_nav{
	display: none;
	position: fixed;
	top: 0;
	width: 100%;
	height: 100%;
	background:#6C6C6A;
	flex-direction: column;
	align-items: center;
	transition: ease-in .2s;
	z-index: 101;
	opacity: 0;
	padding: 30px;
	.ham_nav_inner {
		max-width: 960px;
		width: 100%;
		margin: auto;
		.g_nav {
			margin: 0;
			padding: 0;
			border: 0;
			display: flex;
			flex-wrap: wrap;
			gap: 30px 60px;
			li {
				width: calc((100% - 120px) / 3);
				a {
					display: block;
					padding: 10px;
					width: 100%;
					color: var(--color-base);
					background: #fff;
					padding-bottom: 10px;
					span{
						display: block;
					}
					.en {
						font-family: var(--font-en);
						font-size: clamp(1.25rem, 1.108rem + 0.61vw, 1.563rem);
					}
				}
			} 
		}
	}
	.nav_info {
		max-width: 500px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		margin: auto;
		.cta_area {
			width: 100%;
			li {
				width: calc((100% - 20px) / 2);
			}
		}
	}
  }
  
  .ham_nav{
	justify-content: center;
	align-items: center;
	padding-top: 100px;
	.dfbox{
		width: 100%;
	}
	.ham_nav_inner{
		margin: 0 auto 2rem;
		.g_nav{

			justify-content: center;
			gap: 4% 4%;
			li{
				width: 48%;
				margin-bottom: 1rem;
				a{
					color: #645652;
					text-align: center;
				}
			}
		}
	}
	.nav_info{
		display: block;
		margin: 0 auto;
		.f-btn{
			display: flex;
			justify-content: center;
			margin-bottom: 1.5rem;
			p{
				width: 48%;
				max-width: 200px;
				a{
					display: inline-flex;
					width: 100%;
					height: 100%;
					justify-content: center;
					align-items: center;
					color: #fff;
					padding: .5rem 1rem;
					border:1px solid #fff;
					border-radius: 5px;
				}
			}
			.line{
				margin-right: 1rem;
				a{
					display: flex;
					justify-content: center;
					align-items: center;
					.icon{
						display: inline-block;
						margin-right: .5rem;
						width: 25px;
						line-height: 0;
					}
				}

			}
			.web{
				a{
					span{
						
						&:before{
							content: "\f0e0";
							margin-right: .5rem;
							font-weight: 900;
							font-size: 1.5rem;
							font-family: "Font Awesome 6 Free";
							text-align: center;
						}
					}
				}
			}
		}
		.tel{
			margin-bottom: 1rem;
			text-align: center;
			a{
				display: inline-block;
				font-size: 2rem;
				color: #fff;
				&:before{
					content: "\f095";
					margin-right: .5rem;
					font-weight: 900;
					font-size: 2rem;
					font-family: "Font Awesome 6 Free";
					text-align: center;
				}
			}
		}
		.nav_address{
			color: #fff;
			text-align: center;
			font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
		}
		
	}
}
  &.active{
	.ham_nav {
		display: block;
		transition: ease-in .2s;
		opacity: 1;
		overflow-y: scroll;
	}
	.header_inner {
		background: none;
		.g_nav,.cta_area,.ham_area .btn_instagram{
			display: none;
		}
	}
	.hamburger-button{
		padding-top: 4px;
	}
	.l-head{
		ul{
			display: none;
		}
	}
	.r-head{
		.instagram{
			a{
				&:before{
					color: #fff;
				}
			}
		}
		.tel-box{
			display: none !important;
		}
	}
  }
}

.fiexd-btn{
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 150;
	.line{
		margin-bottom: .5rem;
		a{
			display: flex;
			justify-content: center;
			align-items: center;
			flex-wrap: wrap;
			margin: 0 auto;
			width: 110px;
			height: 110px;
			background: rgba(0, 0, 0, .5);
			border-radius: 50%;
			em{
				display: block;
				color: #fff;
				font-style: normal;
				text-align: center;
				img{
					width: 45px;
				}
			}
			&:hover{
				opacity: .8;
			}
		}
	}
	.f-block{
		display: flex;
		justify-content: center;
		p{
			a{
				display: flex;
				justify-content: center;
				align-items: center;
				border-radius: 50%;
				width: 70px;
				height: 70px;
				font-size: 12px;
				color: #fff;
				span{

					&:before{
						content:"";
						display: block;
						margin-bottom: .5rem;
						font-weight: 900;
						font-size: 1.375rem;
						font-family: "Font Awesome 6 Free";
						text-align: center;
					}
				}
			}
			&.tel{
				margin-right: .8rem;
				a{
					background: rgba(190, 161, 122, .5);
					span{
						
						&:before{
							content:"\f095";
						}
						
					}
				}
			}
			&.web{
				a{
					background: rgba(0, 0, 0, .5);
					span{
						
						&:before{
							content:"\f0e0";
						}
						
					}
				}
			}
		}
	}
}
footer{
	padding: 5rem 0;
	background: #3B3B3B;
	.inblock{
		max-width: 1000px;
	}
	.logo{
		margin-bottom: 2rem;
		text-align: center;
		line-height: 0;
		img {
			vertical-align: middle;
		}
	}
	.f-block{
		display: flex;
		justify-content: center;
		margin-bottom: 2rem;
		.link-box{
			display: flex;
			justify-content: space-between;
			width: 55%;
			max-width: 370px;
			margin-right: 15%;
			li{
				margin-bottom: 1rem;
				a{
					position: relative;
					display: inline-block;
					color: #fff;
					font-size: clamp(0.75rem, 0.636rem + 0.48vw, 1rem);
					&:hover{
						opacity: 0.8;
					}
				}
			}
			.l-link{
				width: 50%;
			}
			.r-link{
				width: 45%;
			}
		}
		.btn-box{
			width: 40%;
			.f-btn{
				margin-bottom: 1rem;
				a{
					display: flex;
					justify-content:flex-start;
					align-items: center;
					max-width: 200px;
					padding: .5rem 1rem;
					border:1px solid #fff;
					border-radius: 10px;
					img{
						width: 30px;
						margin-right: 1rem;
					}
					span{
						color: #fff;
						font-size: 1.125rem;
						font-weight: 500;
					}
				}
				&.web{
					a{
						padding-left:1.5rem ;
						span{
							
						&:before{
							content:"\f0e0";
							display: inline-block;
							margin-right: 1rem;
							font-size: 1.5rem;
							font-weight: 900;
							font-family: "Font Awesome 6 Free","Font Awesome 6 Brands";
						}
						}
					}
				}
			}
			.tel{
				margin-bottom: 1rem;
				a{
					font-size: 1.375rem;
					color: #fff;
					&:before{
						content:"\f095";
						display: inline-block;
						margin-right: 1rem;
						font-weight: 900;
						font-family: "Font Awesome 6 Free","Font Awesome 6 Brands";
					}
				}
			}
			.address{
				color: #fff;
				font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
			}
		}
	}
	.copy{
		color: #fff;
		text-align: center;
		font-size: clamp(0.75rem, 0.693rem + 0.24vw, 0.875rem);
	}
}
.btn{
	a{
		position: relative;
		display: inline-flex;
		justify-content: center;
		align-items: center;
		width: 100px;
		height: 100px;
		border-radius: 50%;
		border:1px solid var(--btn-base);
		color: var(--btn-base);
		span {
			text-align: center;
			font-family: var(--font-en);
			padding-top: 0.3em;
			em{
				display: block;
				font-style: normal;
			}
		}
		&:before{
			content:"";
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%,-50%) scale(0);
			width: 100%;
			height: 100%;
			transition: .3s all;
			background: var(--btn-base);
			border-radius: 50%;
			z-index: -1;
		}
		&:hover{
			color: #fff;
			&:before{
				transform: translate(-50%,-50%) scale(1);
			}
		}
	}
}
.btn2 {
	a {
		margin-bottom: 1rem;
		padding: 0.7rem 3rem;
		font-size: clamp(0.875rem, 0.829rem + 0.2vw, 1rem);
		color: #fff;
		background: var(--btn-base);
		border-radius: 50px;
		text-align: center;
		position: relative;
		&::before {
			content: "";
			position: absolute;
			top: 50%;
			right: 20px;
			width: 6px;
			height: 6px;
			border: 0;
			border-top: solid 1px #fff;
			border-right: solid 1px #fff;
			transform: translate(0, -50%) rotate(45deg);
			transition: all 0.2s 0.1s ease-in-out;
		}
		&:hover{
			opacity: 0.8;
		}
	}
}
#container{
	/* margin-top: 113px; */
	margin-bottom: 113px;
}

/* WYSIWYG */
.wysiwyg_tit {
	font-weight: 500;
	font-size: 35px;
	position: relative;
	text-align: left;
	padding: 0.6em 0;
  }
  .wysiwyg_tit::before,
  .wysiwyg_tit::after {
	position: absolute;
	left: 0;
	content: '';
	width: 100%;
	height: 6px;
	border-color: #000;
	border-style: solid;
  }
  .wysiwyg_tit::before {
	top: 0;
	border-width: 3px 0 1px 0;
  }
  .wysiwyg_tit::after {
	bottom: 0;
	border-width: 1px 0 3px 0;
  }
  .wysiwyg_area hr {
	border: none;
	height: 2px;
	background-image: linear-gradient(to right, #000 2px, transparent 2px);
	background-size: 8px 2px;
	background-repeat: repeat-x;
	background-position: left bottom;
	margin: 40px 0;
  }
  .wysiwyg_area table th {
	background: #F5F2ED;
	border: 1px var(--color-base) solid;
	font-weight: normal;
  }
  .wysiwyg_area table td {
	border: 1px var(--color-base) solid;
	padding: 1em;
  }
  .wysiwyg_area img {
	display: block;
  }
  .wysiwyg_area img.emojione {
	display: inline;
  }
  .wysiwyg_area .aligncenter {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
  }
  
.wysiwyg_area{
	margin-bottom: 2rem;
	p{
		margin-bottom: .5rem;
		font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
		line-height: 1.8;
	}
	em{
		font-style: italic;
	}
	b{
		font-weight: bold;
	}
	a{
		text-decoration: underline;
		color: var(--btn-base);
		&:hover{
			text-decoration: none;
		}
	}
	ul{
		list-style-type: disc;
		margin: 0 0 15px 20px;
	}
	ol{
		list-style-type: decimal;
		margin: 0 0 15px 20px;
	}
	blockquote{
		font-family: Georgia, "Bitstream Charter", serif;
		font-style: italic;
		font-weight: normal;
		margin: 0 3em;
	}
	h2{
		position: relative;
		display: inline-block;
		padding: .5rem 2rem;
		margin: 1rem 0;
		font-size: clamp(1.375rem, 0.963rem + 1.76vw, 2.5rem);
		color: var(--btn-base);
		line-height: .5;
		&:before, &:after {
			content: "";
			position: absolute;
			top: 0;
			height: 100%;
			width: 2px;
			background: var(--color-text);
			border-radius: 30px;
		}
		&::before {
			left: 0;
		}
		&:after {
			right: 0;
		}
	}
	/*h3{
		position: relative;
		margin-bottom: 1.5rem;
		padding-bottom: .3rem;
		display: inline-block;
		font-size: 1.5em;
		&::before{
			content: "";
			position: absolute;
			left: 0;
			bottom: 0;
			width: 100%;
			height: 1px;
			background: var(--color-text);
		}
	}*/
	h3 {
		font-size: clamp(1rem, 0.83rem + 0.73vw, 1.375rem);
		background-color: var(--color-base);
		color: #fff;
		font-weight: 500;
		margin: 1em 0;
		padding: 0.2em 0.6em;
		@media (max-width: 769px) {
			padding: 0.5em 0.6em;
		}
	}
	h4{
		font-size: clamp(1rem, 0.83rem + 0.73vw, 1.375rem);
		color: #928579;
		border-left: 7px var(--color-base) solid;
		border-bottom: 1px var(--color-base) solid;
		padding: 0.2em 0.4em;
		margin: 1em 0;
	}
	h5 {
		color: var(--btn-base);
		font-weight: 500;
		margin: 1em 0;
	}
	table,tr,th,td{
		border: 1px solid #ccc;
		border-collapse: collapse;
		font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
	}
	table{
		width: 100% !important;
		margin: 0 0 1.5em;
		border-width: 1px 1px 0 0;
		em{
			font-style: italic;
		}
	}
	strong {
		font-weight: bold;
	}
}
.post_main{
	width: calc(100% - 400px);
	@media (max-width: 769px) {
		width: 100%;
	}

	h1.post_title{
		color: #333333;
		font-weight: 500;
		font-size: 30px;
		margin: 0 0 40px;
	}
	time{
		font-size: 14px;
		color: var(--color-text);
	}
	.eyecatch {
		margin: 0 0 30px;
		max-width: 400px;
		width: 100%;
		img {
			width: 100%;
		}
	}
}
.title-block{
	margin-bottom: 1rem;
	padding: 2rem;
	background: #888;
	border-radius: 100px 0 100px 0;
	color: #fff;
	text-align: center;
	.en{
		font-size: clamp(1.5rem, 0.585rem + 3.9vw, 4rem);
		font-family: var(--font-en);
	}
	h1, .ja{
		font-size: clamp(0.75rem, 0.476rem + 1.17vw, 1.5rem);
	}
}
.breadcrumb{
	max-width: 1400px;
	width: 92%;
	margin: 0 auto 5rem;
	ol{
		display: flex;
		justify-content: flex-start;
		li{
			font-size: 12px;
			margin-right: .5rem;
			color: var(--color-text);
			a{
				color: var(--color-text);
				&:hover{
					color: var(--btn-base);
				}
			}
			&:after{
				content:"\f105";
				display: inline-block;
				margin-left: .5rem;
				font-weight: 900;
				font-family: "Font Awesome 6 Free";
			}
			&:last-child{
				a{
					pointer-events: none;
				}
				&:after{
					content:none;
				}
			}
		}
	}
}
.inblock{
	width: 92%;
	max-width: 1400px;
	margin: 0 auto;
}
.arrow{
	position: relative;
	display: block;	
	padding: 1rem 1rem;
	border-bottom:1px solid var(--color-base);
	&:before{
		content:"";
		position: absolute;
		right: 15px;
		top: 55%;
		transform: translate(0,-170%) rotate(45deg);
		width: 10px;
		height: 2px;
		background: var(--color-base);
		transition: .3s all;
	}
	&:after{
		content:"";
		position: absolute;
		right: 15px;
		top: 55%;
		transform: translate(0,-50%);
		width: 25px;
		height: 2px;
		background: var(--color-base);
		transition: .3s all;
	}
	&:hover{
		&:before{
			
			transform: translate(5px,-170%) rotate(45deg);
		}
		&:after{
			transform: translate(5px,-50%);
		}
	}
}
.arrow1{
	&::after {
		content: "";
		background: url(../img/arrow1.svg) center center / contain no-repeat;
		width: 20px;
        height: 8px;
		margin-left: auto;
	}
	&:hover {
		opacity: 0.8;
	}
}
.back-arrow{
	position: relative;
	display: block;	
	padding: 1rem 1rem 1rem 3.5rem;
	&:before{
		content:"";
		position: absolute;
		left: 15px;
		top: 55%;
		transform: translate(0,-170%) rotate(-45deg);
		width: 10px;
		height: 2px;
		background: var(--color-base);
		transition: .3s all;
	}
	&:after{
		content:"";
		position: absolute;
		left: 15px;
		top: 55%;
		transform: translate(0,-50%);
		width: 25px;
		height: 2px;
		background: var(--color-base);
		transition: .3s all;
	}
	&:hover{
		&:before{
			
			transform: translate(-5px,-170%) rotate(-45deg);
		}
		&:after{
			transform: translate(-5px,-50%);
		}
	}

}
.column_category_label {
	display: inline-block;
	background-color: #CBAF8F;
	color: #fff;
	margin: 0 0 10px 5px;
	padding: 0.1em 0.5em;
	font-size: 14px;
	@media (max-width: 769px) {
		font-size: 13px;
	}
	a{
		color: #fff;
		font-size: 14px;
		@media (max-width: 769px) {
			font-size: 13px;
		}
	}
}
@media screen and (max-width: 1535px) {
	header{
		.header-in{
			.l-head{
				ul{
					li{
						a{
							
						padding: 0 2rem;
						}
						span{
							font-size: 20px;
						}
					}
				}
			}
		}
	}
}

@media screen and (max-width: 1300px) {
	#container{
		/* margin-top: 105px; */
	}
	header{
		.header-in{
			.l-head{
				.logo{
					width: 180px;
					margin-right: 1.5rem;
				}
				ul{
					padding:  .5rem 1rem;
					li{
						a{
							padding: 0 1.125rem;
						}
						span{
							font-size: 16px;
						}
						em{
							font-size: 10px;
						}
					}
				}
			}
			.r-head{
				.instagram{
					margin-left: 1rem;
					margin-right: .8rem;
					a{
						&:before{
							font-size: 2.5rem;
						}
					}
				}
			}
		}
	}
} 

@media screen and (max-width: 1025px) {
	#container{
		/* margin-top: 90px; */
	}
	
	.title-block{
		padding: 1.5rem;
		border-radius: 80px 0 80px 0;
	}
	header{
		.header-in{
			.l-head{
				.logo{
					width: 180px;
				}
				ul{
					display: none;
				}
			}
			.r-head{
				.tel-box{
					display: block;
					a{
						display: flex;
						justify-content: center;
						align-items: center;
						width: 130px;
						padding: .5rem 1rem;
						color: #fff;
						background: rgba(190, 161, 122, .7);
						border-radius: 5px;
						text-align: center;
						&:before{
							content:"\f095";
							margin-right: .5rem;
							font-weight: 900;
							font-size: 1.5rem;
							font-family: "Font Awesome 6 Free";
							text-align: center;
						}
					}
				}
			}
		}
	}
	
	.fiexd-btn{
		.line{
			margin-bottom: .5rem;
			a{
				width: 110px;
				height: 110px;
				em{
					font-size: .875rem;
					img{
						width: 50px;
					}
				}
			}
		}
		.f-block{
			p{
				a{
					width: 60px;
					height: 60px;
					font-size: 10px;
					span{

						&:before{
							font-size: 1.25rem;
						}
					}
				}
			}
		}
	}
	
	.btn{
		text-align: center;
		a{
			width: 80px;
			height: 80px;
			font-size: .875rem;
		}
	}
}
@media screen and (max-width: 767px) {

	
	.title-block{
		padding: 1.25rem;
		border-radius: 60px 0 60px 0;
	}
	.breadcrumb{
		margin-bottom: 2rem;
	}
	.post_main{
		margin-bottom: 50px;
	
		h1.post_title{
			font-size: 1.5rem;
			margin: 0 0 20px;
		}
		time{
			font-size: 14px;
			color: var(--color-text);
		}
	}

	/*.hamburger-lines {
		height: 4vw;
	}
	.hamburger-button {
		width: 12vw;
		height: 12vw;
		padding-top: 4vw;
	}
	.active .hamburger-button {
		padding-top: 4vw;
	}
	.ham_nav {
		padding: 6vw 5vw 0;
	}
	.ham_nav .g_nav  {
		gap: 7vw 3vw;
	}
	.ham_nav .g_nav li {
		width: calc((100% - 3vw) / 2);
	}
	.ham_nav .g_nav li a {
		font-size:.875rem;
	}
	.ham_nav .g_nav li a .en {
		font-size: 1.5rem;
	}
	.ham_nav .nav_info {
		width: 100%;
	}
	.ham_nav .nav_info .cta_area {
		gap: 3vw;
	}
	.ham_nav .nav_info .cta_area li {
		width: calc((100% - 3vw) / 2);
	}
	.ham_nav .nav_info .cta_area a {
		font-size: 3.5vw;
	}
	.ham_nav .nav_instagram {
		gap: 10vw;
	}*/
	header{
		.header-in{
			.r-head{
				.tel-box{
					a{
						font-size: .875rem;
						&:before{
							font-size: 1.375rem;
						}
					}
				}
				.hamburger-button{
					width: 40px;
					height: 40px;
					padding-top: 12px;
					.hamburger-lines{
						height: 18px;
					}
				}
			}
		}
		.ham_nav{
			justify-content: center;
			align-items: center;
			padding-top: 70px;
			.dfbox{
				width: 100%;
			}
			.ham_nav_inner{
				margin: 0 auto 2rem;
				.g_nav{

					justify-content: center;
					gap: 4% 4%;
					li{
						width: 48%;
						margin-bottom: 1rem;
						a{
							color: #645652;
							text-align: center;
							font-size: 12px;
						}
					}
				}
			}
			.nav_info{
				display: block;
				margin: 0 auto;
				.f-btn{
					display: flex;
					justify-content: center;
					margin-bottom: 1.5rem;
					p{
						width: 48%;
						max-width: 250px;
						a{
							display: inline-flex;
							width: 100%;
							height: 100%;
							justify-content: center;
							align-items: center;
							color: #fff;
							padding: 0.5em;
							border:1px solid #fff;
							border-radius: 5px;
						}
					}
					.line{
						margin-right: 1rem;
						a{
							display: flex;
							justify-content: center;
							align-items: center;
							.icon{
								display: inline-block;
								margin-right: .5rem;
								width: 25px;
								line-height: 0;
							}
						}

					}
					.web{
						a{
							span{
								
								&:before{
									content: "\f0e0";
									margin-right: .5rem;
									font-weight: 900;
									font-size: 1.5rem;
									font-family: "Font Awesome 6 Free";
									text-align: center;
								}
							}
						}
					}
				}
				.tel{
					margin-bottom: 1rem;
					text-align: center;
					a{
						display: inline-block;
						font-size: 2rem;
						color: #fff;
						&:before{
							content: "\f095";
							margin-right: .5rem;
							font-weight: 900;
							font-size: 2rem;
							font-family: "Font Awesome 6 Free";
							text-align: center;
						}
					}
				}
				.nav_address{
					color: #fff;
					text-align: center;
				}
				
			}
		}
	}
	.fiexd-btn{
		display: flex;
		flex-direction: row-reverse;
		align-items: flex-end;
		gap: 5px;
		.line{
			margin-bottom: 0;
			a{
				width: 90px;
				height: 90px;
				em{
					font-size: 12px;
					img{
						width: 40px;
					}
				}
			}
		}
		.f-block{
			display: block;
			.web{
				/*display: none;*/
				a {
					background: #8D8D8D !important;
				}
			}
		}
	}
	footer{
		padding: 4rem 0 2rem;
		.f-block{
			display: block;
			.link-box{
				width: 100%;
				margin:0 auto 2rem;
				padding: 5%;
			}
			.btn-box{
				width: 100%;
				text-align: center;
				display: flex;
				flex-wrap: wrap;
				justify-content: space-between;
				.f-btn{
					width: calc((100% - 10px) / 2);
					a{
						margin: 0 auto;
						max-width: none;
						height: 50px;
						span {
							font-size: 14px;
							display: flex;
							align-items: center;
						}
					}
				}
			}
			.address {
				width: 100%;
			}
		}
	}
}

@media screen and (max-width: 479px) {
	header{
		.header-in{
			.l-head{
				.logo{
					width: 150px;
					margin-right: 1rem;
				}
			}
			.r-head{
				.tel-box{
					margin-right: .5rem;
					a{
						width:90px;
						padding: .5rem .3rem;
						font-size: 12px;
						&:before{
							font-size: 1rem;
						}
					}
				}
				.instagram{
					margin: 0 .5rem 0 0;
					a{
						&:before{
							font-size: 2rem;
						}
					}
				}
			}
		}
	}
}

/*--------------------
ページネーション
--------------------*/
.post_pagination {
	margin-top: 50px;
	*{
		font-family: var(--font-en);
	}
	.nav-links {
		display: flex;
		gap: 10px;
		justify-content: center;
		.prev,.next{
			width: auto;
			border-radius: inherit;
			border-bottom: 1px transparent solid;
			&:hover{
				width: auto;
				background-color: transparent;
				color: var(--btn-base);
				border-bottom: 1px var(--btn-base) solid;
			}
		}
		a,span{

			width: 45px;
			height: 45px;
			border-radius: 50%;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-wrap: wrap;
			overflow: hidden;
			font-size: 18px;
			color: var(--btn-base);
			transition: all 0.15s linear;
		}
		a{
			&:hover{
				background: var(--btn-base);
				color: #fff;
			}
		}
	}
	.current.page-numbers {
		background: var(--btn-base);
		color: #fff;
	}
  }
  @media screen and (max-width: 1200px) {
	.post_pagination {
	  margin-top: 5vw;
	}
	.post_pagination .nav-links {
	  gap: 1vw;
	}
	.post_pagination .nav-links a, .post_pagination .nav-links span {
	  width: 3.5vw;
	  height: 3.5vw;
	  font-size: 1.5vw;
	}
  }
  @media screen and (max-width: 767px) {
	.post_pagination {
	  margin-top: 5vw;
	}
	.post_pagination .nav-links {
	  gap: 1vw;
	}
	.post_pagination .nav-links a, .post_pagination .nav-links span {
	  width: 6vw;
	  height: 6vw;
	  font-size: 3.5vw;
	}
  }


/*--------------------
トップページ
--------------------*/
@keyframes sdl01 {
0% {
	transform: scale(1, 0);
	transform-origin: 0 0;
}
50% {
	transform: scale(1, 1);
	transform-origin: 0 0;
}
50.1% {
	transform: scale(1, 1);
	transform-origin: 0 100%;
}
100% {
	transform: scale(1, 0);
	transform-origin: 0 100%;
}
}


/*--------------------
ティザー用(bodyにteaserクラス付与)
--------------------*/
.teaser{
	a{
		pointer-events: none;
	}
	.arrow{
		&:before,&::after{
			content: none;
		}
	}
	.btn{
		display: none;
	}
	header{
		.header-in{
			.l-head{
				ul{
					display: none;
				}
			}
			.r-head{
				.hamburger-button{
					display: none;
				}
			}
		}
	}
	&#top{
		.campaign{
			display: none;
		}
		.about{
			background: #fff;
		}
		.insta{
			display: none;
		}
		.wp-block{
			display: none;
		}
		.trouble{
			.inblock{
				.f-box{
					.trouble-box{
						.row{
							li{
								a{
									&:before,&:after{
										content: none;
									}
								}
							}
						}
					}
				}
			}
		}
	}
	.fiexd-btn{
		display: none;
	}
}

#top{
	#container{
		margin-top: 0;
		margin-bottom: 0;
	}
	h2.en-title{
		margin-bottom: 2.5rem;
		color: var(--color-text);
		font-size: 1.875rem;
		font-weight: 500;
		text-align: center;
		span{
			display: block;
			font-size: 4rem;
			font-weight: 400;
			color: #D1D1D1;
		}
	}
	/*メインビジュアル*/
	.main{
		position: relative;
		margin-bottom: 10rem;
		margin-top: 110px;
		position: relative;
		width: 100%;
		height: calc(100vh - 86px);
		z-index: 5;
		.catch{
			position: absolute;
			bottom: 50%;
			left: 10%;
			transform: translateY(50%);
			z-index: 999;
			span{
				display: block;
				font-size: 3rem;
				color: #636363;
				border-bottom:1px solid #636363;
				&:nth-child(2){
					transform: translateX(80px);
					margin-top: 10px;
				}
				&:nth-child(3){
					transform: translateX(160px);
					margin-top: 10px;
				}
			}
		}
		.f-main{
			height: 100%;
			.r-main{
				margin: 0 0 0 auto;
				width: 60%;
				height: 100%;
				border-radius: 50px 0 0 0 ;
				overflow: hidden;
				img{
					width: 100%;
					height: 100%;
					object-fit: cover;
					object-position: center bottom;

				}
			}
		}
		.type p {
			display: inline-block;
			position: absolute;
			left: 40px;
			bottom: 20px;
			z-index: 2;
			padding: 10px 10px 110px;
			color: #636363;
			font-size: 14px;
			line-height: 1;
			letter-spacing: .2em;
			text-transform: uppercase;
			text-decoration: none;
			writing-mode: vertical-rl;
			transition: .2s;
			overflow: hidden;
			z-index: 150;
			&::after {
			  content: '';
			  position: absolute;
			  bottom: 0;
			  left: 50%;
			  width: 1px;
			  height: 100px;
			  background: #636363;
			}
		  }
		  
		  #type01 p::after {
			animation: sdl01 1.5s cubic-bezier(1, 0, 0, 1) infinite;
		  }
		  
		.wave{
			position: absolute;
			bottom: 0;
			left: 0;
			width: 100%;
			height: 200px;
			z-index: 105;
		}
		
		
		.wave canvas{
			position: absolute;
			bottom: -100px;
			left:0;
			width: 100%;
		}
		
	}
	/*キャンペーン*/
	.campaign{
		position: relative;
		margin-bottom: 8rem;
		z-index: 150;
		.inblock{
			width: 95%;
			margin: 0 auto;
			max-width: 1600px;
			display: flex;
			justify-content: space-between;
			align-items: center;
			.l-box{
				width: 30%;
				h2{
					margin-bottom: 1.5rem;
					font-size: 2rem;
					font-weight: normal;
					color: var(--color-text);
					span{
						display: block;
						color: #D1D1D1;
						font-size: 4rem;
						letter-spacing: 5px;
					}
				}
			}
			.r-box{
				position: relative;
				width: 70%;
				padding: 0 65px;
				.swiper-wrapper{
					.swiper-slide{
						.img-cover{
							aspect-ratio: 1 / 1;
							border-radius: 30px;
							overflow: hidden;
							img{
								width: 100%;
								height: 100%;
								object-fit: cover;
							}
						}
					}
				}
				.swiper-button-prev,.swiper-button-next{
					&:after{
						font-size: 25px;
						color: #828282;
					}
				}
			}
		}
	}
	
	/*医師紹介*/
	.about{
		padding: 5rem 0;
		background: #F5F2ED;
		.inblock{
			.f-block{
				display: flex;
				justify-content: space-between;
				.photo-box{
					position: relative;
					width: 38%;
					.photo{
						line-height: 0;
						border-radius: 0 0 0 30px;
						overflow: hidden;
					}
					.en{
						position: absolute;
						top: -50px;
						right: -100px;
						font-size: 8rem;
						color: #D1D1D1;
						line-height: 1;
						font-family: var(--font-en);
					}
				}
				.text-block{
					position: relative;
					width: 58%;
					padding-top: 130px;
					z-index: 2;
					h2{
						margin-bottom: 2rem;
						font-size: 2rem;
						font-weight: 500;
						color: var(--color-text);
					}
					.read-box{
						p{
							margin-bottom: 1.5rem;
							color: #333333;
							font-weight: 500;
							line-height: 1.8;
							font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
						}
					}
					.name-box{
						display: flex;
						justify-content: space-between;
						align-items: center;
						.name{
							width: calc(100% - 150px);
							font-size: 1.5rem;
							color: #333;
							font-weight: 500;
							span{
								display: inline-block;
								margin-right: 1.5rem;
							}
							em{
								display: inline-block;
								font-size: 1.875rem;
							}
						}
					}
				}
			}
		}
	}

	/*お悩みから探す*/
	.trouble{
		padding: 5rem 0;
		background: var(--color-base);
		.inblock{
			h2.en-title{
				span{
					color: #fff;
				}
			}
			.f-box{
				display: flex;
				justify-content: flex-start;
				flex-wrap: wrap;
				gap: 18px;
				.trouble-box{
					width: 32%;
					.head{
						position: relative;
						padding: 1.5rem 3rem 1.5rem 1.5rem;
						color: var(--color-text);
						background: var(--color-base2);
						border-radius: 0 40px 0 0;
						cursor: pointer;
						h3{
							font-size: 1.25rem;
						}
						&:before{
							content:"";
							position: absolute;
							right: 30px;
							top: 50%;
							width: 20px;
							height: 2px;
							background: var(--color-text);
							z-index: 5;
						}
						&:after{
							content:"";
							position: absolute;
							right: 30px;
							top: 50%;
							width: 20px;
							height: 2px;
							background: var(--color-text);
							transform: rotate(90deg);
							transition: .3s all;
							z-index: 5;
						}
						&.click{
							&:after{
								transform: rotate(0);
							}
						}
					}
					.row{
						position: relative;
						padding: 1rem;
						background: #fff;
						display: none;
						line-height: 1.4;
						li{
							a{
								position: relative;
								display: block;	
								padding: 1rem 3rem 1rem 1rem;
								border-bottom:1px solid var(--color-base);
								&:before{
									content:"";
									position: absolute;
									right: 15px;
									top: 45%;
									transform: translate(0,-50%) rotate(45deg);
									width: 10px;
									height: 2px;
									background: var(--color-base);
									transition: .3s all;
								}
								&:after{
									content:"";
									position: absolute;
									right: 15px;
									top: 50%;
									transform: translate(0,-50%);
									width: 25px;
									height: 2px;
									background: var(--color-base);
									transition: .3s all;
								}
								&:hover{
									&:before{
										
										transform: translate(5px,-50%) rotate(45deg);
									}
									&:after{
										transform: translate(5px,-50%);
									}
								}
							}
						}
					}
				}
			}
		}
	}

	
	/*施術メニュー*/
	.case{
		padding: 5rem 0;
		background: var(--color-base2);
		.inblock{
			.f-box{
				display: flex;
				justify-content: flex-start;
				flex-wrap: wrap;
				gap: 2rem 2.5%;
				.case-box{
					width: 31%;
					.title{
						margin-bottom: 1rem;
						padding: 1.5rem;
						font-size: 1.25rem;
						color: #fff;
						background: var(--btn-base);
						border-radius: 50px;
						text-align: center;
						pointer-events: none;
					}
					ul{
						li{
							margin-bottom: 1rem;
							a{
								padding: 1.5rem 3rem 1.5rem 2rem;
								border-bottom:none;
								background: #fff;
								&:before,&:after{
									right: 25px;
								}
							}
						}
					}
					& > a {
						.title{
							position: relative;
							&::before {
								content: "";
								position: absolute;
								top: 50%;
								right: 30px;
								width: 8px;
								height: 8px;
								border: 0;
								border-top: solid 1px #fff;
								border-right: solid 1px #fff;
								transform: translate(0, -50%) rotate(45deg);
								transition: all 0.2s 0.1s ease-in-out;
							}
						}
						&:hover {
							opacity: 0.8;
						}
					}
				}
			}
		}
	}
	
	/*クリニックの特徴*/
	.point{
		padding: 5rem 0;
		.inblock{
			h2.en-title{
				margin-bottom: 5rem;
			}
			.f-point{
				display: flex;
				justify-content: space-between;
				margin-bottom: 2rem;
				.point-box{
					position: relative;
					width: 31%;
					border-radius: 30px 30px 0 0;
					background:#CBAF8F;
					.catch-num{
						position: absolute;
						right: 0;
						left: 0;
						top: -70px;
						display: inline-flex;
						justify-content: center;
						align-items: flex-end;
						color: var(--color-base);
						.s-num{
							font-size: 5rem;
							line-height: .9;
							em{
								display: block;
								font-size: 14px;
							}
						}
						.l-num{
							font-size: 7rem;
							line-height: .9;
						}
						
					}
					.photo{
						border-radius: 30px 30px 0 0;
						overflow: hidden;
						line-height: 0;
					}
					.text{
						display: flex;
						align-items: center;
						justify-content: center;
						min-height: 166px;
						padding: 2rem;
						color: #fff;
						font-size: 1.5rem;
						line-height: 1.8;
						text-align: center;
						span{
							display: block;
						}
					}
					&:nth-child(2){
						background: #ACACAC;
					}
				}
			}
			.btn{
				text-align: center;
			}
		}
	}
	
	/*Instagram*/
	.insta{
		padding: 5rem 0;
		background: var(--color-base2);
		.inblock{
			.f-title{
				display: flex;
				justify-content: space-between;
				align-items: center;
				h2.en-title{
					text-align: left;
				}
				.id{
					a{
						display: inline-block;
						font-size: 1.75rem;
						color: var(--color-base);
						font-family: var(--font-en);
						&:before{
							content:"\f16d";
							margin-right: 1rem;
							font-size: 1.875rem;
							font-weight: normal;
							font-family: "Font Awesome 6 Free","Font Awesome 6 Brands";
						}
					}
				}
			}
			.f-insta{
				display: flex;
				justify-content: center;
				flex-wrap: wrap;
				max-width: 1000px;
				margin: 0 auto;
				p{
					width: 33%;
					a{
						display: block;
						width: 100%;
						aspect-ratio: 1/1.1;
						line-height: 0;
						img{
							width: 100%;
							height: 100%;
							object-fit: cover;
						}
						&:hover{
							img{
								opacity: .8;
							}
						}
					}
				}
			}
		}
	}
	/*お知らせ・コラム*/
	.wp-block{
		padding: 5rem 0;
		.f-block{
			display: flex;
			justify-content: space-between;
			.news,.column{
				position: relative;
				width: 48%;
				h2{
					font-size: 3.5rem;
					color: #D1D1D1;
				}
				.box{
					min-height: 564px;
					padding: 6rem 4vw 2rem 4vw;
					border-radius: 30px;
					.circle{
						position: absolute;
						left: 0;
						right: 0;
						margin: 0 auto;
						top: -10px;
						display: flex;
						justify-content: center;
						align-items: center;
						width: 130px;
						height: 130px;
						border-radius: 50%;
						img{
							width: 60px;
							fill: #fff;
						}
					}
					.box-title{
						margin-bottom: 2rem;
						padding-bottom: 1rem;
						font-size: 2rem;
						font-weight: 500;
						text-align: center;
					}
					ul{
						margin-bottom: 1.5rem;
						li{
							a{
								display: block;
								padding: 1.5rem 3rem 1.5rem 0;
								.day{
									font-size: 14px;
									color: #8D8D8D;
								}
							}
						}
					}
					.more{
						text-align: right;
						a{
							display: inline-block;
							color: #fff;
							padding: .5rem 3.5rem .5rem 1rem;
						}
					}
				}
			}
			.news{
				.box{
					background: var(--color-base2);
					.circle{
						background: var(--color-base);
					}
					.box-title{
						border-bottom:2px solid var(--color-base);
					}
					ul{
						li{
							a{
								border-bottom:dashed var(--color-base) 1px;
							}
						}
					}
					.more{
						a{
							background: var(--color-base);
							&::before,&::after{
								background: #fff;
							}
						}
					}
				}
			}
			.column{
				.box{background: #f2f2f2;
					.circle{
						background: #ACACAC;
					}
					.box-title{
						border-bottom:2px solid #ACACAC;
					}
					ul{
						li{
							a{
								border-bottom:dashed #656565 1px;
								&::before,&::after{
									background: #8d8d8d;
								}
							}
						}
					}
					.more{
						a{
							background: #ACACAC;
							&::before,&::after{
								background: #fff;
							}
						}
					}
				}
			}
		}
	}
	
	/*アクセス*/
	.access{
		position: relative;
		padding: 5rem 0;
		overflow: hidden;
		&:before{
			content:"";
			position: absolute;
			top: 0;
			left: -50vw;
			right: 0;
			margin: 0 auto;
			width: 200%;
			height: 100%;
			background: #F6F2EC;
			border-radius: 100% 100% 0 0;
			text-align: center;
			z-index: -1;
		}
		.inblock{
			h2{
				margin-bottom: 5rem;
			}
			.map{
				margin: 0 auto 1.5rem;
				max-width: 1000px;
				width: 100%;
			}
			.address{
				text-align: center;
				font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
			}
		}
	}
}

@media screen and (max-width: 1535px) {
	#top{
		.campaign{
			.inblock{
				.l-box{
					width: 35%;
					h2{
						font-size: 1.625rem;
						span{
							font-size: 3.25rem;
							letter-spacing: 2px;
						}
					}
				}
				.r-box{
					width: 64%;
					padding: 0 50px;
				}
			}
		}
		.about{
			.inblock{
				.f-block{
					.text-block{
						padding-top: 100px;
					}
				}
			}
		}
	}
}
@media screen and (max-width: 1025px) {
	#top{
		h2.en-title{
			font-size: 1.875rem;
			span{
				font-size: 3.75rem;
			}
		}
		/*メインビジュアル*/
		.main{
			margin-bottom: 8rem;
			margin-top: 76px;
			height: calc(90vh -76px);
			.f-main{

				.catch{
					left: 4%;
					span{
						font-size: 2.25rem;
						&:nth-child(2){
							transform: translateX(60px);
						}
						&:nth-child(3){
							transform: translateX(120px);
						}
					}
				}
			}
		}
		/*キャンペーン*/
		.campaign{
			.inblock{
				display: block;
				.l-box{
					display: flex;
					justify-content: space-between;
					align-items: center;
					width: 100%;
					margin-bottom: 1rem;
				}
				.r-box{
					width: 100%;
					padding: 0 50px;
				}
			}
		}
		/*医師紹介*/
		.about{
			.inblock{
				.f-block{
					.photo-box{
						.en{
							font-size: 6.5rem;
						}
					}
					.text-block{
						padding-top: 0;
						h2{
							margin-bottom: 1.5rem;
						}
						.read-box{
							p{
								margin-bottom: 1rem;
								line-height: 1.6;
							}
						}
						.name-box{
							.name{
								font-size: 1.25rem;
								span{
									margin-right: 0;
								}
								em{
									display: block;
									font-size: 1.625rem;
								}
							}
						}
						
					}
				}
			}
		}
		/*お悩みから探す*/
		.trouble{
			.inblock{
				.f-box{
					gap: none;
					.trouble-box{
						width: 48%;
						.head{
							padding: 1rem 2.5rem 1rem 1.5rem;
							h3{
								font-size: 1.125rem;
							}
						}
					}
				}
			}
		}
		/*施術メニュー*/
		.case{
			.inblock{
				.f-box{
					.case-box{
						width: 48%;
						.title{
							padding: 1rem;
							font-size: 1.125rem;
						}
						.case-box{
							ul{

								li{
									width: 48%;
									a{
										padding: 1rem 3rem 1rem 1rem;
									}
								}
							}
						}
					}
				}
			}
		}

		.point{
			.inblock{
				.f-point{
					.point-box{
						.catch-num{
							top: -60px;
							.l-num{
								font-size: 6rem;
							}
							.s-num{
								font-size: 4rem;
								em{
									font-size: 12px;
								}
							}
						}
						.text{
							padding: 1rem;
							font-size: 1.125rem;
						}
					}
				}
			}
		}
		.insta{
			.inblock{
				.f-title{
					.id{
						a{
							font-size: 1.75rem;
						}
					}
				}
			}
		}
		.wp-block{
			.f-block{
				.news,.column{
					h2{
						font-size: 2.875rem;
					}
					.box{
						padding-top: 4rem;
						.circle{
							width: 100px;
							height: 100px;
							img{
								width: 45px;
							}
						}
						.box-title{
							font-size: 1.625rem;
						}
					}
				}
				.news{
					margin-bottom: 3rem;
				}
			}
		}
	}
}

@media screen and (max-width: 769px) {
	#top{
		h2.en-title{
			font-size: 1.375rem;
			span{
				font-size: 3rem;
			}
		}
		.main{
			min-height: 600px;
			background: #f1f1f1;
			.type{
				display: none;
			}
			.f-main{

				.catch{
					right: 0;
					left: 0;
					bottom: 130px;
					margin: 0 auto;
					text-align: center;
					span{
						font-size: 1.5rem;
						&:nth-child(1){
							display: block;
							border-bottom: none;
							em{
								display: inline-block;
								border-bottom: 1px solid #636363;
							}
						}
						&:nth-child(2){
							display: inline-block;
							transform: translateX(0);
						}
						&:nth-child(3){
							display: inline-block;
							transform: translateX(0);
						}
					}
				}
				.r-main{
					width: 100%;
					height: calc(100% - 200px);
					border-radius: 0;
				}
			}
		}
		.campaign{
			.inblock{
				width: 100%;
				.l-box{
					width: 95%;
					margin: 0 auto;
					h2{
						span{
							font-size: 2.5rem;
						}
					}
				}
				.r-box{
					padding: 0;
				}
				.swiper-slide{
					transform: scale(.7);
					transition: .3s all;
				}
				.swiper-slide-active{
					transform: scale(1);
				}
				.swiper-button-prev,.swiper-button-next{
					display: none;
				}
			}
		}
		.about{
			.inblock{
				.f-block{
					display: block;
					.photo-box{
						width: 100%;
						max-width: 400px;
						margin: 0 auto 1rem;
						.en{
							right: -20px;
							font-size: 5.25rem;
						}
					}
					.text-block{
						width: 100%;
						.name-box{
							.name{
								span{
									margin-right: .5rem;
									font-size: 15px;
								}
								em{
									display: inline-block;
								}
							}
						}
					}
				}
			}
		}
		.trouble{
			.inblock{
				.f-box{
					display: block;
					.trouble-box{
						width: 100%;
						margin-bottom: 1rem;
					}
				}
			}
		}
		.case{
			.inblock{
				.f-box{
					display: block;
					.case-box{
						width: 100%;
						margin-bottom: 2rem;
						.title{
							position: relative;
							padding: .8rem 1rem;
							pointer-events: all;
							&:before{
								content: "";
								position: absolute;
								right: 30px;
								top: 50%;
								width: 20px;
								height: 2px;
								background: #656565;
								z-index: 5;
							}
							&:after{
								
								content: "";
								position: absolute;
								right: 30px;
								top: 50%;
								width: 20px;
								height: 2px;
								background: #656565;
								transform: rotate(90deg);
								transition: .3s all;
								z-index: 5;
							}
							&.click{
								&:after{
									transform: rotate(0);
								}
							}
						}
						ul{
							display: none;
							li{
								a{
									padding: 1rem 3rem 1rem 1rem;
								}
							}
						}
						& > a {
							.title{
								&::before {
									right: 20px;
									background: transparent;
								}
								&::after {
									display: none;
								}
							}
						}
					}
				}
			}
		}
		.point{
			.inblock{
				.f-point{
					display: block;
					.point-box{
						width: 100%;
						max-width: 500px;
						margin:0 auto 5rem;
					}
				}
			}
		}
		.wp-block{
			.f-block{
				display: block;
				.news,.column{
					width: 100%;
					h2{
						font-size: 2.875rem;
					}
					.box{
						padding-top: 4rem;
						.circle{
							width: 100px;
							height: 100px;
							img{
								width: 45px;
							}
						}
						.box-title{
							font-size: 1.625rem;
						}
					}
				}
				.news{
					margin-bottom: 4rem;
				}
			}
		}
	}
	
}

@media screen and (max-width: 479px) {
	#top{
		h2.en-title{
			font-size: 1.125rem;
			span{
				font-size: 2.5rem;
			}
		}
		.about{
			.inblock{
				.f-block{
					display: block;
					.photo-box{
						width: 100%;
						max-width: 300px;
						margin: 0 auto 1rem;
						.en{
							top: 90%;
							right: -20px;
							font-size: 5.25rem;
						}
					}
				}
			}
		}
		.insta{
			.inblock{
				.f-title{
					display: block;
					.en-title{
						margin-bottom: 1rem;
						width: 100%;
					}
					.id{
						margin-bottom: 2rem;
						width: 100%;
						a{
							font-size: 1.375rem;
							&::before{
								font-size: 1.625rem;
								margin-right: .5rem;
							}
						}
					}
				}
				.f-insta{
					p{
						width: 50%;
					}
				}
			}
		}
		.wp-block{
			.f-block{
				.news,.column{
					.box{
						padding-top: 2.5rem;
						.box-title{
							font-size: 1.375rem;
						}
					}
				}
			}
		}

	}
}


/*--------------------
アーカイブ、シングル　共通
--------------------*/
.screen-reader-text {
    border: 0;
    clip: rect(1px,1px,1px,1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal!important
}
.screen-reader-text:focus {
    background-color: #ddd;
    clip: auto!important;
    clip-path: none;
    color: #444;
    display: block;
    font-size: 1em;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}
#archive-news,#single-news,
#archive-column,#single-column,
#archive-campaign,#single-campaign{ 
	.menu-wrapper {
		display: flex;
		justify-content: space-between;
		@media (max-width: 769px) {
			display: block;
		}
		
		.news_list_wrapper {
			width: calc(100% - 400px);
			margin: 0;
			padding: 3rem;
			background: #F5F2ED;
			border-radius: 50px;
			@media (max-width: 1025px) {
				width: 60%;
				padding: 2.5rem;
			}
			@media (max-width: 769px) {
				width: 100%;
				margin-bottom: 3rem;
				padding: 2rem;
			}
			.news_list {
				li {
					a {
						display: flex;
						justify-content: space-between;
						padding: 1.5rem 3rem 1.5rem 0;
						border-bottom:1px dashed var(--btn-base);
						@media (max-width: 769px) {
							display: block;
						}
						time {
							width: 90px;
							color: var(--color-text);
							@media (max-width: 1025px) {
								width: 80px;
								color: var(--color-text);
							}
							@media (max-width: 769px) {
								width: 100%;
								font-size: 14px;
							}
						}
						.news_tit {
							width: calc(100% - 110px);
							@media (max-width: 1025px) {
								width: calc(100% - 100px);
							}
							@media (max-width: 769px) {
								width: 100%;
							}
						}
					}
				}
			}
		}
		.news-menu {
			width: 320px;
			@media (max-width: 1025px) {
				width: 35%;
			}
			@media (max-width: 769px) {
				width: 100%;
			}
			.box {
				margin-bottom: 2.5rem;
				@media (max-width: 1025px) {
					margin-bottom: 2.5rem;
				}
				@media (max-width: 769px) {
					margin-bottom: 2.5rem;
				}
				.title {
					padding: .875rem 2rem;
					font-size: 1.375rem;
					font-weight: 500;
					color: var(--color-text);
					background: #F2F2F2;
					border-radius: 30px 0 0 0;
					@media (max-width: 1025px) {
						padding: .875rem 1.625rem;
						font-size: 1.25rem;
					}
					@media (max-width: 769px) {
						padding: .875rem 1.5rem;
						font-size: 1.125rem;
					}
				}
				ul {
					li {
						border-bottom:var(--btn-base) dashed 1px;
						display: flex;
						align-items: center;
						padding: 0 1em;
						a {
							display: block;
							padding: 1.25rem 0;
							@media (max-width: 1025px) {
								padding: 1.25rem 0;
							}
							time {
								font-size: 14px;
								color: var(--color-text);
								@media (max-width: 1025px) {
									font-size: 14px;
								}
							}
							.column_category_label {
								font-size: 11px;
								margin-bottom: 5px;
							}
							p {
								font-size: 16px;
							}
						}
					}
				}
				&:nth-child(1) {
					.title {
						background: var(--color-base2);
					}
				}
			}
		}
	}
}

/*--------------------
お知らせ
--------------------*/
#archive-news,#single-news {
	.title-block{
		background: url(../img/news/news_title.jpg) no-repeat 50% 50%;
		background-size: cover;
	}
}

/*--------------------
コラム
--------------------*/
#archive-column,#single-column {
	.title-block{
		background: url(../img/column/column_title.jpg) no-repeat 50% 50%;
		background-size: cover;
		@media (max-width: 769px) {
			background: url(../img/column/column_title.jpg) no-repeat 10% 50%;
			background-size: cover;
		}
	}
	.column_list_wrapper {
		width: calc(100% - 400px);
		margin: 0;
		@media (max-width: 1025px) {
			width: 60%;
		}
		@media (max-width: 769px) {
			width: 100%;
			margin-bottom: 3rem;
		}
		.column_list {
			li {
				a {
					background-color: #F7F7F7;
					display: flex;
					@media (max-width: 1025px) {
						flex-direction: column-reverse;
						padding-top: 2em;
					}
					.column_list_cont {
						padding: 2em;
						width: calc(100% - 300px);
						@media (max-width: 1025px) {
							width: 100%;
						}
						time {
							font-size: clamp(0.813rem, 0.744rem + 0.29vw, 1rem);
							color: #8D8D8D;
							margin-bottom: 0.6em;
						}
						.post_ttl {
							font-size: clamp(1rem, 0.863rem + 0.59vw, 1.375rem);
							margin-bottom: 0.6em;
						}
						.post_excerpt {
							font-size: clamp(0.875rem, 0.829rem + 0.2vw, 1rem);
						}
					}
					.eyecatch {
						width: 300px;
						height: 300px;
						@media (max-width: 1025px) {
							width: 150px;
							height: 150px;
							margin: auto;
						}
						img {
							width: 100%;
							height: 100%;
							object-fit: cover;
						}
					}
					&:hover {
						box-shadow: 0px 0px 7px 0px #d0d0d0;
						color: var(--color-text);
					}
				}
				& + li {
					margin-top: clamp(1.25rem, 1.021rem + 0.98vw, 1.875rem);
				}
			}
			li:nth-child(even) {
				a {
					background-color: #FBF7F3;
				}
			}
		}
	}
}

/*--------------------
キャンペーン
--------------------*/
#archive-campaign,#single-campaign {
	.title-block{
		background: url(../img/campaign/campaign_title.jpg) no-repeat 50% 50%;
		background-size: cover;
		@media (max-width: 768px) {
			background: url(../img/campaign/campaign_title.jpg) no-repeat 20% 50%;
			background-size: cover;
		}
	}
	.campaign_list_wrapper {
		max-width: 1000px;
		width: 100%;
		margin: auto;
		.campaign_list {
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			gap: 60px 5%;
			@media (max-width: 768px) {
				gap: 30px 15px;
			}
			li {
				width: 30%;
				@media (max-width: 768px) {
					width: calc((100% - 15px) / 2);
				}
				a {
					.post_ttl {
						font-size: clamp(0.875rem, 0.784rem + 0.39vw, 1.125rem);
						margin-top: clamp(0.313rem, 0.198rem + 0.49vw, 0.625rem);
					}
				}
			}
		}
	}
}

/*--------------------
症例
--------------------*/
#case{
	.title-block{
		background: url(../img/case/case_title.jpg) no-repeat 50% 50%;
		background-size: cover;
	}
	/* 症例　検索 */
	.case_search {
		max-width: 1000px;
		margin:0 auto 100px;
		.sec_tit{
			font-weight: 500;
			font-size: 30px;
			text-align: center;
			margin-bottom: 50px;
		}
		.search_box{
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			margin-bottom: 30px;
			dt{
				font-weight: 500;
				font-size: 18px;
				width: 119px;
				padding: 15px 10px;
			}
			dd{
				width: calc(100% - 119px);
				margin: 0;
				padding: 15px 10px;
				display: flex;
				flex-wrap: wrap;
				align-items: center;
				*{
					font-weight: 500;
					font-size: 18px;
				}
				input{
					cursor: pointer;
				}
				input[type="checkbox"] {
					position: relative;
					width: 16px;
					height: 16px;
					border:1px solid var(--color-text);
					border-radius: 3px;
					-webkit-appearance: none;
						-moz-appearance: none;
							appearance: none;
				}
				input[type="checkbox"] {
					position: relative;
					width: 16px;
					height: 16px;
					border:1px solid var(--color-text);
					vertical-align: -1px;
					border-radius: 3px;
					-webkit-appearance: none;
					-moz-appearance: none;
							appearance: none;
				}
				input[type="checkbox"]:checked {
					background-color: var(--color-pink2);
				}
				input[type="checkbox"]:checked::before {
					position: absolute;
					top: 1px;
					left: 5px;
					transform: rotate(50deg);
					width: 6px;
					height: 10px;
					border-right: 2px solid var(--color-text);
					border-bottom: 2px solid var(--color-text);
					content: '';
				}
			}
			.menu_select{
				width: 100%;
				border: none;
				border-radius: 5px;
				padding: 5px 20px;
				color: #000;
				border:1px solid var(--color-text);
				font-family: "Noto Serif JP", serif;
				option {
					color: var(--color-text);
					font-family: "Noto Serif JP", serif;
				}
				
			}
			label {
				margin-right: 40px;
				display: block;
				cursor: pointer;
			}
		}
		.submit {
			margin: 0;
			button {
				font-weight: 500;
				font-size: 25px;
				display: block;
				width: 300px;
				margin: 0 auto;
				padding: 10px 0;
				background-color: var(--btn-base);
				font-family: "Noto Serif JP", serif;
				color: #fff;
				border: 0;
				border-radius: 100px;
				cursor: pointer;
				transition: ease-in .2s;
				&:hover {
					opacity: 0.8;
				}
			}
		}
	}

	/* 症例　共通 */
	.case_list {
		margin: 0;
		padding: 0;
		.list-title{
			span{
				
				position: relative;
				display: block;
				color: var(--color-text);
				font-weight: 500;
				font-size: 30px;
				padding-top: 10px;
				line-height: 1.5;
				margin: 0 0 30px;
				&::before{
					content:"";
					position: absolute;
					top: 0;
					left: 0;
					width: 50px;
					height: 3px;
					background: #656565;
					border-radius: 5px;
				}
			}
		}
		.btn_more {
			text-align: right;
			a{
				display: inline-block;
				padding: .5rem 2rem;
				font-size: 1.25rem;
				color: #fff;
				background: var(--btn-base);
				border:1px solid var(--btn-base);
				border-radius: 30px;
				&:after{
					content:"\f105";
					margin-left: .5rem;
					display: inline-block;
					font-weight: 900;
					font-family: "Font Awesome 6 Free";
				}
				&:hover{	
					color: var(--btn-base);
					background: #fff;
				}
			}
		}
	}
	.case_list_box {
		display: flex;
		justify-content: space-between;
		.case_photo {
			width: 570px;
			height: 550px;
			
			figure{
				figcaption {
					font-size: 1.875rem;
				}
			}
			&.vertical{
				display: flex;
				flex-wrap: wrap;
				figure{
					display: block;
					margin: 0;
					width: 50%;
					height: 500px;
					line-height: 0;
					figcaption {
						display: block;
						color: #fff;
						font-family: var(--font-en);
						text-align: center;
						line-height: 1.6;
					}
				}
			}
			&.beside{
				figure{
	
					position: relative;
					line-height: 0;
					figcaption {
						position: absolute;
						left: 0;
						bottom: 0;
						display: inline-block;
						padding: .3rem 1.5rem;
						color: #fff;
						font-family: var(--font-en);
						text-align: center;
						line-height: 1.6;
					}
				}
			}
			figure {
				img {
					width: 100%;
					height: 100%;
					object-fit: cover;
				}
				&.case_before{
	
					figcaption {
						background: var(--color-base);
					}
				}
				&.case_after{
	
					figcaption {
						background: var(--btn-base);
					}
				}
			}
			.case_after{
				figcaption{
					small {
						font-weight: 500;
						font-size: 14px;
						display: inline-block;
						margin-left: 10px;
						letter-spacing: 0;
						font-family: var(--font-serif);
					}
				}
			}
		}
		
		.case_detail {
			width: calc(100% - 650px);
		}
	}
	.case_detail {
		dl {
			display: flex;
			flex-wrap: wrap;
			width: 100%;
			margin-bottom: 1.5rem;
			border-top:1px dashed #656565;
			dt {
				display: flex;
				justify-content: center;
				align-items: center;
				width: 170px;
				padding: 1.25rem 1.25rem;
				color: var(--btn-base);
				background: #f2f2f2;
				font-weight: 500;
				border-bottom:1px dashed #656565;
				font-size: clamp(0.75rem, 0.636rem + 0.48vw, 1rem);
			}
			dd {
				background: #fff;
				font-weight: 500;
				border-bottom:1px dashed #656565;
				width: calc(100% - 170px);
				margin-left: 0;
				padding: 1.25rem;
				font-size: clamp(0.75rem, 0.636rem + 0.48vw, 1rem);
				.price {
					font-weight: 500;
					color: var(--color-pink);
					font-size: 1.375rem;
					.price_tax {
						font-weight: 500;
						font-size: 0.875rem;
					}
				}
				.price_detail {
					margin-top: 10px;
				}
			}
		}
	}
	/* 症例一覧 */
	&.page_case_archive {
		.case_list {
			border-top: 1px #707070 solid;
			li{
				margin-top: 70px;
				padding-bottom: 70px;
				border-bottom: 2px #707070 dotted;
			}
		}
		.case_archive{
			padding-bottom: 100px;
		}
		
		/*--------------------
		症例　検索結果
		--------------------*/
		.search_hit {
			margin-bottom: 50px;
			text-align: center;
			.txt {
				text-align: center;
				font-size: 20px;
				margin: 0;
				.large {
					font-size: 1.5em;
					color: var(--color-pink);
					padding: 0.2em;
				}
			}
		}
	}
	/*--------------------
	症例　詳細
	--------------------*/
	&.page_case_single{
		/* 症例メイン */
		.case_list{
			margin-bottom: 4rem;
		}
		.case_list_box{
			padding-top: 0 !important;
			dl{
				margin-bottom: 3rem;
			}
		}
		h2{
			margin-bottom: 2rem;
			text-align: center;
			span{
				position: relative;
				padding: 0 3.5rem;
				display: inline-block;
				font-size: 1.5rem;
				color: var(--color-text);
				&:before,&:after{
					content:"";
					position: absolute;
					top: 50%;
					transform: translateY(-50%);
					width: 35px;
					height: 2px;
					background: #656565;
				}
				&:before{
					left: 0;
				}
				&::after{
					right: 0;
				}
			}
		}
		.detail-box{
			.title{
				color: var(--color-text);
				margin-bottom: 1rem;
				font-size: 1.5rem;
				font-weight: bold;
			}
		}
		.case_photo {
			margin-bottom: 1rem;
			&:last-child{
				margin-bottom: 0;
			}
			&.vertical{
				flex-wrap: wrap;
			}
		}
		
		.case_info{
			margin-bottom: 4rem;
			padding: 4rem 0;
			background: #F6F2EC;
			.case_detail_list{
				margin-bottom: 4rem;
				dt{
					color: #fff;
					background: var(--color-base);
				}
			}
			.price_table{
				dl {
					dt {
						margin-bottom: 1rem;
						font-size: 1.125rem;
						color: var(--btn-base);

						&::before {
							content: "●";
							display: inline-block;
							margin-right: .3rem;
						}
					}
				}
				.bikou {
					font-size: 12px;
					margin-top: -25px;
					& + dl {
						margin-top: 3rem;
					}
				}
				table{
					border-radius: 30px 30px 0 0;
					overflow: hidden;
					.col01{
						width: calc(100% - 300px);
					}
					.col02{
						width: 300px;
					}
					th{
						width: auto;
					}
					thead{
						th{
							font-weight: 500;
							color: #fff;
							text-align: center;
							background: var(--color-base);
							font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
							&:nth-child(1){
								border-right:1px solid #fff;
							}
						}
					}
					tbody{
						tr{
							background: #fff;
							border-bottom:1px dashed #656565;
							&:last-of-type{
								border-bottom: none;
							}
							&:nth-child(2n){
								background: #F2E7DC;
							}
							th,td{
								padding: 20px;
							}
							th{
								font-weight: 500;
								border-right:#656565 1px solid;
								font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
							}
							td{
								text-align: right;
								color: var(--color-pink);
								font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
							}
						}
					}
				}
			}
		}
		.btn-block{
			h2{
				span{
					padding: 0;
					&:before,&:after{
						content: none;
					}
				}

			}
			.btn-box{
				display: flex;
				justify-content: center;
				flex-wrap: wrap;
				gap:16px;
				.base-btn{
					a{
						position: relative;
						display: inline-block;
						padding: .5rem 2rem .5rem 1rem;
						min-width: 200px;
						color: #fff;
						background: var(--btn-base);
						border-radius: 30px;
						text-align: center;
						&:after{
							position: absolute;
							content:"\f105";
							display: inline-block;
							top: 50%;
							right: 1rem;
							transform: translateY(-50%);
							margin-left: .5rem;
							font-weight: 900;
							font-family: "Font Awesome 6 Free";
						}
						&:hover {
							opacity: 0.8;
						}
					}
				}
			}
		}
	}
}



@media screen and (max-width: 1300px) {
	#case{
		.case_list_box{
			.case_photo {
				width: 500px;
				height: 500px;
				&.vertical{
					figure{
						height: 500px;
					}
				}
			}
			.case_detail{
				
				width: calc(100% - 550px);
			}
		}
		.case_detail {
			dl {
				dt {
					width: 170px;
					padding: 1.25rem 1.25rem;
				}
				dd {
					width: calc(100% - 170px);
					.price {
						font-size: 1.375rem;
					}
				}
			}
		}
	}
}

@media screen and (max-width: 1025px) {
	#case{
		.case_list_box{
			position: relative;
			display: block;
			padding-top: 4.5rem;
			.case_photo {
				margin: 0 auto 2rem;
				width: 500px;
				height: 500px;
				&.vertical{
					figure{
						height: 450px;
					}
				}
			}
			.case_detail {
				width: 100%;
			}
		}
		.case_detail {
			.list-title{
				position: absolute;
				top: 0;
				left: 0;
			}
			dl {
				dt {
					width: 170px;
					padding: 1.25rem 1.25rem;
				}
				dd {
					width: calc(100% - 170px);
					.price {
						font-size: 1.375rem;
					}
				}
			}
		}
		&.page_case_single{
			.photo-box{
				margin-bottom: 2rem;
			}
		}
	}
}

@media screen and (max-width: 769px) {
	#case{
		.case_list_box{
			padding-top: 6.5rem;
			.case_photo {
				width: 450px;
				height: 450px;
				figure{
					
					figcaption {
						font-size: 1.25rem;
					}
				}
				&.vertical{
					figure{
						height: 400px;
					}
				}
			}
		}
		.case_detail {
			.list-title{
				span{
					font-size: 1.625rem;
				}
			}
			dl {
				dt {
					width: 100px;
					padding: 1rem;
				}
				dd {
					width: calc(100% - 100px);
					.price {
						font-size: 1.25rem;
					}
				}
			}
		}
		.case_list{
			.btn_more{
				text-align: center;
			}
		}
		
		/*--------------------
		症例　詳細
		--------------------*/
		&.page_case_single{
			/* 症例メイン */
			h3{
				margin-bottom: 2rem;
				span{
					padding: 0 3.5rem;
					font-size: 1.5rem;
				}
			}
			.detail-box{
				.title{
					font-size: 1.5rem;
				}
			}
			
			.case_info{
				margin-bottom: 4rem;
				padding: 4rem 0;
				.case_detail_list{
					margin-bottom: 4rem;
				}
				.price_table{
					table{
						border-radius: 30px 30px 0 0;
						overflow: hidden;
						.col01{
							width: calc(100% - 180px);
						}
						.col02{
							width: 180px;
						}
					}
				}
			}
			.btn-block{
				.btn-box{
					display: block;
					.base-btn{
						margin-bottom: 1rem;
						text-align: center;
					}
				}
			}
		}
	}
}
@media screen and (max-width: 479px) {
	#case{
		.case_list_box{
			padding-top: 6.5rem;
			.case_photo {
				width: 100%;
				height: 400px;
				figure{
					
					figcaption {
						font-size: 18px;
					}
				}
				&.vertical{
					figure{
						height: 350px;
					}
				}
			}
		}
		.case_detail {
			.list-title{
				span{
					font-size: 1.5rem;
				}
			}
			dl {
				dd {
					.price {
						font-size: 1.25rem;
						small {
							font-weight: 500;
							font-size: 14px;
							display: inline-block;
							margin-left: 10px;
							letter-spacing: 0;
						}
					}
				}
			}
		}
	}
}

/*--------------------
料金表
--------------------*/
#price{

	.title-block{
		background: url(../img/price/price_title.jpg) no-repeat 50% 50%;
		background-size: cover;
	}
	.inblock {
		max-width: 1000px;
	}
	.pagelink{
		margin-bottom: 4rem;
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
		gap:1rem 2.5%;
		a{
			position: relative;
			display: flex;
			justify-content: flex-start;
			align-items: center;
			width: 31%;
			padding: 1rem 2rem 1rem 1rem;
			color: #fff;
			background: var(--btn-base);
			transition: all .3s;
			&:hover{
				opacity: 0.8;
			}
			&:before{
				content:"\f13a";
				position: absolute;
				right: 10px;
				top: 50%;
				transform: translateY(-50%);
				display: inline-block;
				color: #fff;
				font-size: clamp(0.813rem, 0.67rem + 0.61vw, 1.125rem);
				font-weight: 900;
				font-family: "Font Awesome 6 Free";
			}
		}
	}
	.product-price{
		margin-bottom: 3rem;
		h2{
			margin-bottom: 1rem;
			padding: 1rem 1rem 1rem 2rem;
			color: #fff;
			background: var(--color-base);
			span{
				position: relative;
				display: inline-block;
				padding-left: 1rem;
				font-size: clamp(1.125rem, 0.727rem + 1.7vw, 2rem);
				&:before{
					content:"";
					position: absolute;
					left: 0;
					top: 0;
					height: 100%;
					width: 5px;
					background: #fff;
					border-radius: 10px;
				}
				small{
					font-size: 1rem;
				}
			}
		}
		dl{
			&:nth-of-type(2n){
				dd{
					table{
						background: var(--color-base2);
						th,td{
							border: 1px solid var(--color-base);
							font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
						}
					}
				}
			}
			dt{
				margin-bottom: 1rem;
				font-size: 1.125rem;
				color: var(--btn-base);
				&:before{
					content:"●";
					display: inline-block;
					margin-right: .3rem;
				}
			}
			& + dl {
				margin-top: 2rem;
			}
		}
		table{
			margin-bottom: .5rem;
			th,td{
				padding: 10px 25px ;
				border:1px solid #ccc;
			}
			th{
				padding: 10px 25px ;
				width: calc(100% - 200px);
				font-weight: normal;
				font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
			}
			td{
				width: 200px;
				text-align: right;
				font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
				small{
					font-size: .875rem;
				}
			}
		}
		.bikou {
			font-size: 12px;
			& + dl {
				margin-top: 2rem;
			}
		}
	}
}

@media screen and (max-width: 769px) {
	#price{
		.pagelink{
			margin-bottom: 4rem;
			gap:1rem 4%;
			a{
				width: 48%;
				padding: .5rem 2rem .5rem .5rem;
			}
		}
		.product-price{
			margin-bottom: 3rem;
			h2{
				margin-bottom: 1.5rem;
				padding: 1rem 1rem 1rem 1.5rem;
				span{
					padding-left: 1rem;
					&:before{
						content:"";
						position: absolute;
						left: 0;
						top: 0;
						height: 100%;
						width: 5px;
						background: #fff;
						border-radius: 10px;
					}
					small{
						font-size: 1rem;
					}
				}
			}
			dl{
				&:nth-of-type(2n){
					dd{
						table{
							background: var(--color-base2);
							th,td{
								border: 1px solid var(--color-base);
							}
						}
					}
				}
				dt{
					margin-bottom: 1rem;
					font-size: 1.125rem;
					color: var(--btn-base);
					&:before{
						content:"●";
						display: inline-block;
						margin-right: .3rem;
					}
				}
			}
			table{
				margin-bottom: .5rem;
				th,td{
					padding: 10px 15px ;
					border:1px solid #ccc;
				}
				th{
					padding: 10px 15px ;
					width: calc(100% - 120px);
					font-weight: normal;
				}
				td{
					width: 120px;
					small{
						font-size: .875rem;
					}
				}
			}
		}
	}
}


/*--------------------
クリニックについて
--------------------*/
#about{
	.title-block{
		background: url(../img/about/about_title.jpg) no-repeat 50% 50%;
		background-size: cover;
	}
	#container{
		margin-bottom: 0;
	}
	h2.en-title{
		margin-bottom: 2.5rem;
		color: var(--color-text);
		font-family: var(--font-en);
		font-size: 1.875rem;
		font-weight: 500;
		text-align: center;
		span{
			display: block;
			font-size: 4rem;
			font-weight: 400;
			color: #D1D1D1;
		}
	}
	.concept{
		position: relative;
		padding-bottom: 4rem;
		h2.en-title{
			text-align: left;
		}
		&:before{
			content:"";
			position: absolute;
			bottom: 0;
			left: 0;
			width: 100%;
			height: 60%;
			background: #F6F2EC;
			z-index: -1;
		}
		.photo-area{
			display: flex;
			justify-content: space-between;
			margin-bottom: 3rem;
			.img{
				width: 40%;
				max-width: 520px;
				border-radius: 30px 0 0 0 ;
				overflow: hidden;
				&.l-img{
					width: 55%;
					max-width: 740px;
					border-radius: 0 30px 0 0 ;
					overflow: hidden;
				}
				img{
					width: 100%;
					height: 100%;
					object-fit: cover;
				}
			}
		}
		.photo{
			display: none;
			width: 100%;
			border-radius: 30px 0 0 0 ;
			overflow: hidden;
			.img{
				height: 100%;
			}
			img{
				width: 100%;
				height: 100%;
				object-fit: cover;
				object-position: 50% 50%;
			}
		}
		.f-catch{
			display: flex;
			justify-content: center;
			align-items: center;
			margin-bottom: 5rem;
			.catch{
				margin-right: 2rem;
				width: 400px;
				text-align: center;
				span{
					display: block;
					font-size: 1.375rem;
					color: var(--color-text);
					letter-spacing: .3rem;
					&.en{
						color: #fff;
						font-size: clamp(3.125rem, 2.727rem + 1.7vw, 4rem);
						line-height: .2;
						letter-spacing: 1.375rem;
						font-family: var(--font-en);
					}
				}
			}
			.read{
				width: calc(100% - 420px);
				max-width: 600px;
				font-size: clamp(0.875rem, 0.784rem + 0.39vw, 1.125rem);
				color: var(--color-text);
				line-height: 2;
				text-align: left;
			}
		}
		.wave{
			position: absolute;
			bottom: 0;
			left: 0;
			width: 100%;
			height: 200px;
			z-index: 105;
			canvas{
				position: absolute;
				bottom: -100px;
				left:0;
				width: 100%;
			}
		}
		
		
	}
	
	/*クリニックの特徴*/
	.point{
		padding: 5rem 0;
		.inblock{
			h2.en-title{
				margin-bottom: 5rem;
			}
			.f-point{
				display: flex;
				justify-content: center;
				flex-wrap: wrap;
				margin-bottom: 2rem;
				gap: 6rem 2.5%;
				.point-box{
					position: relative;
					width: 31%;
					border-radius: 30px 30px 0 0;
					background:#CBAF8F;
					.catch-num{
						position: absolute;
						right: 0;
						left: 0;
						top: -70px;
						display: inline-flex;
						justify-content: center;
						align-items: flex-end;
						color: var(--color-base);
						.s-num{
							font-size: 5rem;
							line-height: .9;
							em{
								display: block;
								font-size: 14px;
							}
						}
						.l-num{
							font-size: 7rem;
							line-height: .9;
						}
						
					}
					.photo{
						border-radius: 30px 30px 0 0;
						overflow: hidden;
						line-height: 0;
					}
					.text{
						padding:1rem 1.5rem 2rem;
						.catch{
							display: flex;
							justify-content: center;
							align-items: center;
							min-height: 185px;
							margin-bottom: 2.5rem;
							padding-bottom: 1rem;
							color: #fff;
							border-bottom: 1px solid #fff;
							font-size: clamp(1.25rem, 1.159rem + 0.39vw, 1.5rem);
							line-height: 1.8;
							text-align: center;
						}
						span{
							display: block;
						}
						.read{
							color: #fff;
							font-size: clamp(0.875rem, 0.784rem + 0.39vw, 1.125rem);
						}
					}
					&:nth-child(2n){
						background: #ACACAC;
					}
				}
			}
		}
	}
	.flow{
		padding: 4rem 0;
		background: #F6F2EC;
		.inblock{
			.swiper-wrapper{
				display: block;
			}
			.flow-box{
				display: flex;
				justify-content: space-between;
				align-items: flex-start;
				margin-bottom: 3.5rem;
				.num{
					position: relative;
					display: flex;
					justify-content: center;
					align-items: center;
					width: 100px;
					height: 100px;
					border-radius: 50%;
					color: #fff;
					background: var(--btn-base);
					text-align: center;
					span{
						display: block;
						font-size: 3rem;
						line-height: 1;
						small{
							display: block;
							font-size: 1rem;
						}
					}
					&:before{
						content:"";
						position: absolute;
						right: 50%;
						margin: 0 auto;
						bottom: -50px;
						height: 50px;
						transform: translate(2px,0);
						width: 1px;
						border-left:2px solid var(--btn-base);
					}
					&:after{
						content:"";
						position: absolute;
						right: 50%;
						bottom: -51px;
						transform: translate(11px,100%);
						width: 1px;
						height: 50px;
						background-image: radial-gradient(circle, var(--btn-base) 20%, transparent 21%);
						background-size: 12px 12px;
						background-repeat: repeat;
						padding: 8px;
					}
				}
				.read-box{
					width: calc(100% - 150px);
					display: flex;
					justify-content: space-between;
					align-items: center;
					dl{
						width: 65%;
						dt{
							margin-bottom: 1.5rem;
							font-size: 2rem;
							font-weight: 500;
							color: var(--btn-base);
						}
						dd{
							line-height: 1.8;
							font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
							a{
								text-decoration: underline;
								&:hover{
									text-decoration: none;
								}
							}
						}
					}
					.photo{
						
						position: relative;
						width: 30%;
						line-height: 0;
						z-index: 2;
						&:before{
							content:"";
							position: absolute;
							left: 0;
							top: 0;
							width: 100%;
							height: 100%;
							transform: translate(10px,10px);
							background: #F2E7DC;
							border-radius: 20px;
							z-index: -1;
						}
						picture{
							img{
								border-radius: 20px;
							}
						}
					}
				}
				&:last-child{
					.num{
						&:before,&:after{
							content:none;
						}
					}
				}
			}
		}
	}
	/*医師紹介*/
	.about{
		padding: 5rem 0;
		background: #fff;
		.inblock{
			.f-block{
				display: flex;
				justify-content: space-between;
				.photo-box{
					position: relative;
					width: 38%;
					.photo{
						line-height: 0;
						border-radius: 0 0 0 30px;
						overflow: hidden;
					}
					.en{
						position: absolute;
						top: -50px;
						right: -100px;
						font-size: 8rem;
						color: #D1D1D1;
						line-height: 1;
						font-family: var(--font-en);
					}
				}
				.text-block{
					position: relative;
					width: 58%;
					padding-top: 130px;
					z-index: 2;
					h2{
						margin-bottom: 2rem;
						font-size: 2rem;
						font-weight: 500;
						color: var(--color-text);
					}
					.read-box{
						p{
							margin-bottom: 1.5rem;
							color: #333333;
							font-weight: 500;
							line-height: 1.8;
							font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
						}
					}
					.name-box{
						display: flex;
						justify-content: space-between;
						align-items: center;
						.name{
							width: 100%;
							font-size: 1.5rem;
							color: #333;
							font-weight: 500;
							span{
								display: inline-block;
								margin-right: 1.5rem;
							}
							em{
								display: inline-block;
								font-size: 1.875rem;
							}
						}
					}
				}
			}
		}
	}
	/*Instagram*/
	.insta{
		padding: 5rem 0;
		background: var(--color-base2);
		.inblock{
			.f-title{
				h2.en-title{
					text-align: center;
				}
			}
			.f-insta{
				display: flex;
				justify-content: center;
				flex-wrap: wrap;
				max-width: 1000px;
				margin: 0 auto 2rem;
				p{
					width: 33%;
					a{
						display: block;
						width: 100%;
						aspect-ratio: 1/1.1;
						line-height: 0;
						img{
							width: 100%;
							height: 100%;
							object-fit: cover;
						}
						&:hover{
							img{
								opacity: .8;
							}
						}
					}
				}
			}
			.id{
				text-align: center;
				a{
					display: inline-block;
					font-size: 1.75rem;
					color: var(--color-base);
					font-family: var(--font-en);
					&:before{
						content:"\f16d";
						margin-right: 1rem;
						font-size: 1.875rem;
						font-family: "Font Awesome 6 Free","Font Awesome 6 Brands";
					}
				}
			}
		}
	}
}


@media screen and (max-width: 1025px) {
	#about{
		h2.en-title{
			font-size: 1.875rem;
			span{
				font-size: 3.75rem;
			}
		}
		/*医師紹介*/
		.about{
			.inblock{
				.f-block{
					.photo-box{
						.en{
							font-size: 6.5rem;
							font-family: var(--font-en);
						}
					}
					.text-block{
						padding-top: 0;
						h2{
							margin-bottom: 1.5rem;
						}
						.read-box{
							p{
								margin-bottom: 1rem;
								line-height: 1.6;
							}
						}
						.name-box{
							.name{
								font-size: 1.25rem;
								span{
									margin-right: 0;
									font-size: 15px;
									display: block;
								}
								em{
									display: block;
									font-size: 1.625rem;
								}
							}
						}
						
					}
				}
			}
		}
		.flow{
			.inblock{
				.flow-box{
					.num{
						width: 90px;
						height: 90px;
						span{
							font-size: 2.5rem;
						}
					}
					.read-box{
						width: calc(100% - 120px);
						dl{
							dt{
								font-size: 1.625rem;
							}
						}
					}
				}
			}
		}
		.point{
			.inblock{
				.f-point{
					.point-box{
						.catch-num{
							top: -60px;
							.l-num{
								font-size: 6rem;
							}
							.s-num{
								font-size: 4rem;
								em{
									font-size: 12px;
								}
							}
						}
						.text{
							padding: 1rem;
							font-size: 1.125rem;
						}
					}
				}
			}
		}
		.insta{
			.inblock{
				.f-title{
					.id{
						a{
							font-size: 1.75rem;
						}
					}
				}
			}
		}
	}
}

@media screen and (max-width: 769px) {
	#about{
		h2.en-title{
			font-size: 1.375rem;
			span{
				font-size: 3rem;
			}
		}
		.concept{
			position: relative;
			z-index: 50;
			&:before{
				height: 80%;
			}
			.photo-area{
				width: 100%;
				margin-bottom: 4rem;
				.img{
					&.l-img{
						width: 100%;
						max-width: 100%;
						aspect-ratio: 1.25/ 1;
					}
					&.spn{
						display: none;
					}
				}
			}
			.f-catch{
				display: block;
				margin-bottom: 2rem;
				.catch{
					margin-right: 0;
					margin-bottom: 2rem;
					text-align: center;
					width: 100%;
				}
				.read{
					width: 100%;
					max-width: 100%;
				}
			}
			.photo{
				display: block;
				margin-bottom: 2.5rem;
				.img{
					
					aspect-ratio: 1.25/ 1;
				}
			}
		}
		.point{
			position: relative;
			z-index: 100;
			padding-top: 3rem;
			.inblock{
				.f-point{
					display: block;
					.point-box{
						width: 100%;
						max-width: 500px;
						margin:0 auto 5rem;
						.text{
							padding: 2rem 1.5rem;
							.catch{
								min-height: 150px;
							}
						}
					}
				}
			}
		}
		.flow{
			.inblock{
				.swiper-wrapper{
					display: flex;
				}
				.flow-box{
					display: block;
					margin-bottom: 1.5rem;
					.num{
						width: 85px;
						height: 85px;
						margin: 0 auto 1.5rem;
						&:before{
							right: 0;
							bottom: 50%;
							margin: 0;
							width: 65%;
							transform: translate(100%,-1px);
							height: 1px;
							border-right:none;
							border-bottom:2px solid var(--btn-base);
						}
						&:after{
							right: -65%;
							bottom: 50%;
							margin: 0;
							height: 1px;
							width: 45px;
							transform: translate(42px,50%);
							background-image: radial-gradient(circle, var(--btn-base) 20%, transparent 21%);
							background-size: 12px 12px;
							background-repeat: repeat;
							padding: 8px;
						}
						span{
							font-size: 2.25rem;
							small{
								margin-bottom: .1rem;
							}
						}
					}
					.read-box{
						display: block;
						width: 100%;
						dl{
							width: 100%;
							margin-bottom: 2rem;
							dt{
								font-size: 1.625rem;
								text-align: center;
							}
						}
						.photo{
							width: 100%;
						}
					}
				}
				.swiper-container{
					position: relative;
					padding-bottom: 2.5rem;
					.swiper-pagination-bullet {
						background-color: #D1D1D1; /* ドットの色を指定できます */
						width: 18px;
						height: 18px;
						margin-right: .5rem;
						opacity: 1;
						&:last-of-type{
							margin-right: 0;
						}
					}
					.swiper-pagination-bullet-active {
						background-color: var(--btn-base); /* アクティブなドットの色を指定できます */
					}
				}
			}
		}
		.about{
			.inblock{
				.f-block{
					display: block;
					.photo-box{
						width: 100%;
						max-width: 400px;
						margin: 0 auto 1rem;
						.en{
							right: -20px;
							font-size: 5.25rem;
						}
					}
					.text-block{
						width: 100%;
						.name-box{
							.name{
								span{
									margin-right: .5rem;
								}
								em{
									display: inline-block;
								}
							}
						}
					}
				}
			}
		}
		.case{
			.inblock{
				.f-box{
					display: block;
					.case-box{
						width: 100%;
						margin-bottom: 2rem;
						.title{
							position: relative;
							padding: .8rem 1rem;
							pointer-events: all;
							&:before{
								
								content: "";
								position: absolute;
								right: 30px;
								top: 50%;
								width: 20px;
								height: 2px;
								background: #656565;
								z-index: 5;
							}
							&:after{
								
								content: "";
								position: absolute;
								right: 30px;
								top: 50%;
								width: 20px;
								height: 2px;
								background: #656565;
								transform: rotate(90deg);
								transition: .3s all;
								z-index: 5;
							}
							&.click{
								&:after{
									transform: rotate(0);
								}
							}
						}
						ul{
							display: none;
							li{
								a{
									padding: 1rem 3rem 1rem 1rem;
								}
							}
						}
					}
				}
			}
		}
	}
	
}

@media screen and (max-width: 479px) {
	#about{
		h2.en-title{
			font-size: 1.125rem;
			span{
				font-size: 2.5rem;
			}
		}
		.about{
			.inblock{
				.f-block{
					display: block;
					.photo-box{
						width: 100%;
						max-width: 300px;
						margin: 0 auto 1rem;
						.en{
							top: 90%;
							right: -20px;
							font-size: 5.25rem;
						}
					}
				}
			}
		}
		.insta{
			.inblock{
				.f-title{
					display: block;
					.en-title{
						margin-bottom: 1rem;
						width: 100%;
					}
				}
				.f-insta{
					p{
						width: 50%;
					}
				}
				.id{
					margin-bottom: 2rem;
					width: 100%;
					a{
						font-size: 1.375rem;
						&::before{
							font-size: 1.625rem;
							margin-right: .5rem;
						}
					}
				}
			}
		}

	}
}

/*--------------------
施術メニュー
--------------------*/
@keyframes case-anim {
	0% {
	  opacity: 1;
	}
	100% {
	  opacity: 0;
	}
}
#menu{
	.title-block{
		background: url(../img/menu/menu_title.jpg) no-repeat 50% 50%;
		background-size: cover;

        @media (max-width: 767px) {
			background: url(../img/menu/menu_title_sp.jpg) center right / cover no-repeat;
		}
	}
	h2.en-title{
		margin-bottom: 2.5rem;
		color: var(--color-text);
		font-family: var(--font-en);
		font-size: 1.875rem;
		font-weight: 500;
		text-align: center;
		span{
			display: block;
			font-size: 4rem;
			font-weight: 400;
			color: #D1D1D1;
		}
	}
	.breadcrumb{
		margin-bottom: 1rem;
	}
	&.list{
		
		#container{
			margin-bottom:0 ;
		}
		/*お悩みから探す*/
		.trouble{
			padding: 5rem 0;
			background: var(--color-base);
			.inblock{
				h2.en-title{
					span{
						color: #fff;
					}
				}
				.f-box{
					display: flex;
					justify-content: flex-start;
					flex-wrap: wrap;
					gap: 18px;
					.trouble-box{
						width: 32%;
						.head{
							position: relative;
							padding: 1.5rem 3rem 1.5rem 1.5rem;
							color: var(--color-text);
							background: var(--color-base2);
							border-radius: 0 40px 0 0;
							cursor: pointer;
							h3{
								font-size: 1.25rem;
							}
							&:before{
								content:"";
								position: absolute;
								right: 30px;
								top: 50%;
								width: 20px;
								height: 2px;
								background: var(--color-text);
								z-index: 5;
							}
							&:after{
								content:"";
								position: absolute;
								right: 30px;
								top: 50%;
								width: 20px;
								height: 2px;
								background: var(--color-text);
								transform: rotate(90deg);
								transition: .3s all;
								z-index: 5;
							}
							&.click{
								&:after{
									transform: rotate(0);
								}
							}
						}
						.row{
							position: relative;
							padding: 1rem;
							background: #fff;
							display: none;
							line-height: 1.4;
							li{
								a{
									position: relative;
									display: block;	
									padding: 1rem 3rem 1rem 1rem;
									border-bottom:1px solid var(--color-base);
									&:before{
										content:"";
										position: absolute;
										right: 15px;
										top: 45%;
										transform: translate(0,-50%) rotate(45deg);
										width: 10px;
										height: 2px;
										background: var(--color-base);
										transition: .3s all;
									}
									&:after{
										content:"";
										position: absolute;
										right: 15px;
										top: 50%;
										transform: translate(0,-50%);
										width: 25px;
										height: 2px;
										background: var(--color-base);
										transition: .3s all;
									}
									&:hover{
										&:before{
											
											transform: translate(5px,-50%) rotate(45deg);
										}
										&:after{
											transform: translate(5px,-50%);
										}
									}
								}
							}
						}
					}
				}
			}
		}

		
		/*施術メニュー*/
		.case{
			padding: 5rem 0;
			background: var(--color-base2);
			.inblock{
				.f-box{
					display: flex;
					justify-content: flex-start;
					flex-wrap: wrap;
					gap: 2rem 2.5%;
					.case-box{
						width: 31%;
						.title{
							margin-bottom: 1rem;
							padding: 1.5rem;
							font-size: 1.25rem;
							color: #fff;
							background: var(--btn-base);
							border-radius: 50px;
							text-align: center;
							pointer-events: none;
						}
						ul{
							li{
								margin-bottom: 1rem;
								a{
									padding: 1.5rem 3rem 1.5rem 2rem;
									border-bottom:none;
									background: #fff;
									&:before,&:after{
										right: 25px;
									}
								}
							}
						}
						& > a {
							.title{
								position: relative;
								&::before {
									content: "";
									position: absolute;
									top: 50%;
									right: 30px;
									width: 8px;
									height: 8px;
									border: 0;
									border-top: solid 1px #fff;
									border-right: solid 1px #fff;
									transform: translate(0, -50%) rotate(45deg);
									transition: all 0.2s 0.1s ease-in-out;
								}
							}
							&:hover {
								opacity: 0.8;
							}
						}
					}
				}
			}
		}
	}
	&.detail{
		#container{
			margin-bottom:4rem ;
		}
		.title-block{
			position: relative;
			padding: 0;
			border-radius: 0;
			background: #F6F2EC;
			overflow: hidden;
			.inblock{
				position: relative;
				max-width: 1200px;
			}
			.page_title{
				padding: 3rem 0 2rem;
				width: 100%;
			}
			h1{
				position: relative;
				color: var(--btn-base);
				font-size: 2.25rem;
				z-index: 3;
			}
			.photo{
				display: inline-block;
				line-height: 0;
				position: absolute;
				top: 10px;
				height: 100%;
				right: 0;
				z-index: 1;
				.img{
					max-height: 100%;
					img{
						height: auto;
						max-height: 100%;
					}
				}

			}
			.wave{
				position: relative;
				transform: translateY(5px);
				z-index: 2;
			}
		}
		.center{
			text-align: center;
		}
		.inblock{
			&.narrow{
				max-width: 1000px;
			}
		}
		.breadcrumb{
			margin-bottom: 3rem;
		}
		.m-photo{
			margin-bottom: 2rem;
		}
		.wysiwyg-title{
			margin-bottom: 2rem;
			span{
				position: relative;
				display: inline-block;
				padding: .5rem 2rem;
				font-size: clamp(1.375rem, 0.963rem + 1.76vw, 2.5rem);
				color: var(--btn-base);
				line-height: 1.2;
				&:before,&:after{
					content:"";
					position: absolute;
					top: 0;
					height: 100%;
					width: 2px;
					background: var(--color-text);
					border-radius: 30px;
				}
				&::before{
					left: 0;
				}
				&:after{
					right: 0;
				}
			}
		}
		.bg-title{

			padding: 1rem 1rem 1rem 1rem;
			background: var(--color-base);
			span{
				display: inline-block;
				position: relative;
				padding-left: 2rem;
				font-size: clamp(1.125rem, 0.727rem + 1.7vw, 2rem);
				color: #fff;
				&:before{
					content:"";
					position: absolute;
					top: 0;
					left: 1rem;
					width: 5px;
					height: 100%;
					background: #fff;
					border-radius: 20px;
				}

			}
		}
		.wysiwyg_area{
			margin-bottom: 4rem;
			h5{
				margin-bottom: 1rem;
				color: var(--color-base);
				font-weight: bold;
			}
		}
		.menu_recommend{
			.menu_risk{
				
			margin-bottom: 3rem;
			}
			.risk_list{
				position: relative;
				padding: 2rem;
				border:2px solid var(--color-base);
				overflow: hidden;
				&.flex{
					display: flex;
					justify-content: flex-start;
					flex-wrap: wrap;
					gap:1rem;
					li{
						width: 48%;
						margin: 0;
					}
				}
				&:before{
					content:"";
					position: absolute;
					left: -15px;
					top: -15px;
					width: 30px;
					height: 30px;
					background: var(--btn-base);
					transform: rotate(45deg);
				}
				&:after{
					content:"";
					position: absolute;
					right: -15px;
					bottom: -15px;
					width: 30px;
					height: 30px;
					background: var(--btn-base);
					transform: rotate(45deg);
				}
				li{
					max-width: 800px;
					margin: 0 auto .5rem;
					font-size: clamp(0.813rem, 0.557rem + 1.09vw, 1.375rem);
					color: var(--color-text);
					&:before{
						content: "\f14a";
						display: inline-block;
						margin-right: .5rem;
						font-size: clamp(1.25rem, 0.966rem + 1.21vw, 1.875rem);
						font-weight: 900;
						color: #ACACAC;
						font-family: "Font Awesome 6 Free";
					}
				}
			}
		}
		
		/*クリニックの特徴*/
		.pickup{
			margin-bottom: 4rem;
			.inblock{
				h2.en-title{
					margin-bottom: 5rem;
				}
				.pickup-box{
					.title{
						display: flex;
						justify-content: flex-start;
						align-items: flex-end;
						margin-bottom: 1.5rem;
						.catch-num{
							display: inline-flex;
							justify-content: center;
							align-items: flex-end;
							margin-right: 1.5rem;
							color: var(--color-base);
							.s-num{
								font-size: 3rem;
								line-height: .9;
								text-align: center;
								em{
									display: block;
									font-size: 8px;
								}
							}
							.l-num{
								font-size: 4rem;
								line-height: .9;
							}
							
						}
						h3{
							span{
								position: relative;
								padding-bottom: .3rem;
								display: inline-block;
								font-size: 1.25rem;
								font-weight: 500;
								color: var(--color-text);
								&:before{
									content:"";
									position: absolute;
									left: 0;
									bottom: 0;
									width: 100%;
									height: 1px;
									background: var(--color-text);
								}
							}
						}
					}
				}
			}
		}
		.case{
			padding: 4rem 0 5rem;
			background: #F6F2EC;
			.case_list_box {
				display: flex;
				justify-content: space-between;
				
				/* 症例　共通 */
				.list-title{
					span{
						
						position: relative;
						display: block;
						color: var(--color-text);
						font-weight: 500;
						font-size: 1.5rem;
						padding-top: 10px;
						line-height: 1.5;
						margin: 0 0 30px;
						&::before{
							content:"";
							position: absolute;
							top: 0;
							left: 0;
							width: 50px;
							height: 3px;
							background: var(--btn-base);
							border-radius: 5px;
						}
					}
				}
				.btn_more {
					text-align: right;
					a{
						display: inline-block;
						padding: .5rem 2rem;
						font-size: 1.25rem;
						color: #fff;
						background: var(--btn-base);
						border:1px solid var(--btn-base);
						border-radius: 30px;
						&:after{
							content:"\f105";
							margin-left: .5rem;
							display: inline-block;
							font-weight: 900;
							font-family: "Font Awesome 6 Free";
						}
						&:hover{	
							color: var(--btn-base);
							background: #fff;
						}
					}	
				}
				
				.case_photo {
					width: 570px;
					height: 550px;
					
					figure{
						figcaption {
							font-size: 1.875rem;
						}
					}
					&.vertical{
						display: flex;
						flex-wrap: wrap;
						figure{
							display: block;
							margin: 0;
							width: 50%;
							height: 500px;
							line-height: 0;
							figcaption {
								display: block;
								color: #fff;
								font-family: var(--font-en);
								text-align: center;
								line-height: 1.6;
							}
						}
					}
					&.beside{
						figure{
			
							position: relative;
							line-height: 0;
							figcaption {
								position: absolute;
								left: 0;
								bottom: 0;
								display: inline-block;
								padding: .3rem 1.5rem;
								color: #fff;
								font-family: var(--font-en);
								text-align: center;
								line-height: 1.6;
							}
						}
					}
					figure {
						img {
							width: 100%;
							height: 100%;
							object-fit: cover;
						}
						&.case_before{
			
							figcaption {
								background: var(--color-base);
							}
						}
						&.case_after{
			
							figcaption {
								background: var(--btn-base);
							}
						}
					}
					.case_after{
						figcaption{
							small {
								font-weight: 500;
								font-size: 14px;
								display: inline-block;
								margin-left: 10px;
								letter-spacing: 0;
								font-family: var(--font-serif);
							}
						}
					}
				}
			}
			.case_detail {
				width: calc(100% - 650px);
				dl {
					display: flex;
					flex-wrap: wrap;
					width: 100%;
					margin-bottom: 1.5rem;
					border-top:1px dashed #656565;
					dt {
						display: flex;
						justify-content: center;
						align-items: center;
						width: 170px;
						padding: 1.25rem 1.25rem;
						color: var(--color-text);
						background: #F2E7DC;
						font-weight: 500;
						border-bottom:1px dashed #656565;
					}
					dd {
						background: #fff;
						font-weight: 500;
						border-bottom:1px dashed #656565;
						width: calc(100% - 170px);
						margin-left: 0;
						padding: 1.25rem;
						.price {
							font-weight: 500;
							color: var(--color-pink);
							font-size: 1.375rem;
							.price_tax {
								font-weight: 500;
								font-size: 0.875rem;
							}
						}
						.price_detail {
							margin-top: 10px;
						}
					}
				}
			}
		}
		.flow{
			padding: 4rem 0;
			.inblock{
				.swiper-wrapper{
					display: block;
				}
				.flow-box{
					display: flex;
					justify-content: space-between;
					align-items: flex-start;
					margin-bottom: 3.5rem;
					&:last-child{
						.num{
							&:before,&:after{
								content:none;
							}
						}
					}
					.num{
						position: relative;
						display: flex;
						justify-content: center;
						align-items: center;
						width: 85px;
						height: 85px;
						border-radius: 50%;
						color: #fff;
						background: var(--btn-base);
						text-align: center;
						span{
							display: block;
							font-size: 2.5rem;
							line-height: 1;
							small{
								display: block;
								font-size: 1rem;
							}
						}
						&:before{
							content:"";
							position: absolute;
							right: 50%;
							margin: 0 auto;
							bottom: -50px;
							height: 50px;
							transform: translate(2px,0);
							width: 1px;
							border-left:2px solid var(--btn-base);
						}
						&:after{
							content:"";
							position: absolute;
							right: 50%;
							bottom: -51px;
							transform: translate(11px,100%);
							width: 1px;
							height: 50px;
							background-image: radial-gradient(circle, var(--btn-base) 20%, transparent 21%);
							background-size: 12px 12px;
							background-repeat: repeat;
							padding: 8px;
						}
					}
					.read-box{
						width: calc(100% - 120px);
						display: flex;
						justify-content: space-between;
						align-items: center;
						gap: 5%;
						dl{
							dt{
								margin-bottom: 1.5rem;
								font-size: 2rem;
								font-weight: 500;
								color: var(--btn-base);
							}
							dd{
								line-height: 1.8;
								font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
								a{
									text-decoration: underline;
									&:hover{
										text-decoration: none;
									}
								}
							}
						}
						.photo{
							position: relative;
							width: 35%;
							line-height: 0;
							z-index: 2;
							flex-shrink: 0;
							&:before{
								content:"";
								position: absolute;
								left: 0;
								top: 0;
								width: 100%;
								height: 100%;
								transform: translate(10px,10px);
								background: #F2E7DC;
								border-radius: 20px;
								z-index: -1;
							}
							picture{
								img{
									border-radius: 20px;
								}
							}
						}
					}
				}
			}
			.swiper-pagination {
				display: none;
			}
		}
		
		.product-price{
			margin-bottom: 3rem;
			.bg-title{
				margin-bottom: 2rem;
			}
			dl{
				&:nth-of-type(2n){
					dd{
						table{
							background: var(--color-base2);
							th,td{
								border: 1px solid var(--color-base);
								font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
							}
						}
					}
				}
				dt{
					margin-bottom: 1rem;
					font-size: 1.125rem;
					color: var(--btn-base);
					&:before{
						content:"●";
						display: inline-block;
						margin-right: .3rem;
					}
				}
				& + dl {
					margin-top: 2rem;
				}
			}
			table{
				margin-bottom: .5rem;
				th,td{
					padding: 10px 25px ;
					border:1px solid #ccc;
				}
				th{
					padding: 10px 25px ;
					width: calc(100% - 200px);
					font-weight: normal;
					font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
				}
				td{
					width: 200px;
					text-align: right;
					small{
						font-size: .875rem;
					}
				}
			}
			.bikou {
				font-size: 12px;
				& + dl {
					margin-top: 3rem;
				}
			}
		}
		.faq{
			margin-bottom: 4rem;
			padding: 4rem 0;
			background: #F6F2EC;
			.faq-title{
				margin-bottom: 2rem;
				text-align: center;
				h2{
					display: inline-block;
					position: relative;
					border:1px solid var(--btn-base);
					padding: .5rem 2rem;
					color: var(--btn-base);
					min-width: 300px;
					border-radius: 50px;
					span.bg{
						position: absolute;
						padding: 0 1.5rem;
						top: 0;
						left: 50%;
						display: inline-block;
						background: #F6F2EC;
						transform: translate(-50%,-50%);
						font-size: .875rem;
						&:before,&:after{
							content:"";
							position: absolute;
							top: 0;
							width: 1px;
							height: 100%;
							background: var(--btn-base);
							z-index: 3;
						}
						&:before{
							left: 0;
							transform: rotate(-30deg);
						}
						&:after{
							right: 0;
							transform: rotate(30deg);
						}
					}
					span.en{
						font-size: 2.25rem;
						font-family: var(--font-en);
					}
				}
			}
			.faq-box{
				padding: clamp(0.938rem, 0.653rem + 1.21vw, 1.563rem) clamp(1.25rem, 0.682rem + 2.42vw, 2.5rem);
				border-radius: 20px;
				background: #fff;
				.head{
					position: relative;
					padding: 0 4rem 0 0;
					cursor: pointer;
					
					span{
						display: inline-block;
						padding-left: 2.5rem;
						font-size: clamp(1rem, 0.886rem + 0.48vw, 1.25rem);
						font-weight: 500;
						color: var(--color-text);
						&:before{
							content:"Q";
							position: absolute;
							left: 0;
							top: -10px;
							font-size: clamp(1.75rem, 1.636rem + 0.48vw, 2rem);
							color: var(--color-base);
						}
					}
					
					&:before{
						content:"";
						position: absolute;
						right: 10px;
						top: 50%;
						width: 20px;
						height: 2px;
						background: var(--color-text);
						z-index: 5;
					}
					&:after{
						content:"";
						position: absolute;
						right: 10px;
						top: 50%;
						width: 20px;
						height: 2px;
						background: var(--color-text);
						transform: rotate(90deg);
						transition: .3s all;
						z-index: 5;
					}
					&.click{
						&:after{
							transform: rotate(0);
						}
					}
				}
				.row{
					position: relative;
					display: none;
					margin-bottom: 0;
					margin-top: 1.5rem;
					padding: 1.5rem 1rem 1rem 2.5rem;
					border-top: dotted 2px var(--color-base);
					&:before{
						content:"A";
						position: absolute;
						left: 0;
						top: .5rem;
						font-size: clamp(1.75rem, 1.636rem + 0.48vw, 2rem);
						color: var(--color-base);
					}
				}
				& + .faq-box{
					margin-top: 1em;
				}
			}
		}
		.remarks{
			.disc{
				padding-left: 1.5rem;
				list-style: disc;
				li{
					margin-bottom: .5rem;
					&:last-child{
						margin-bottom: 0;
					}
				}
			}
		}
	}
}
@media screen and (max-width: 1300px) {
	#menu{
		&.detail{
			.case{
				.case_list_box{
					.case_photo {
						width: 500px;
						height: 500px;
						&.vertical{
							figure{
								height: 500px;
							}
						}
					}
					.case_detail{
						
						width: calc(100% - 550px);
					}
				}
			}
		}
	}
}

@media screen and (max-width: 1025px) {
	#menu{
		h2.en-title{
			font-size: 1.875rem;
			span{
				font-size: 3.75rem;
			}
		}
		&.list{
			
			/*お悩みから探す*/
			.trouble{
				.inblock{
					.f-box{
						gap: none;
						.trouble-box{
							width: 48%;
							.head{
								padding: 1rem 2.5rem 1rem 1.5rem;
								h3{
									font-size: 1.125rem;
								}
							}
						}
					}
				}
			}
			/*施術メニュー*/
			.case{
				.inblock{
					.f-box{
						.case-box{
							width: 48%;
							.title{
								padding: 1rem;
								font-size: 1.125rem;
							}
							.case-box{
								ul{

									li{
										width: 48%;
										a{
											padding: 1rem 3rem 1rem 1rem;
										}
									}
								}
							}
						}
					}
				}
			}
		}
		&.detail{
			.case{
				.case_list_box{
					position: relative;
					display: block;
					.case_photo {
						margin: 0 auto 2rem;
						width: 500px;
						height: 500px;
						&.vertical{
							figure{
								height: 450px;
							}
						}
					}
					.case_detail {
						width: 100%;
					}
					.btn_more{
						text-align: center;
					}
				}
			}
				
			.flow{
				.inblock{
					.flow-box{
						.num{
							width: 90px;
							height: 90px;
							span{
								font-size: 2.5rem;
							}
						}
						.read-box{
							width: calc(100% - 120px);
							dl{
								dt{
									font-size: 1.625rem;
								}
							}
						}
					}
				}
			}
		}

	}
}

@media screen and (max-width: 769px) {
	#menu{
		h2.en-title{
			font-size: 1.375rem;
			span{
				font-size: 3rem;
			}
		}
		&.list{
			
			.trouble{
				.inblock{
					.f-box{
						display: block;
						.trouble-box{
							width: 100%;
							margin-bottom: 1rem;
						}
					}
				}
			}
			.case{
				.inblock{
					.f-box{
						display: block;
						.case-box{
							width: 100%;
							margin-bottom: 2rem;
							.title{
								position: relative;
								padding: .8rem 1rem;
								pointer-events: all;
								&:before{
									
									content: "";
									position: absolute;
									right: 30px;
									top: 50%;
									width: 20px;
									height: 2px;
									background: #656565;
									z-index: 5;
								}
								&:after{
									
									content: "";
									position: absolute;
									right: 30px;
									top: 50%;
									width: 20px;
									height: 2px;
									background: #656565;
									transform: rotate(90deg);
									transition: .3s all;
									z-index: 5;
								}
								&.click{
									&:after{
										transform: rotate(0);
									}
								}
							}
							ul{
								display: none;
								li{
									a{
										padding: 1rem 3rem 1rem 1rem;
									}
								}
							}
							& > a {
								.title{
									&::before {
										right: 20px;
										background: transparent;
									}
									&::after {
										display: none;
									}
								}
							}
						}
					}
				}
			}
		}
		&.detail{
			.title-block{
				.photo{
					top: 20px;
					width: 120px;
				}
			}
			.wysiwyg-title{
				span{
					padding: .5rem 1.5rem;
					font-size: 1.75rem;
					line-height: 1.2;
				}
			}
			.case{
				
				.case_list_box{
					.case_photo {
						width: 450px;
						height: 450px;
						figure{
							
							figcaption {
								font-size: 1.25rem;
							}
						}
						&.vertical{
							figure{
								height: 400px;
							}
						}
					}
				}
			}
				
			.flow{
				.inblock{
					.swiper-wrapper{
						display: flex;
					}
					.flow-box{
						display: block;
						margin-bottom: 1.5rem;
						.num{
							width: 85px;
							height: 85px;
							margin: 0 auto 1.5rem;
							&:before{
								right: 0;
								bottom: 50%;
								margin: 0;
								width: 65%;
								transform: translate(100%,-1px);
								height: 1px;
								border-right:none;
								border-bottom:2px solid var(--btn-base);
							}
							&:after{
								right: -65%;
								bottom: 50%;
								margin: 0;
								height: 1px;
								width: 45px;
								transform: translate(42px,50%);
								background-image: radial-gradient(circle, var(--btn-base) 20%, transparent 21%);
								background-size: 12px 12px;
								background-repeat: repeat;
								padding: 8px;
							}
							span{
								font-size: 2.25rem;
								small{
									margin-bottom: .1rem;
								}
							}
						}
						.read-box{
							display: block;
							width: 100%;
							dl{
								width: 100%;
								margin-bottom: 2rem;
								dt{
									font-size: 1.625rem;
									text-align: center;
								}
							}
							.photo{
								width: 100%;
							}
						}
					}
					.swiper-container{
						position: relative;
						padding-bottom: 2.5rem;
						.swiper-pagination {
							display: block;
							.swiper-pagination-bullet {
								background-color: #D1D1D1; /* ドットの色を指定できます */
								width: 18px;
								height: 18px;
								margin-right: .5rem;
								opacity: 1;
								&:last-of-type{
									margin-right: 0;
								}
							}
							.swiper-pagination-bullet-active {
								background-color: var(--btn-base); /* アクティブなドットの色を指定できます */
							}
						}
					}
				}
			}
		}
	}
	
}

@media screen and (max-width: 479px) {
	#menu{
		&.detail{
			.wysiwyg-title{
				span{
					padding: .5rem 1.5rem;
					font-size: 1.5rem;
				}
			}
			.case{
				
				.case_list_box{
					padding-top: 6.5rem;
					.case_photo {
						width: 100%;
						height: 400px;
						figure{
							
							figcaption {
								font-size: 18px;
							}
						}
						&.vertical{
							figure{
								height: 350px;
							}
						}
					}
				}
				.case_detail {
					.list-title{
						span{
							font-size: 1.5rem;
						}
					}
					dl {
						dd {
							.price {
								font-size: 1.25rem;
								small {
									font-weight: 500;
									font-size: 14px;
									display: inline-block;
									margin-left: 10px;
									letter-spacing: 0;
								}
							}
						}
					}
				}
			}
		}
	}
}

/*---------------------------
404
---------------------------*/
.page_404 {
	.inblock {
		padding-bottom: 4rem;

		.txt {
			text-align: center;
			font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
			line-height: 2;
			margin-bottom: 50px;
		}
		.btn_top {
			text-align: center;

			a {
				display: inline-block;
                padding: .5rem 2rem;
                font-size: 1.25rem;
                color: #fff;
                background: var(--btn-base);
                border: 1px solid var(--btn-base);
                border-radius: 30px;

				&::after {
					content: "\f105";
					margin-left: .5rem;
					display: inline-block;
					font-weight: 900;
					font-family: "Font Awesome 6 Free";
				}
				&:hover {
					background: #fff;
					color: var(--btn-base);
				}
			}
		}
	}
}

/*---------------------------
privacypolicy
---------------------------*/
#privacypolicy {
	#container {
		margin-bottom: 0;
	}
	.title-block{
		background: url(../img/privacypolicy/privacypolicy_title.jpg) no-repeat 50% 50%;
		background-size: cover;

        @media (max-width: 767px) {
			background: url(../img/privacypolicy/privacypolicy_title_sp.jpg) center right / cover no-repeat;
		}
	}
	.inblock {
		max-width: 1000px;
		padding-bottom: 4rem;

		.sec_ttl {
			font-size: clamp(1.25rem, 1.1rem + 0.64vw, 1.5rem);
			border-bottom: #656565 1px solid;
            padding: 0 0 0.5em;
            margin-bottom: 0.5em;
		}
		.txt {
			font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
			line-height: 2;
			margin-bottom: 1em;
			
			& + .sec_ttl {
				margin-top: 2em;
			}
		}
	}
}
/*--------------------
アクセス
--------------------*/
#access {
	.title-block{
		background: url(../img/access/access_title.jpg) no-repeat 50% 50%;
		background-size: cover;
	}
	.access_box {
		position: relative;
		padding: 5rem 0 0;
		overflow: hidden;
		&::before{
			content:"";
			position: absolute;
			top: 0;
			left: -50vw;
			right: 0;
			margin: 0 auto;
			width: 200%;
			height: 100%;
			background: #F6F2EC;
			border-radius: 100% 100% 0 0;
			text-align: center;
			z-index: -1;
		}
        @media (max-width: 767px) {
			&::before{
				height: 600px;
			}
		}
		.inblock{
			padding-bottom: 4rem;
			h2.en-title {
				span {
					display: block;
					font-size: clamp(2.5rem, 1.814rem + 2.93vw, 4.375rem);
					font-weight: 400;
					color: #D1D1D1;
				}
			}
		}
		.map_area {
			@media (max-width: 767px) {
				background: #F6F2EC;
			}
			h2.en-title {
				text-align: center;
				margin-bottom: 30px;
			}
			.map {
				max-width: 750px;
				width: 100%;
				margin: 0 auto clamp(2.5rem, 2.043rem + 1.95vw, 3.75rem);
			}
			.address_wrapper {
				display: flex;
				justify-content: space-between;
				align-items: flex-start;
				max-width: 1000px;
				width: 100%;
				margin: auto;
				@media (max-width: 767px) {
					flex-direction: column;
					gap: 40px;
				}
				.address {
					width: 50%;
					display: flex;
					flex-wrap: wrap;
					@media (max-width: 767px) {
						width: 100%;
					}
					dt {
						width: 130px;
						border-top: 1px #ACACAC solid;
						padding: 1rem;
						font-size: 14px;
						color: #BEA17A;
					}
					dd {
						width: calc(100% - 130px);
						border-top: 1px #D1D1D1 solid;
						padding: 1rem;
						font-size: 14px;
						small {
							font-size: 12px;
						}
					}
					dt:last-of-type {
						border-bottom: 1px #ACACAC solid;
					}
					dd:last-of-type {
						border-bottom: 1px #D1D1D1 solid;
					}
				}
				.sec_ttl {
					font-size: 18px;
					margin-bottom: 0.8rem;
					@media (max-width: 767px) {
						text-align: center;
					}

					&::before {
						content: "";
						display: block;
						width: 30px;
						height: 1px;
						background-color: #707070;
						margin-bottom: 1.2rem;
					}
					@media (max-width: 767px) {
						&::before {
							width: 25px;
							margin: auto;
							margin-bottom: 0.8rem;
						}
					}
				}
				.clinic_photo_area {
					width: 45%;
					@media (max-width: 767px) {
						width: 100%;
					}
					.clinic_photo {
						img {
							width: 100%;
							border-radius: 0 0 0 50px;
							@media (max-width: 767px) {
								border-radius: 0 0 0 30px;
							}
						}
					}
				}
			}
		}
	}
}
/*--------------------
採用情報
--------------------*/
#recruit {
	.title-block{
		background: url(../img/recruit/recruit_title.jpg) no-repeat 50% 50%;
		background-size: cover;

        @media (max-width: 767px) {
			background: url(../img/recruit/recruit_title_sp.jpg) center right / cover no-repeat;
		}
	}
	.inblock{
		max-width: 1000px;
	}
	.first_sec {
		display: flex;
		justify-content: space-between;
		margin-bottom: clamp(5rem, 4.543rem + 1.95vw, 6.25rem);
		@media (max-width: 767px) {
			flex-direction: column;
		}
		.txt_area {
			width: 52%;
			@media (max-width: 767px) {
				width: 100%;
			}
			h2 {
				font-size: clamp(1.5rem, 1.317rem + 0.78vw, 2rem);
				color: #CBAF8F;
				margin-top: 20px;
				margin-bottom: 20px;
				line-height: 2;
			}
			.txt {
				font-size: 14px;
				margin-bottom: 40px;
				line-height: 1.8;
			}
			img.sp {
				margin-bottom: 50px;
			}
			h3 {
				font-size: 18px;
				color: #BEA17A;
				border-left: 4px #BEA17A solid;
				margin-bottom: 15px;
				padding-left: 10px;
			}
			.list {
				line-height: 2;
				font-size: clamp(0.875rem, 0.829rem + 0.2vw, 1rem);
				font-weight: 500;
			}
		}
		.photo {
			width: 44%;
			@media (max-width: 767px) {
				width: 100%;
			}
		}
	}
	.recruitment_box {
		padding: 2% 4%;
		background-color: #F7F7F7;
		@media (max-width: 767px) {
			padding: 5% 8%;
		}
		h2 {
			font-size: clamp(1.5rem, 1.317rem + 0.78vw, 2rem);
			color: #CBAF8F;
			margin-bottom: 5px;
			line-height: 2;
		}
		.read {
			font-size: clamp(0.875rem, 0.829rem + 0.2vw, 1rem);
			margin-bottom: 30px;
			line-height: 2;
		}
		.recruitment_detail {
			dt {
				font-size: 18px;
				color: #BEA17A;
				border-left: 4px #BEA17A solid;
				margin-bottom: 10px;
				padding-left: 10px;
			}
			dd {
				font-size: clamp(0.875rem, 0.829rem + 0.2vw, 1rem);
				margin-bottom: 20px;
				line-height: 1.7;
			}
		}
		& + .recruitment_box {
			margin-top: 20px;
		}
	}
	.recruit_form {
		max-width: 670px;
		width: 92%;
		margin: clamp(3.75rem, 2.835rem + 3.9vw, 6.25rem) auto 0;

		h2 {
			font-size: clamp(1.25rem, 1.136rem + 0.49vw, 1.563rem);
			text-align: center;
			margin-bottom: 40px;
		}
		.form {
			dt {
				font-size: clamp(1.125rem, 1.079rem + 0.2vw, 1.25rem);
				margin-bottom: 10px;
				.required {
					background-color: #B10000;
					color: #fff;
					font-size: clamp(0.75rem, 0.704rem + 0.2vw, 0.875rem);
					margin-left: 10px;
					padding: 0 0.5em;
					display: inline-block;
				}
				small {
					font-size: clamp(0.75rem, 0.704rem + 0.2vw, 0.875rem);
					margin-left: 10px;
				}
			}
			dd {
				margin-bottom: 30px;
				p {
					.wpcf7-text, .wpcf7-textarea {
						width: 100%;
						padding: 0.5em;
						border: 1px #ACACAC solid;
					}
					.wpcf7-list-item {
						display: block;
						margin: 0 0 5px;
					}
					.wpcf7-select {
						padding: 0.5em;
						border: 1px #ACACAC solid;
					}
				}
			}
		}
		.btn_submit {
			p {
				input[type="submit"] {
					background: var(--btn-base);
					color: #fff;
					width: 300px;
					border: none;
					cursor: pointer;
					margin: auto;
					font-family: "Noto Serif JP", serif;
					display: block;
					padding: 1em;
					transition: ease-in .2s;
					font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
					@media (max-width: 767px) {
						width: 200px;
					}
					&:hover {
						opacity: 0.8;
					}
				}
			}
		}
	}
}
/*--------------------
送信確認
--------------------*/
#recruit-confirm {
	.title-block{
		background: url(../img/recruit/recruit_title.jpg) no-repeat 50% 50%;
		background-size: cover;

        @media (max-width: 767px) {
			background: url(../img/recruit/recruit_title_sp.jpg) center right / cover no-repeat;
		}
	}
	.inblock {
		max-width: 1000px;
		.txt {
			text-align: center;
			margin-bottom: 30px;
			font-size: clamp(0.875rem, 0.829rem + 0.2vw, 1rem);
		}
		.form {
			dt {
				font-size: clamp(1.125rem, 1.079rem + 0.2vw, 1.25rem);
				margin-bottom: 10px;
				.required {
					background-color: #B10000;
					color: #fff;
					font-size: clamp(0.75rem, 0.704rem + 0.2vw, 0.875rem);
					margin-left: 10px;
					padding: 0 0.5em;
					display: inline-block;
				}
			}
			dd {
				margin-bottom: 30px;
				font-size: clamp(0.875rem, 0.829rem + 0.2vw, 1rem);
			}
		}
		.submit_area {
			position: relative;
			margin-top: clamp(2.5rem, 2.06rem + 1.88vw, 3.75rem);
			
		  	/* 送信ボタン */
			.btn_submit {
				display: flex;
				justify-content: center;

				p {
					margin: 0;
					position: relative;
					transition : ease-in .2s;
					input {
						display: flex;
						justify-content: center;
						align-items: center;
						background-color: var(--btn-base);
						border: none;
						font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem);
						color: #fff;
						min-width: 300px;
						width: 100%;
						padding: 1em;
						cursor: pointer;
						transition : ease-in .2s;
						font-family: "Noto Serif JP", serif;
		
						@media (max-width: 767px) {
							min-width: 200px;
						}
					}
					&::after {
						content: "";
						position: absolute;
						right: 20px;
						bottom: 45%;
						width: clamp(0.313rem, 0.241rem + 0.15vw, 0.375rem);
						height: clamp(0.313rem, 0.241rem + 0.15vw, 0.375rem);
						border: 0;
						border-top: solid 1px #fff;
						border-right: solid 1px #fff;
						transform: rotate(45deg);
						transition: ease-in .2s;
					}
					.wpcf7-spinner {
						display: none;
					}
					&:hover {
						opacity: 0.8;
						transition : ease-in .2s;
					}
				}
			}

		  	/* 修正 */
			.btn_previous {
				position: absolute;
				left: 0;
				top: 0;
	
				@media (max-width: 767px) {
					position: static;
					display: flex;
					justify-content: center;
					margin-top: 30px;
				}
			
				p {
					margin: 0;
					position: relative;
					transition : ease-in .2s;
	
					input {
						background-color: #ACACAC;
						border: none;
						color: #fff;
						font-size: 14px;
						padding: 1em;
						width: 140px;
						cursor: pointer;
						transition : ease-in .2s;
						font-family: "Noto Serif JP", serif;
			
						@media (max-width: 767px) {
							padding: 0.5em;
						}
					}
	
					&::before {
						content: "";
						position: absolute;
						left: 20px;
						bottom: 45%;
						width: clamp(0.313rem, 0.241rem + 0.15vw, 0.375rem);
						height: clamp(0.313rem, 0.241rem + 0.15vw, 0.375rem);
						border: 0;
						border-top: solid 1px #fff;
						border-left: solid 1px #fff;
						transform: rotate(-45deg);
						transition: ease-in .2s;
					}
					&:hover {
						opacity: 0.8;
						transition : ease-in .2s;
					}
				}
			}
		}
	}
}
/*--------------------
thanks
--------------------*/
#thanks {
	.title-block{
		background: url(../img/about/about_title.jpg) no-repeat 50% 50%;
		background-size: cover;

        @media (max-width: 767px) {
			background: url(../img/about/about_title_sp.jpg) center right / cover no-repeat;
		}
	}
	.txt {
		font-size: clamp(0.875rem, 0.829rem + 0.2vw, 1rem);
		text-align: center;
		margin-bottom: 50px;
	}
	.btn2 {
		text-align: center;
	}
}