@charset "UTF-8";

/*==============================
		content設定
==============================*/

#contents h3{
	text-align: center;
	margin-bottom: 20px;
	font-weight: bold;
}


/*-----titleImage-----*/

#contents #titleImg{
	background-image: url(/img/blog/titleimg_pc.jpg);
}

/*-----ブログ-----*/


#blog > .w980 {
    position: relative;
}

#blog > .w980 .chara{
    width: auto;
    position: absolute;
    right: -100px;
}

#blog .blog_list .blog_box{
	flex:0 0 48%;
	-ms-flex:0 0 48%;
	max-width: 100%;/*IE用*/
	margin-bottom: 5%;
}

#blog .blog_list .blog_box a >div{
	flex:0 0 48%;
	-ms-flex:0 0 auto;
	max-width: 48%;/*IE用*/
}

#blog .blog_list .blog_box a .txt_box .title{
	font-weight:bold;
}

#blog .blog_list .blog_box a .txt_box .cate{
	border: 1px solid;
	padding:0 5px;
	margin-bottom:10px;
	display: inline-block;
}

#blog .blog_list .blog_box a .txt_box  .txt{
	font-size:12px;
}

#blog .btn{
	margin: 50px auto 0;
}


/*ページャー*/
#pager{
	text-align: center;
}

#pager li{
	box-sizing: border-box;
	display: inline-block;
	width: 30px;
	height: 30px;
	line-height: 30px;
	border: 1px solid #333333;
}

#pager li a{
	display: block;
	height: 100%;
}

#pager li .active{
	color: #fff;
	text-decoration: none;
	background-color: #333333;
}

/*-----準備中-----*/

.border_box{
	margin: 0 auto;
	max-width: 800px;
	height: 140px;
	line-height: 140px;
	text-align: center;
	font-size: 18px;
	border: 1px solid #333;
}



/*------------------------------
	タブレットの設定
------------------------------*/

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

	
	
}



/*------------------------------
	スマホの設定
------------------------------*/

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

	/*-----titleImage-----*/
	
	#contents #titleImg{
		background-image: url(/img/blog/titleimg_sp.jpg);
	}
	/*-----ブログ-----*/
	#blog .blog_list .blog_box{
		flex: 0 0 100%;
		-ms-flex: 0 0 100%;
		max-width: 100%;/*IE用*/
		margin-bottom:40px;
	}
	#blog .blog_list .blog_box .flex{
	    width: 100%;
	}
	#blog .blog_list .blog_box a .img_box{
		flex: 0 0 32%;
		-ms-flex: 0 0 32%;
		max-width: 32%;/*IE用*/
	}
	#blog .blog_list .blog_box a .txt_box{
		flex: 0 0 64%;
		-ms-flex: 0 0 64%;
		max-width: 64%;/*IE用*/
	}
	
	#blog > .w980 .chara{
		position: initial;
	}
	
}