@charset "utf-8";

/*		Contents
---------------------------------------------------------------------------
	common
	header
	contents
	group
	footer
------------------------------------------------------------------------ */


/* ========================================================================
	common
======================================================================== */
@media print, screen and (min-width:768px){
body{
	min-width:1260px;
}

.sp{
	display:none;
}

.inner{
	position:relative;
	width:1200px;
	margin:0 auto;
}

a img, .fade, .fades a{ transition-duration:0.2s; }
a:hover img, .fade:hover, .fades a:hover{ opacity:0.8; }
.fade:hover img, .fades a:hover img{ opacity:1; }
}

@media screen and (max-width:767px){
body{
	min-width:320px;
}

.pc{
	display:none;
}

.inner{
	position:relative;
	padding:0 20px;
}

iframe{
	width:100%;
	height:100%;
}
}


/* ========================================================================
	header
======================================================================== */
header{
	position:relative;
	min-width:1200px;
}

@media screen and (max-width:767px){
header{
	min-width:auto;
}
}


/* ----------------------------------------
	logo
---------------------------------------- */
header > .logo{
	position:absolute;
	top:42px;
	left:58px;
	text-align:center;
	z-index:1;
}

header > .logo .name{
	margin:34px 0 0 0;
	font-size:2.0rem;
	color:#FFFFFF;
	line-height:1;
	letter-spacing:0.1em;
}

header > .logo .name span{
	display:block;
	margin:10px 0 0 0;
	font-size:1.2rem;
	letter-spacing:0.28em;
}

@media screen and (max-width:767px){
header > .logo{
	top:20px;
	left:20px;
}

header > .logo img{
	width:78px;
}

header > .logo .name{
	display:none;
}
}


/* ----------------------------------------
	clinic
---------------------------------------- */
header .clinic{
	position:absolute;
	top:0;
	left:38px;
}

header .clinic::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(64,62,61,0.9);
	mix-blend-mode:multiply;
	z-index:1;
}

header .clinic a{
	display:flex;
	align-items:flex-end;
	position:relative;
	padding:30px 40px 40px 40px;
	color:#FFFFFF;
	text-decoration:none;
	z-index:1;
}

header .clinic .logo{
	margin:0 28px 0 0;
}

header .clinic dl dt{
	margin:0 0 14px 0;
	font-size:2.4rem;
	font-weight:600;
	line-height:1;
}

header .clinic dl dd{
	padding:0 0 4px 0;
	font-size:1.5rem;
	letter-spacing:0.1em;
}

header .clinic dl dd span{
	display:block;
	margin:14px 0 0 0;
	padding:7px 0;
	border:1px solid #FFFFFF;
	text-align:center;
	font-size:1.6rem;
	line-height:1;
}

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


/* ----------------------------------------
	navi
---------------------------------------- */
header .navi{
	display:flex;
	position:absolute;
	top:0;
	right:170px;
	z-index:10;
}

header .navi li{
	display:flex;
	align-items:center;
	height:110px;
}

header .navi a{
	display:block;
	margin:0 20px 0 0;
	padding:0 0 0 37px;
	background:url(../../img/common/navi_tel.png) no-repeat left center;
	background-size:37px;
	font-weight:500;
	color:#FFFFFF;
	line-height:3.7rem;
	letter-spacing:0.05em;
	text-decoration:none;
}
header .navi .mail a{ background-image:url(../../img/common/navi_mail.png); }

@media screen and (max-width:767px){
header .navi{
	position:fixed;
	top:auto;
	bottom:0;
	right:0;
	width:100%;
}

header .navi li{
	width:50%;
	height:56px;
}

header .navi a{
	display:flex;
	justify-content:center;
	align-items:center;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	background:#FFFFFF;
	font-size:1.7rem;
	color:#333333;
	line-height:1;
}

header .navi a > span{
	display:inline-block;
	padding:0 0 0 25px;
	background:url(../../img/common/icon_tel02.png) no-repeat left center;
	background-size:17px;
}

header .navi .mail{
	display:none;
}
}


/* reservation
---------------------------------------- */
header .navi .reservation{
	position:fixed;
	top:50%;
	right:0;
	transform:translateY(-50%);
	height:auto;
	writing-mode:vertical-rl;
	text-orientation:upright;
}

header .navi .reservation a{
	display:flex;
	justify-content:center;
	align-items:center;
	width:52px;
	min-height:220px;
	margin:0;
	padding:20px 0 46px 0;
	background:url(../../img/common/icon_blank01.png) no-repeat center bottom 22px, linear-gradient(to bottom, #766A5E 56.5%, #65584B 56.5%);
	background-size:14px;
	font-size:1.4rem;
	font-weight:700;
	letter-spacing:0.1em;
}

header .navi .reservation a::before{
	content:"";
	position:absolute;
	bottom:96px;
	left:0;
	border-style:solid;
	border-color:transparent transparent #65584B transparent;
	border-width:0 0 40px 52px;
}

header .navi .reservation span{
	position:relative;
}

@media screen and (max-width:767px){
header .navi .reservation{
	position:static;
	transform:none;
	writing-mode:horizontal-tb;
}

header .navi .reservation a{
	position:relative;
	width:100%;
	height:100%;
	min-height:auto;
	padding:0;
	background:linear-gradient(to right, #766A5E calc(50% + 10px), #65594B 50%);
	font-size:1.7rem;
	font-weight:500;
	color:#FFFFFF;
}

header .navi .reservation a::before{
	bottom:0;
	left:50%;
	margin:0 0 0 -10px;
	border-width:0 0 56px 20px;
}

header .navi .reservation a > span{
	padding:0 0 0 22px;
	background:url(../../img/common/icon_blank01.png) no-repeat left bottom;
	background-size:14px;
}
}


/* ----------------------------------------
	nav
---------------------------------------- */
#nav::before{
	content:"";
	position:fixed;
	top:0;
	right:0;
	width:160px;
	height:132px;
	background:rgba(64,62,61,0.9);
	mix-blend-mode:multiply;
	z-index:10;
	transition-duration:0.2s;
}
#nav.close::before{ opacity:0; }

#nav .switch{
	position:fixed;
	top:0;
	right:0;
	width:160px;
	height:132px;
	background:url(../../img/common/btn_menu.png) no-repeat center;
	background-size:80px 60px;
	cursor:pointer;
	z-index:20;
}
#nav .switch span{ display:none; }
#nav.close .switch{ background-image:url(../../img/common/btn_close.png); }

#nav .menu{
	overflow-y:scroll;
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(248,242,236,0.8);
	z-index:10;
}

@media screen and (max-width:767px){
#nav::before{
	width:104px;
	height:80px;
}

#nav .switch{
	width:104px;
	height:80px;
	background:url(../../img/common/btn_menu.png) no-repeat center;
	background-size:64px auto;
}
}


/* gnavi
---------------------------------------- */
#nav .gnavi{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	gap:20px 0;
	min-width:1260px;
	height:100%; /* ここjs調整 */
	padding:0 40px;
}

#nav .gnavi dl{
	max-width:1400px;
	width:100%;
	padding:30px 0 20px 150px;
	background:#403E3D;
}

#nav .gnavi dl dt{
	margin:0 0 20px 0;
	font-size:1.8rem;
	color:#FFFFFF;
	line-height:1;
}

#nav .gnavi dl dd ul{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
}

#nav .gnavi dl dd ul li{
	width:25%;
	text-align:left;
}

#nav .gnavi dl dd a{
	display:inline-block;
	position:relative;
	margin:0 0 10px 0;
	padding:0 0 0 28px;
	color:#FFFFFF;
	line-height:3.6rem;
	text-decoration:none;
}
#nav .gnavi dl dd a:hover{ opacity:0.6; }

#nav .gnavi dl dd ul li a::before{
	content:"";
	position:absolute;
	top:50%;
	left:0;
	width:16px;
	height:1px;
	background:#FFFFFF;
}

@media screen and (max-width:767px){
#nav .gnavi{
	gap:15px 0;
	height:auto;
	min-width:auto;
	padding:100px 20px 30px;
}

#nav .gnavi dl{
	max-width:none;
	padding:25px 20px 15px;
}

#nav .gnavi dl dt{
	margin:0 0 15px 0;
}

#nav .gnavi dl dd ul{
	display:block;
}

#nav .gnavi dl dd ul li{
	width:auto;
}

#nav .gnavi dl dd a{
	display:block;
	margin:0;
}
}


/* ---------- btn ---------- */
#nav .gnavi .btn{
	display:flex;
	gap:0 46px;
	padding:20px 0 0 0;
}

#nav .gnavi .btn a{
	display:flex;
	justify-content:center;
	align-items:center;
	width:400px;
	height:80px;
	background:#FFFFFF;
	border:1px solid #707070;
	font-size:1.7rem;
	font-weight:500;
	color:#333333;
	line-height:1;
	text-decoration:none;
}

#nav .gnavi .btn img{
	margin:0 10px 0 0;
}

@media screen and (max-width:767px){
#nav .gnavi .btn{
	flex-direction:column;
	gap:15px 0;
	width:100%;
	padding:15px 0 0 0;
}

#nav .gnavi .btn a{
	width:100%;
	height:56px;
}
}


/* ========================================================================
	contents
======================================================================== */
#contents{
	overflow:hidden;
}

#contents > .inner{
	display:flex;
	justify-content:space-between;
	padding:80px 0 0 0;
}

#contents > .inner > main{
	order:2;
	width:800px;
	padding:0 0 140px 0;
}

#contents > .inner > aside{
	width:320px;
	padding:0 0 176px 0;
}

@media screen and (max-width:767px){
#contents > .inner{
	padding:40px 0 0 0;
}

#contents > .inner > main{
	width:auto;
	padding:0 20px 20px;
}

#contents > .inner > aside{
	display:none;
}
}


/* ----------------------------------------
	main
---------------------------------------- */
main section{
	padding:0 0 30px 0;
}
main section section:last-child{ padding:0; }

main p,
main table,
main figure{
	margin:0 0 30px 0;
}

main p span{
	color:#FF5E38;
}

main strong{
	font-weight:400;
	color:#FF5E38;
	text-decoration:underline;
}

main table th{
	padding:12px;
	background:#EBEBEB;
	border:1px solid #C3C3C3;
}

main table td{
	padding:12px;
	border:1px solid #C3C3C3;
}

@media screen and (max-width:767px){
main section{
	padding:0 0 20px 0;
}

main p,
main figure{
	margin:0 0 20px 0;
}

main table{
	margin:0 0 20px 0;
	border-bottom:1px solid #C3C3C3;
}

main table th,
main table td{
	display:block;
	padding:10px 12px;
	border-bottom:none;
}
}


/* h要素
---------------------------------------- */
.inner > main h2,
.inner > main h3{
	position:relative;
	margin:0 0 30px 0;
	padding:0 0 10px 17px;
	border-bottom:1px solid #655A4F;
	font-family:"Noto Serif JP", serif;
	font-size:2.0rem;
	font-weight:700;
}
.inner > main h3{ padding-left:0; }

.inner > main h2::before{
	content:"";
	position:absolute;
	top:2px;
	left:0;
	width:7px;
	height:28px;
	background:#655A4F;
}


@media screen and (max-width:767px){
.inner > main h2,
.inner > main h3{
	margin:0 0 20px 0;
}
}


/* ----------------------------------------
	aside
---------------------------------------- */

/* nav
---------------------------------------- */
aside .nav{
	margin:0 0 34px 0;
	padding:32px 27px 0;
	background:#FAF7F4;
	border:1px solid #655A4F;
	box-shadow:10px 10px 0 rgba(101,90,79,0.3);
}

aside .nav h2{
	margin:0 0 30px 0;
	text-align:center;
	font-weight:500;
	color:#655A4F;
	line-height:1;
}

aside .nav h2 span{
	display:block;
	font-size:4.0rem;
}

aside .nav ul{
	margin:0 0 40px 0;
	padding:0 0 20px 0;
	border-bottom:1px solid #707070;
}
aside .nav ul:last-child{
	margin:0;
	padding-bottom:40px;
	border:none;
}

aside .nav ul li{
	position:relative;
	margin:0 0 10px 0;
}

aside .nav ul li::before{
	content:"";
	position:absolute;
	top:50%;
	left:0;
	width:100%;
	border-bottom:2px dotted #655a4f;
	opacity:0.5;
}

aside .nav ul li a{
	display:inline-block;
	position:relative;
	padding:0 10px 0 26px;
	background:url(../../img/common/arrow_02.png) no-repeat left center #FAF7F4;
	background-size:18px;
	font-size:2.0rem;
	font-weight:500;
	color:#655A4F;
	line-height:4.0rem;
	text-decoration:none;
}
aside .nav ul li a:hover{ text-decoration:underline; }


/* bnr
---------------------------------------- */
aside .bnr li{
	margin:0 0 24px 0;
}


/* ========================================================================
	group
======================================================================== */
#group{
	padding:70px 0 30px 0;
	background:url(../../img/common/bg_group.png) no-repeat center;
	background-size:cover;
}

#group .inner{
	width:1000px;
}

@media screen and (max-width:767px){
#group{
	padding:50px 0 10px 0;
}

#group .inner{
	width:auto;
	padding:0 70px;
}
}


/* ----------------------------------------
	h_01
---------------------------------------- */
#group .h_01 .en,
#group .h_01 .ja{
	color:#FFFFFF;
}


/* ----------------------------------------
	splide
---------------------------------------- */
#group .splide{
	margin:0 0 70px 0;
}

#group .splide ul{
	display:flex;
	flex-wrap:wrap;
	gap:66px 32px;
}

#group .splide ul li{
	display:flex;
	flex-direction:column;
	width:226px;
	color:#FFFFFF;
}

#group .splide ul li h3{
	margin:16px 0 6px 0;
	font-size:1.7rem;
	font-weight:700;
}

#group .splide ul li p{
	flex:1;
	margin:0 0 16px 0;
	font-size:1.4rem;
}

@media screen and (max-width:767px){
#group .splide{
	margin:0 0 80px 0;
}

#group .splide ul{
	flex-wrap:nowrap;
	gap:0;
}

#group .splide ul li{
	width:auto;
}

#group .splide ul li > img{
	width:100%;
}
}

/* splide__arrow
---------------------------------------- */
@media screen and (max-width:767px){
#group .splide__arrow{
	width:40px;
	height:40px;
	background:none;
	opacity:1;
}

#group .splide__arrow::before{
	content:"";
	position:absolute;
	top:50%;
	right:0;
	width:40px;
	height:40px;
	background:url(../../img/common/group/arrow.png) no-repeat center;
	background-size:40px;
	margin:-20px 0 0 0;
	transition-duration:0.2s;
}
#group .splide__arrow--next{ right:-60px; }
#group .splide__arrow--prev{ left:-60px; }
#group .splide__arrow--prev::before{ transform:scaleX(-1); }

#group .splide__arrow:hover::before{
	opacity:0.8;
}
#group .splide__arrow:hover:not(:disabled){ opacity:1; }
#group .splide__arrow svg{ display:none; }
}


/* splide__pagination
---------------------------------------- */
@media screen and (max-width:767px){
#group .splide__pagination{
	bottom:-40px;
	padding:0;
}

#group .splide__pagination__page{
	position:relative;
	width:8px;
	height:8px;
	margin:0 4px;
	padding:0;
	background:rgba(255,255,255,0.5);
	transition-property:all;
	transition-duration:0.2s;
	opacity:1;
}

#group .splide__pagination__page.is-active,
#group .splide__pagination__page:hover{
	background:#FFFFFF;
	transform:none;
}
}


/* widget_btn
---------------------------------------- */
#group .splide .widget_btn{
	margin:0;
}

#group .splide .widget_btn a{
	min-width:auto;
	min-height:auto;
	width:100%;
	height:56px;
	font-size:1.9rem;
}

@media screen and (max-width:767px){
#group .splide .widget_btn a{
	font-size:1.6rem;
}
}


/* ========================================================================
	footer
======================================================================== */
footer{
	padding:80px 0 0 0;
	position:relative;
	background:#403E3D;
}

footer::before,
footer::after{
	content:"";
	position:absolute;
	top:0;
	left:0;
	border-style:solid;
	border-color:#4D4B4A transparent transparent transparent;
	border-width:330px 370px 0 0;
}
footer::after{
	top:auto;
	left:auto;
	bottom:0;
	right:0;
	border-color:transparent transparent #4D4B4A transparent;
	border-width:0 0 330px 370px;
}

footer .inner{
	width:auto;
	max-width:1480px;
	padding:0 40px;
	z-index:1;
}

footer .flex{
	margin:0 0 80px 0;
	justify-content:space-between;
}

footer small{
	display:block;
	padding:20px 0 80px 0;
	text-align:center;
	font-size:1.4rem;
	color:#FFFFFF;
}

@media screen and (max-width:767px){
footer{
	padding:40px 0 56px 0;
}
footer::before{ border-width:140px 160px 0 0; }
footer::after{ 	bottom:56px; border-width:0 0 140px 160px; }

footer .inner{
	max-width:none;
	padding:0 20px;
}

footer .flex{
	display:block;
	margin:0 0 40px 0;
}

footer small{
	padding:20px 0 40px 0;
}
}

a.page-top{
	text-decoration: none;
}
.page-top {
    position: fixed;
    right: 5px;
    bottom: 20px;
    height: 50px;
    text-decoration: none;
    font-weight: bold;
    transform: rotate(90deg);
    font-size: 90%;
    line-height: 1.5rem;
    color: #4D4B4A !important;
    padding: 0 0 0 35px;
    border-top: solid 1px;
}
.page-top::before {
    content: "";
    display: block;
    position: absolute;
    top: -1px;
    left: 0px;
    width: 15px;
    border-top: solid 1px;
    transform: rotate(35deg);
    transform-origin: left top;
}
@media screen and (max-width:767px){
.page-top {
	bottom: 80px;
}
}
/* ----------------------------------------
	clinic
---------------------------------------- */
footer .clinic{
	display:flex;
	text-align:center;
}

footer .clinic dl{
	margin:30px 0 0 30px;
}

footer .clinic dl dt{
	margin:0 0 20px 0;
	font-size:1.9rem;
	color:#FFFFFF;
	line-height:1;
	letter-spacing:0.1em;
}

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

footer .clinic .logo img{
	width:100px;
}

footer .clinic dl{
	margin-left:0;
}
}


/* tel
---------------------------------------- */
footer .clinic .tel a{
	display:inline-block;
	margin:0 0 20px 0;
	padding:0 0 0 35px;
	background:url(../../img/common/icon_tel01.png) no-repeat left center;
	background-size:27px;
	font-size:2.7rem;
	color:#FFFFFF;
	line-height:1;
	letter-spacing:0.1em;
	text-decoration:none;
}


/* widget_btn
---------------------------------------- */
footer .clinic .widget_btn{
	margin:0;
}

footer .clinic .widget_btn a{
	min-width:auto;
	min-height:auto;
	width:270px;
	height:46px;
	background:url(../../img/common/arrow_01.png) no-repeat right 36px center;
	background-size:22px;
	border-color:#FFFFFF;
	font-size:1.6rem;
	font-weight:400;
	letter-spacing:0.1em;
}

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


/* ----------------------------------------
	nav
---------------------------------------- */
footer .nav{
	flex:1;
	max-width:840px;
	margin:0 0 0 100px;
}

footer .nav ul{
	display:flex;
	flex-wrap:wrap;
}
footer .nav ul:first-child{
	margin:0 0 9px 0;
	padding:0 0 9px 0;
	border-bottom:1px solid #FFFFFF;
}

footer .nav ul:nth-child(2){
	margin:0 0 9px 0;
	padding:0 0 9px 0;
	border-bottom:1px solid #FFFFFF;
}

footer .nav ul li{
	width:210px;
}

footer .nav a{
	display:block;
	position:relative;
	padding:0 0 0 1.0em;
	font-size:1.4rem;
	color:#FFFFFF;
	line-height:3.2rem;
	text-decoration:none;
	white-space:nowrap;
}
footer .nav a:hover{ text-decoration:underline; }

footer .nav a::before{
	content:"・";
	position:absolute;
	top:0;
	left:0;
}

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


/* ----------------------------------------
	sns
---------------------------------------- */
footer .sns{
	display:flex;
	justify-content:center;
	gap:0 20px;
}

/* ----------------------------------------
	calendar
---------------------------------------- */
.calendar_title {
	margin: 0 auto;
	width: 100%;
	background: #67594E;
	color: #ffffff;
	text-align: center;
}
.calendar_table{
	margin: 0 auto 10px;
	width: 100% !important;
	table-layout: fixed;
	text-align: center;
	color: #67594E;
	font-size: 90%;
}
.calendar_table th{
    padding: 3px;
    background: #ffffff;
    border: 1px solid #67594E;
}
.calendar_table td {
	border: 1px solid #67594E;
	padding: 3px;
} 
.closed {
}
.other-month {
	color: #bbb;
}

@media screen and (max-width:767px){
	.calendar_table th,
	.calendar_table td {
	  display: table-cell !important;
	}
  }