@charset "utf-8";
/* CSS Document */

.tp-091-title { text-align: center; padding: 2rem;}
	
.blog-area-091 { padding: 4rem 4.5em 8rem;}
	.blog-area-091 h1 { letter-spacing: 2px;}
	
	.blog-box-091 {position: relative;}
		.blog-box-091 li { display:inline-block; vertical-align:top;}
		.blog-box-091.index li {width: 23.5%; margin-right: 2%;}
		.blog-box-091.index li:nth-child(4n+4) { margin-right: 0;}
		
			
			.blog-box-091 .blog-top-pic { display: block; background: #eee no-repeat center center; background-size: cover; opacity: .6;}
				.blog-box-091 .blog-top-pic:hover { opacity: 1;}
			.blog-box-091 .blog-con { padding: 1rem 0; }
				.blog-box-091 .blog-con > h1 { color: #595757; letter-spacing:1px;}
				.blog-box-091 .blog-con a {color: #595757;}
				.blog-box-091 .blog-con .con-box { margin-top: 1rem;}
				
			.blog-box-091.index .blog-con-box { padding: 1.5rem; background-color: #e8e8e9}	
			.blog-box-091.index .blog-top-pic { padding-bottom: 100%;}
				
		
		.blog-box-091.news li { width: 32%; margin-right: 2%; position: relative;}
		
		
			.blog-box-091.news .blog-top-pic { padding-bottom: 60%;}
			.blog-box-091.news .tag { position: absolute; padding: .5rem; margin-top: -1.5rem; display: block; color: #fff; background-color: #231815; letter-spacing: 1px;}
			.blog-box-091.news .blog-con > h1 { margin-top: 1em;}
			
			.news-tag { border-bottom: 1px solid #c2c3c4; padding: 1rem 0; color: #989899; margin-bottom: 2rem;}
				.news-tag a { color: #989899;}
				.news-tag a:hover, .news-tag a.ck { color: #231815;}
				
				.news-tag .part { display: inline-block; padding: 0 1rem;}
				  
@media (min-width: 1024px){
	.blog-box-091.news li:nth-child(3n+3) { margin: 0;}
}

@media (max-width: 1023px){
	.blog-area-091 { padding: 4rem 2em;}
		.blog-box-091.index li, .blog-box-091.news li { width: 49%; margin-bottom: 2%;}
		.blog-box-091.index li:nth-child(2n+2), .blog-box-091.news li:nth-child(2n+2) { margin-right: 0;}
		
		.blog-box-091.index h1, .blog-box-091.news .blog-con > h1 { font-size: 1.4rem;}

}
@media (max-width: 768px){
	.blog-area-091 { padding: 2rem 1em;}
	
	.blog-box-091.index li, .blog-box-091.news li { width: 100%; margin-bottom: 4%;}
		.blog-box-091.index li:nth-child(n+1), .blog-box-091.news li:nth-child(n+1) { margin-right: 0;}
		
		
		
		.news-tag .part { padding: 0 .5rem;}
}