@charset "utf-8";
/* CSS Document */

/* reset */

body,h1,h2,h5,ul,p,dl,dt,dd {
	margin:				0;
	padding:			0;}

/* 共通 */
/* heeder */

header {
	width:				100%;
	height:				360px;}
header img {
	width:				105px;
	height:				106px;
	margin-left: 		8px;
	margin-right: 		8px;}
h1 {
	white-space: 		nowrap;
	color:				#fff;}
h2 {
	margin:				16px;
	font-size:			16px;
	color:				#999;}
.title {
	margin: 			0 16px;}
.lax {
	position:			fixed;
	width:				100%;}
.head01 {
	display: 			flex;
	justify-content: 	center;
	align-items: 		center;
	height:				180px;
	background-color:	#52ceba;
	z-index:			100;
	text-align:			center;
	transition: height 0.3s ease;}
.head02 {
	height:				80px;
	background-color:	#8affb4;
	z-index:			90;
	margin-top:			180px;
	text-align:			center;
	align-content: 		center;}
.head03 {
	height:				50px;
	background-color:	#eaff81;
	z-index:			80;
	margin-top:			260px;}

@media screen and (min-width:769px) {}
@media screen and (min-width:641px) and (max-width:768px) {
	header h1 {
		font-size: 		4vw;}
	header h2 {
		font-size: 		2vw;}
	header img {
		width: 			100%;
		height: 		auto;}
}
@media screen and (max-width:640px) {
	body {
		overflow-x:		hidden;}
	header img {
		width: 			100%;
		height: 		auto;}
	h1 {
		font-size:		4vw;
		margin-left:	8px;
		padding-top:	8px;}
	h2 {
		font-size: 		14px;
		margin-top:		12px;
		margin-left:	8px;
		margin-right:	8px;}
	.head01 {
		height:			160px;}
	.head01.scroll {
		height: 		140px;}
	.head02 {
		margin-top:		160px;}
	.head03 {
		margin-top:		240px;}
	.telset {
		margin-right:	8px;
		margin-top:		8px;
		text-align:		right;}
}

/* 共通 */
/* footer */

footer a {
	color: 				#fff;
	text-decoration: 	none;}
.footer-top {
	position:			fixed;
	bottom:				0;
	width:				100%;
	height:				36px;
	text-align:			right;
	font-size:			24px;
	background-color:	#52ceba;}
.footer-top p {
	margin-right:		16px;}
.footer-top.static {
	position:			static;}
.footer-bottom {
	padding-top: 		16px;
	padding-bottom: 	16px;
	background-color:	#438a70;
	text-align:			center;
	color:				#fff;}
.footer-bottom ul {
	text-align: 		left;
	list-style: 		none;
	display: 			flex;}
.footer-bottom li {
	margin: 			0 8px;
	min-width: 			120px;
}
.footerNav {
	display: 			flex;
	width: 				540px;
	margin: 			0 auto;}
.firstNav {
	font-weight: 		bolder;
	list-style: 		disc!important;}
#foot-banner {
	margin-top: 16px;}

@media screen and (min-width:769px) {}
@media screen and (min-width:641px) and (max-width:768px) {}
@media screen and (max-width:640px) {
	.footer-bottom ul {
		display: block;
		margin-top: 8px;}
	.footerNav {
		width: 272px;
	}
}

/* others */

h3 {
	padding:			18px;
	background-color:	#8affb4;}
h4 {
	color:				#438a70;}
section {
	width:				96%;
	margin:				0 auto 8px;
}
article {
	border:				solid thin #CCC;
	margin-bottom:		60px;}
article div {
	margin:				12px 18px;}
.notice-ul {
	margin:				16px 40px;}
.notice-ul li {
	margin-bottom: 		16px;}
.notice-li2 {
	list-style:	 		none;
	margin-left:		12px;}
.notice-li2 span {
	border-bottom:		thin dotted #c0c0c0;}
.notice-li3 {
	font-family:		"ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospace;
	font-size: 			small;
	line-height: 		1.5;}
.notice-li4 {
	font-size:			small;
	font-family:		"ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospace;
	list-style:			none;
	margin-left:		12px;}
.notice-li5 {
	margin-top: 		1rem;
	list-style: 		none;
	margin-left: 		-16px;}
.notice-li5::before {
    content:  			"★";
	position: 			relative;
	left: 				-4px;}
.notice-li5 ol {
	margin-top: 		1rem;
}
dt {
	float:				left;}
.htitle {
	width:				100%;
	color:				#fff;
	padding:			12px 0;
	text-align:			center;
	background-color:	#438a70;}
.address {
	margin:				12px 0 0;}
.holiday-color {
	color:				red;}
.left {
	float:				left;}
.right {
	float:				right;}
.clear {
	clear:				both;}

@media screen and (min-width:769px) {
	section {
		max-width: 		1840px;}
	article div {
		margin:			20px;}
	.notice-li5 {
		margin-top: 	0;}
	.notice-li5 ol li {
		margin-bottom: 	0;}
	.notice-ol {
		margin-bottom: 	1rem;}
	.sp {
		display:		none;}
}
@media screen and (min-width:641px) and (max-width:768px) {
	.notice-li5 ol li {
		margin-bottom:	0;}
	.sp {
		display:		none;}
}
@media screen and (max-width:640px) {
	.notice-li2 {
		margin-left:	0;}
	.notice-li3 {
		font-size: 		1rem;
		margin-bottom:	8px;}
	.notice-li4 {
		font-size: 		1rem;}
	.notice-li5 ol {
		margin-top: 	0.5rem;}
	.pc {
		display:		none;}
}

/* top */

.topgate {
	min-height:			160px;}
.topgate img {
	float:				right;
	border:				thin solid #ccc;}
.promise dl {
	margin-top:			12px;}
.promise dt {
	float:				none;
	font-weight:		bold;
	margin-top:			12px;
	margin-bottom:		12px;}
.promise dd {
	margin-left:		32px;}
.container {
	margin: 			0;}
.circlegate {
	display: 			flex;
	text-align: 		center;
	justify-content: 	space-around;}
.circlegate_parts {
	width: 				calc(100% / 3);
	box-sizing: 		border-box;
	text-align: 		center;
	margin: 			0 1.5rem;
	padding-top: 		1rem;}
.circlegate_parts p {
	text-indent: 		1rem;}
.circlegate h4 {
	margin-left: 		auto;
	margin-right: 		auto;
	text-align: 		center;
	font-size: 			20px;
	margin-bottom: 		8px;}
.circlegate p {
	text-align: 		justify;}
.pie {
	position: 			relative;
	margin-right: 		auto;
	margin-left: 		auto;
	width: 				200px;
	height: 			200px;
	border-radius: 		50%;
	background-color: 	#006769;
	font-size: 			2rem;}
.pie_circle {
	position: 			absolute;
	border: 			solid medium #fff;
	width: 				190px;
	height: 			190px;
	margin: 			0;
	border-radius: 		50%;
	box-sizing: 		border-box;
	top: 				5px;
	left: 				5px;}
.pie_per {
	background-image: 	conic-gradient(#006769 0% 82%, #a3b9b1 82% 100%);}
.pie span {
	position: 			absolute;
	color: 				#fff;}
.pie_year span {
	top: 				15%;
	right: 				38%;}
.pie_peo span {
	top: 				15%;
	right: 				55%;}
.pie_per span {
	top: 				22%;
	right: 				33%;}
.pie_numbers {
	font-size: 			4.5rem;
	font-family: 		YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";}
.pie_unit {
	transform: 			translate(100%, 85%);}
.pie_more {
	transform: 			translate(10%, 160%);}
.pie_more2 {
	transform: 			translate(62%, 160%);}
.more {
	margin-top:			12px;}

@media screen and (min-width:769px) {
	.topgate p {
		margin-top: 	8px;}
	.topgate img {
		padding:		4px;
		margin-left:	16px;}
}
@media screen and (max-width:820px) {
	.circlegate {
		display: block;}
	.circlegate_parts {
		margin: auto;
		width: 70%;}
}
@media screen and (min-width:641px) and (max-width:768px) {
	.topgate img {
		padding:		4px;
		margin-left:	8px;}
}
@media screen and (max-width:640px) {
	.topgate img {
		width:			100%;
		margin-bottom:	16px;}
	.more {
		float:			right;}
}

/* link directory */

#link-style h5 {
	width:				100%;
	background-color:	#8affb4;
	margin-top:			12px;
	margin-bottom:		12px;}
#link-style ul {
	margin-left:		24px;}
#link-style dt {
	font-weight:		bold;}
#link-style dd {
	margin-left:		100px;}
#link-style span {
	font-size:			12px;}

/* about directory */

#gc {
	margin-top:			20px;}
#gc .calendar {
	border:				0;
	width:				100%;
	height:				320px;}
#gc h4 {
	margin-top:			0;
	margin-bottom:		1.33em;}
#guide-a dt {
	font-weight:		bold;}
#guide-a .holiday {
	color:				#ff0000;}
#guide-a .smaller {
	font-size:			small;}
#guide-b h5 {
	font-size:			20px;
	margin-bottom:		12px;}
#guide-b p {
	margin-bottom:		12px;}
#policy p {
	margin-bottom:		12px;}
#policy h5 {
	font-size:			18px;
	margin-bottom:		8px;}
#policy .ps {
	font-size:			small;
	margin-bottom:		8px;}
	#policy .subinfo {
		float:				right;
		border:				thin solid #ccc;}
	#policy table {
		margin:				8px;
		font-size:			small;
		border-collapse:	collapse;}
	#policy th {
		text-align:			left;
		border:				1px solid #888;}
	#policy td {
		border:				1px solid #888;
		text-align:			center;}
	#policy thead {
		font-weight:		bold;
		border-bottom:		3px double #888;}
	#policy thead th {
		background-color:	#eaff81;}
	#policy thead td {
		background-color:	#eaff81;}
	#policy tfoot {
		border-collapse:	collapse;}
	#policy tfoot th {
		background-color:	#52ceba;
		border-bottom:		3px double #888;}
	#policy tfoot td {
		background-color:	#52ceba;
		border-bottom:		3px double #888;}
	#policy tbody {
		border-collapse:	collapse;}
	#policy .note {
		font-size:			small;
		margin-left:		8px;
		margin-right:		8px;}
#staff .greeting {
	padding:			4px;
	margin-top:			20px;
	border:				thin solid #ccc;}
#staff .pr {
	float:				left;
	margin-top:			-4px;}
#staff .point {
	margin-top:			16px;}
#staff .staffname {
	margin-bottom:		0px;}
#staff .qual {
	font-size:			12px;}
#staff ul {
	min-height:			200px;
	font-size:			14px;
	margin:				20px 0 24px 200px;}
#staff .li-none {
	list-style:			none;
	margin-left:		12px;}
#staff .li-b {
	font-weight:		bold;}
#staff .advantage {
	margin:				0 0 12px;
	padding:			24px;
	background-color:	#eaff81;}
#staff .shift {
	font-size:			12px;}
#staff span {
	color:				#ff0000;}
	#staff table {
		border-collapse:collapse;
		text-align:		center;
		margin-top:		12px;}
	#staff thead {
		border-bottom:	thin solid #888;
		font-size:		12px;}
	#staff thead td {
		background-color:#eaff81;}
	#staff td {
		border:			1px solid #888;
		padding:		0 24px;}
.lastchild {
	list-style: 		none;
	padding-top: 		1em;
}

@media screen and (min-width:769px) {
	#gc {
		float:			right;
		width:			46%;}
	#gc .calendar {
		height:			492px;}
	#guide-b h5 {
		text-align: 	center;}
	.sign {
		text-align: 	right;
		font-weight:	bold;}
	#policy h5 {
		margin-top:		24px;}
	#staff .greeting {
		float:			left;}
}
@media screen and (min-width:641px) and (max-width:768px) {
	#gc {
		width:			95%;}
	#staff .greeting {
		float:			left;}
}
@media screen and (max-width:640px) {
	#gc {
		width:			94%;}
	.cardstyle {
		text-align:		center;}
	#staff .greet-p {
		text-align:		center;}
	#staff ul {
		margin-left:	20px;}
	#staff td {
		padding:		0 19px;}
}

/* chiro directory */

#chara h6 {
	font-size:			18px;
	margin-top:			1.33em;
	margin-bottom:		1.33em;}
#chara p {
	margin-bottom:		8px;}
#chara span {
	color:				#ff0000;}

#sitemap img {
	padding:			4px;
	border:				thin solid #ccc;}
#sitemap dt {
	font-weight:		bold;
	float:				none;}
#for .appli {
	text-align:			center;
	margin:				12px 0 8px;}
.appli img {
	padding:			8px;
	border:				thin solid #ccc;}
#for p {
	margin-bottom:		12px;}
#for span {
	font-weight:		bold;}
#for dl {
	margin-bottom:		4px;
	border:				thick dotted #888;}
#for dd {
	margin-top:			12px;}
#for .parts {
	font-weight:		bold;
	margin-top:			14px;}
#for .effect {
	margin:				0;}
.effect p {
	margin-top:			12px;}
.effect span {
	font-weight:		bold;}
#for .announce {
	padding:			16px 16px 4px;
	text-align:			center;
	background-color:	#eaff81;}
#for .taboo {
	margin:				0;}
.reserve {
	text-align:			center;
	padding:			40px 0;
	margin:				0;}
.reserve a {
	padding:			24px;
	color:				#fff;
	font-weight:		bold;
	background-color:	#438a70;}
#flow article {
	display: 			flex;
	justify-content: 	space-between;
	margin-bottom:		20px;
	align-items:		center;}
#flow .strt {
	margin-left:		18px;
	margin-bottom:		18px;}
#flow .flowimg {
	border:				thin solid #ccc;
	width: 				300px;
	height: 			auto;
	padding:			4px;
	background-color:	#fff;}
#flow .point::before {
	content: 			url('../img/pr-point.png');
	display: 			block;}
.flowtel {
	color: 				#000!important;}
.flowdiv {
	margin: 			12px 0 0 18px!important;}
.flowdiv div {
	margin: 			20px 0!important;}
#faq .effectdt {
	float:				none;
	color:				#438a70;
	font-weight:		bold;
	border-bottom:		medium dotted #ccc;}
#faq .effectdd {
	margin:				18px 0 24px 18px;}
#faq .effectdd p {
	margin-top:			12px;}
#chiro img {
	border:				thin solid #ccc;}
#chiro p {
	margin-bottom:		18px;}
#chiro dt {
	float:				none;
	margin-bottom:		18px;
	font-weight:		bold;
	color:				#438a70;}
#chiro dd {
	margin-bottom:		18px;}
#chiro .quote {
	background:			url(../img/quote.gif) no-repeat;
	padding-left:		60px;}
#chiro ul {
	margin-left:		24px;
	margin-bottom:		18px;}
#chiro span {
	font-weight:		bold;}

@media screen and (min-width:769px) {
	#sitemap dl {
		margin-left:	220px;
		height:			260px;}
	#sitemap .smallimg-dt {
		margin:			-3px;}
	#for dl {
		width:			49%;
		height:			120px;}
	#for .parts {
		margin-top:		18px;}
	#for dl img {
		margin:			10px;}
	#for .flat {
		width:			98%;
		padding:		0 7px;}
	#for .effect-r {
		float:			right;}
	#for .symptom {
		height:			180px;}
	#for .symp-a {
		margin-left:	20%;
		float:			left;}
	#for .symp-b {
		margin-left:	50%;}
	#flow span {
		color:			#f00;}
	#chiro img {
		float:			right;
		padding:		4px;}
}
@media screen and (min-width:641px) and (max-width:768px) {
	#sitemap dl {
		margin-left:	220px;
		height:			336px;}
	#for dl {
		width:			48%;
		height:			160px;}
	#for dd {
		margin-right:	4px;}
	#for dl img {
		margin:			16px;}
	#for .flat {
		width:			98%;
		padding:		0 2px;}
	#for .effect-r {
		float:			right;}
	#for .symptom {
		height:			180px;}
	#for .symp-a {
		margin-left:	10%;
		float:			left;}
	#for .symp-b {
		margin-left:	52%;}
	#flow article {
		flex-direction: column-reverse;}
	#flow .flowimg {
		width:			100%;}
	.FlowImgDiv {
		width: 			90%;}
	.flowdiv {
		margin: 		12px 18px 0 18px!important;}
	#chiro img {
		float:			right;
		padding:		4px;}
}
@media screen and (max-width:640px) {
	#sitemap dl {
		height:			290px;}
	.appli img {
		width:			96%;}
	#for dl {
		height:			150px;}
	#for dd {
		margin-right:	6px;}
	#for dl img {
		margin:			20px 12px;}
	#for .flat {
		height:			180px;}
	#for .symp-a {
		margin-left:	10%;}
	#for .symp-b {
		margin-left:	10%;}
	#flow article {
		flex-direction: column-reverse;}
	#flow .flowimg {
		width:			100%;}
	.FlowImgDiv {
		width: 			90%;}
	.flowdiv {
		margin: 		12px 18px 0 18px!important;}
	#chiro img {
		width:			100%;}
	#chiro .DDP {
		float:			right;
		padding:		4px;
		width:			170px;
		border:			thin solid #ccc;}
	#chiro p {
		margin-top:		8px;}
}

/* font color */

.redfont {color:#FE0004;}
.greenfont {color:#438a70;}
.bluefont {color:blue;}
.strong {font-weight:bold;}

/** information PDF **/

#information-PDF img {
	width: 				100%;}

@media screen and (min-width:769px) {
	#information-PDF {
		text-align: 	center;}
	#information-PDF img {
		width: 			80%;}
}