@charset "utf-8";
body {
/*	font-family: Jun 501, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;*/
	font-size: 1.8rem;
	color: rgba(68, 68, 68, 1);
	background: rgba(249, 249, 239, 1) url(../img/common/headline.png) repeat-x;
	transform: none !important;
}

* { padding: 0; margin: 0; box-sizing: border-box; }
img { vertical-align: bottom; }
a { text-decoration: none; }
	#newsContentBox a, 
	.telBox a, 
	#newsBox a {
		padding-bottom: 0.25em;
		border-bottom: 2px dotted;
	}
	a img { border: none; }
li { list-style: none; }
	.myUl { padding-left: 2em; }
		.myUl li {
			position: relative;
		}
		.myUl li::before {
			content: '●';
			position: absolute;
			top: 0;
			left: -2em;
			font-size: 0.5em;
			color: rgba(128, 122, 88, 1);
		}
	.otherListBox::after {
		content: 'など';
		text-align: right;
		width: 100%;
	}
	.cautionUl li {
		margin-left: 1em;
		text-indent: -1em;
	}
.nextContent, 
p { margin-bottom: 1em; }
strong { color: rgba(255, 142, 54, 1); }

section { margin-bottom: 2em; }

.pcHide { display: none; }
.spHide { display: block; }
#drawerBox { display: none; }

.spTable::after, 
#mainContentsBox::after, 
.clearBox::after {
	content: "";
	clear: both;
	height: 0;
	display: block;
	visibility: hidden;
}

.largerText { font-size: 150%; }
.middleText { font-size: 100%; }
.smallerText { font-size: 86%; line-height: 150%; }
.smallText { font-size: 1.2rem; line-height: 150%; }

.initBox {
	width: 90vw;
	margin: 0 auto;
}

.centerText { text-align: center; }
.leftText { text-align: left; }
.rightText { text-align: right; }

h2 {
	font-size: 3rem;
	color: rgba(0, 155, 19, 1);
	padding-bottom: 1em;
	background: url(../img/common/h2line.png) repeat-x 50% 100%;
	margin-bottom: 1em;
	display: inline-block;
}
@media only screen and (max-width: 780px) {
	h2 {
		font-size: 2.4rem;
	}
}
h2.rightImgH2 { margin-left: 25%; }
h4 {
	font-size: 2rem;
	color: rgba(53, 120, 76, 1);
	padding-bottom: 0.5em;
	border-bottom: 2px dotted rgba(53, 120, 76, 1);
	margin-bottom: 1em;
	text-align: left;
}
dt.titleDt {
	color: rgba(53, 120, 76, 1);
	font-weight: bold;
}

.flexBox {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
	.flex4 > * { width: 23%; }
	.flex3 > * { width: 30%; }
	.flex2 > * { width: 48%; }

	.centerflex { justify-content: center; }

.maskBox {
	position: relative;
}
	.prevwmaskBox::after, 
	.maskBox::before, 
	.maskBox::after {
		content: '';
		width: 100vw;
		height: calc( ( 70vw / 17 ) - 1px );
		background-size: cover;
		position: absolute;
		left: 0;
		z-index: 10;
	}
	.maskBox::before { background-image: url(../img/common/mainimagebghead.png); top: 0; }
	.maskBox::after { background-image: url(../img/common/mainimagebgfoot2.png); bottom: 0; }
		#mainimageBox.maskBox::after { background-image: url(../img/common/mainimagebgfoot.png); bottom: 0; }
	.prevwmaskBox { padding-bottom: calc( ( 70vw / 17 ) + 2em ); position: relative; }
.wmaskBox { background: rgba(255, 255, 255, 1); position: relative; }
	.wmaskBox::before {
		content: '';
		width: 100vw;
		height: 2em;
		position: absolute;
		background: rgba(255, 255, 255, 1);
		top: -2em;
		left: 0;
	}
	.wmaskBox::after {
		content: '';
		width: 100vw;
		height: calc( 70vw / 17 );
		background-size: cover;
		position: absolute;
		left: 0;
		bottom: calc( -1 * 70vw / 17 );
		z-index: 10;
		background-image: url(../img/common/mainimagebghead_w.png);
	}
.innerItemBox {
	padding: calc( ( 70vw / 17 ) + 2em ) 0;
}

	.cautionBox {
		border-radius: 6px;
		padding: 1em;
		border: 2px dotted rgba(128, 122, 88, 1);
		background: rgba(255, 255, 255, 1);
	}
	.wBox {
		border-radius: 6px;
		padding: 1em;
		background: rgba(255, 255, 255, 1);
		box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
	}
.noteBox {
	background-image:
	linear-gradient(
		90deg,
		rgba(0, 0, 0, 0) 0%,
		rgba(0, 0, 0, 0) 50%,
		rgba(255, 255, 255, 1) 50%,
		rgba(255, 255, 255, 1) 50%
	),
	linear-gradient(
		180deg,
		rgba(0, 0, 0, 0) 0%,
		rgba(0, 0, 0, 0) 97%,
		rgba(0, 0, 0, 0.25) 97%,
		rgba(0, 0, 0, 0.25) 100%
	);
	background-size:
		4px 100%,
		100% 2.2em;
	line-height: 2.2;
}
	.noteBox p { margin-bottom: calc( 2.2em + 1px ); }
.googlemapBox {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
	.googlemapBox iframe,
	.googlemapBox object,
	.googlemapBox embed {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

a:hover {
	transition: 0.3s;
}
.myBtnBox {
	margin: 2em 0;
	text-align: center;
}
	.myBtn, 
	.myBtnBox a {
		padding: 1em 5em;
		color: rgba(0, 155, 19, 1);
		display: inline-block;
		border: 1px solid rgba(0, 155, 19, 1);
		text-decoration: none;
		border-radius: 1.5em;
		position: relative;
	}
		.myBtn:hover, 
		.myBtnBox a:hover { background: rgba(0, 155, 19, 1); color: rgba(255, 255, 255, 1); }
		.myBtn::before, 
		.myBtn::after, 
		.myBtnBox a::before, 
		.myBtnBox a::after {
			content: '';
			border-bottom: 1px solid rgba(0, 155, 19, 1);
			position: absolute;
			transition: 0.3s;
		}
		.myBtn::before, 
		.myBtnBox a::before {
			display: block;
			width: 0.5em;
			height: 0.5em;
			top: 1.5em;
			right: 1em;
			border-right: 1px solid rgba(0, 155, 19, 1);
			transform: rotate(-45deg);
		}
		.myBtn::after, 
		.myBtnBox a::after {
			width: 1.5em;
			top: 1.75em;
			right: 1em;
		}
		.myBtn:hover::before, 
		.myBtn:hover::after, 
		.myBtnBox a:hover::before, 
		.myBtnBox a:hover::after { right: 0.5em; border-color: rgba(255, 255, 255, 1); }
.btnBox {}
	.btnBox a {
		display: block;
		text-align: center;
		background: url(../img/common/btn_bg.jpg) 50% 50%;
		color: rgba(68, 68, 68, 1);
		border-radius: 6px;
		padding: 0.5em;
		text-decoration: none;
	}
		.btnBox a:hover { opacity: 0.5; }

.numberOl { counter-reset: mynumber;}
	.numberOl li {
		padding: 0 0 0.5em 2em;
		position: relative;
	}
		.numberOl li::before {
			counter-increment: mynumber;
			content: counter(mynumber);
			color: rgba(255, 255, 255, 1);
			background: rgba(129, 123, 87, 1);
			border-radius: 3px;
			padding: 0 0.5em;
			position: absolute;
			top: 0;
			left: 0;
		}

		
.rightImg {
	float: right;
	margin: 0 0 1em 1em;
}
.leftImg {
	float: left;
	margin: 0 1em 1em 0;
}
.fixImg { width: 100%; }
	.fixImg340 { max-width: 340px; }

/* ===================================
Layout
=================================== */
#headerBox { margin-top: 2em; }

	#headerBox .flexBox { flex-wrap: nowrap; }
	#headerBox .leftBox {
		flex-grow: 1;
		max-width: 350px;
	}
		#headerBox .leftBox h1 { margin-bottom: 0.5rem; }
		#headerBox .leftBox .smallText { font-size: 1.5rem; }

	#headerBox .rightBox { width: calc( 80vw - 350px ); }
		#pediatrichomecareBox .telBox, 
		#accessBox .telBox, 
		#headerBox .rightBox .telBox {
			flex-grow: 1;
			font-size: 2.4rem;
			font-weight: bold;
			color: rgba(0, 155, 19, 1);
			text-align: right;
		}
		#headerBox .rightBox .telBox { color: rgba(54, 121, 77, 1); }
		#footerBox .telBox {
			font-size: 2.4rem;
			color: rgba(68, 68, 68, 1);
		}
		#pediatrichomecareBox .telBox, 
		#accessBox .telBox { text-align: left; }
			#pediatrichomecareBox .telBox, 
			#accessBox .telBox, 
			#footerBox .telBox span:not(.telSubSpan), 
			#headerBox .rightBox .telBox span {
				display: inline-block;
				background: url(../img/common/icon_tel.png) no-repeat;
				padding: 0 1rem 0 2.7rem;
				background-size: 2.4rem;
				background-position: 0 0.5rem;
			}

			#pediatrichomecareBox .telBox {
				font-size: 4rem;
				padding-left: 5.8rem;
				background-size: 5.4rem;
			}
			#pediatrichomecareBox .telBox .telSubSpan {
				font-size: 1.4rem;
				color: rgba(68, 68, 68, 1);
			}
			#footerBox .telBox span:not(.telSubSpan) {
				background-image: url(../img/common/icon_tel_black.png);
			}
			#footerBox .telBox span.telSubSpan { font-size: 1.2rem; } 
		#headerBox .rightBox .telSubDl { position: relative; }
			#headerBox .rightBox .telSubDl dt {
				padding-top: 0.5rem;
				position: absolute;
				top: -1rem;
				left: 0.5rem;
			}
			#headerBox .rightBox .telSubDl dd { padding-top: 1rem; }

/*#headerBox .leftBox { width: 48%; }
#headerBox { margin-bottom: 1em; }
#headerBox .leftBox { flex-grow: 1; min-width: 300px; }
	#headerBox .leftBox a {
		text-indent: -2000em;
		font-size: 1.2rem;
		display: inline-block;
		width: 300px;
		height: calc( 300px * (77 / 414) );
		background: url(../img/common/logo.png) no-repeat;
		background-size: contain;
		margin: 3em 0 0.5em 0;
	}
		#headerBox .leftBox div strong {
			background: rgba(0, 155, 19, 1);
			color: rgba(255, 255, 255, 1);
			border-radius: 0.5rem;
			padding: 0 0.5rem;
			margin-left: 1em;
		}
#headerBox .rightBox {
	margin-top: 2.5em;
}
	.telBox {}
	.telBox a, 
	.telBox {
		font-size: 2.0rem;
		font-weight: bold;
		color: rgba(0, 155, 19, 1);
		background-repeat: no-repeat;
		background-size: 2.0rem;
		padding-left: 2.8rem;
	}
	.telBox a { text-decoration: none; background-image: url(../img/common/icon_tel.png); }
	#headerBox .rightBox .flexBox { flex-wrap: nowrap; }
	#headerBox .rightBox .telBox { background-image: url(../img/common/icon_tel.png); }
	#headerBox .rightBox .emergencyTelBox, 
	#footerBox .rightBox .emergencyTelBox {
		font-size: 1.2rem;
		font-weight: bold;
		text-align: center;
		background: rgba(227, 245, 193, 1);
		border-radius: 1.2rem;
	}
	#headerBox .rightBox .emergencyTelBox .spHide, 
	#footerBox .rightBox .emergencyTelBox .spHide, 
	#headerBox .rightBox .emergencyTelBox .pcHide, 
	#footerBox .rightBox .emergencyTelBox .pcHide { color: rgba(255, 142, 54, 1); }
	.telBox .spHide, 
	#headerBox .rightBox .emergencyTelBox .spHide, 
	#footerBox .rightBox .emergencyTelBox .spHide { display: inline-block; }
	#headerBox .rightBox .telSubDl {
		font-weight: bold;
		color: rgba(68, 68, 68, 0.5);
		flex-grow: 1;
	}
*/

#mainMenuBox {
	text-align: right;
/*	padding-top: 1em;*/
}
	#mainMenuBox ul li, 
	#footerMenuBox ul li {
		display: inline-block;
		margin-left: 1em;
		font-weight: bold;
	}
	#mainMenuBox ul li a { font-size: 1.6rem; }
	#mainMenuBox ul li:not(:last-child) a, 
	#footerMenuBox ul li a {		
		color: rgba(68, 68, 68, 1);
		padding-bottom: 0.25em;
		border-bottom: 2px dotted rgba(0, 155, 19, 1);
		text-decoration: none;
	}
	#mainMenuBox ul li:not(:last-child) a:hover, 
	#footerMenuBox ul li a:hover { color: rgba(255, 142, 54, 1); border-color: rgba(255, 142, 54, 1); }
	#headerReservation a, 
	#mainMenuBox li.reservation a, 
	#footerBox .rightBox .reservation a {
		color: rgba(255, 255, 255, 1);
		background: rgba(255, 142, 54, 1);
		text-decoration: none;
		padding: 0.25em 1em;
		border-radius: 6px;
		position: relative;
	}
	#headerReservation a, 
	#mainMenuBox .reservation a::after {
		content: '※内科予約はお電話ください';
		font-size: 1.1rem;
		position: absolute;
		left: -1.6rem;
		top: 3rem;
		width: 15rem;
		color: rgba(255, 142, 54, 1);
		z-index: 100;
	}
	#mainMenuBox p, 
	#footerBox .rightBox p {
		display: inline-block;
		color: rgba(255, 142, 54, 1);
		font-size: 1.3rem;
		text-align: right;
	}
/*#backToTopBtnBox { position: relative; }*/
/*
	#backToTopBtn {
		position: fixed;
		transform: translate3d(0, 0, 0);
		right:  1em;
		bottom: 1em;
		display: block;
		padding: 0.5em 1em;
		border: 1px solid rgba(0, 155, 19, 1);
		color: rgba(0, 155, 19, 1);
		background: rgba(255, 255, 255, 1);
		text-decoration: none;
		z-index: 1000;
	}
*/
#footerBox {
	background: url(../img/common/footer.png) no-repeat;
	background-size: 100vw;
	width: 100vw;
	min-height: calc( 323vw / 17 );
	padding-top: calc( 100vw / 17 );
	position: relative;
}
	#footerBox::before {
		content: '';
		background: url(../img/common/footer_car.png) no-repeat;
		background-size: contain;
		width: 4vw;
		height: 4vw;
		position: absolute;
		top: 2vw;
		left: 80vw;
		display: block;
		animation: moving 6s ease 0s infinite normal none running;
	}
/*	#internistclinicBody #footerBox::after,
	#physicalexaminationsBody #footerBox::after,  */
	#pediatricsBody #footerBox::after {
		content: '';
		position: absolute;
		top: calc( ( 70vw / 17 ) * -1 );
		left: 0;
		width: 100%;
		height: calc( 323vw / 17 );
		z-index: -1;
		background: rgba(255, 255, 255, 1);
	}
	@keyframes moving {
		0% { left: 80vw; opacity: 0; }
		20% { left: 80vw; opacity: 0; }
		45% { opacity: 100; }
		75% { opacity: 100; }
		100% { left: 20vw; opacity: 0; }
	}
	#footerMenuBox ul { margin-bottom: 1em; }
	#footerMenuBox ul li {
		font-size: 1.4rem;
		margin-right: 1em;
		margin-left: 0;
	}
	#footerBox ul li.reservation a::after {
		content: '※内科予約はお電話ください';
		position: absolute;
		bottom: -0.5em;
		right: -16rem;
		font-size: 1.2rem;
		font-weight: bold;
		color: rgba(255, 142, 54, 1);
	}
	#footerBox .rightBox .telBox { margin-top: 0.5em; }
	#footerBox .leftBox .smallText {
		font-size: 1.4rem;
		padding-top:0.3rem;
	}
	#footerBox .leftBox strong {
		background: rgba(54, 121, 77, 1);
		color: rgba(255, 255, 255, 1);
		border-radius: 1rem;
		padding: 0 0.8rem;
		margin-left: 1em;
		display: inline-block;
	}

	#footerBox .copyrightP {
		margin: 1em 0 0 0;
		color: rgba(0, 155, 19, 1);
		font-size: 1.2rem;
		font-weight: bold;
	}
	#backToTopBtnBox {
		width: 50px;
		height: 50px;
		position: fixed;
		right: 25px;
		bottom: 25px;
		background: rgba(72, 170, 1, 1);
		border-radius: 50%;
		opacity: 0.6;
		z-index: 1000;
	}
		#backToTopBtnBox a {
			display: block;
			width: 50px;
			height: 50px;
			text-decoration: none;
			text-indent: -2000em;
		}

	.pinkBox {
		padding: 1.5em;
		background: rgba(251, 233, 213);
		border-radius: 10vw;
		margin-bottom: 1em;
	}

	.timescheduleBox {
		background: rgba(255, 255, 255, 0.75);
		border-radius: 6px;
		box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
		padding: 0.75em;
		display: inline-block;
		position: relative;
	}
		.timescheduleBox::before {
			content: '';
			background: url(../img/common/timeschedulehead.png);
			width: 35px;
			height: 35px;
			position: absolute;
			top: -25px;
			left: calc( ( 100% - 35px ) / 2 );
			background-repeat: no-repeat;
		}
		.timescheduleBox table {
			width: 100%;
			border-collapse:  collapse;
			border: 1px solid rgba(204, 204, 204, 1);
		}
			.timescheduleBox table th, 
			.timescheduleBox table td {
				border: 1px solid rgba(204, 204, 204, 1);
			}
			.timescheduleBox table th {
				background: rgba(129, 123, 87, 1);
				color: rgba(255, 255, 255, 1);
				text-align: center;
				padding: 0.5em;
				width: 10%;
			}
			.timescheduleBox table th:first-child { width: 30%; }
			.timescheduleBox table td {
				background: rgba(255, 255, 255, 1);
				color: rgba(255, 142, 54, 1);
				text-align: center;
				font-weight: bold;
				line-height:1.2;
				padding: 0.2em 0;
			}
			.timescheduleBox table tr td:first-child { padding: 0.2em 0.5em; }
				.timescheduleBox table td span {
					font-size: 1.2rem;
					font-weight: normal;
					color: #444;
					display: block;
					text-align: center;
					line-height: 1;
				}
				  .timescheduleBox table td span.small{
					  font-size: 1.1rem;
					  line-height: 1.1;
				  }
			.timescheduleBox table td.setX { color: rgba(154, 154, 154, 1); }
		/*	.timescheduleBox table th:first-child, 
			.timescheduleBox table td:first-child { text-align: left; }*/
			.timescheduleBox table td:first-child { color: rgba(68, 68, 68, 1); }

			.timescheduleBox .smallText { margin: 1em 0 0 0; }
			.timescheduleBox table th:first-child .smallText, 
			.timescheduleBox table td:first-child .smallText { margin-top: 0; }

	.headThTable {
		width: 100%;
		border-collapse: collapse;
		border-spacing: 0;
		background: rgba(255, 255, 255, 1);
		border: 2px solid rgba(204, 204, 204, 1);
	}
		.headThTable thead th {
			padding: 0.5em 0;
			text-align: center;
			background: rgba(0, 155, 19, 1);
			color: rgba(255, 255, 255, 1);
		}
		.headThTable thead tr th:first-child { border-right: 1px solid rgba(204, 204, 204, 1); }
		.headThTable tbody td { text-align: center; }
		.headThTable tbody td:not(:last-child) { border-right: 1px solid rgba(204, 204, 204, 1); }
		.headThTable tbody tr:not(:last-child) td { border-bottom: 1px solid rgba(204, 204, 204, 1); }


	#pagenotfoundimageBox, 
	#pageimageBox {
		position: relative;
		height: calc( 377vw / 17 );
		background-size: cover;
		background-position: 50% 50%;
		background-image: url(../img/about/mainimage.jpg);
	}
	#pagenotfoundimageBox h1, 
	#pageimageBox h1 {
		display: inline-block;
		background: url(../img/common/pageheader.jpg) 50% 100%;
		color: rgba(255, 255, 255, 1);
		padding: 0.75em 2em;
		border-radius: 1.5em;
		margin-top: calc( ( ( 377vw / 17 ) - 2.5em ) / 2 );
		font-size: 3.5rem;
		letter-spacing: 0.1em;
	}
	#pagenotfoundimageBox, 
	#newsBody #pageimageBox, 
	#visitingclinicBody #pageimageBox, 
	#outpatienttreatmentBody #pageimageBox, 
	#pediatricsBody #pageimageBox, 
	#internistclinicBody #pageimageBox, 
	#aboutBody #pageimageBox { background-image: url(../img/about/mainimage.jpg); }

/* ===================================
Top
=================================== */
#pageimageBox, 
#mainimageBox {
/*	background: rgba(0, 0, 0, 0.1);*/
	margin-bottom: 2em;
}
	#mainimageBox .initBox {
		position: relative;
		height: calc( 800vw / 17 );
	}
		#mainimageBox .initBox .mainimageUl {}
			#mainimageBox .mainimageUl li {
				position: absolute;
				top: 0;
				left: 0;
				width: 100vw;
				height: calc( 800vw / 17 );
				background-position: 50% 50%;
				background-size: cover;

				animation-name: mainimageAnime;
				animation-duration: 15s;
				animation-iteration-count: infinite;
				opacity: 0;
			}
			#mainimageBox .mainimageUl li:nth-child(2) { animation-delay: 5s; }
			#mainimageBox .mainimageUl li:nth-child(3) { animation-delay: 10s; }
		/*	#mainimageBox .mainimageUl li:nth-child(4) { animation-delay: 15s; } */
			
			@keyframes mainimageAnime {
				0% { opacity: 0; }
				20% { opacity: 1; }
				30% { opacity: 1; }
				40% { opacity: 0; }
			}

		#mainimageBox .mainimageUl li div, 
		#mainimageBox h2 {
			position: absolute;
			/*
			-webkit-writing-mode: vertical-rl;
			-ms-writing-mode: tb-rl;
			writing-mode: vertical-rl;
			left: 210px;
			*/
			/*
			top: calc( 156px + 1.5rem );
			left: 10vw;
			*/
			bottom: 25rem;
			left: 5vw;
			font-size: 2.4rem;
			z-index: 200;
			padding-bottom: 0;
			background-image: none;
			margin-bottom: 0;
		}
		
/*		#mainimageBox .mainimageUl li:first-child div { top: 156px; } */
			#mainimageBox .mainimageUl li div span, 
			#mainimageBox h2 span {
				background: rgba(0, 155, 19, 1);
				color: rgba(255, 255, 255, 1);
			/*	padding: 0.5em 0.25em;*/
				padding: 0.5rem 2rem 1rem 2rem;
				border-radius: 6px;
			/*	letter-spacing: 0.4rem;*/
				display: inline-block;
				margin-bottom: 0.5rem;
			}
				#mainimageBox h2 span em {
					font-style: normal;
				/*	-webkit-text-combine-upright: all;
					-ms-text-combine-upright: all;
					text-combine-upright: all;*/
				}
			#mainimageBox h2 span.mainCopy2 {
			/*	margin: 1.5em 0.5em 0 0;*/
				margin-top: 0.5em;
			}

			#mainimageBox .mainimageUl li:nth-child(2) div span,
			#mainimageBox .mainimageUl li:nth-child(3) div span,
			#mainimageBox .mainimageUl li:nth-child(4) div span {
			/* 200414 削除	
				background: none;
				color: rgba(0, 155, 19, 1);
				font-size: 130%;
				text-shadow:0 0 5px #FFF;
			*/
			}
		
		#mainimageBox .timescheduleBox {
			position: absolute;
			bottom: 0;
			right: 0;
			z-index: 100;
		}

#guidanceBox {}
		#guidanceBox .pinkBox { margin-bottom: 3em; }
	#guidanceBox .flexBox li {
		background: rgba(255, 255, 255, 1);
		padding: 1em 1em 1em 1em;
		box-shadow: 2px 2px 2px rgba(128, 122, 88, 0.5);
		border-radius: 6px;
		background-position: 50% 1em;
		margin-bottom: 0.5em;
	}
	#guidanceBox .flexBox li img { width: 70%; max-width: 155px; }
		#guidanceBox .flexBox li h3 {
			color: rgba(129, 123, 87, 1);
			padding: 1em 0;
			font-size: 2.2rem;
		}

#firststepBox {
	background: rgba(242, 246, 251, 1) url(../img/home/appearance.jpg) no-repeat 100% 0;
	background-size: contain;
}
/*	#firststepBox .initBox { padding: calc( ( 70vw / 17 ) + 2em ) 0; }*/
		#firststepBox h3 {
			color: rgba(53, 120, 76, 1);
			font-size: 2rem;
			line-height: 150%;
			padding-bottom: 1em;
		}
		#firststepBox .leftText { width: 58%; }
		#firststepBox .cautionBox { margin-top: 2em; }
			#firststepBox .cautionBox h4 {
				color: rgba(128, 122, 88, 1);
				border-bottom: none;
				margin-bottom: 0;
			}
			#firststepBox .cautionBox h4::before {
				content: url(../img/common/icon_leaf.png);
				display: inline-block;
				vertical-align: middle;
			}
	.prevwmaskBox::after, 
	#firststepBox::after {
		background-image: url(../img/common/mainimagebgfoot_w.png);
		bottom: 0;
	}

#newsBox {}
	#newsBox .initBox {
		padding-left: 38%;
		background: url(../img/home/newsimage.png) no-repeat;
		background-size: contain;
		min-height: 250px;
	}
		#newsBox .initBox h2 { width: 100%; }
			#newsBox .initBox h2 a.myBtn {
				float: right;
				display: inline-block;
				font-size: 1.2rem;
				padding: 0.25em 3em 0.25em 1em;
				transition: 0.3s;
				border-bottom: none;
			}
			#newsBox .initBox a.pcHide { display: none; }
		#newsBox dl { padding-bottom: 0.5em; margin-bottom: 0.5em; }
		#newsBox dl:not(:first-child) { border-bottom: 1px solid rgba(0, 155, 19, 0.25); }
			#newsBox .flex2 dt { width: 12rem; color: rgba(128, 122, 88, 1); text-align: left; font-size: 1.6rem; }
			#newsBox .flex2 dd { flex-grow: 1; text-align: left; }
			#newsBox h2 { color: rgba(115, 206, 126, 1); }
			#newsBox .myBtn {
				background: rgba(115, 206, 126, 1);
				border-color: rgba(255, 255, 255, 1);
				color: rgba(255, 255, 255, 1);
			}
			#homeBody #newsBox .initBox h2, 
			#homeBody #newsBox .flex2 dt { background: rgba(255, 255, 255, 0.5); }
				#newsBox .myBtn::before, 
				#newsBox .myBtn::after { border-color: rgba(255, 255, 255, 1); }
			#newsBox .myBtn:hover { background: rgba(255, 142, 54, 1); }

/*#accessBox { padding: 4em 0; }*/
	#accessBox .leftBox { width: 40%; font-size: 1.4rem; line-height: 150%; }
		#accessBox .leftBox img { max-width: 370px; }
	#accessBox .rightBox { width: 58%; }

	#accessBox .headingDl {
		margin-top: 0.5em;
		line-height: 140%;
	}
		#accessBox .headingDl dt {
			border: 1px solid rgba(68, 68, 68, 1);
			border-radius: 3px;
			padding: 0 0.5em;
			width: 25%;
			text-align: center;
		}
		#accessBox .headingDl dd {
			width: 72%;
		}
		#accessBox h2 { padding-bottom: 0.5em; margin-bottom: 0.5em; }
		#accessBox .googlemapBox { padding-top: 100px; }
		#accessBox .telBox {
			background-position: 0 1em;
			padding-top: 1em;
			padding-bottom: 1em;
			display: block;
		}

#bannerBox li { margin: 0 0.25em; width: auto; display: inline-block; }
	#bannerBox li a {
		text-decoration: none;
		border: 1px solid rgba(66, 103, 178, 1);
		border-radius: 6px;
		padding: 0.5em 1em;
		line-height: 125%;
		background: rgba(255, 255, 255, 1);
		display: block;
		font-size: 1.4rem;
		color: rgba(66, 103, 178, 1);
	}
	#bannerBox li.facebook a { border-color: rgba(66, 103, 178, 1); color: rgba(66, 103, 178, 1); }
	#bannerBox li.instagram a { border-color: rgba(178, 66, 137, 1); color: rgba(178, 66, 137, 1); }
	#bannerBox li.higashikucarenetwork a { border-color: rgba(72, 170, 1, 1); color: rgba(72, 170, 1, 1); }
	#bannerBox li.blog a { border-color: rgba(136, 85, 41, 1); color: rgba(136, 85, 41, 1); }


/* ===================================
about
=================================== */
#greetingBox .initBox {
	background: rgba(255, 255, 255, 1);
	width: 60vw;
	max-width: 900px;
	padding: 2em;
	border-radius: 6px;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
	line-height: 200%;
}
/*	#greetingBox .initBox span { border-bottom: 1px dotted rgba(0, 0, 0, 0.5); }*/
#policyBox { background: rgba(255, 255, 255, 1); }
	#policyBox dt {
		background: rgba(227, 245, 192, 1);
		color: rgba(72, 170, 1, 1);
		padding: 0.5em;
		border-radius: 3px;
		margin-bottom: 0.5em;
	}
	#policyBox dd { font-size: 1.4rem; }

#staffBox {}
	#staffBox ul li:not(.dummy) {
		text-align: center;
		border-radius: 6px;
		margin-bottom: 1em;
		padding-bottom: 1em;
		background-color: rgba(255, 255, 255, 1);
		box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
		line-height: 125%;
	}
			#staffBox ul li .photo img {
				width: 65%;
				margin-bottom: 1em;
			}
		#staffBox ul li .belong { font-size: 1.4rem; display: inline-block; margin-right: 0.5rem; }
		#staffBox ul li .name { display: inline-block; }
		#staffBox ul li .sub { font-size: 1.2rem; color: rgba(0, 0, 0, 0.5); display: inline-block; }
		#staffBox ul li .sub2 { font-size: 1.2rem; color: rgba(0, 0, 0, 0.5); }
/*#staffBox { padding-top: 4em; }
	#staffBox dl dt {
		text-align: center;
		border-radius: 6px;
		margin-bottom: 1em;
		padding-bottom: 1em;
		background-color: rgba(255, 255, 255, 1);
		box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
		line-height: 125%;
	}
		#staffBox dl dt img {
			width: 65%;
			margin-bottom: 1em;
		}
		#staffBox dl dt span { color: rgba(0, 0, 0, 0.5); }
	#staffBox dl dd {
		text-align: left;
		font-size: 1.4rem;
		line-height: 125%;
		margin-bottom: 1em;
	}
*/
	#greetingBox p:not(:first-child){ margin-right: 30px; }
	#greetingBox .itoImageBox { position: relative; }
	#greetingBox .itoImageBox img {
		position: absolute;
		bottom: 0;
		right: -130px;
	}


/* ===================================
pediatrics
=================================== */
#pediatricoutpatientBox {}
	#palliativecareBox .rightImg, 
	#pediatrichomecareBox .leftImg, 
	#pediatricoutpatientBox .leftImg, 
	#pediatricoutpatientBox .rightImg {
		width: 25%;
		max-width: 300px;
	}
	#pediatricoutpatientBox .rightMBox { margin-right: calc( 25% + 1em ); }
/*#pediatrichomecareBox { padding: 4em 0; }*/
	#pediatricoutpatientBox .leftMBox, 
	#pediatrichomecareBox .leftMBox { margin-left: calc( 25% + 1em ); }
	#pediatrichomecareBox .wBox { display: inline-block; margin-bottom: 1em; padding-bottom: 0.5em; }


/* ===================================
pediatrics
=================================== */
#palliativecareBox .initBox {
/*	min-height: 464px;*/
}

/* ===================================
visitingclinic
=================================== */
#visitingclinicBody .numberOl dt.titleDt { color: rgba(129, 123, 87, 1); }
#visitingclinicBody .pageImageBox { justify-content: center; }
#visitingclinicBody .pageImageBox div { width: auto; }
	#visitingclinicBody .pageImageBox div:first-child { margin-right: 0.5em; }
	#visitingclinicBody #nutritionGuidanceBox .leftBox { width: calc( 70% - 2em ); }
	#visitingclinicBody #nutritionGuidanceBox .rightBox { width: 30%; }
	#visitingclinicBody #nutritionGuidanceBox .rightBox div { margin-bottom: 0.5em; }
	#visitingAreaBox .rightImg {
		width: 63%;
		max-width: 340px;
	}
	#visitingAreaBox .leftBox { width: 33%; }
	#visitingAreaBox .rightBox { width: 63%;}


/* ===================================
news
=================================== */
.myPagenation {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
	.myPagenation li {
		width: 3rem;
		margin: 0.5rem;
		border-radius: 5px;
		text-align: center;
		font-weight: bold;
	}
	.myPagenation li a {
		width: 3rem;
		height: 3rem;
		background: rgba(255, 255, 255, 1);
		color: rgba(0, 155, 19, 1);
		border: 1px solid rgba(0, 155, 19, 1);
		display: block;
		border-radius: 5px;
		text-decoration: none;
	}
		.myPagenation li a:hover {
			background: rgba(255, 142, 54, 1);
			border-color: rgba(255, 142, 54, 1);
			color: rgba(255, 255, 255, 1);
		}
	.myPagenation li.nowpage {
		background: rgba(0, 155, 19, 1);
		color: rgba(255, 255, 255, 1);
	}
	#newsContentBox #newsBox { margin: 4em 0; }
	#newsContentBox #newsBox dl:first-child { border-bottom: 1px solid rgba(0, 155, 19, 0.25); }

	#newsContentBox ul li {
		list-style: disc;
		margin-left: 2em;
	}
	#newsContentBox ol li {
		list-style: decimal;
		margin-left: 2em;
	}
	#newsContentBox blockquote { margin: 1em 0 1em 2em; }

@media only screen and (max-width: 780px) {
	body { font-size: 1.6rem; }
	#greetingBox .initBox, 
	.initBox { width: 90vw; }
	#drawerBox, 
	.pcHide { display: block; }
	#footerBox .telBox span.spHide, 
	#newsBox .initBox h2 a.myBtn, 
	#headerBox .rightBox .telBox span, 
	#headerBox .rightBox .emergencyTelBox .spHide, 
	#footerBox .rightBox .emergencyTelBox .spHide, 
	.spHide { display: none; }
	#newsBox .initBox a.pcHide, 
	.telBox .pcHide, 
	#headerBox .rightBox .emergencyTelBox .pcHide, 
	#footerBox .rightBox .emergencyTelBox .pcHide { display: inline-block; }

	.centerflex { justify-content: space-between; }
	#visitingclinicBody #nutritionGuidanceBox .leftBox, 
	#visitingclinicBody #nutritionGuidanceBox .rightBox, 
	#firststepBox .leftText, 
	#accessBox .leftBox, 
	#accessBox .rightBox, 
	.flex3 > *, 
	.flex2 > * {
		width: 100%;
		display: block;
	}
	.flex4 > * { width: 48%; }
	.spLeftText { text-align: left; }

	h2.rightImgH2 { margin-left: 0; }

	.telBox a { color: rgba(0, 155, 19, 1); }

	#drawerBox {
		position: absolute;
		top: 1.5em;
		right: 2.5vw;
	}
	#headerBox { margin-top: 1em; }
	#headerBox .leftBox { width: 50%; flex-grow: 0; }
	/*
		#headerBox .leftBox a {
			width: 40vw;
			height: calc( 40vw * (77 / 414) );
			margin-top: 1.5em;
		}
		#headerBox .rightBox {
			margin-top: 1.5em;
		}
	*/
		#headerBox .rightBox .telBox { position: relative; text-align: left; }
		#headerBox .rightBox .telBox a {
			text-indent: -2000em;
			width: 30px;
			height: 26px;
			background: url(../img/common/icon_tel.png) 50% 50% no-repeat;
			background-size: contain;
			display: block;
			position: absolute;
			top: 10px;
		/*	right: calc( 2.5vw + 35px );*/
			right: 35px;
			border-bottom: none;
		}
			#headerBox .rightBox .telBox a::after {
				text-indent: 0;
				position: absolute;
				content: url(../img/common/text_tel.png);
			/*
				content: 'TEL';
				font-size: 1.2rem;
				left: calc( 30px - 2.7rem );
				bottom: -2.4rem;
				color: rgba(0, 155, 19, 1);
			*/
				left: 0;
				bottom: -20px;
			}
			#headerReservation a {
				position: absolute;
				width: auto;
				top: 3px;
			/*	left: calc( ( 5vw + 105px ) * -1 );*/
				left: calc( ( 8rem + 50px ) * -1 );
				font-size: 1.2rem;
				padding: 0.5rem 1rem;
				color: rgba(255, 255, 255, 1);
				font-weight: bold;
			}
			#headerReservation a::before, 
			#headerReservation a::after {
				white-space: pre;
				position: absolute;
				left: 0;
				font-size: 1.0rem;
				width: 15rem;
				line-height: 100%;
			}
			#headerReservation a::before {
				content: '※内科予約はお電話ください';
				color: rgba(255, 142, 54, 1);
				top: 4rem;
			}
			/*
			#headerReservation a::after {
				content: '※電話受付 (月～金)8:35～18:00\A　　　　　 (土)8:35～12:30';
				color: rgba(68, 68, 68, 1);
				top: 5.1rem;
			}
			*/

	#footerBox {
		background-image: url(../img/common/footer_sp.png);
		background-size: cover;
		background-position: 50% 0;
		height: auto;
		text-align: center;
	}
		#footerBox::before { content: none; }
		#footerBox .copyrightP { margin-bottom: 0; padding-bottom: 0; }
		#footerBox .telSubSpan { display: block; }
		#footerMenuBox ul {
			margin-top: 3em;
			/*
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			*/
		}
			#footerMenuBox ul li {
			/*	width: 23%;*/
				margin-right: 0.5em;
			}

		#footerBox .rightBox .reservation a { margin-bottom: 2em; display: inline-block; }
		#footerBox .rightBox .reservation a::after {
			bottom: -2.5rem;
			right: -4rem;
			width: 20rem;
			display:block;
		}
	#pagenotfoundimageBox, #pageimageBox { height: calc( 377vw / 9 ); }
	#pagenotfoundimageBox h1, #pageimageBox h1 {
		font-size: 2.0rem;
		margin-top: calc( ( ( 377vw / 9 ) - 2em ) / 2 );
	}

/* [home]============================ */
	#mainimageBox h2 {
		font-size: 1.2rem;
		top: calc( ( 70vw / 17 ) + 1em );
	}
		#mainimageBox h2 span.mainCopy2 { margin-top: 0.5em; }
		#mainimageBox h2 span { letter-spacing: 0; }
		#mainimageBox .mainimageUl li:first-child div, 
		#mainimageBox .mainimageUl li div {
			top: auto;
			bottom: 2rem;
			left: 5vw;
			font-size: 1.2rem;
		}
		#mainimageBox .mainimageUl li div span, #mainimageBox h2 span { padding-bottom: 0.5rem; }
	#firststepBox {
		background-position: 100% 100%;
		padding-bottom: 5em;
	}
	#accessBox, 
	#newsBox { text-align: center; }
		#newsBox .initBox {
			padding-bottom: calc( 36400vw / 537 );
			padding-left: 0;
			background-position: 50% 100%;
		}
			#newsBox .initBox a.pcHide {
				font-size: 1.2rem;
				padding: 0.5em 3em;
				margin: 2em auto 0 auto;
			}
	#accessBox { padding-bottom: 0; }
		#accessBox :not(h2) { text-align: left; } 
		#accessBox .rightBox { margin-top: 1em; }

		#bannerBox li {
			margin: 0 0 0.5em 0;
			width: 48%;
		}


/* [about]============================ */
	#greetingBox p:not(:first-child){ margin-right: 0; }

	#pediatrichomecareBox .leftImg, 
	#palliativecareBox .rightImg, 
	#pediatricoutpatientBox .leftImg, 
	#pediatricoutpatientBox .rightImg {
		width: 50%;
	}
	#pediatricoutpatientBox .rightMBox { margin-right: 0; }


/* [visitingclinic]============================ */
	#visitingclinicBody .pageImageBox div:first-child { margin-right: 0; }
	#visitingclinicBody .pageImageBox img { margin-bottom: 0.5em; }

	#pediatricoutpatientBox .leftMBox, 
	#pediatrichomecareBox .leftMBox { margin-left: 0; }

	#visitingclinicBody #pediatrichomecareBox .telBox {
		font-size: 3rem;
		padding-left: calc( 4.5rem + 5px );
		background-size: 4.5rem;
	}
		#visitingclinicBody #pediatrichomecareBox .telBox .telSubSpan { font-size: 1.1rem; }


/* [news]============================ */
	#newsBody #newsContentBox img { width: 100%; height: auto; }



	
	.spTable { width: 100%; }

		.spTable td {
			text-align: center;
		}

		#outpatientscheduleBox .spTable tr, 
		#outpatientscheduleBox .spTable th, 
		#outpatientscheduleBox .spTable td {
			float: left;
			width: 100% !important;
			box-sizing: border-box;
			text-align: left;
		}
		#outpatientscheduleBox .timescheduleBox table td { text-align: left; padding: 0.5rem 2rem; }
		#outpatientscheduleBox .spTable thead { display: none; }
		#outpatientscheduleBox .spTable tbody td:first-child { background: rgba(129, 123, 87, 1); color: rgba(255, 255, 255, 1); }
		#outpatientscheduleBox .spTable tbody td::before { content: attr(data-name)' '; }
	#outpatientscheduleBox .timescheduleBox table td span {
		display: inline-block;
		padding-left: 1em;
		font-size: 1.6rem;
	}
	#outpatientscheduleBox .timescheduleBox table td span.smallText { color: rgba(255, 255, 255, 1); padding-left: 0; }
}

@media only screen and (min-width: 1200px) {
	.initBox { width: 1200px; }

	#newsBox .initBox { padding-left: 500px; }

	#mainMenuBox ul li a { font-size: 1.8rem; }
	
	#headerBox .leftBox { width: 350px; }
	#headerBox .rightBox { width: 850px; }
}

@media print {
	.animation { visibility: visible !important; }
}