@charset "utf-8";

@media(min-width:1077px) {
	.toppage #common-header {position:relative; background:transparent;}
	.toppage #common-header::before {
		position:absolute; top:1.25em; left:0; right:0; 
		content:""; height:2.5em; width:100vw;
		background:rgba(255,255,255,0.7);
		z-index:-1;
	}
	.toppage #sticker:not(.fixed) .logo {width:auto; margin:0.25em 0 1.25em;}
	#header-navi-btns {margin:0 1em;}
	#header-navi-btns a.btn-slim {
		display:inline-block; width:7em !important; 
		margin:0.25em 0.25em !important; padding:0.125em 0 !important;
		font-size:90%; font-weight:bold;
		text-align:center; font-feature-settings:"palt";
	}
}

#main-visual {
	position:relative;
	top:0; right:0; left:0;
	width:100%; height:105.7vh;
	z-index:0;
}
/*
#main-visual::before {
	position:absolute; top:0; right:0; bottom:0; left:0;
	content:"";
	width:100%; height:100%;
	z-index:11;
	background:rgba(255,0,0,0.5);
}
*/
#mv-midlayer {
	position:absolute; top:0; right:0; bottom:0; left:0;
	width:100%; height:100%;
	background:linear-gradient(-90deg, rgba(41,171,226,0.5) 11.8%, rgba(41,171,226,0.5) 87.55%);
	z-index:4;
}

.toppage h1 {display:inline-block; margin:0; line-height:1;}

.toppage h2.tac {letter-spacing:0.125em; text-indent:0.125em;}

/*
#onslide-logo {
	position:absolute; top:1rem; left:1.5rem; width:auto; height:150px; text-align:left;
	z-index:4; 
}
#onslide-logo a {display:block; text-align:left;}
#onslide-logo .logo {
	width:auto; height:96px;
	margin:0;
}
*/

#onslide-banner {
	position:absolute; bottom:6rem; left:1.5rem; width:auto; height:10.5em; text-align:left;
	z-index:4; 
}
#onslide-banner .tel-number {
	width:auto; height:3.5em; margin:0.5rem;
}
#onslide-banner .banner {
	width:auto; height:5.7em; margin:0.5rem;
}


#main-visual::after {
	position:absolute; bottom:0; left:0; right:0; 
	content:""; width:100%; height:4rem;
	background:var(--pastel-color);
	pointer-events:none;
	z-index:4;
}

#onslide-face {
	position:absolute;
	bottom:2rem; right:3rem;
	width:23rem; height:23rem;
	z-index:9990;
	overflow:visible;
}
#onslide-face .face-mini {
	position:absolute; right:1.5rem; bottom:0;
	display:block;
	width:13m; height:13em;
	transform:rotate(5deg);
	z-index:9991;
}
#onslide-face .face-mini img {
	width:13em; height:13em; border-radius:100%;
	background:rgba(240,230,220,0.5);
}
#onslide-face .fv-words {
	position:absolute; top:0; left:0;
	display:block;
	width:auto; height:11em;	
	z-index:9992;
}
#onslide-face .fv-words img {
	width:auto; height:11em;	
}


@media (min-width:1600px) {

}

@media (min-width:1580px) {
	#main-visual {max-height:min(105.7vw, 1024px);}
}

@media (max-width:1579px) {

}

@media (min-width:1280px) {
	
}

@media (max-width:1279px) {
	#onslide-face {
		bottom:0.5rem; right:1.5rem;
		width:21rem; height:24.5rem;
	}
	#onslide-face .face-mini img {
		width:11rem; height:11rem;
	}
	#onslide-face .fv-words img {
		margin-top:3rem; margin-left:3em;
		width:min(95vw, 14rem); height:auto;	
	}	
}

@media (max-width:1169px) {
	.toppage h1 {font-size:14px; top:8px;}
}

@media (min-width:1077px) and (max-width:1579px) {
	#main-visual {max-height:min(105.7vw, 924px);}
}
@media (max-width:1076px) {
	#main-visual {max-height:min(105.7vw,864px);}
}
@media (max-width:899px) {

}
@media (max-width:800px) {
	#main-visual {max-height:min(100vmin, 800px);}
}
@media (min-width:769px) {
	.onslide-catch:hover {opacity:0.7; transition:all 0.14s linear 0s;}
}
@media (max-width:768px) {
	#onslide-face {bottom:1em; right:0; width:clamp(18rem,100vmin,21rem); height:25rem;}
	#onslide-face .face-mini {right:1em;}
}
@media (max-width:600px) {
	#main-visual {max-height:max(120vmin, 700px);}
	#onslide-banner {bottom:5.5rem; left:0.5rem; width:calc(100% - 58vmin);}
	#onslide-banner a:has(.banner):last-child {display:none !important;}
	#onslide-face {bottom:1rem; right:0; width:clamp(15rem,36vmin,18rem);}
	#onslide-face .face-mini {right:0.75rem;}	
	#onslide-face .fv-words {transform: scale(0.9);}	
	#onslide-face .fv-words img {margin-left:0;}
}
@media (max-width:480px) {
	#main-visual {max-height:max(145svmin, 500px); overflow:hidden;}
	#main-visual::after {height:3rem;}
	#onslide-banner {bottom:4rem; left:0; width:calc(100% - 58vmin);}
	#onslide-banner .banner {margin-top:0;}
	#onslide-face {bottom:1rem; right:1%; width:clamp(12rem,37vmin,17rem); height:18.5rem; margin-left:-1%;}
	#onslide-face .face-mini {right:0; width:auto; height:auto;} 
	#onslide-face .fv-words {width:auto; height:auto; transform: scale(0.88) translate(-2%,0);}
	#onslide-face .face-mini img {width:8.5rem; height:8.5rem;}
	#onslide-face .fv-words img {height:auto;}	
}
@media (max-width:359px) {
	#main-visual {height:clamp(424px,150vmin,90vmax);} 
	#onslide-face .fv-words {width:auto; height:auto; transform: scale(0.8) translate(7%,0);}
}

	


#news-info {
	position:relative;
	padding-top:2rem; 
	padding-bottom:4rem;
	background:var(--pastel-color);
	text-align:center;
}
#news-info table {margin:auto; width:auto; font-weight:500;}
#news-info table :is(th,td) {vertical-align:top; padding:0.75rem 0.375rem; font-size:1rem; line-height:1.5; border:none; background:transparent;}
#news-info table th {width:8em; word-break:keep-all; white-space:nowrap; opacity:0.6;}
#news-info table td {width:auto;}

#news-info .more-link {margin-top:1.5rem; text-align:right;}
#news-info .more-link .readmore {display:inline-block; position:relative; margin-right:1em;}
#news-info .more-link .readmore::after {
	content: ""; width: 8px; height: 8px; position: absolute; right: -1em; top: 50%; margin-top: -4px;
	border-right: 2px solid var(--acc-color); border-top: 2px solid var(--link-color); transform: rotate(45deg); transition: all 0.14s linear 0s;
}

@media (hover: hover) {
	#news-info .more-link .readmore:hover::after {right:-1.125em; transition:all 0.14s ease 0s;}
}
@media (max-width:1069px) {

}
@media (max-width: calc(1000px + 3rem) ) {
	#news-info .inner {padding:0 1.5rem;}
}
@media (max-width:640px) {

}
@media (max-width:600px) {
	#news-info {margin-top:-1rem; padding-top:0; padding-bottom:4rem;}
	#news-info table th {display:block; width:100%; padding:1em 1em 0 0.5em;}
	#news-info table td {display:block; width:100%; padding:0 1em 1em 1.5em;}
}
@media (max-width:480px) {
	#news-info {margin-top:-0.5rem; padding-top:0; padding-bottom:3rem;}
	#news-info .inner {padding:0 1rem;}
}




#clinic-info {
	padding-top:2rem; 
	padding-bottom:2rem;
	background:var(--sub-color);
	overflow:hidden;
}
#clinic-info .cell {position:relative;}
#clinic-hours {float:left;}
#clinic-hours .chart {display:block;}
#clinic-hours::before {
	position:absolute; content:"";
	height:auto; aspect-ratio:1;
	background:var(--pastel-color);
	border-radius:100%;
	z-index:-1;
}	
#fever-clinic {float:right;}
#fever-clinic .inner {display:inline-block; margin-inline:auto; width:auto; max-width:36rem;}
#fever-clinic .banner {
	margin:2.5rem auto 1rem;
	width:19rem;
}
#fever-clinic::before {
	position:absolute; content:""; 
	aspect-ratio:1; height:auto;
	background:var(--white-color);
	border-radius:100%;
	z-index:-1;
}
#fever-clinic::after {
	position:absolute; 
	top:-27.5%; left:50%;
	margin-left:-2.4rem;
	content:url('./img/mark/logo-mascot.svg');
	width:4.8rem; height:4.8rem;
	z-index:5;
}	

@media (min-width:1440px) {
	#clinic-info .float-wrapper {padding-right:2rem;}	
}
@media (min-width:1280px) {
	#clinic-info .cell {padding:3em 2em;}
	#clinic-hours {
		width:calc(60% - (var(--flex-gap) / 2) );
		margin-top:-2rem;
		text-align:center;
		z-index:1;
	}
	#clinic-hours::before {
		top:-65%; left:-25%;
		width:69rem;
	}	
	#clinic-hours .chart {
		margin:1rem auto 1rem;
		width:clamp(35rem,38vw,44rem);
	}
	#fever-clinic {
		width:calc(40% - (var(--flex-gap) / 2) );
		margin-top:30%; 
		text-align:center;
		z-index:3;
	}
	#fever-clinic::before {
		top:-22%; left:calc(50% - 19rem);
		width:38rem;
	}
}
@media (min-width:1100px) and (max-width:1279px) {
	#fever-clinic {
		width:40%;
		max-width:40%;
		margin-top:-4rem; 
		padding-inline:1.5rem;
		padding-block:2.5em;
		z-index:3;
	}
	#fever-clinic::before {
		top:-26%; left:calc(50% - 332px);
		width:646px;
	}	
}
@media (max-width:1279px) {
	#clinic-hours {
		width:60%;
		margin-top:1rem; 
		margin-bottom:3rem; 
		padding-inline:2rem;
		text-align:center;
	}
	#clinic-hours::before {
		top:-90%; left:-42%;
		width:clamp(1040px,180%,1200px); 
	}
	#clinic-hours .chart {
		margin:1rem auto;
		width:clamp(35rem,38vw,44rem);
	}
	#fever-clinic {
		width:clamp(28rem,44%,32rem);
		max-width:100%;
		margin-top:-4rem; 
		padding-inline:1.5rem;
		padding-block:2.5em;
		z-index:3;
	}
	#fever-clinic .banner {
		width:clamp(17rem,20vw,21rem);
	}
}
@media (max-width:1099px) {
	#fever-clinic::before {
		position:absolute; top:-26%; left:-13%;
		width:max(250px,126%); 
	}	
}
@media (max-width:1079px) {
	#clinic-hours {
		width:70%;
	}
	#clinic-hours::before {
		top:-96%; left:-42%;
		width:clamp(940px,180%,1170px);
	}	
	#fever-clinic {
		margin-top:1rem;  
	}
}
@media (max-width:959px) {
	#fever-clinic {
		margin-top:3rem; 
	}
}
@media (max-width:900px) {
	#clinic-hours, #fever-clinic {
		float:none; 
		margin-inline:auto;
		width:min(100%,35rem);
	}
	#clinic-hours {
		padding-top:4.5rem;
		padding-inline:0;		
	}
	#clinic-hours::before {
		display:none;
	}
	#fever-clinic {
		width:min(100%,436px);
		margin-top:12rem; margin-bottom:0;
		padding-top:2.5rem; padding-bottom:1rem;
		padding-inline:0;
	}
	#fever-clinic::before {
		top:-28.8%; left:-16%;
		width:132%;
	}
	#fever-clinic::after {
		top:-33.5%;
	}	
}
@media (max-width:600px) {
	#fever-clinic {
		padding-top:1.25rem;
	}
	#fever-clinic::before {
		top:-28%; left:calc(50% - 300px);
		width:600px;
	}	
}

ul.of-theme {padding-left:0;}
ul.of-theme li {position: relative; margin-bottom: 0.6em; margin-inline:0; padding-left: 1.25em; line-height: 1.5; }
ul.of-theme li::before {
	content: "■";
	display: block;  float: left; text-align: center;
	margin-left: -1.5em;  height: 1.5em; width: 1.5em;
}
ul.of-theme.acc li::before {color:var(--acc-color);}
ul.of-theme.notice li::before {color:var(--notice-color);}




#about-intro {padding:3.5rem 0 0;}
#about-intro .text-side {
	position:relative; 
	padding-top:5em;
	z-index:2;
}
#about-intro .text-side::before {
	position:absolute; top:-20%; left:-40%;
	content:""; width:180%; height:auto; aspect-ratio:1;
	background:var(--pastel-color);
	border-radius:100%;
	z-index:-1;	
}
#about-intro .image-side {
	position:relative; height:25em; margin-inline:auto; margin-top:-1em; z-index:4;
	container-type: inline-size;
} 
#about-intro .image-side img {position:absolute; border-radius:100%; aspect-ratio:1; height:auto; object-fit:cover;}
#about-intro .image-side img:first-child {top:-1em; left:0em; width:clamp(16em,80cqw,26em); z-index:9;}
#about-intro .image-side img:last-child {top:17em; right:4em; width:clamp(9em,52cqw,17em); z-index:8;}

@media (min-width:901px) and (max-width:1079px) {
	#about-intro .image-side img:first-child {top:-6em; left:-2.5em; width:clamp(19em,84cqw,26em);}
	#about-intro .image-side img:last-child {top:10.5em; right:4em; width:clamp(10em,55cqw,17em);}
	#about-intro .text-side .inner {margin-top:-0.5rem;}
	#about-intro .text-side::before {top:-20%; left:-50%; width:200%;}
}
@media (max-width:900px) {
	#about-intro {margin:0; padding-bottom:1.5rem;}
	#about-intro :is(.image-side, .text-side) {width:min(100%,35rem); margin-inline:auto;}
	#about-intro .image-side {margin-top:-2.5rem; margin-bottom:7rem;}
	#about-intro .image-side img:first-child {top:1em; left:-2.5em; width:clamp(16em,80cqw,26em);}
	#about-intro .image-side img:last-child {top:17em; right:1.5em; width:clamp(9em,52cqw,17em);}
	#about-intro .text-side {padding-top:8rem; padding-bottom:0;}
	#about-intro .text-side::before {
		top:-5%; left:-100%;
		width:300%; aspect-ratio:16 / 10;
	}
}
@media (max-width:480px) {
	#about-intro .image-side img:first-child {top:1em; left:-0.5em;}
	#about-intro .image-side img:last-child {top:19.5em; right:0;}
	#about-intro .text-side {padding-top:3.5rem; padding-bottom:0.5rem;}
	#about-intro .text-side::before {
		top:-15%; left:-150%;
		width:400%;	aspect-ratio:1;
	}
}



#greetings {
	padding-top:6rem; 
	padding-bottom:7rem;
	background:var(--pastel-color);
}
#greetings .image-side {
	text-align:center;
}
#greetings .image-side > * {margin-inline:auto;}
#greetings .image-side .portrait{
	width:15em; aspect-ratio:1; object-fit:cover; border-radius:100%;
}
@media (max-width:899px) {
	#greetings {margin-top:-3.5em;}
	#greetings :is(.image-side, .text-side) {width:min(100%,35rem); margin-inline:auto;}
}
@media (max-width:600px) {
	#greetings {margin-top:-5em;}	
}


#treatment-intro {
	padding-top:7rem; 
	padding-bottom:6rem;
	background:var(--sub-color);	
}
#treatment-intro .overview .inner {
	display:flex; flex-direction:row; align-items:center; gap:var(--flex-gap);
	container-type: inline-size;
}
#treatment-intro .overview dt {
	position:relative;
	color:var(--alt-color);
	font-size:200%; font-weight:700; line-height:1;
	z-index:1;
}
#treatment-intro .overview dt::before {
	position:absolute; top:4%; left:5%;
	content:""; width:90%; height:auto; aspect-ratio:1;
	background:var(--white-color); border-radius:100%;
	z-index:-1;
}
#treatment-intro .overview dd {
	padding:0.5em 1em;
}
#treatment-intro .overview img {
	display:block;
	border-radius:var(--radius-large);
	object-fit:cover;
}
#treatment-intro .overview p.addition {margin-block:0.75em; padding-inline:1.5em;}


@media (min-width:1170px) {
	#treatment-intro .overview .text-side {
		width:calc(33cqw - var(--flex-gap) / 2);
	}
	#treatment-intro .overview .image-side {
		margin-block:-2rem;
		width:calc(66cqw - var(--flex-gap) / 2);
	}
	#treatment-intro .overview img {
		width:auto; max-width:calc(100% + calc(100vw - 100cqw));
		height:100%; max-height:37.5rem;
		margin-top:1.15rem;
		/*aspect-ratio:4 / 3;*/
	}
}
@media (max-width:1169px) {
	#treatment-intro {	padding-top:6rem;} 
	#treatment-intro .overview .inner {flex-direction:column;}
	#treatment-intro .overview .text-side {display:contents; width:stretch;}
	#treatment-intro .overview h2 {order:1;}
	#treatment-intro .overview div.image-side {order:2; width:100%; margin:0;}
	#treatment-intro .overview div.like-these {order:3; width:100%; margin-top:1em; display:flex; flex-direction:row;}
	#treatment-intro .overview div.image-side img {width:min(100%,35rem); height:auto; aspect-ratio:16 / 10; object-fit:cover; margin-inline:auto;}
	#treatment-intro .overview p.addition {order:4; padding-inline:0;}
}
@media (max-width:900px) {
	#treatment-intro {	padding-top:5rem;} 
	#treatment-intro .overview div.like-these {flex-direction:column;}
	#treatment-intro .overview div.like-these dl {width:min(100%,35rem); margin-inline:auto;}
}
@media (max-width:599px) {
	#treatment-intro {	padding-bottom:4rem;} 	
}


#treatment-intro .methods {margin-top:4em;}


#treatment-intro .ear-expert {
	margin:7em auto 2em;
}

#treatment-intro .ear-expert .image-side {text-align:center;}
#treatment-intro .ear-expert .image-side img {
	margin-inline:auto;
	width:min(94%, 25rem); height:auto; aspect-ratio:1; object-fit:cover; border-radius:100%;
}

@media (max-width:900px) {
	#treatment-intro .ear-expert h2 {text-align:center; text-indent:0.125em;}
	#treatment-intro .ear-expert :is(.image-side, .text-side) {width:min(100%,35rem); margin-inline:auto;}
}




#access {
	padding-top:5.5em; 
	padding-bottom:6rem;
	padding-inline:1.25rem;
	background:var(--white-color);
}
/*
.toppage #access {
	padding-top:5.5rem; 
	padding-bottom:6rem;
}
.about #access {
	padding-top:5.5em; 
	padding-bottom:6rem;
}
*/

@media (min-width:900px) {
	#access .map-container {height:35rem;}
}
@media (max-width:599px) {
	#access {
		padding-top:4em; 
		padding-bottom:5.5rem;
	}	
}


.toppage section.hr-box {padding-inline:1.25rem !important;}


.toppage p.textarea br {display:block; content:""; margin:0.5em 0;}





/* ***** ***** ***** ***** ***** ***** 
	Subpage Common 
*/

.subpage #header-logo .logo {margin:0.5rem 0.25rem; width:clamp(15rem, 44vw, 27rem);}



#page-title {
	position:relative; 
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center;
	z-index:5;
}


#title-bg-layer {
	position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%;
	content: " ";
	z-index:-1; 
	opacity:1;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px); 
}
@supports not ((backdrop-filter: blur()) or (-webkit-backdrop-filter: blur())) {
	#title-bg-layer {
		background:rgba(140,140,140,0.35) url(./img/bg/pattern-wh.png) repeat 0 0;
	}
}


#page-title-inner {
	position:absolute; top:0; right:0; bottom:0; left:0; 
	width:100%; height:100%; overflow:hidden;
	background-image:
		linear-gradient(0deg,rgba(255,255,255,0.66),rgba(255,255,255,0.66));
		/*
		linear-gradient(0deg,rgba(37,86,119,0.6),rgba(37,86,119,0.6)),
		linear-gradient(0deg,rgba(0,0,0,0.1),rgba(0,0,0,0.1)); 
		/*
		linear-gradient(0deg,rgba(12,12,22,0.6),rgba(12,12,22,0.6)),
		linear-gradient(0deg,rgba(0,0,0,0.1),rgba(0,0,0,0.1)); 
		*/
}


.page-title-sub {
	display:block;
	position:absolute; right:1rem; bottom:0.6rem; 
	margin:auto; text-align:center;
	font-family:var(--eisuuji);
	font-size:2.75em; font-weight:300; letter-spacing:0.125em; line-height:0.6;
	color:var(--slug-color);
	text-shadow:none; z-index:0;
}

@media (max-width:800px) {
	.page-title-sub {right:0.5rem; bottom:0.55rem; font-size:2.3em;}
}
@media (max-width:480px) {
	.page-title-sub {right:0.325rem; bottom:0.3rem; font-size:2em;}
}


#page-title {height:calc(17rem + var(--sticky-header-height));}
#page-title-inner {padding-top:calc(var(--sticky-header-height) - 5px);}


@media (min-width: 1078px) {
	#page-title-inner {position:absolute; top:0; right:0; bottom:0; left:0; height:100%;}
	/*	.search #page-title, .taxo #page-title, .error404 #page-title {height:250px;}*/
}
@media (max-width: 1077px) {
	#page-title {height:calc(18.5rem + var(--sticky-header-height));}
	/*	.search #page-title, .taxo #page-title, .error404 #page-title {height:220px;}*/
}
@media (max-width: 480px) {
	#page-title {height:calc(16.5rem + var(--sticky-header-height));}
	/*.search #page-title, .taxo #page-title, .error404 #page-title {height:200px;}*/
}

#page-title h1 {
	margin:0; padding:0;
	color:var(--acc-color); line-height:1.4em; font-weight:700;
	text-align:center;
}

/*.subpage.fixed-page #page-title h1,*/
.subpage #page-title h1 {
	font-size:235%;
	letter-spacing:0.25em; text-indent:0.25em;
	font-weight:700;
}
.subpage:not(.fixed-page) #page-title h1 {
	letter-spacing:0.125em; text-indent:0.125em;
}
.subpage.single #page-title h1 {	font-size:160%;}

.subpage #page-title h1:has(.h1-en-caption) {margin-top:1em;}
h1 span.h1-en-caption {
	display:inline-block; margin-block:-1rem; margin-inline:auto; 
	text-align:center; font-family:var(--eisuuji); font-weight:300; font-size:0.75em; color:rgba(0,30,40,0.3); text-shadow:none; z-index:0;
	letter-spacing:0.125em; padding-left: 0.125em;
}


@media (max-width:1279px) {
	.subpage #page-title h1 {margin-top:1em;}	
	.subpage #page-title h1:has(.h1-en-caption) {margin-top:1.5em;}
}

@media (max-width:800px) {

}
@media (max-width:640px) {
	.subpage #page-title h1 {margin-top:0.5em;}	
	.subpage #page-title h1:has(.h1-en-caption) {margin-top:1em;}
}
@media (max-width:480px) {
	.subpage #page-title-inner h1 {
		margin-top:1em;
		padding-left:0.25em;
		font-size:160%; text-align:left; 
		letter-spacing:0.15em;
	}
	.subpage #page-title h1:has(.h1-en-caption) {margin-top:1.5em;}
	.subpage.single.type--post #page-title h1 {	
		padding-left:1em; padding-right:1em;
		font-size:150%; line-height:1.1;
		letter-spacing:0; text-indent:0;
	}

}




.page-std img + p.caption {
	margin:0.5rem 0 1.5rem; padding:0 0.5em;
	font-size:0.85rem; line-height:1.35; text-align:justify;
}


.ancor-link {margin-top:2em;}

.shell h3:not(:first-child) {margin-top:3em;}

.hr.container {margin-top:2.25em; padding-top:2.25em;}




/* **********************************************
　Page has children
*/


#child-pages {
	padding-top:6em; padding-bottom:6.5em; padding-inline: 1.25em;
	/*background:var(--sub-color);*/
	background:var(--bg-texture) no-repeat 0 0;
	background-size:cover;
}
@media (hover: hover) {
	#child-pages {background-attachment:fixed;}
}

#brother-pages {
	padding-top:6em; padding-bottom:5em; padding-inline: 1.25em;
	background:var(--bg-texture) no-repeat 0 0;
	background-size:cover;
}
#brother-pages h2 {
	margin-top:0;
	font-size:220%; font-weight:700;
	color:var(--alt-color); opacity:0.6;
}
.back-to-parent {margin-top:2rem; text-align:center;}
@media (hover: hover) {
	#brother-pages {background-attachment:fixed;}
}
/* Safari Hack */
_::-webkit-full-page-media, _:future, :root .is-pc.fixed-page.has-parent {
	#brother-pages, #btn-contact {background-attachment: scroll;}
}



#menu-banner {
	background-image:
		linear-gradient(180deg, rgba(255, 255, 255, 1) 5%, rgba(255, 255, 255, 0.5) 22%, rgba(255, 255, 255, 0.25) 60%),
		url(./img/bg/entrance-1pwb.jpg);
	background-position:0 0, 0 center;
	background-repeat:no-repeat, no-repeat;
	background-size:cover, cover;
}
#menu-banner.oya-page {
	padding:0.75em 0 6.5em;
	/* background:#f5f5f5; */
}
#menu-banner.ko-page {
	padding:6.5em 0 6.5em;
	margin-top:-5em;
}
.is-pc #menu-banner {
	background-attachment:scroll, fixed;
}
.is-mobile #menu-banner {
	background-attachment:scroll, scroll;
}


#menu-banner .children-banner {background:var(--white-color); transition:all 0.33s linear 0s;}


#menu-banner dl {display:flex; margin:0; height:100%; min-height:12.95rem; position:relative;}
#menu-banner dl::after {
	content: " ";
	width: 10px;
	height: 10px;
	position: absolute;
	right: 1em;
	top: 50%;
	margin-top: -5px;
	border-right: 2px solid var(--link-color);
	border-top: 2px solid var(--link-color);
	transform: rotate(45deg);
}	
#menu-banner #menu-face dl::after {border-right: 2px solid #aec729; border-top: 2px solid #aec729;}
#menu-banner #menu-etc dl::after {border-right: 2px solid #aaa; border-top: 2px solid #aaa;}
#menu-banner .children-banner .brief-copy {text-shadow:none !important;}
@media (max-width:599px) {
	#menu-banner .children-banner .brief-copy {font-feature-settings:"palt";}
}
@media (hover: hover) {
	#menu-banner .children-banner:hover {transform:scale(1.03); transition:all 0.14s ease 0s; box-shadow:0 2px 10px rgba(0,0,0,0.15);}
}

#menu-banner dl dt.eyecatch {width:40%;}
#menu-banner dl dd.summary {width:60%; padding:0.75em; color:#222;}
#menu-banner .brief-copy {font-size:95%; margin:0.75em 0 0.5em; padding:0 1em 0 0; line-height:1.5;}
#menu-banner .price-info {padding-left:0.5em; font-size:95%; font-weight:bold; line-height:1.7;}
#menu-banner #menu-body .price-info {color:#ef9518;}
#menu-banner #menu-face .price-info {color:#aec729;}
#menu-banner #menu-etc .price-info {color:#aaa;}
	
	
#menu-banner figure.menu-item {
	position: relative; overflow: hidden;
	width:100%; /*min-width:300px;*/
	height:100%; /*min-height:150px;*/
	color:var(--white-color);
	background-size:cover; background-position:center top;
}
#menu-banner figure.menu-item::before{ content:""; display: block; padding-top: 60%;}
#menu-banner h3 {
	position:static;
	margin:0.5rem 0; padding:0em;
	line-height:1.25;
	font-size:170%; font-weight:500; 	
	font-feature-settings:"palt";
}

#menu-banner h3 span {padding:0;}
#menu-banner #menu-body h3 span { box-shadow:0 -0.5em 0 0 rgba(242,170,70,0.6) inset;}
#menu-banner #menu-face h3 span { box-shadow:0 -0.5em 0 0 rgba(210,230,104,0.6) inset;}
#menu-banner #menu-etc h3 span { box-shadow:0 -0.5em 0 0 rgba(150,150,150,0.25) inset;}

@media (min-width:900px) and (max-width:1199px) {
	#menu-banner h3 {font-size:clamp(145%,2.15vw,170%);}
	#menu-banner .brief-copy {font-size:92.5%;}
}

@media (max-width:599px) {
	#menu-banner dl {min-height:160px;}
}
@media (max-width:530px) {
	#menu-banner dl {min-height:140px;}
	#menu-banner dl::after {right: 0.625em;}	
	#menu-banner dl dd.summary {padding:0.75em 1em 0.75em 0.25em;}	
	#menu-banner h3 {font-size:clamp(133%,2.25vw,170%);}
	#menu-banner .brief-copy {font-size:95%;}
	#menu-banner .price-info {padding-left:0; font-size:90%;}
}



/* **********************************************
　.blog-home , archive
*/

:where(.blog-home, .archive) #home-body {padding-bottom:1.5em;}




/* **********************************************
　Colomns , Column
*/



#sub-column {max-width:1000px; margin:auto;}


#appendix {
	margin:0 auto; padding:4em 0 2.5em; 
	background:var(--bg-texture) no-repeat 0 0;
	background-size:cover;
}
@media (hover: hover) {
	#appendix {background-attachment:fixed;}
}


#single-body + #appendix.of-blog {background:var(--sub-color);}


#sub-column { /* #sub-column = @ single.php (---blog each post) */ }
#sub-column h2 { margin:0.5em 0 1.5em; font-size:1.5em; letter-spacing:0.15em; text-indent:0.15em;}
#sub-column h2.en {font-size:2.5em; margin-bottom:0; letter-spacing:0;} 
#sub-column th {width:120px;}
#sub-column td {width:auto;}


.blog-cat-list li {display:inline-block;}

.tagcloud { margin-bottom:40px; padding-left:1.5em;}
.tagcloud a { 
    display:inline-block !important;
    line-height:1.2em !important; 
    padding:5px !important;
}

.searchform div {display:flex; max-width:220px; border:1px solid #bcbfcd; overflow:hidden; margin:auto; border-radius:5px; }
.searchform div input#s {width:calc(100% - 40px); height:36px !important; padding-left:1em; border:none !important; border-radius:0;}
.searchform div input#searchsubmit {
	width:40px; height:36px !important; margin:0 !important; padding:6px 12px; border:none !important; cursor:pointer;
	background:var(--link-color) url(./img/icon/search-wh.svg) no-repeat 0 0; background-size:contain; color:transparent;
	transition:all 0.33s linear 0s;
	border-radius:0;
}
.searchform div input#searchsubmit:hover {
	background:#aaa url(./img/icon/search-wh.svg) no-repeat 0 0; background-size:contain; transition:all 0.165s linear 0s;
}

.searchform label.screen-reader-text {display:none;}



.rel-one table {margin:0;}
#appendix.of-teachers .blog-rel th, #appendix.of-teachers .blog-rel td {border:none;} 
#appendix.of-teachers .blog-rel th {width:120px !important; padding:10px;}
#appendix.of-teachers .blog-rel td {width:auto !important; padding:10px; text-align:left !important; color:var(--moji-color) !important;}
#appendix.of-teachers .blog-rel .post-tn, #appendix.of-teachers .blog-rel .thumb-frame {display:block; width:100px; height:100px; margin:4px 2px; background:rgba(0,0,0,0.15); overflow:hidden; border-radius:0%;}
#appendix.of-teachers .blog-rel div.post-tn-100 {width:100px; height:100px; background:rgba(0,0,0,0.2); overflow:hidden; border-radius:0%;}
#appendix.of-teachers .blog-rel div.post-tn-150 {width:150px; height:150px; background:rgba(0,0,0,0.2); overflow:hidden; border-radius:0%;}



#related-post {
	background:var(--sub-color);
}



.single .related-post {padding:2em 0 3em;}

.single .related-post h2 {
	font-size:225%; font-weight:500;
	color:var(--acc-color); opacity:0.35;
}
.single .related-post  a {}


table.blog-rel {margin:0.5rem 0;}
.single .related-post .blog-rel th, .single .related-post .blog-rel td {border:none;} 
.single .related-post .blog-rel th {width:170px; padding:10px; text-align:center;}
.single .related-post .blog-rel td {width:calc(100% - 170px); padding:10px; text-align:left !important; font-size:90% !important;}
.single .related-post .blog-rel .post-tn, .single .related-post .blog-rel .thumb-frame {display:block; width:150px; height:150px; margin:4px auto; background:rgba(0,0,0,0.15); overflow:hidden; border-radius:var(--radius-btn);}
.single .related-post .blog-rel .post-tn img , .single .related-post .blog-rel .thumb-frame img {height:100%; aspect-ratio:1; object-fit:cover;}
.single .related-post .blog-rel td span:not(.each-cat) {display:block;}
.single .related-post .blog-rel td .post-date {font-size:100%; opacity:0.6;}
.single .related-post .blog-rel td .post-title {font-size:130%; font-weight:700; line-height:1.4; font-feature-settings:"palt";} 
.single .related-post .blog-rel td .post-cats {font-size:82%; font-weight:500; padding:0.75em 0 0.5em;} 
.single .related-post .blog-rel td .each-cat {
	display:inline-block; margin-right:0.5em; margin-bottom:0.25em; padding:0 0.65em 0.1em; line-height:1.9; 
	background:rgba(255,255,255,0.6); color:var(--acc-color); 
	border:1px solid var(--acc-color); border-radius:var(--radius-slight);
	text-shadow:none !important;
	transition:all 0.33s linear 0s;
}
.single .related-post .blog-rel td :is(.post-date,.post-title,.post-cats) {color:var(--acc-color); transition:all 0.22s ease 0s;}
.single .related-post .blog-rel td span.each-cat {
}

.single .related-post .each-post {margin:0 0.5em; transition:all 0.35s linear 0s; border-radius:var(--radius-blog-rel);}
@media (hover: hover) {
	.single .related-post .each-post:hover {background:rgba(255,255,255,0.33); transition:all 0.14s linear 0s;;}	
	.single .related-post .each-post:hover .blog-rel td :is(.post-date,.post-title,.post-cats) {color:var(--moji-color); transition:all 0.09s linear 0s;}
	.single .related-post .each-post:hover .blog-rel td span.each-cat {background:rgba(255,255,255,0.9); transition:all 0.09s ease 0s;}
}


@media (max-width:900px) {
	.single .related-post .inner {max-width:770px; margin-inline:auto;}
}

@media (max-width:599px) {
	.single .related-post .each-post {margin:0;}
	.single .related-post .blog-rel th {width:25% !important; min-width:115px !important; max-width:115px !important; padding:5px 5px 5px 0;}
	.single .related-post .blog-rel .post-tn, .single .related-post .blog-rel .thumb-frame {width:110px; height:110px;}
	.single .related-post .blog-rel td span.post-date {font-size:100%; padding-bottom:4px;}
	.single .related-post .blog-rel td span.post-title {font-size:123%; line-height:1.35; font-feature-settings:"palt";} 
	.single .related-post .blog-rel td span.post-cats {font-size:85%;} 
	.single .related-post .blog-rel td span.each-cat {margin-right:0.75em; padding:0 0.35em 0.1em; line-height:1.6; margin-right:4px; font-feature-settings:"palt";}
}
@media (max-width:480px) {
	.each-post {margin-inline:0;}
	.single .related-post .blog-rel td span.post-title {font-size:116%; line-height:1.25;}  	
	.single .related-post .blog-rel td span.each-cat {display:none;}
}







/* **********************************************
　Custom Post "item" - Post Card
*/

#items {padding-bottom:3.5em;}

.post-card-wrapper {padding:1.5em 2px;}
.post-card {height:100%;}

.post-card dl {
	height:100%; position:relative;
	padding:0; margin:0 3.5%; 
	box-shadow:none; transition:all 0.33s linear 0s; 
	background: var(--white-color);
	color:var(--moji-color);
	font-feature-settings:"palt";
	border-radius:var(--radius-card);
	overflow:hidden;
} 

/*.post-card dt {width:100%; padding:0.75em 1rem;}*/
.post-card dt h3 {margin:0.5em 0 0.125em; color:var(--white-color); font-size:1.55em; letter-spacing:0.25em;}
.post-card dt {width:100%; padding:0.75em 1rem 0.375em; margin:0; font-size:1rem; letter-spacing:0; color:inherit; line-height:1.5;}
.post-card dd {width:100%; padding:0.75em 1rem;}
.post-card dd.post-date {width:100%; padding:1rem 1rem 0; font-size:90%; opacity:0.6;}
.post-card dd.post-date + dt {padding:0.25em 1rem 1.25rem;}
.post-card dd.post-type {width:100%; padding:1rem 1rem 0; font-size:80%; opacity:0.5;}
.post-card dd.post-type + dt {padding:0.25em 1rem 0.75em;}
.post-card dd.excerpt {width:100%; padding:0.75em 1rem; font-size:90%; margin-bottom:1em;}
.post-card dd.eyecatch {position:relative; width:100%; height:auto; background:rgba(243,243,243,1); overflow:hidden; padding:0; }
.post-card dd.eyecatch .card-image {
	display:block; width:100% !important; min-width:100%; height:auto; margin:0; 	aspect-ratio:1; object-fit:cover;
}

.extend .post-card dl {position:relative; padding-bottom:3em; line-height:1.5;}
.search .extend .post-card dl {padding-bottom:0.5em;}

.post-card dd.taxo-terms {padding-top:0.125rem; padding-bottom:1.125rem; line-height:1.35;}
.post-card dd.taxo-terms .each-term {
	display:inline-block; margin-right:0.25em; padding:0.125em 0.5em 0.125em; 
	border:1px solid var(--sub-color); color:var(--sub-color);
	font-size:62%;
	border-radius:var(--radius-slight);
}
@media (max-width:480px) {
	.keep-half .post-card-wrapper {padding:1em 0 1em;}
	.extend .post-card dl {padding-bottom:2.25em; line-height:1.35;}	
	.post-card dd.academic-bg {font-size:82%;}
}
@media (hover: hover) {
	a:hover .post-card dl {
		transform:scale(1.025); box-shadow:0 2px 1.15em 2px rgba(0,0,0,0.25); transition:all 0.14s linear 0s; 
		background:var(--acc-color); color:var(--white-color); text-shadow:none;
	}
	a:hover .post-card dd.taxo-terms .each-term {
		text-shadow:none;
		border:1px solid rgba(255,255,255,0.88); color:rgba(255,255,255,0.88);
	}
}



#child-pages .post-card-wrapper {padding-block:0.75rem;}


.post-card.card-kwsk dl {
	margin-inline:0 !important;
	border-radius:var(--radius-card-large); overflow:hidden;
}
.post-card.card-kwsk dt {
	font-size:177%; font-weight:700; color:var(--acc-color); 
	text-align:center;
}
.post-card.card-kwsk dd.eyecatch img {
	width:100%;
	aspect-ratio:16 / 10; object-fit:cover;
}
.post-card.card-kwsk dd.caption {
	padding:0.5rem 1.25rem 1rem;
}
.post-card.card-kwsk dd.kwsk {
	position:relative;
	padding:0 2.125em 1.25em;
	color:var(--acc-color); font-weight:700; text-align:right;
}
.post-card.card-kwsk dd.kwsk::after {
	content: ""; width: 0.45em; height: 0.45em; position: absolute; right:1.3em; top: 50%; margin-top: -0.85em;
	border-right: 2px solid var(--acc-color); border-top: 2px solid var(--acc-color); transform: rotate(45deg); transition: all 0.14s linear 0s;	
}
@media (hover: hover) {
	.post-card.card-kwsk dl:hover > * {color:var(--white-color);}
	.post-card.card-kwsk dl:hover > dd.kwsk::after {
		border-right: 2px solid var(--white-color); border-top: 2px solid var(--white-color); transform: rotate(45deg);
	}
}





.search .post-card dt, 
#appendix .post-card dt {padding-bottom:1.25em !important;}

.post-card dd.staff-spec {padding-top:1rem; padding-bottom:0.25rem;  font-size:1rem;}
.staff-spec div {font-size:0.85em; line-height:1.5; margin:0;}
.post-card dd.staff-spec + dt {padding-top:0 !important; padding-bottom:1rem; font-size:1.2rem !important;}




/* **********************************************
	About us
*/

/* Safari Hack */
_::-webkit-full-page-media, _:future, :root .is-pc.fixed-page.about-us {
	#btn-contact {background-attachment: scroll;}
}
.about-us table tr td:first-child {white-space:nowrap;}
.about-us table .tcx-text-md {display:inline-block;}


/* **********************************************
	Cases
*/





/* **********************************************
 Page-Menu
*/


.taxo-large-button {
	position:relative; 
	display: flex; align-items: center; justify-content:center;
	width:100%; height:80px; 
	background:var(--white-color); border:1px solid #ddd; 
	box-shadow: 0px 3px 5px rgba(20, 20, 20, 0.3);
	font-feature-settings:"pkna";
	transition:all 0.33s linear 0s;
}
.taxo-large-button:hover { transform:translate(2px,2px); transition:all 0.14s linear 0s;}
.taxo-large-button::after {
	content:" "; width:10px; height:10px;
	position:absolute; right:10px; top:50%; margin-top:-5px;
	border-right:2px solid var(--effect-color);	border-top:2px solid var(--effect-color);
	transform:rotate(45deg);
	transition:all 0.14s linear 0s;
}
.taxo-large-button:hover::after {
	content:" "; width:10px; height:10px;
	position:absolute; right:8px; top:50%; margin-top:-5px;
	border-right:2px solid salmon;	border-top:2px solid salmon;
	transform:rotate(45deg);
	transition:all 0.14s linear 0s;
}
.taxo-large-button span {display:block; margin:auto 1.5em; }

.rel-duo-wrapper {width:100px; height:100px; background:rgba(0,0,0,0.2); border-radius:6px; overflow:hidden;}
.rel-duo-wrapper .yoko {width:100px; height:50px;}
.rel-duo-wrapper .tate {width:50px; height:100px;}
.rel-duo-wrapper .yoko, .rel-duo-wrapper .tate {background-repeat:no-repeat; background-size:cover; background-position:center center;}

img.this-case-photo {width:100% !important; max-width:330px !important;}




.taxo-term-list {
	padding:2em auto; margin-bottom:2em; font-size:125%;
 	font-family:'Noto Sans JP', sans-serif, sans; 
	text-align:center;
}
.taxo-term-list ul {padding-left:0; margin-top:0;}
.taxo-term-list ul li {margin:0 0.5em;}
.taxo-term-list a {
	font-size:0.8em; line-height:1;
	padding:0.35em 0.75em 0.5em; 
	background:var(--white-color);
	border: 1px solid var(--sub-color); 
	color:var(--sub-color);
	border-radius:var(--radius-small);
}
.taxo-term-list  a:hover {
	background:var(--sub-color);
	border:1px solid var(--sub-color);
	color:var(--white-color);
}





/* **********************************************
  Courses
*/
.page-spl #page-body {padding:5em 0 5em;}
.page-spl #page-body h2:first-child {margin-top:1rem;}




/* **********************************************
  About
*/
.about .wp-block-media-text.alignwide.is-stacked-on-mobile figure {text-align:center;}
.about .wp-block-media-text.alignwide.is-stacked-on-mobile figure img {width:100%; max-width:240px; margin:auto;}
.spec th {white-space:nowrap;}

@media only screen and (min-width: 768px) {
	.spec th {width:8em;}
}





/* **********************************************
  Google map
*/
.map-container {text-align:center; width: 100%;}
.map-container iframe{	display: block; pointer-events: none; position: relative;}
.map-container iframe.clicked{pointer-events: auto;}

@media only screen and (min-width: 900px) {
	.map-container iframe {width:100%; height:100%; margin:0; border:none !important;}
	.access .map-container {text-align:center; height:600px;}
}
@media only screen and (max-width: 899px) {
	.map-container iframe {width:96%; height:75vh; max-height:600px; margin:0 2%; border:1px solid #999;}
}





/* **********************************************
   Contact
*/
/* .contact #page-body {background:var(--slight-gra);} */
.contact .post-body .btn-line {padding:0.65rem 2rem 0.5rem; font-size:1.15rem ;line-height:1;}
.contact .post-body .btn-line img {height:40px; margin:0 8px 0 0;}

.contact .wpcf7-form {background:transparent; padding:0;}
.contact .fixed-page-post {max-width:39em; margin:auto; padding-bottom:3em;} 
#contact-form-wrapper {padding-bottom:4em;}

@media (max-width:530px) {
	.contact .post-body .brief-intro br {display:none;}
}


li.chk-xl {
	line-height:1.35em;
	height: auto; font-size:36px;
	list-style:none; 
	background: url(./img/icon/chk.png) no-repeat 0 0;
	background-size:48px 48px;
	padding: 4px 0 6px 1.5em;
	margin: 0.5em 0;
}
li.chk {
	line-height:1.35em;
	height: auto; font-size:120%;
	background: url(./img/icon/chk.png) no-repeat 0 0;
	background-size:1.75em 1.75em;
	padding: 0.25em 0 0.5em 2.25em;
	margin: 0.75em 0;
}




/* *********************************************************************
   privacy-policy / terms-of-service
*/
.privacy-policy .fixed-page-post {max-width:47em; margin:auto;}
.tos .fixed-page-post {max-width:52em; margin:auto;}

.privacy-policy h1 span.h1-en-caption,
.tos h1 span.h1-en-caption {font-size:0.9em;}

.tos .anchor-links {text-align:center;}
.tos .anchor-links.at-top {margin:0 0 3em; }
.tos .anchor-links.at-bottom {margin:3em 0 0; }
.tos .anchor-link {width:11em; margin:0 0.5em 1em;}

.tos .kakomi {margin:3em 0 4.5em; border:1px solid #ccc; border-radius:6px; padding:1em 1em 1em;}

/*

*/
.tos-links {text-align:right;}
.tos-links a {display:inline-block; margin:0.25em 0.5em; font-size:0.75rem; text-decoration:underline;}

a.tos-link {display:inline-block; margin:0.25em 0.5em; padding:0 1rem; font-size:0.85rem; text-decoration:underline;}
a.tos-link:hover {color:var(--hover-color);} 

#policy ol {margin:2em 0;}
#policy ol li {	line-height:1.7em; font-size:20px; margin:1em 0;}







/* ***************************************************************
  Taxonomy -- Common
*/

.taxo-list-wrapper {margin:1em 0; padding:0.5em 1em; font-size:90%;}
.term-list {margin:1em 0; padding-left:1em;}
.term-list li {display:inline-block; margin:0.5em 1.5em 0.5em 0;}





/* ***************************************************************
  Search Result
*/

.search #page-upper {}

.hits {margin:0 0.25rem;font-size:0.9rem; font-weight:500; /*normal*/ color:var(--white-color); padding:0.25em 0.75em; background:var(--alt-color); /*#bdbdbd;*/ border-radius:3px; font-feature-settings:"palt"; }

.showing {margin:0 0 0 0.5rem; font-size:0.8rem; font-weight:500; /*normal*/ color:var(--alt-color); /*#b3b3b3;*/  font-feature-settings:"palt"; }

.bg-ivory .hits-indicator {padding:0.75em 0;}

#not-found {text-align:left;}
#not-found h2 {font-family:var(--eisuuji); font-size:250%; margin-top:0;}
.bg-ivory #not-found h2 {color:#7A0910;}
.options {padding:1em 0;}
.main-option, .sub-option {display:inline-block; margin:1rem 0.5rem !important; width:13em !important; text-align:center !important}
.sub-option .searchform {width:12em; margin:auto;}
.pager {padding:2em 0 3em;}

#search-options {margin: 0 auto; padding: 3em 0; background:var(--bg-option);}



.face-icon {width:25vw; max-width:72px; margin:0.5em !important; border-radius:7px;}
.face-icon.maru {border-radius:100%;}
.face-icon.kaku {border-radius:0%;}


.bubble {display:inline-block; position:relative; padding:1em; border-radius:6px; background:var(--white-color); max-width:555px; margin-top:0.75em !important; margin-bottom:0.75em !important;}
.bubble.to-right::before {position:absolute; left:-32px; bottom:50%; margin-bottom:-16px; content:""; border:16px solid transparent; border-right:16px solid var(--white-color);} 
.bubble.to-left::before {position:absolute; right:-32px; bottom:50%; margin-bottom:-16px;  content:""; border:16px solid transparent; border-left:16px solid var(--white-color);} 
.bubble.bordered {border:1px solid #bababa;} 
.bubble.bordered.to-right::before {position:absolute; left:-32px; bottom:50%; margin-bottom:-16px; content:""; border:16px solid transparent; border-right:16px solid #bababa;} 
.bubble.bordered.to-right::after {position:absolute; left:-31px; bottom:50%; margin-bottom:-16px; content:""; border:16px solid transparent; border-right:16px solid var(--white-color);} 
.bubble.bordered.to-left::before {position:absolute; right:-32px; bottom:50%; margin-bottom:-16px;  content:""; border:16px solid transparent; border-left:16px solid #bababa;} 
.bubble.bordered.to-left::after {position:absolute; right:-31px; bottom:50%; margin-bottom:-16px;  content:""; border:16px solid transparent; border-left:16px solid var(--white-color);} 





/* ****************************************
  fancybox 3
*/


.fancybox-button--close {z-index:99999 !important; background:var(--sub-color) !important;}
.fancybox-slide--iframe .fancybox-content {height:auto; max-height:85vh !important;}

.fancybox-active html {overflow:hidden;}

@media (hover: hover) {
	button.fancybox-button--close:hover {color:#fff !important;}
}
@media (min-width:800px) {
	.fancybox-caption {font-size:1em !important;}
}
@media (max-width:480px) {
	.fancybox-slide--iframe {padding-inline:0.75em !important;}
}

/* Close current fancybox instance with JS
parent.jQuery.fancybox.getInstance().close(); */
.close-current-modal {display:inline-block; cursor:pointer; padding:0.5em 1.25em; border-radius:6px; border:1px solid #888; background:var(--white-color); font-size:0.8em;}




/* ****************************************
  GLightbox
*/
#glightbox-body.glightbox-clean .gslide-description {background:transparent !important; color:#fff;}
#glightbox-body.glightbox-clean .gdesc-inner {padding:1rem 1.5rem 1.5rem;}
#glightbox-body.glightbox-clean .gslide-desc { font-family:var(--wabun);}
#glightbox-body.glightbox-clean .gclose {background:var(--acc-color); opacity:1;}



/********/

#loading {
  margin: 80px auto;
  font-size: 8px;
  position: relative;
  text-indent: -9999em;
  border-top: 1.1em solid rgba(0,104,182,0.32);
  border-right: 1.1em solid rgba(0,104,182,0.32);
  border-bottom: 1.1em solid rgba(0,104,182,0.32);
  border-left: 1.1em solid rgba(0,104,182,1);
  transform: translateZ(0);
  animation: load8 1.1s infinite linear;
}
#loading,
#loading:after {
  border-radius: 50%;
  width: 6.5em;
  height: 6.5em;
}
@keyframes load8 {
  0% { transform: rotate(0deg);}
  100% { transform: rotate(360deg);}
}
#loading{ position:fixed; left:50%; top:40%; margin-left:-3.25em; text-align:center;}



.fuwa-sp {visibility:hidden;}



.powatt {
	animation-fill-mode:both;
	animation-duration:2s;
	animation-name: Powatter;
	visibility: visible !important;
}
@keyframes Powatter {
	0% { opacity: 0; transform: translateY(20px); }
	100% { opacity: 1; transform: translateY(0); }
}

.powatt-short-delay {
	animation-fill-mode:both;
	animation-duration:2s;
	animation-name: Powatter;
	visibility: visible !important;
    animation-delay: 0.8s; 		
}

.powatt-mid-delay {
	animation-fill-mode:both;
	animation-duration:2s;
	animation-name: Powatter;
	visibility: visible !important;
    animation-delay: 1.6s; 		
}

.powatt-mid-delay-2 {
	animation-fill-mode:both;
	animation-duration:2s;
	animation-name: Powatter;
	visibility: visible !important;
    animation-delay: 2.0s; 		
}

.powatt-long-delay {
	animation-fill-mode:both;
	animation-duration:2s;
	animation-name: Powatter;
	visibility: visible !important;
    animation-delay: 2.4s; 		
}

.fuwatt-l2r {
	animation-fill-mode:both;
	animation-duration:1s;
	animation-name: Fuwatter-LtoR;
	visibility: visible !important;
    animation-delay: 0.225s; 			
}
@keyframes Fuwatter-LtoR {
	0% { opacity: 0; transform: translateX(-30px); }
	100% { opacity: 1; transform: translateX(0); }
}
.fuwatt-l2r-nano-delay {
	animation-fill-mode:both;
	animation-duration:1s;
	animation-name: Fuwatter-LtoR;
	visibility: visible !important;
    animation-delay: 0.4s; 			
}
.fuwatt-l2r-short-delay {
	animation-fill-mode:both;
	animation-duration:1s;
	animation-name: Fuwatter-LtoR;
	visibility: visible !important;
    animation-delay: 0.8s; 			
}
.fuwatt-l2r-delay {
	animation-fill-mode:both;
	animation-duration:1s;
	animation-name: Fuwatter-LtoR;
	visibility: visible !important;
    animation-delay: 1.6s; 			
}

.fuwatt-r2l {
	animation-fill-mode:both;
	animation-duration:1s;
	animation-name: Fuwatter-RtoL;
	visibility: visible !important;
    animation-delay: 0.225s; 		
}
@keyframes Fuwatter-RtoL {
	0% { opacity: 0; transform: translateX(30px); }
	100% { opacity: 1; transform: translateX(0); }
}
.fuwatt-r2l-nano-delay {
	animation-fill-mode:both;
	animation-duration:1s;
	animation-name: Fuwatter-RtoL;
	visibility: visible !important;
    animation-delay: 0.4s; 		
}
.fuwatt-r2l-short-delay {
	animation-fill-mode:both;
	animation-duration:1s;
	animation-name: Fuwatter-RtoL;
	visibility: visible !important;
    animation-delay: 0.8s; 		
}
.fuwatt-r2l-delay {
	animation-fill-mode:both;
	animation-duration:1s;
	animation-name: Fuwatter-RtoL;
	visibility: visible !important;
    animation-delay: 1.6s; 		
}



.fuwatt {
	animation-fill-mode:both;
	animation-duration:1s;
	animation-name: Fuwatter;
	visibility: visible !important;
}
@keyframes Fuwatter {
	0% { opacity: 0; transform: translateY(-20px); }
	100% { opacity: 1; transform: translateY(0); }
}

.fuwatt-short-delay {
	animation-fill-mode:both;
	animation-duration:1s;
	animation-name: Fuwatter-LD;
	visibility: visible !important;
    animation-delay: 0.4s; 	
}
@keyframes Fuwatter-SD {
	0% { opacity: 0; transform: translateY(-20px); }
	100% { opacity: 1; transform: translateY(0); }
}

.fuwatt-mid-delay {
	animation-fill-mode:both;
	animation-duration:1s;
	animation-name: Fuwatter-LD;
	visibility: visible !important;
    animation-delay: 0.8s; 	
}
@keyframes Fuwatter-MD {
	0% { opacity: 0; transform: translateY(-20px); }
	100% { opacity: 1; transform: translateY(0); }
}

.fuwatt-long-delay {
	animation-fill-mode:both;
	animation-duration:1s;
	animation-name: Fuwatter-LD;
	visibility: visible !important;
    animation-delay: 1.2s; 	
}
@keyframes Fuwatter-LD {
	0% { opacity: 0; transform: translateY(-20px); }
	100% { opacity: 1; transform: translateY(0); }
}


.guwatt {
	animation-fill-mode:both;
	animation-duration:1s;
	animation-name: Guwatter;
	visibility: visible !important;
}
@keyframes Guwatter {
	0% { opacity: 0; transform: translateY(40px); }
	100% { opacity: 1; transform: translateY(0); }
}



/* ***********************************
	img A面 ⇔ B面 リバーシブル ギミック
	reversible image - turn-around card gimmik
*/
.wp-block-column:has(.reversible-wrapper) {text-align:center;}
.reversible-wrapper {
	perspective: 1000px;
	display: inline-block;
	margin:0;
	width: min(100%,440px);
	height: auto;
	aspect-ratio:3 / 4;
	cursor: pointer;
}

.two-sides {
	width: 100%;
	height: 100%;
	position: relative;
	transform-style: preserve-3d;
	transition: transform 0.6s ease;
}

@media (hover: hover) {
	.reversible-wrapper:hover .two-sides {
		transform: rotateY(180deg);
	}
}

.two-sides.flipped {
	transform: rotateY(180deg);
}


.two-sides .front-side,
.two-sides .back-side {
	position: absolute;
	inset: 0;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

.two-sides .back-side {
	transform: rotateY(180deg);
}

.two-sides .front-side img,
.two-sides .back-side img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	border-radius:1.5rem;
}

.reversible-wrapper + .caption {
	margin-block:0.25rem;
	text-align:center;
	font-size:85%;
	font-weight:700;	
	color:var(--note-color);
}


/* =============================================================================
   Media Queries
   ========================================================================== */


@media only screen and (min-width: 1078px) {
	.subpage-eyecatch {background-repeat:no-repeat; background-attachment:scroll; background-size:cover; background-position:center center;}
}
@media only screen and (max-width: 1077px) {
	.subpage-eyecatch {background-repeat:no-repeat; background-attachment:scroll; background-size:cover; background-position:center 10%;}

	.saru-kao {bottom:10%; right:8.5%; width:80px;}
	.saru-serif {bottom:20%; right:4%; width:115px;}
	
}
@media only screen and (min-width: 996px) {

}
@media only screen and (max-width: 995px) {

}

@media only screen and (min-width: 801px) {


	.a-area {background:inherit; transition:all 0.5s linear 0s;}
	.a-area.a-pink:hover {color:#d6c; background:rgba(255,221,232,0.4); transition:all 0.34s linear 0s;}
	.a-area.a-blue:hover {color:#00f; background:rgba(81,201,255,0.15); transition:all 0.34s linear 0s;}
}

@media only screen and (max-width: 800px) {
	
	.subpage-eyecatch { background-attachment:scroll; background-size:cover; background-position:center center;}	

	h1 span.blog-post-title {text-align:left !important; line-height:1.5em !important;}
	
}

@media only screen and (min-width: 769px)  {

}


/* All Mobile Sizes */
@media only screen and (max-width: 768px) {

	#header-inner {height:auto; min-height:100px;}	
	


	
	/* #body-menu etc --- @ front-page, page-menu*/
	.keep-half.smp-waku {border-top:1px solid #ddd; margin-top:1.5em;}
	.keep-half.smp-waku > div { padding:0.5em; } 
	.keep-half.smp-waku > div {border-bottom:1px solid #ddd;}
	.keep-half.smp-waku > div:nth-child(odd) {border-right:1px solid #ddd;}



	.bubble {width:auto; max-width:408px;}

}

/* Mobile Landscape Size to Tablet Portrait */
@media only screen and (min-width: 481px) and (max-width: 768px) {

	h1 span.blog-post-title {font-size:82.5%; line-height:1.5em !important;}

}


/* Mobile Portrait Size to Mobile Landscape Size */
@media only screen and (max-width: 700px) {


}

/* Mobile Portrait Size to Mobile Landscape Size */
@media only screen and (max-width: 480px) {

	
	h1 span.h1-en-caption { bottom:20px; right: 1%; left:1%; margin:auto; font-size:1em;}
	
	.feature-text {font-size:125%; line-height:1.7em; text-align:left;}

	.motto p {text-align:left;}

	#page-upper a.gbtn-aqua-small {font-size:85%; font-feature-settings:"pkna";}






	#intro-box h2 {font-size:5.2vw; letter-spacing:-0.025em;}

	.privacy-policy #page-title h1 {font-size:175%;}
	.privacy-policy h1 span.h1-en-caption {font-size:0.95em;}
	.privacy-policy h2.jp {font-size:175%;}
	
	ul.term-list {padding-left:0;}	
	ul.term-list li { font-size:100%; margin-top:0.75em; margin-bottom:0.75em;}
	
	

	.face-icon,
	.face-photo {width:20vw; max-width:80px; margin:0.5em 0;}
	.bubble {padding:0.75em; font-size:90%; max-width:55vw;}
	.bubble.to-right::before {position:absolute; left:-16px; bottom:50%; margin-bottom:-8px; content:""; border:8px solid transparent; border-right:8px solid var(--white-color);} 
	.bubble.to-left::before {position:absolute; right:-16px; bottom:50%; margin-bottom:-8px;  content:""; border:8px solid transparent; border-left:8px solid var(--white-color);} 
	.bubble.bordered {border:1px solid #bababa;} 
	.bubble.bordered.to-right::before {position:absolute; left:-16px; bottom:50%; margin-bottom:-8px; content:""; border:8px solid transparent; border-right:8px solid #bababa;} 
	.bubble.bordered.to-right::after {position:absolute; left:-15px; bottom:50%; margin-bottom:-8px; content:""; border:8px solid transparent; border-right:8px solid var(--white-color);} 
	.bubble.bordered.to-left::before {position:absolute; right:-16px; bottom:50%; margin-bottom:-8px;  content:""; border:8px solid transparent; border-left:8px solid #bababa;} 
	.bubble.bordered.to-left::after {position:absolute; right:-15px; bottom:50%; margin-bottom:-8px;  content:""; border:8px solid transparent; border-left:8px solid var(--white-color);} 	

	
	
}


/* */

/* ============================================================
 * 当テーマ用 — カラー調整
 * ============================================================
 */
.has-aqua-background-color {}
.has-aqua-background-color h3 {filter:saturate(150%) brightness(85%);}


