@charset "utf-8";


/* --------------------------------------------------- */
/* Doctor */
/* --------------------------------------------------- */
.dr { position: relative; }
.dr .drhead,
.dr .wave > div {
	margin-left: 50%;
	margin-right: auto;
	width: 43%;
	max-width: 560px;
}
.dr .drhead h2 {
	margin-top: 1.5em;
	padding-left: 3.5em;
	background-image: url('../img/common/mark.svg');
	background-repeat: no-repeat;
	color: #111;
	font-size: 2.1rem;
	text-align: left;
	line-height: 1.5;
}
.dr .drhead h2::before {
	content: attr(data-post)'';
	display: block;
	font-size: 66.66%;
}
.dr .drhead h2::after {
	content: attr(data-yomi)'';
	display: inline-block;
	margin-left: 1.0em;
	font-size: 66.66%;
}
.dr .drhead h3 {
	color: #93c031;
	font-family: "Kosugi Maru", sans-serif;
	font-size: 2.4rem;
}
.dr figure {
	position: absolute;
	z-index: 2;
	top: 5.0em;
	right: 55%;
	display: block;
	width: 38%;
	max-width: 420px;
}
.dr figure img { border-radius: 24px; }
.dr .wave {
	position: relative;
	background-color: #f7f5ee;
}
.dr .wave::before {
	content: '';
	position: absolute;
	bottom: 100%;
	left: 0;
	right: 0;
	display: block;
	margin-top: -2px;
	width: 100%;
	padding-top: 7.5%;
	background-image: url('../img/common/wave-m.png');
	background-repeat: repeat-x;
	background-size: contain;
}
.dr .wave::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: block;
	padding-top: 1.25%;
	width: 100%;
	background-image: url('../img/common/line-w.png');
	background-repeat: repeat-x;
	background-size: contain;
	background-position: 50% 100%;
}
.dr .profile {
	display: flex;
	flex-wrap: wrap;
}
.dr .profile dt {
	width: 80px;
}
.dr .profile dd {
	padding: 0 0 0 1.0em;
	width: calc(100% - 80px);
	border-left: 1px solid #d9d7d6;
}
.dr .profile h4 {
	color: #5e3732;
	font-family: "Kosugi Maru", sans-serif;
}

@media screen and (max-width: 960px) {
	.dr .drhead h3 { font-size: 2.1rem; }
	.dr .drhead h3 span { display: inline; }

}
@media screen and (max-width: 767px) {
	.dr .drhead {
		margin-left: 45%;
		margin-right: auto;
		width: 50%;
	}
	.dr .drhead h2 { font-size: 1.8rem; }
	.dr .drhead h3 {
		margin-top: 4.0em;
		font-size: 2.1rem;
	}
	.dr figure {
		position: absolute;
		z-index: 2;
		top: 5.0em;
		right: 60%;
		display: block;
		width: 33%;
		max-width: 420px;
	}
	.dr .wave {
		position: relative;
		background-color: #f7f5ee;
	}
	.dr .wave > div {
		margin-left: auto;
		margin-right: auto;
		width: 86%;
		max-width: 360px;
	}
	.dr .profile {
		display: flex;
		flex-wrap: wrap;
	}
	.dr .profile dt {
		width: 80px;
	}
	.dr .profile dd {
		padding: 0 0 0 1.0em;
		width: calc(100% - 80px);
		border-left: 1px solid #d9d7d6;
	}

}
@media screen and (max-width: 640px) {
	.dr .wave::before {
		padding-top: 48px;
		background-size: auto 100%;
	}
	.dr .wave::after {
		padding-top: 16px;
		background-size: auto 100%;
	}
	.dr figure {
		position: static;
		display: block;
		margin: 0 auto;
		width: 86%;
		max-width: 320px;
	}
	.dr .drhead {
		margin-left: auto;
		margin-right: auto;
		width: 86%;
	}
	.dr .drhead h2 { font-size: 1.8rem; }
	.dr .drhead h3 {
		margin-top: 1.0em;
		font-size: 2.1rem;
	}

}
@media screen and (max-width: 420px) {
	.dr .drhead h3 {
		margin-top: 1.0em;
		font-size: 1.8rem;
	}
	.dr .profile dt { width: 64px; }
	.dr .profile dt h4 { font-size: 1.3rem; }
	.dr .profile dd {
		padding: 0 0 0 0.75em;
		width: calc(100% - 64px);
	}
}

/* --------------------------------------------------- */
/* BasicBreakPoint */
/* --------------------------------------------------- */
@media screen and (max-width: 767px) {
}
@media screen and (max-width: 420px) {
}