/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 02 2026 | 01:40:47 */
/* ======================================
   関連記事・人気記事 共通
====================================== */
.column-under-posts {
	margin-top: 70px;
}
.column-posts{
	margin:1em auto;
}
.section-title {
	text-align: center;
	font-size: 25px;
	font-weight: 700;
	color: #7C7461;
	margin-bottom: 15px;
	letter-spacing: 0.08em;
}
.column-post-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 15px;
}

.column-post-card {
	background: #fff;
	border: 1px solid #eee;
	border-radius: 8px;
	overflow: hidden;
	transition: .3s;
}

.column-post-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 20px rgba(0,0,0,.08);
}

.column-post-card a {
	display: block;
	color: inherit;
	text-decoration: none;
}

.column-post-thumb {
	overflow: hidden;
	background: #f5f5f5;
}

.column-post-thumb img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	display: block;
	transition: .4s;
}

.column-post-card:hover .column-post-thumb img {
	transform: scale(1.05);
}

.column-post-body {
	padding: 16px;
}

.column-post-date {
	display: block;
	font-size: 13px;
	color: #999;
	margin-bottom: 8px;
}

.column-post-title {
	font-size: 14px;
	color: #666666;
	margin: 0;
}

@media (max-width: 767px) {
	.column-under-posts {
		margin-top: 50px;
	}

	.column-posts {
		padding: 45px 0 0;
	}

	.section-title {
		font-size: 22px;
		margin-bottom: 25px;
	}

	.column-post-grid {
		grid-template-columns: 1fr;
		gap: 20px;
	}
}


.column-detail-container{
	display:flex;
	align-items:flex-start;
	gap:50px;
}

.column-main{
	flex:1;
	min-width:0;
}

.column-side{
	width:300px;
	flex-shrink:0;
	position:sticky;
	top:100px;
}

.column-side-box{
	margin-bottom:32px;
	padding:24px;
	background:#fff;
	border:1px solid #eee;
	border-radius:14px;
	box-shadow:0 8px 24px rgba(0,0,0,.05);
}

.column-side-title{
	margin:0 0 18px;
	padding-bottom:10px;
	border-bottom:1px solid #e5e5e5;
	font-size:15px;
	font-weight:700;
	letter-spacing:.08em;
	color:#333;
}
.side-post-list,
.side-cat-list{
	list-style:none;
	margin:0;
	padding:0;
}

.side-post-list li{
	margin-bottom:16px;
}

.side-post-list li:last-child{
	margin-bottom:0;
}

.side-post-list a{
	display:flex;
	gap:12px;
	color:inherit;
	text-decoration:none;
}

.side-post-thumb{
	width:80px;
	height:60px;
	flex-shrink:0;
	overflow:hidden;
	border-radius:8px;
	background:#f5f5f5;
}

.side-post-thumb img{
	width:100%;
	height:100%;
	object-fit:cover;
}

.side-post-date{
	display:block;
	margin-bottom:4px;
	color:#999;
	font-size:12px;
}

.side-post-title{
	display:block;
	font-size:13px;
	font-weight:600;
	line-height:1.5;
}

.side-cat-list li{
	border-bottom:1px solid #eee;
}

.side-cat-list li a{
	display:block;
	padding:10px 0;
	color:#333;
	font-size:14px;
	text-decoration:none;
}

.side-cat-list li a:hover,
.side-post-list a:hover .side-post-title{
	color:#8B7355;
}

.column-side-banner a{
	display:block;
	padding:28px 22px;
	border-radius:16px;
	background:#8B7355;
	color:#fff;
	text-align:center;
	text-decoration:none;
	transition:.3s;
}

.column-side-banner a span{
	display:block;
	margin-bottom:8px;
	font-size:13px;
	letter-spacing:.16em;
	opacity:.8;
}

.column-side-banner a strong{
	display:block;
	font-size:18px;
	line-height:1.5;
}

.column-side-banner a:hover{
	transform:translateY(-3px);
	opacity:.9;
}

@media(max-width:900px){
	.column-detail-container{
		display:block;
	}

	.column-side{
		width:100%;
		position:static;
		margin-top:50px;
	}
}
/* スマホ */
@media (max-width:767px){

	.column-detail-container{
		display:flex;
		flex-direction:column;
	}

	.column-main{
		order:1;
		width:100%;
	}

	.column-side{
		order:2;
		width:95%;
		position:static;
        margin: 0 auto;
	}

	.column-side-box{
		margin-bottom:24px;
	}
}

/* 症例一覧CTAバナー */
.column-side-banner{
	margin-top:30px;
}

.column-side-banner a{
	display:block;
	position:relative;
	padding:28px 22px;
	border-radius:18px;
	background:#8B7355;
	color:#fff;
	text-align:center;
	text-decoration:none;
	overflow:hidden;
	transition:.3s;
}

.column-side-banner a::before{
	content:"";
	position:absolute;
	inset:0;
	background:linear-gradient(135deg, rgba(255,255,255,.22), transparent 55%);
	pointer-events:none;
}

.column-side-banner a span{
	display:block;
	position:relative;
	margin-bottom:8px;
	font-size:13px;
	letter-spacing:.16em;
	opacity:.85;
}

.column-side-banner a strong{
	display:block;
	position:relative;
	font-size:18px;
	line-height:1.5;
}

.column-side-banner a:hover{
	transform:translateY(-3px);
	box-shadow:0 12px 28px rgba(0,0,0,.14);
}
/* 目次 */
.column-toc{
	background:#fff;
	padding:20px 24px;
	border-radius:16px;
	border:1px solid #eee;
	box-shadow:0 10px 30px rgba(0,0,0,.06);
    max-width: 700px;
    margin: 0 auto;
}

.toc-title{
	position:relative;
	margin:0 0 20px;
	padding-bottom:14px;
	font-size:18px;
	font-weight:700;
	color:#333;
}
.toc-list,
.toc-sublist{
	list-style:none;
	padding:0;
	margin:0;
}

.toc-item{
	margin-bottom:14px;
}

.toc-item:last-child{
	margin-bottom:0;
}

.toc-item.toc-main > a{
	display:block;
	position:relative;
	padding-left:16px;
	color:#333;
	font-size:14px;
	font-weight:600;
	line-height:1.7;
	text-decoration:none;
	transition:.3s;
}

.toc-item.toc-main > a::before{
	content:"";
	position:absolute;
	left:0;
	top:.75em;
	width:6px;
	height:6px;
	border-radius:50%;
	background:#8B7355;
}

.toc-sublist{
	margin:10px 0 0 18px;
}

.toc-subitem{
	margin-bottom:8px;
}

.toc-subitem a{
	display:block;
	color:#666;
	font-size:13px;
	line-height:1.7;
	text-decoration:none;
	transition:.3s;
}

.toc-item a:hover,
.toc-subitem a:hover{
	color:#8B7355;
	transform:translateX(3px);
}


@media (max-width:767px){


	.column-toc{
		margin:30px 0;
		padding:22px 18px;
		border-radius:14px;
	}

	.toc-title{
		font-size:16px;
		margin-bottom:16px;
	}

	.toc-item.toc-main > a{
		font-size:13px;
	}

	.toc-subitem a{
		font-size:12px;
	}
}

/* 記事ボタン */
.reserve-btn-wrap{
	margin:40px auto;
	text-align:center;
}

.reserve-btn-link{
	display:inline-block;
	transition:.3s;
}

.reserve-btn-link img{
	display:block;
	width:100%;
	max-width:420px;
	height:auto;
	margin:0 auto;
}

.reserve-btn-link:hover{
	transform:translateY(-3px);
	opacity:.9;
}

@media (max-width:767px){
	.reserve-btn-wrap{
		margin:30px auto;
	}

	.reserve-btn-link img{
		max-width:360px;
	}
}

/* トップページのコラムにもアーカイブ一覧と同じ装飾を適用 */
.column-section{
	max-width:1200px;
	margin:0 auto;
	padding:20px 30px;
}

@media (max-width:768px){
	.column-section{
		padding:60px 20px;
	}
}
.column-section .column-grid{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:20px;
}

.column-section .column-card{
	background:#fff;
	border-radius:16px;
	overflow:hidden;
	box-shadow:0 8px 24px rgba(0,0,0,.08);
	transition:.3s;
}

.column-section .column-card:hover{
	transform:translateY(-4px);
}

.column-section .column-card-link{
	display:block;
	color:inherit;
	text-decoration:none;
}

.column-section .column-card-thumbnail{
	aspect-ratio:16/10;
	overflow:hidden;
}

.column-section .column-card-thumbnail img{
	width:100%;
	height:100%;
	object-fit:cover;
	transition:.4s;
}

.column-section .column-card:hover .column-card-thumbnail img{
	transform:scale(1.06);
}

.column-section .column-card-content{
	padding:22px;
}

.column-section .column-card-meta{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
	font-size:13px;
}

.column-section .column-card-tag{
    background: #7C7461;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    padding: 4px 12px;
    border-radius: 3px;
    white-space: nowrap;
}

.column-section .column-card-date{
	color:#888;
	font-size:13px;
}

.column-section .column-card-title{
	margin:0 0 12px;
	font-size:16px;
}

.column-section .column-card-excerpt{
	margin:0;
	color:#666;
	font-size:12px;
}

.column-card-btn{
	margin-top:18px;
	font-weight:700;
	color:var(--color_main,#0b6db7);
}

@media screen and (max-width: 959px){
	.column-section .column-grid{
		grid-template-columns:repeat(2,1fr);
		gap:22px;
	}
}

@media screen and (max-width: 599px){
	.column-section .column-grid{
		grid-template-columns:1fr;
	}

	.column-section .column-card-content{
		padding:18px;
	}
}
/*  */
.column-more{
	margin-top:60px;
	text-align:center;
}

.column-more-btn{
	display:inline-flex;
	align-items:center;
	gap:14px;
	position:relative;
	padding-bottom:10px;
	color:#222;
	font-size:15px;
	font-weight:700;
	letter-spacing:.12em;
	text-decoration:none;
	text-transform:uppercase;
	transition:.3s;
}

.column-more-btn::before{
	content:"";
	position:absolute;
	left:0;
	bottom:0;
	width:100%;
	height:1px;
	background:#222;
	transform-origin:left;
	transition:.3s;
}

.column-more-btn::after{
	content:"→";
	font-size:18px;
	transition:.3s;
}

.column-more-btn:hover{
	color:var(--color_main);
}

.column-more-btn:hover::before{
	background:var(--color_main);
}

.column-more-btn:hover::after{
	transform:translateX(8px);
}