@charset "utf-8";
/*
 * base css 
 * pc width 1000px fixed
 */

@media (max-width: 599px) {
} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {
} /* end 600-959 */

@media (min-width: 960px) {
} /* 960- */


/* ---------------------------------------- common */

p + p { margin: 1em 0 0; }

@media (max-width: 599px) {

	#wrapper {
		font-size: 1.3rem;
		line-height: 1.6;
	}
	.inner { margin: 0 4%; }
	article, .article { padding: 0 0 38px; }
	.inside + .inside { margin: 2em 0 0; }
	
	h2 {
		font-size: 1.8rem;
		line-height: 1.4;
		margin: 0 0 24px;
	}
	h3 {
		font-size: 1.5rem;
		line-height: 1.4;
		margin: 0 0 10px;
	}

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {

	#wrapper {
		font-size: 1.4rem;
		line-height: 1.7;
	}
	.inner { margin: 0 5%; }
	article, .article { padding: 0 0 56px; }
	.inside + .inside { margin: 2em 0 0; }
	
	h2 {
		font-size: 2.2rem;
		line-height: 1.4;
		margin: 0 0 35px;
	}
	h3 {
		font-size: 1.6rem;
		line-height: 1.4;
		margin: 0 0 12px;
	}

} /* end 600-959 */

@media (min-width: 960px) {

	#wrapper {
		font-size: 1.6rem;
		line-height: 1.8;
	}
	.inner {
		width: 1100px;
		margin: 0 auto;
	}
	article, .article { margin: 0 0 70px; }
	
	.inside + .inside { margin: 2em 0 0; }
	
	h2 {
		font-size: 2.4rem;
		line-height: 1.4;
		margin: 0 0 44px;
	}
	h3 {
		font-size: 1.8rem;
		line-height: 1.4;
		margin: 0 0 12px;
	}

} /* 960- */

/* ---------------------------------------- mobile-men */

@media (max-width: 599px) {

	#mobile-menu {
		display:none; /*19.1.24廃止*/
		background: #25B2c9;
		text-align: left;
		padding: 12px 4% 16px;
	}
	#mobile-menu a {
		display: inline-block;
		color: #fff;
		font-size: 4.4rem;
		line-height: 1;
		margin: 0 10px 0 0;
	}

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {

	#mobile-menu { display: none; }

} /* end 600-959 */

@media (min-width: 960px) {

	#mobile-menu { display: none; }
	#drawer-menu { display: none; }

} /* 960- */

/* ---------------------------------------- header */

header h1 + p a { display: inline-blcok; }
#headline a:hover { opacity: .5; }

@media (max-width: 599px) {

	header { text-align: center; }
	header .inner { padding: 20px 0 16px; }
	header h1 { display: none; }
	header h1 + p img {
		width: 55%;
		height: auto;
	}
	#headline > p,
	#headline dd { display: none; }
	#headline dl dt ul {
		display: -webkit-box;
		display: -webkit-flexbox;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		webkit-flex-wrap: nowrap;
		-ms-flex-wrap: nowrap;
		flex-wrap: nowrap;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		-webkit-justify-content: center;
		justify-content: center;
	}
	#headline dl dt ul li:nth-child(n+1){
		margin: 0 0 0 16px;
	}
	#headline dl dt ul a {
		display: block;
		width: 60px;
		height: 60px;
		color: #fff;
		background: #25B2c9;
		text-align: center;
		line-height: 60px;
		-webkit-border-radius: 6px;
		border-radius: 6px;
	}
	#headline dl dt ul a img {
		-webkit-border-radius: 6px;
		border-radius: 6px;
	}

	/* globalnav */
	header .inner:not(.flexs) { display: none; }

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {

	header { border-top: 3px #25B2c9 solid; }
	header .inner { padding: 20px 0 16px; }
	header .inner.flexs > .inside { 
		margin: 0;
	}
	header h1 { display: none; }
	header h1 + p img {
		width: 80%;
		height: auto;
	}
	#headline {
		width: 48%;
		position: relative;
	}
	#headline > p,
	#headline dd { display: none; }
	#headline dl dt ul {
		display: -webkit-box;
		display: -webkit-flexbox;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		webkit-flex-wrap: nowrap;
		-ms-flex-wrap: nowrap;
		flex-wrap: nowrap;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		-webkit-justify-content: space-between;
		justify-content: space-between;
	}
	#headline dl dt ul li:nth-child(n+1){
		margin: 0 0 0 10px;
	}
	#headline dl dt ul a {
		display: block;
		width: 60px;
		height: 60px;
		color: #fff;
		background: #25B2c9;
		text-align: center;
		line-height: 60px;
		-webkit-border-radius: 6px;
		border-radius: 6px;
	}
	#headline dl dt ul a img {
		-webkit-border-radius: 6px;
		border-radius: 6px;
	}
	
	/* globalnav */
	#globalnav {
		display: table;
		table-layout: fixed;
		width: 100%;
		border-left: 1px #ccc solid;
	}
	#globalnav li {
		display: table-cell;
		border-right: 1px #ccc solid;
		vertical-align: middle;
		text-align: center;
	}
	#globalnav a {
		display: block;
		line-height: 1.4;
		padding: 0.5em 1em;
		position: relative;
	}
	#globalnav a:hover::after {
		font-family: 'FontAwesome';
		content: "\f0da";
		color: #5eafc7;
		position: absolute;
		right: .5em;
		top: 50%;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
	}

} /* end 600-959 */

@media (min-width: 960px) {

	header { border-top: 3px #25B2c9 solid; }
	header .inner { padding: 12px 0 20px; }
	header .inner.flexs > .inside { 
		margin: 0;
	}
	header h1 {
		font-size: 1.2rem;
		height: 62px;
	}
	#headline {
		width: 56%;/*48%*/
		position: relative;
	}
	#headline > p {
		font-size: 1.4rem;
		line-height: 1;
		padding: 1.5em 0;
		margin: 0 0 1em;
	}
	#headline > dl > dt ul { letter-spacing: -0.4em; }
	#headline > dl > dt ul li:not(#go-map) { 
		display: inline-block;
		letter-spacing: normal;
	}
	#headline > dl > dt ul li { margin: 0 10px 0 0; }
	#headline > dl > dt ul li:last-child { margin: 0; }
	#headline > dl > dt ul li:not(#go-map) a {
		display: block;
		width: 84px;
		height: 84px;
	}
	#headline > dl > dt ul li a img {
		-webkit-border-radius: 6px;
		border-radius: 6px;
	}
	#medical-check {
		display: block;
		width: 320px;
		height: 84px;
	}
	
	#go-map {
		letter-spacing: normal;
		position: absolute;
		top: 0;
		right: 0;
	}
	#go-map a {
		display: block;
		width: 48px;
		color: #fff;
		background: #2ea4be;
		font-size: 1.6rem;
		line-height: 1;
		text-align: center;
		padding: 1em 0;
		-webkit-border-radius: 50px;
		border-radius: 50px;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	#headline dd dl {
		display: table;
		width: 100%;
	}
	#headline dd dl dt,
	#headline dd dl dd {
		display: table-cell;
		font-size: 1.6rem;
		line-height: 1.5;
		vertical-align: top;
	}
	#headline dd dl dt {
		border-right: 1px #ccc solid;
		padding: 0 1em 0 0;
	}
	#headline dd dl dd { padding: 0 0 0 1em; }
	#headline dd .tel {
		font-size: 2.2rem;
		line-height: 1;
		margin: 0 0 .5em
	}
	#headline dd .tel i {
		color: #9e9e9e;
		margin: 0 .2em 0 0;
	}
	#headline dd .tel small { font-size: 1.6rem; }
	
	/* globalnav */
	#globalnav {
		display: table;
		table-layout: fixed;
		width: 100%;
		border-left: 1px #ccc solid;
	}
	#globalnav li {
		display: table-cell;
		border-right: 1px #ccc solid;
		text-align: center;
	}
	#globalnav a {
		display: block;
		line-height: 1;
		padding: 0.5em;
		position: relative;
	}
	#globalnav a:hover::after {
		font-family: 'FontAwesome';
		content: "\f0da";
		color: #5eafc7;
		position: absolute;
		right: 1.5em;
		top: 50%;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
	}

} /* 960- */

/* ---------------------------------------- visual */

#visual.under > div { position: relative; }
#visual.under h2 {
	background: rgba( 255, 255, 255, .8 );
	padding: 0.75em 2em;
	text-align: center;
	margin: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	-webkit-border-radius: 10px;
	border-radius: 10px;
}

@media (max-width: 599px) {

	#visual.home > div { height: 200px; }
	#visual.under .inner { margin: 0; }
	#visual.under > div { height: 160px; }
	#visual.under h2 { 
		width: 80%;
		font-size: 1.8rem;
	}

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {

	#visual.home > div { height: 320px; }
	#visual.under .inner { margin: 0; }
	#visual.under > div { height: 200px; }
	#visual.under h2 { font-size: 2.0rem; }

} /* end 600-959 */

@media (min-width: 960px) {

	#visual.home > div { height: 430px; }
	#visual.under { background: #e2f2e6; }
	#visual.under > div { height: 250px; }
	#visual.under h2 { font-size: 2.6rem; }

} /* 960- */

/* ---------------------------------------- breadcrumb, container, sidebar (underlayer) */

@media (max-width: 599px) {

	#breadcrumb,
	#container > #sidebar { display: none; }
	#container { padding: 40px 0 0; }

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {

	#container > #sidebar { display: none; }
	/* #container { padding: 0 0 60px; } */
	#breadcrumb {
		font-size: 1.3rem;
		padding: 20px 0 30px;
	}
	#breadcrumb li { display: inline-block; }
	#breadcrumb li:not(:last-child)::after {
		font-family: 'FontAwesome';
		content: "\f105";
		margin: 0 .5em 0 1em;
	}

} /* end 600-959 */

@media (min-width: 960px) {

	#breadcrumb {
		font-size: 1.3rem;
		padding: 20px 0 30px;
	}
	#breadcrumb li { display: inline-block; }
	#breadcrumb li:not(:last-child)::after {
		font-family: 'FontAwesome';
		content: "\f105";
		margin: 0 .5em 0 1em;
	}
	
	#container {
		display: -webkit-box;
		display: -webkit-flexbox;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: nowrap;
		-ms-flex-wrap: nowrap;
		flex-wrap: nowrap;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-flex-direction: row-reverse;
		-ms-flex-direction: row-reverse;
		flex-direction:row-reverse;
		/* padding: 0 0 70px; */
	}
	#container > main { width: 810px; }
	#container > #sidebar { width: 220px; }
	
	/* sidebar */
	#sidebar { padding: 0 0 50px; }
	#sidebar nav { margin: 0 0 10px; }
	#sidebar .health { background: #dff4f6; }
	#sidebar .diagnosis { background: #eaeffe; }
	#sidebar nav h3 { 
		color: #fff;
		font-size: 1.6rem;
		margin: 0;
	}
	#sidebar .health h3 { background: #52a6c6; }
	#sidebar .diagnosis h3 { background: #7475b3; }
	#sidebar nav:not(.immunization) h3,
	#sidebar nav > ul > li > a {
		display:block;
		line-height: 1.6;
		padding: 1em;
	}
	#sidebar .health > ul > li:nth-child(2){
		border-top: 1px #fff solid;
		border-bottom: 1px #fff solid;
	}
	#sidebar .health > ul > li > a { background: #9ee4eb; }
	#sidebar .diagnosis > ul > li > a { background: #a0a8db; }
	#sidebar nav ul.disc,
	#sidebar aside ul.disc {
		font-size: 1.4rem;
		padding: 1em;
	}
	#sidebar .health ul.disc { color: #52a6c6; }
	#sidebar .diagnosis ul.disc { color: #7475b3; }
	
	#sidebar .immunization a {
		display: block;
		color: #24969d;
		border: 2px #24969d solid;
		line-height: 1.6;
		padding: 1em;
	}
	
	#sidebar aside { background: #e2f2e6; }
	
	#sidebar nav > ul > li > a,
	#sidebar .immunization a {
		position: relative;
	}
	#sidebar nav > ul > li > a::after,
	#sidebar .immunization a::after {
		font-family: 'FontAwesome';
		content: "\f0da";
		position: absolute;
		top: 50%;
		right: 1em;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
	}
	#sidebar .health > ul > li > a::after { color: #52a6c6; }
	#sidebar .diagnosis > ul > li > a::after { color: #7475b3; }
	#sidebar a:hover { opacity: .5; }

} /* 960- */

/* ---------------------------------------- footline */

@media (max-width: 599px) {

	#footline {
		background: #e2f2e6;
		text-align: center;
		padding: 10px 0;
	}
	#footline .inside { display: none; }
	#footline a {
		display: inline-block;
		background: #fff;
		font-size: 1.4rem;
		padding: .5em 3em;
		-webkit-border-radius: 40px;
		border-radius: 40px;
	}
	#footline a i {
		font-size: 2.0rem;
		color: #9e9e9e;
		margin: 0 .5em 0 0;
	}

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {

	#footline .is_mobile { display: none; }
	#footline {
		background: #e2f2e6;
		padding: 40px 0;
	}
	#footline .inside { margin: 0; }
	#footline h3 { 
		font-weight: bold;
		font-size: 1.6rem;
	}
	#footline a::before {
		font-family: 'FontAwesome';
		content: "\f0da";
		color: #9e9e9e;
		margin: 0 .5em 0 0;
	}

} /* end 600-959 */

@media (min-width: 960px) {

	#footline .is_mobile { display: none; }
	#footline {
		background: #e2f2e6;
		padding: 40px 0;
	}
	#footline .inside { margin: 0; }
	#footline h3 { 
		font-weight: bold;
		font-size: 1.6rem;
	}
	#footline a::before {
		font-family: 'FontAwesome';
		content: "\f0da";
		color: #9e9e9e;
		margin: 0 .5em 0 0;
	}

} /* 960- */

/* ---------------------------------------- footer */

footer .tel i {
	color: #9e9e9e;
	margin: 0 .2em 0 0;
}

@media (max-width: 599px) {

	footer {
		background: #fff;
		padding: 30px 0;
	}
	footer .inside.flexs { text-align: center; }
	footer .inside.flexs > div:first-child { 
		text-align: center; 
		margin: 0 0 1.5em;
	}
	footer .inside.flexs > div:first-child img {
		width: 50%;
		height: auto;
	}
	
	footer .inside.flexs .tel {
		display: inline-block;
		font-size: 1.8rem;
		padding: 0 .5em 0 0;
	}
	
	footer .inside.flexs > div:last-child ul + p {
		margin: 1em 0 0;
	}
	footer .inside.flexs > div:last-child ul + p span {
		display: inline-block;
		color: #fff;
		background: #998878;
		line-height: 1;
		padding: 4px 1em;
		-webkit-border-radius: 6px;
		border-radius: 6px;
	}
	
	footer .inside.directions br { display: none; }
	footer .inside.directions p span { 
		display: block;
		text-align: center; 
		font-size: 1.3rem;
		line-height: 2.4;
	}
	footer .inside.directions p span i {
		display: block;
		color: #fff;
		background: #8e8e8e;
		line-height: 1;
		padding: 6px 1em;
		margin: 0 .5em 0 0;
		-webkit-border-radius: 6px;
		border-radius: 6px;
	}

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {

	footer {
		background: #fff;
		padding: 30px 0;
	}
	footer .inside.flexs { display: block; }
	
	footer .inside.flexs > div:first-child { 
		text-align: center; 
		margin: 0 0 1.5em;
	}
	footer .inside.flexs > div:first-child img {
		width: 30%;
		height: auto;
	}

	footer .inside.flexs > div:last-child ul { 
		display: table;
		font-size: 1.6rem;
		line-height: 1.4;
		margin: 0 auto 10px;
	}
	footer .inside.flexs > div:last-child ul li { 
		display: table-cell;
		font-size: 1.6rem;
		line-height: 1.4;
	}
	footer .inside.flexs .tel {
		display: block;
		font-size: 2.0rem;
		padding: 0 1.5em 0 0;
	}
	footer .inside.flexs > div:last-child ul + p {
		font-size: 1.4rem;
		text-align: center; 
	}
	footer .inside.flexs > div:last-child ul + p span {
		display: inline-block;
		color: #fff;
		background: #998878;
		line-height: 1;
		padding: 4px 1em;
		-webkit-border-radius: 6px;
		border-radius: 6px;
	}
	

	footer .inside.directions p { 
		text-align: left; 
		font-size: 1.4rem;
		line-height: 2.2;
	}
	footer .inside.directions p span { 	white-space: nowrap; }
	
	footer .inside.directions p span i {
		display: inline-block;
		color: #fff;text-align: left; 
		background: #8e8e8e;
		line-height: 1;
		padding: 4px 1em;
		margin: 0 .5em 0 1em;
		-webkit-border-radius: 6px;
		border-radius: 6px;
	}


} /* end 600-959 */

@media (min-width: 960px) {

	footer {
		background: #fff;
		padding: 40px 0;
	}
	footer .inside.flexs > div:first-child {
		margin: 0 60px 0 0;
	}
	
	footer .inside.flexs > div:last-child ul { 
		display: table;
		width: 100%;
		font-size: 1.6rem;
		line-height: 1.4;
		margin: 0 0 10px;
	}
	footer .inside.flexs > div:last-child ul li { 
		display: table-cell;
		font-size: 1.6rem;
		line-height: 1.4;
	}
	footer .inside.flexs .tel {
		display: block;
		font-size: 2.0rem;
		padding: 0 1.5em 0 0;
	}
	footer .inside.flexs > div:last-child ul + p {
		font-size: 1.4rem;
	}
	footer .inside.flexs > div:last-child ul + p span {
		display: inline-block;
		color: #fff;
		background: #998878;
		line-height: 1;
		padding: 4px 1em;
		-webkit-border-radius: 6px;
		border-radius: 6px;
	}
	
	footer .inside.directions { text-align: center; }
	footer .inside.directions p { 
		display: inline-block;
		text-align: left; 
		font-size: 1.4rem;
		line-height: 2.2;
	}
	footer .inside.directions p span i {
		display: inline-block;
		color: #fff;text-align: left; 
		background: #8e8e8e;
		line-height: 1;
		padding: 4px 1em;
		margin: 0 .5em 0 1em;
		-webkit-border-radius: 6px;
		border-radius: 6px;
	}

} /* 960- */

/* ---------------------------------------- copyright */

#copyright { 
	color: #fff;
	background: #25B2c9;
	line-height: 1;
	text-align: center;
	padding: 1.75em;
}

@media (max-width: 599px) {

	#copyright { font-size: 1.1rem; }

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {

	#copyright { font-size: 1.2rem; }

} /* end 600-959 */

@media (min-width: 960px) {

	#copyright { font-size: 1.3rem; }

} /* 960- */
