@charset "utf-8";

#kaso_body #lead{
	text-align: center;
	padding: 4% 0 0 ;
	font-weight: 700;
}

#kaso_body #lead p{
	font-size:20px;
}


#kaso_body #column ul.item{
	display: flex;
	flex-wrap: wrap;
	gap: 40px 20px;
	width: 84%;
	margin: 0 auto;
}

#kaso_body #column ul.item > li{
	width: calc(100% / 3 - 20px * 2 / 3);
	position: relative;
	border: 1px solid #333;
	padding: 1% 1% 4%;
	box-shadow: 6px 6px 6px rgba(51,51,51,0.4);
}

#kaso_body #column ul.item > li:hover{
	border-color:#171c61 ;
	transition: all .2s;
}

#kaso_body #column ul.item > li:hover h3{
	color: #171c61;
	transition: all .2s;
}

#kaso_body #column ul.item > li .column_head{
	overflow: hidden;
	position: relative;
}

#kaso_body #column .cate{
	position: absolute;
	font-size: 16px;
	display: flex;
	align-items: center;
	top: 0;
	font-weight: 700;
	padding: 6px 20px;
	width: 60%;
	background: linear-gradient(to right, #c08623, #d3b04e);
	clip-path: polygon(0 0, 100% 0%, 90% 100%, 0% 100%);
}

#kaso_body #column time{
	font-size:13px;
}

#kaso_body #column ul.item > li:hover .thum{
	transform: scale(1.15);
	transition: all .3s;
}

#kaso_body #column ul.item > li:hover{
	border-color:#1a1f8f;
	box-shadow: 8px 8px 8px rgba(0, 54, 125, 0.4);
}

#kaso_body #column ul.item li .thum{
	width: 100%;
	overflow: hidden;
}
#kaso_body #column ul.item li .thum img{
	height: 230px;
	object-fit:cover;
	object-position:center;
}
#kaso_body #column ul.tag{
	z-index: 3;
	position: relative;
	overflow: hidden;
}

#kaso_body #column ul.tag li a:hover{
	border-color: transparent;
	color: #fff;
	transition: all .2s;
}

#kaso_body #column ul.tag li{
	float: left;
	margin: 0 2px 2px 0;
	padding:0;
}

#kaso_body #column ul.tag li:nth-of-type(n + 4){
	display:none;
}

#kaso_body #column ul.tag li a{
	border: 1px solid #333;
	padding: 2px 10px;
	font-size: 12px;
}

#kaso_body #column .column_head{
	overflow: hidden;
}

#kaso_body #cate{
	padding:6% 0 0;
}


/*記事内容*/

body.article #individual,
#article{
	background-color: #e5e5e5;
}

#kaso_body #article .inner{
	background-color: #fff;
	padding: 2% 6%;
}

#kaso_body #article h1{
	margin: 0 0 20px;
}

#kaso_body #article .cate{
	position: static;
	width:20%;
	min-width: 300px;
	font-size: 20px;
	margin: 0 0 20px;
}

#kaso_body #article .cate a{
	display:block;
}

#kaso_body #article .wrapper{
	display: flex;
	align-items: center;
	gap: 0 20px;
	margin:0 0 10px;
}

#kaso_body #article strong{
	font-weight:700;
}



#kaso_body #article ul.tag li a{
	padding: 2px 10px;
}

#kaso_body #article .thum{
	width: 100%;
	height: 500px;
	margin:0 0 20px;
}


/*記事内設定*/
#kaso_body #article .body h2,
#kaso_body #article .body h3{
	margin:0 0 20px;
}
#kaso_body #article .body h4,
#kaso_body #article .body h5,
#kaso_body #article .body h6{
	margin:0 0 10px;
}
#kaso_body #article .body h2{
	position: relative;
	padding: 0 0 10px;
}

#kaso_body #article .body h3{
	position: relative;
	font-size: 20px;
	display: inline-block;
	-webkit-box-orient: initial;
	-webkit-line-clamp: initial;
	overflow: visible;
	height: auto;
	padding-left: 20px;
}

#kaso_body #article .body h3::before{
	content: '';
	position: absolute;
	background: linear-gradient(to bottom, #171c61,#019ce5);
	bottom: 0;
	left: 0;
	width:10px;
	height: 100%;
}

#kaso_body #article .body h2::after{
	content: '';
	position: absolute;
	background: linear-gradient(to right, #171c61,#019ce5);
	bottom: 0;
	left: 0;
	width: 100%;
	height: 2px;

}

#kaso_body #article .body ul,
#kaso_body #article .body ol{
	margin:0 0 20px 20px;
}

#kaso_body #article .body ul li{
	list-style:disc;
	margin:0 0 6px;
}

#kaso_body #article .body ol li{
	list-style:decimal;
	margin:0 0 6px;
}

#kaso_body #article .body blockquote p{
	font-size:12px;
	margin:10px 0;
	font-style:italic;
}

#kaso_body #article .body .img_wrap{
	display: flex;
	gap: 0 40px;
}

#kaso_body #article .body p a{
	text-decoration:underline;
	color:#019ce5;
}

#kaso_body #article .body a.is_only_link{
	background: linear-gradient(to right, #171c61,#019ce5);
	margin: 0 auto;
	color:#fff !important;
	text-decoration:none;
	max-width: 320px;
	padding: 20px 30px 20px 20px;
	display:flex;
	align-items:center;
	justify-content:center;
	position:relative;
}
#kaso_body #article .body a.is_only_link::after{
	content'';
	position:absolute;
	right:20px;
	top:50%;
	width: 10px;
	height: 10px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	transform: rotate(45deg) translateY(-50%);
}

#kaso_body #article .body a.is_only_link:hover{
	opacity:0.8;
	transition:all .3s;
}

#kaso_body #article .body table tr{
	border-width: 0px;
}

#kaso_body #article .body table td{
	padding:1%;
	border-width:1px;
}

#kaso_body #article　.cate a{
	display:block;

}

#kaso_body.taxonomy main h2{
	font-size: 20px;
	margin: 0 auto 4%;
}

#kaso_body.taxonomy main h2 span{
	font-size: 30px;
}

#kaso_body.taxonomy #column ul.tag li{
	border:none;
}
#kaso_body.taxonomy #column ul.tag li a:hover{
	color:#fff;
	border-color:transparent;
}

.curtain_anim::before{
	background:#fff;
	animation-duration:2.6s;
}

#kaso_body main .ttl{
	text-align:center;
}
#kaso_body main .ttl h2{
	display:inline-block;
}

@media screen and (min-width: 768px) and (max-width: 1279px) {
	#kaso_body #column ul.item li .thum img{
		height:200px;
	}
	#kaso_body.taxonomy main h2 {
		font-size: 18px;
	}
	#kaso_body.taxonomy main h2 span{
		font-size:22px;
	}
	#kaso_body.taxonomy main h3{
		font-size:18px;
	}
	#kaso_body.taxonomy #column ul.tag li:nth-of-type(n + 3){
		display:none;
	}
}

@media screen and (max-width: 1024px){
	#kaso_body #column ul.item >li{
		width: calc(100% / 2 - 20px * 1 / 2);
	}
}

@media screen and (max-width: 767px){

	#kaso_body main h2{
		font-size: 24px;
		margin: 0 0 4%;
	}

	#kaso_body main .line{
		margin: 0 0 8%;
	}
	#kaso_body #column h3 {
		font-size: 16px;
	}
	#kaso_body #column ul.item{
		width: 100%;
	}

	#kaso_body #column ul.item > li .cate{
		width: 90%;
		font-size: 13px;
		padding: 4px 10px;
	}

	#kaso_body #column ul.item > li .cate.pc{
		display: none;
	}

	#kaso_body #column ul.tag li a{
		font-size: 12px;
		padding: 2px 6px;
	}

	#kaso_body #article h1{
		font-size: 22px;
		line-height: 1.6;
	}


	#kaso_body #article .inner{
		padding: 12% 4%;
	}
	#kaso_body #article .body .img_wrap{
		flex-direction: column;
		gap: 20px 0;
	}
	#kaso_body #article .body .img_wrap.column2 img,
	#kaso_body #article .body .img_wrap.column3 img,
	#kaso_body #article .body .img_wrap.column4 img{
		width: 100%;
	}

	#kaso_body #article .body h2{
		font-size: 20px;
	}

	#kaso_body #article .body h3{
		font-size: 18px;
	}


	#kaso_body #article .cate{
		font-size: 18px;
	}


	#kaso_body #article .body a.is_only_link{
		padding: 20px 10px 20px 10px;
		font-size: 14px;
	}
	#kaso_body.taxonomy main h2{
		font-size: 18px;
		width: 94%;
		margin: 0 auto 8%;
		text-align:left;
	}

	#kaso_body.taxonomy main h2 span{
		font-size: 18px;
	}

	#kaso_body #lead p {
		font-size: 15px;
	}

}

@media screen and (max-width: 520px){
	#kaso_body #column ul.item{
		flex-direction: column;
		width: 100%;
		gap:20px;
	}

	#kaso_body #column ul.item >li{
		width: 100%;
		display: flex;
		gap: 0 10px;
		padding: 2% 2% 4%;
	}

	#kaso_body #column ul.item >li .column_head{
		width: 30%;
	}

	#kaso_body #column ul.item >li .column_body{
		width: calc(70% - 10px);
	}

	#kaso_body #column ul.tag li:nth-of-type(n + 2){
		display: none;
	}

	#kaso_body #column ul.item >li .column_head .thum img{
		height: 80px;
	}

	#kaso_body #column .cate{
		font-size: 14px;
		width: 80%;
		position: static;
		gap:20px;
	}

	#kaso_body #pagination .inner{
		padding: 0 0 14%;
	}

	#kaso_body #article .thum{
		height: 250px;
	}

	#kaso_body #article .wrapper{
		margin: 0 0 10px;
		align-items: flex-start;
	}

	#kaso_body #article .body table td{
		font-size: 14px;
	}

	#kaso_body #gallery-1 img{
		border:none;
	}

	#kaso_body #gallery-1.gallery-columns-3{
		display:flex;
		gap:0 10px;
	}
	#kaso_body #column ul.item li .thum img {
		height: 80px;}
	#kaso_body #column .cate{
		position:static;
	}

}