@charset "utf-8";

html, body { margin: 0; padding: 0; font-family: 'Noto Sans JP', "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif"; }
@media only screen and (max-width: 768px){
	html, body { font-size: 16px; }
}
@media print, screen and (min-width: 769px){
	html, body { font-size: 18px; }
}

/* inner */
@media only screen and (max-width: 768px){
	.inner { padding-right: 20px; padding-left: 20px; }
}
@media print, screen and (min-width: 769px){
	.inner { margin: 0 auto; width: 90%; }
	section#section07 .inner { width: 50%; }
}

/* print */
@media print {}

/* header & footer */
header { padding: 1rem 0; background: rgba(93,193,207,1.0); }
header h1 { float: left; width: 48%; margin: 0; padding: 0; font-size: 1rem; line-height: 1.4; }
header nav { float: right; width: 48%; text-align: right; }
header nav ul,
header nav ul li { list-style: none; margin: 0; padding: 0; line-height: 1; float: right; margin-left: 0.8rem; }
header nav ul li,
header nav ul li a i { color: #fff; }
footer { color: #fff; background: rgba(93,193,207,1.0); }
footer #footer { padding: 3rem 0; }
footer a { color: #fff; }
footer #copyright { margin: 0; padding: 1rem; text-align: center; background: #1E8C9B; }
.siteLogo { margin: 0; padding: 0; font-family: 'Noto Serif JP', serif; }
.telNumber { margin: 0; padding: 0; font-size: 1.8rem; line-height: 1; }
footer .telNumber { margin-top: 0.5rem; }
footer .officeHour { margin: 1rem 0 0; }
@media only screen and (max-width: 768px){
	header { position: fixed; top: 0; left: 0; z-index: 9999; width: 100%; }
	header h1 { padding-top: 0.5rem; }
	header nav { padding-top: 0.2rem; }
	header nav ul li.spOnly i { font-size: 3rem; }
	footer { text-align: center; }
	footer .officeHour { display: table; margin-right: auto; margin-left: auto; text-align: left; }
}
@media print, screen and (min-width: 769px){
	header nav { padding-top: 0.8rem; }
	footer #footer > .inner > .clearfix > div { float: left; }
	footer #footer > .inner > .clearfix > div + p.pcOnly { float: right; margin: 0; padding: 0; font-size: 3rem; }
}

/* main */
h2 { margin: 0 0 1rem; padding: 0; font-size: 2.3rem; line-height: 1; text-align: center; font-weight: normal; font-family: 'Noto Serif JP', serif; }
p.titleEng { margin: 0.5rem 0 3rem; padding: 0; font-size: 1rem; line-height: 1; text-align: center; }
section#section01 { color: #fff; text-align: center; text-shadow: 1px 1px 2px #000, 0 0 1em #000, 0 0 0.2em #000; background-image: url("../images/bg_section01.jpg"); }
section#section05 .dentistWrap .dentistPhoto { text-align: center; font-family: 'Noto Serif JP', serif; }
section#section05 .dentistWrap .dentistPhoto strong { font-size: 1.5rem; font-weight: normal; }
section#section05 .dentistDescription { font-size: 1rem; }
section#section05 h3 { margin: 0; padding: 0; font-size: 1.1rem; font-weight: normal; }
.sectionBackColor { padding: 8rem 0;  background: #F0F0F0; }
.innerArea { padding: 5rem 2rem; color: #fff; text-align: center; text-shadow: 1px 1px 10px #1E8C9B; background: rgba(93,193,207,0.9); }
.innerArea strong { display: inline-block; margin-bottom: 1rem; color: red; font-size: 1.3rem; font-weight: normal; }
.innerArea dl { margin: 0; padding: 0; text-align: left; }
.innerArea dl dt { margin: 0; padding: 0; color: yellow; font-size: 1.2rem; }
.innerArea dl dd { margin: 0; padding: 0 0 2rem; }
table.tableStyle01 { margin: 0 0 2rem; }
table.tableStyle01 th { padding-right: 1rem; text-align: left; vertical-align: top; white-space: nowrap; font-weight: normal; }
table.tableStyle01 td { text-align: left; vertical-align: top; }
table.tableStyle02 { margin-right: auto; margin-left: auto; }
table.tableStyle02 th,
table.tableStyle02 td { padding-bottom: 1rem; }
#timeList table { width: 100%; border-top: 1px solid #000; border-left: 1px solid #000; border-collapse: collapse; }
#timeList table thead tr th { white-space: nowrap; }
#timeList table th,
#timeList table td { padding: 1rem 5px; font-weight: normal; text-align: center; border-right: 1px solid #000; border-bottom: 1px solid #000; border-collapse: collapse; }
.photoGallery ul { list-style: none; margin: 0 0 0 -2%; padding: 0; }
.photoGallery ul li { float: left; margin: 0 0 2% 2%; padding: 0; }
.photoGallery ul li { width: 23%; }
@media only screen and (max-width: 768px){
	section#section01 { padding: 15rem 0 8rem; }
	.sectionBack { background-size: cover; background-position: 50%; background-repeat: no-repeat; }
	p.sectionImage { position: relative; z-index: 0; margin: 0; padding: 0; }
	p.sectionImage img { width: 100%; height: auto; }
	.innerWrap { margin-bottom: 3rem; }
	.innerArea { position: relative; z-index: 1; margin-top: -6rem; }
	section#section05 .dentistWrap .dentistDescription { display: table; margin-right: auto; margin-left: auto; }
	#timeList table tr th:last-child,
	#timeList table tr td:last-child { display: none; }
	#timeList table thead tr th { width: 10%; }
	#timeList table thead tr th:first-child { width: 40%; }
	#timeList table + p { color: red; }
}
@media print, screen and (min-width: 769px){
	section#section01 { padding: 30rem 0; }
	section#section02 { background-image: url("../images/bg_section02.jpg"); }
	section#section03 { background-image: url("../images/bg_section03.jpg"); }
	section#section04 { background-image: url("../images/bg_section04.jpg"); }
	section#section06 { background-image: url("../images/bg_section06.jpg"); }
	section#section05 .dentistWrap { margin: 1rem auto 0; width: 800px; }
	section#section05 .dentistWrap .dentistPhoto { float: left; width: 320px; }
	section#section05 .dentistWrap .dentistDescription { float: right; padding: 1rem 0 0 2rem; width: calc(800px - 320px - 2rem); font-size: 0.95rem; }
	.sectionBack { padding: 12rem 0; }
	.innerWrap { width: 60%; }
	.innerWrap.innerRight { float: right; }
	.innerWrap.innerLeft{ float: left; }
	.sectionBack { background-size: cover; background-position: center center; background-repeat: no-repeat; }
}

/* text */
.fontLarge01 { font-size: 1.3rem; }
.fontLarge02 { font-size: 1.5rem; }
.fontMincho { font-family: 'Noto Serif JP', serif; }

/* image */
img.imageMax { max-width: 100% !important; height: auto !important; }
@media only screen and (max-width: 768px){}
@media print, screen and (min-width: 769px){}

/* layout */
.clearfix { zoom: 1; overflow: hidden; }
.clearfix:after { content: ""; display: block; clear: both; }
.margin00 { margin: 0; }
.nowrap { display: inline-block; }
.center { text-align: center; }
@media only screen and (max-width: 768px){
	.pcOnly { display: none; }
	.psCenter { text-align: center; }
}
@media print, screen and (min-width: 769px){
	.spOnly { display: none; }
	.pcCenter { text-align: center; }
}
