@charset "utf-8";


/* ---- reset ---- */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, hr,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
	margin: 0;
}

body {
	-webkit-text-size-adjust: 100%; /* for iOS, Android */
}

li {
	list-style: none;
}

a, button {
	-webkit-tap-highlight-color: transparent; /* for iOS, Android */
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: top;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

caption, th {
	text-align: left;
}

button {
	padding: 0;
	border-style: none;
	border-radius: 0;
	background-color: transparent;
	outline: none;
	cursor: pointer;
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
	line-height: 1;
}

input, select, textarea {
	padding: 0;
	border-style: none;
	border-radius: 0;
	background-color: transparent;
	outline: none;
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
	font-family: inherit;
	line-height: 1;
}

*, *::before, *::after {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}


/* ---- font ---- */

html {
	font-size: 62.5%;
}

body {
	font-family: "Helvetica Neue", Arial, "Hiragino kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", Meiryo, sans-serif;
	font-size: 1.6rem;
	font-weight: normal;
	line-height: 1;
}

.serif {
	font-family: "Yu Mincho", "Hiragino Mincho ProN", HGS明朝E, Meiryo, serif;
}

@media screen\0 {
	.serif {
		font-family: HGS明朝E, serif;
	}
}

button, input, select, textarea {
	font-family: inherit;
	font-size: 100%;
}

.ast {
	font-family: sans-serif;
}


/* ---- basics ---- */

body {
	background-color: #f6f5f1;
	background-image: url(../img/bg.jpg);
	color: #333;
}

a { text-decoration: underline; color: #007cff; }
a:link { color: #007cff; }
a:visited { color: #007cff; }
a:hover { text-decoration: none; color: #007cff; }
a:active { text-decoration: none; color: #007cff; }

strong, em, b {
	font-weight: bold;
	font-style: normal;
}

@media screen and (min-width: 480px) {
	.pc-hidden { display: none; }
}

@media screen and (max-width: 479px) {
	.sp-hidden { display: none; }
}


/* ---- container ---- */

body {
	padding: 40px 40px 60px;
}

.global-container {
	max-width: 960px;
	margin: 0 auto;
}

@media screen and (max-width: 639px) {
	
	body {
		padding: 6vw 5vw 9vw;
	}
	
}


/* ---- notice ---- */

.notice {
	margin-top: 60px;
	padding: 20px;
	border: 4px solid #dc2801;
	border-radius: 3px;
	background-color: #fff;
	line-height: 1.8;
}

.notice li {
	position: relative;
	padding-left: 1em;
}

.notice li::before {
	content: "●";
	position: absolute;
	left: 0;
	top: 0;
	color: #333;
}

@media screen and (max-width: 639px) {
	
	.notice {
		margin-top: 8vw;
		padding: 5vw;
		border-width: 2px;
		line-height: 1.6;
	}
	
}


/* ---- outline ---- */

.outline {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	margin-top: 45px;
	line-height: 1.8;
}

.outline dt {
	width: 6em;
	margin-top: 20px;
	margin-right: 2em;
	background-color: #dc2801;
	border-radius: 3px;
	color: #fff;
	font-weight: bold;
	text-align: center;
}

.outline dd {
	width: calc(100% - 8em);
	margin-top: 20px;
}

@media screen and (max-width: 639px) {
	
	.outline {
		display: block;
		margin-top: 8vw;
		line-height: 1.6;
	}
	
	.outline dt {
		width: 6em;
		margin-top: 3vw;
		margin-right: 0;
	}
	
	.outline dd {
		width: auto;
		margin-top: 2vw;
	}
	
}

.outline + ul {
	margin-top: 20px;
	line-height: 1.8;
}

.outline + ul li {
	position: relative;
	padding-left: 1em;
}

.outline + ul li::before {
	content: "●";
	position: absolute;
	left: 0;
	top: 0;
	color: #dc2801;
}

.outline + ul + p {
	margin-top: 20px;
	font-size: 1.3rem;
	line-height: 1.5;
}

@media screen and (max-width: 639px) {
	
	.outline + ul {
		margin-top: 5vw;
		line-height: 1.6;
	}
	
	.outline + ul + p {
		margin-top: 5vw;
		font-size: 1.2rem;
		line-height: 1.3;
	}
	
}


/* ---- infectious disease ---- */

h2 {
	margin-top: 60px;
	font-size: 2rem;
}

h2 span {
	display: inline-block;
	padding: .4em 1em;
	border-radius: 3px 3px 0 0;
	background-color: #2c8737;
	color: #fff;
}

h2 + ul {
	padding: 20px;
	border-radius: 0 3px 3px 3px;
	background-color: #fff;
	line-height: 1.8;
}

h2 + ul li {
	position: relative;
	padding-left: 1em;
}

h2 + ul li::before {
	content: "●";
	position: absolute;
	left: 0;
	top: 0;
	color: #2c8737;
}

@media screen and (max-width: 639px) {
	
	h2 {
		margin-top: 8vw;
		font-size: 1.8rem;
	}
	
	h2 span {
		padding: .4em 1em;
	}
	
	h2 + ul {
		padding: 5vw;
		line-height: 1.6;
	}
	
}


/* ---- photo ---- */

h2.photo span {
	background-color: #333;
}

h2.photo + p {
	padding: 20px 20px 0 20px;
	border-radius: 0 3px 0 0;
	background-color: #fff;
	line-height: 1.8;
}

h2.photo + p + ul {
	display: flex;
	flex-wrap: wrap;
	column-gap: 40px;
	padding: 10px 20px 20px 20px;
	border-radius: 0 0 3px 3px;
	background-color: #fff;
	line-height: 1.8;
}

h2.photo + p + ul li {
	position: relative;
	padding-left: 1em;
	font-size: 2.2rem;
}

h2.photo + p + ul li::before {
	content: "●";
	position: absolute;
	left: 0;
	top: calc(50% - .85em);
	color: #333;
	font-size: 1.6rem;
}


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

footer {
	margin-top: 80px;
	padding-top: 30px;
	border-top: 1px solid #333;
}

footer p {
	font-size: 1.4rem;
	text-align: center;
}

@media screen and (max-width: 639px) {
	
	footer {
		margin-top: 8vw;
		padding-top: 5vw;
	}
	
	footer p {
		font-size: 1.3rem;
	}
	
}
