@charset "utf-8";

.blogHeader {
	position: relative;
	padding: 20px 10%;
}

.blogHeader a>img {
	width: 10%;
	min-width: 100px;
	max-width: 160px;
}

.blogHeader>ol {
	position: absolute;
	right: 10%;
	top: 30px;
	font-size: 16px;
}


.blogHeader>ol li {
	display: inline-block;
}

.blogHeader>ol li:not(:last-child) {
	margin-right: 20px;
}

.blogHeader>ol li:hover,
.blogHeader>ol li a.active,
.blogArea ul li div>a {
	text-decoration: underline;
}

.blogArea {
	width: 70%;
	margin: 0 auto;
	padding: 70px 0;
}

.blogArea ul {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

.blogArea ul li {
	width: 30%;
	box-sizing: border-box;
	text-align: center;
}

.blogArea ul li:not(:nth-child(3n)) {
	margin-right: 5%;
}

.blogArea ul li>img {
	width: 100%;
}

.blogArea ul li>div {
	padding: 30px 10px 70px 10px;
}

.blogArea ul li h3 {
	font-size: 24px;
}

.blogArea ul li div>p,
.blogArea ul li div>a {
	font-size: 14px;
}

.blogArea ul li div>*:not(:last-child) {
	margin-bottom: 20px;
}

.blogArea ul li div>a:hover {
	font-weight: 600;
}

.articleArea {
	width: 60%;
	margin: 0 auto;
	padding: 70px 0;
}

.articleArea h2 {
	font-size: 46px;
	font-weight: bolder;
	margin-bottom: 50px;
	text-align: center;
}

.articleArea [class^="articleBox_"] p {
	font-size: 18px;
	font-weight: 400;
	line-height: 2em;
	word-break: keep-all;
}

.articleArea [class^="articleBox_"]>*:not(:last-child),
.articleArea [class^="articleBox_"]>div>*:not(:last-child) {
	margin-bottom: 40px;
}

.articleArea [class^="articleBox_"] h3 {
	font-size: 28pt;
	margin-top: 70px;
}

.articleArea [class^="articleBox_"] h4 {
	font-size: 20pt;
	margin-bottom: 30px;
}

.articleArea [class^="articleBox_"] span {
	display: block;
	padding: 5px 0 0 30px;
}

.articleArea [class^="articleBox_"] .imgBox {
	text-align: center;
}

.articleArea [class^="articleBox_"] img {
	width: 60% !important;
}

.articleBox_04 img {
	margin: 40px 0;
	text-align: center;
}

.pageBtn,
.olderPostBtn {
	font-size: 14pt;
	position: relative;
}
.pageBtn{
	margin-top: 100px;
}
.olderPostBtn {
	margin-top: 50px;
}
.pageBtn .pre {
	background: url("/img/clinicInfo/ver_2025/blog/pre.svg")no-repeat left center /15px;
	padding-left: 30px;
	display: inline-block;
}

.pageBtn .next,
.olderPostBtn a {
	background: url("/img/clinicInfo/ver_2025/blog/next.svg")no-repeat right center /15px;
	padding-right: 30px;
	position: absolute;
	right: 0;
	display: inline-block;
}

.pageBtn .pre:hover,
.pageBtn .next:hover,
.olderPostBtn a:hover {
	text-decoration: underline;
}

table {
	width: 100%;
}

table tr * {
	border: 1px solid #888888;
	padding: 10px;
	text-align: center;
	font-size: 14pt;
}

table tr th {
	background-color: rgb(226, 226, 226);
}

@media screen and (max-width:720px) {
	.blogArea {
		width: 90%;
	}

	.blogArea ul li {
		width: 100%;
	}

	.blogArea ul li:not(:nth-child(3n)) {
		margin-right: 0;
	}

	.articleArea {
		width: 90%;
	}

	.articleArea h2 {
		font-size: 23pt;
	}

	.articleArea [class^="articleBox_"] h3 {
		font-size: 22pt;
	}

	.articleArea [class^="articleBox_"] p {
		font-size: 12pt;
	}

	.articleArea [class^="articleBox_"] span {
		padding: 5px 0 0 10px;
	}

	.articleArea [class^="articleBox_"] h3 {
		margin-top: 40px;
	}

	.articleArea [class^="articleBox_"]>*:not(:last-child) {
		margin-bottom: 20px;
	}

	.articleArea [class^="articleBox_"] img {
		width: 100% !important;
	}

	.articleBox_01 .imgBox:first-child {
		flex-direction: column;
	}

	.pageBtn {
		font-size: 10pt;
	}

	.pageBtn .pre {
		width: 45%;
		background: url("/img/clinicInfo/ver_2025/blog/pre.svg")no-repeat left center /10px;
	}

	.pageBtn .next {
		width: 45%;
		background: url("/img/clinicInfo/ver_2025/blog/next.svg")no-repeat right center /10px;
	}

	table tr * {
		font-size: 12pt;
	}
}