@charset "utf-8";

/* about */
.headlineImgAbout {background: url(../images/header_profile.jpg) bottom right no-repeat;background-size:cover;}




/*  【注意】このファイルsample1はAPIを複数呼び出していて複雑なので、単純なサンプルとしてsample2～4も参照のこと */

/*  デザイン例（本番は外部CSS推奨） */

/* 必須 */
[class^="blog-system-postmonths-yearmonth-"] {/* 将来の機能拡張に備えいったん全てを非表示にする */
	display: none;
}


/*  【注意】このファイルsample1はAPIを複数呼び出していて複雑なので、単純なサンプルとしてsample2～4も参照のこと */

/*  デザイン例（本番は外部CSS推奨） */

/* 必須 */
[class^="blog-system-postmonths-yearmonth-"] {/* 将来の機能拡張に備えいったん全てを非表示にする */
	display: none;
}
.blog-system-postmonths-yearmonth-container,
.blog-system-postmonths-yearmonth-year,
.blog-system-postmonths-yearmonth-month2,
.blog-system-postmonths-yearmonth-count {/* 必要なパーツのみを明示的に表示 */
	display: inline;
}
[class^="blog-system-headlines-headline-"] {/* 必須（将来の機能拡張に備えいったん全てを非表示にする） */
	display: none;
}
.blog-system-headlines-headline-container,
.blog-system-headlines-headline-date,
.blog-system-headlines-headline-title,
.blog-system-headlines-headline-body,
.blog-system-headlines-headline-img1 {/* （↑の続き）必要なパーツのみを明示的に表示 */
	display: block;
}
/* ここから下は全くの自由 */



.blog-system-postmonths-yearmonth-container a{text-decoration:none;}


.blog-system-headlines-headline-img1{

position: relative;

top: -40px;

left: 0;
}	

/* box index list 使用  F9F4F4(ピンク系)  FCFCFC*/
.blog-system-headlines-headline-container{
	width: 28%;
	/*   border: 1px #ddd solid;*/
	padding: 1%;
	margin: 1%;
	float: left;
	min-height: 160px;
	/* background: #fefefe; */
	/* border: 1px solid #eee; */
	border-bottom: 1px solid #6f6f6f;
	max-height: 100px;
	position: relative;
	top: 0;
	left: 0;
	width: 95%;
}

.blog-system-headlines-headline-title{
	/* font-size: 1em; */
	overflow: hidden;
	text-align: left;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-weight: 600;
	color: #074952;
	font-size: 0.8rem;
	position: absolute;
	top: 30px;
	left: 210px;
	font-size: 1em;
	z-index: 1;
	}

.blog-system-headlines-headline-title a:hover{
	
	color: #1d9eae;
	}


.blog-system-postmonths-yearmonth{

}


.blog-system-postmonths-yearmonth-year,
.blog-system-postmonths-yearmonth-month2,
.blog-system-postmonths-yearmonth-count {
		font-size: 1.05em;
		color: #fff;
}

.blog-system-postmonths-yearmonth-year{
	padding-left: 1px;
}

.blog-system-postmonths-yearmonth-count{
	padding-left: 10px;
}
.blog-system-postmonths-yearmonth-count:before {
	content: '(';
}
.blog-system-postmonths-yearmonth-count:after {
	content: ')';
}
.blog-system-postmonths-yearmonth-year:after {
	content: '年';
}
.blog-system-postmonths-yearmonth-month2:after {
	content: '月';
}
.blog-system-headlines-headline-date {
	color: #999;
	font-size: large;
	font-weight: bold;
	/* display: none; */
	font-size: 1rem;
	text-align: left;
	position: relative;
	top: 0;
	padding-left: 0;
	left: 210px;
	/* width: 250px; */
	overflow: hidden;
}
.blog-system-headlines-headline-img1 img {
	width: 100%;
	height: auto;
	padding: 2%;
	/* max-height: 150px; */
	/* max-width: 90%; */
	overflow: hidden;
	width: 50%;/* トリミングしたい枠の幅 */
	height: 50%;/* トリミングしたい枠の高さ */
	position: relative;
	/* overflow: hidden; */
	/* width: 150px; *//* トリミングしたい枠の幅 */
	width: 200px;
	height: 150px;/* トリミングしたい枠の高さ */
	position: relative;
	object-fit: cover;
}


.blog-system-headlines-headline-body{
	font-size: 0.9em;
	color: #222;
	position: absolute;
	top: 60px;
	left: 210px;
	font-size: 1rem;
	max-height: 3.5em;
	line-height: 1.2;
	overflow: hidden;
	letter-spacing: 0.08em;
	padding: 1px 5px 0 0;
	line-height: 1.3;
	margin: 0;
	overflow: hidden;
	/* white-space: nowrap; */
	text-overflow: ellipsis;
}

/* ここから下は自由に記述可 */
.blog-system-post-post-date {
	margin-top: 15px;
	color: #000;
	font-size: large;
	font-weight: 400;
	display: none;
}
.blog-system-post-post-title{
	color: #fff;
	font-size: large;
	font-weight: 600;
	background: #330401;
	margin-bottom: 10px;
	padding: 8px;

}

.blog-system-post-post-body{
	color: #fff;
	margin-top: 10px;
}


.blog-system-post-post-body img {
	max-width: 400px;
	height: auto;
}
[class^="blog-system-post-post-img"] img {
	max-width: 100%;
	height: auto;

}


.blog-system-post-post-img1{
	width: 100%;
	max-width: 450px;
}

.t_title{
	font-size: 1.3em;
	margin-bottom: 15px;
	text-align: left;
}


.s_title{
	font-size: 1.2em;
	margin-bottom: 15px;
	border-bottom: 1px #999 solid;
	text-align: center;
	background: #330401;
	color: #fff; 
	padding: 5px;
}




[data-img-pos="右"] .blog-system-post-post-img1,
 [data-img-pos="右"] .blog-system-post-post-img2,
 [data-img-pos="右"] .blog-system-post-post-img3{
    float: right;
    width:40%;

}

[data-img-pos="右"] .blog-system-post-post-body {
	width: 59%;
	margin-right: 1%;
    float: left;
}


[data-img-pos="左"] .blog-system-post-post-img1,
[data-img-pos="左"] .blog-system-post-post-img2,
[data-img-pos="左"] .blog-system-post-post-img3{
    float: left;
    width: 40%;
}

[data-img-pos="左"] .blog-system-post-post-body {
	width: 59%;
    float: right;
    margin-left: 1%;
}



.int_blogR{
	width: 15%;
	margin-left: 1%;
	/* float: right; */
}

.int_blogL{
	width: 82%;
	padding-right: 1%;
	float: left;
	/* border-right: 1px solid #f1efef; */
}

.int_blog{
	width: 100%;
}


/* pad SIZE */
@media screen and (max-width: 1024px){


	.int_blogL{
		width: 70%;
	}
	.int_blogR{
		width: 25%;
	}	



	.blog-system-headlines-headline-container{
		width: 42%;
		min-height:350px;
	}
	
	
}


/* SMARTPHONES SIZE */
@media screen and (max-width: 850px){

		.blog-system-headlines-headline-container{
			width: 98%;
			/* border: 1px #eee solid; */
			padding: 1%;
			margin: 1%;
			float: left;
			min-height: 320px;
		}

		.blog-system-postmonths-yearmonth{
			display: inline; 
			float: left;
			padding: 1%;
			margin-right: 1%;
			margin-bottom: 1%;
			border: 1px solid #999;
			min-width: 29.3%;
		}
					
		.blog-system-postmonths-yearmonth-year,
		.blog-system-postmonths-yearmonth-month2,
		.blog-system-postmonths-yearmonth-count {
				font-size: 0.9em;
		}
		
		.blog-system-postmonths-yearmonth-year{
			padding-left: 2px;
		}


		
	.int_blogR{
		width: 98%;
		margin-left: 1%;
		float: right;
		margin: 2%;
		margin-left:2%;
	}

	.int_blogL{
		width: 98%;
		padding-right: 1%;
		float: left;
		border-right: none;
		margin: 2%;
	}

	.int_blog{
		width: 100%;
	}

		

}





/* SMARTPHONES SIZE */
@media screen and (max-width: 667px){



}

/* SMARTPHONES SIZE */
@media screen and (max-width: 400px){


		.blog-system-postmonths-yearmonth{
			min-width: 44.3%;
		}


		.blog-system-headlines-headline-container{
			width: 96%;
			border: 1px #999 solid;
			padding: 2%;
			margin: 10px 1%;
			float: left;
			min-height: 250px;
		}




		[data-img-pos="右"] .blog-system-post-post-img1,
		[data-img-pos="右"] .blog-system-post-post-img2,
		[data-img-pos="右"] .blog-system-post-post-img3{
		    float: right;
		    width:90%;
		    padding: 5%;

		}
		
		[data-img-pos="右"] .blog-system-post-post-body {
			width: 100%;
			margin-right: 0%;
		    float: left;
		}
		

		[data-img-pos="左"] .blog-system-post-post-img1,
		[data-img-pos="左"] .blog-system-post-post-img2,
		[data-img-pos="左"] .blog-system-post-post-img3{
		    float: left;
		    width: 90%;
		    padding: 5%;
		}
		
		[data-img-pos="左"] .blog-system-post-post-body {
			width: 100%;
		    float: right;
		    margin-left: 0%;
		}



}ntainer,
.blog-system-postmonths-yearmonth-year,
.blog-system-postmonths-yearmonth-month2,
.blog-system-postmonths-yearmonth-count {/* 必要なパーツのみを明示的に表示 */
	display: inline;
}
[class^="blog-system-headlines-headline-"] {/* 必須（将来の機能拡張に備えいったん全てを非表示にする） */
	display: none;
}
.blog-system-headlines-headline-container,
.blog-system-headlines-headline-date,
.blog-system-headlines-headline-title,
.blog-system-headlines-headline-body,
.blog-system-headlines-headline-img1 {/* （↑の続き）必要なパーツのみを明示的に表示 */
	display: block;
}
/* ここから下は全くの自由 */


.blog-system-headlines-headline-img1{

position: relative;

top: -40px;

left: 0;
}	

/* box index list 使用  F9F4F4(ピンク系)  FCFCFC*/
.blog-system-headlines-headline-container{
	width: 28%;
	/*   border: 1px #ddd solid;*/
	padding: 1%;
	margin: 1%;
	float: left;
	min-height: 160px;
	/* background: #fefefe; */
	/* border-top: 1px solid #eee; */
	max-height: 100px;
	position: relative;
	top: 0;
	left: 0;
	width: 95%;
	table-layout: fixed;
}

.blog-system-headlines-headline-title{/* font-size: 1em; */overflow: 
	hidden;text-align: left;white-space: nowrap;text-overflow: ellipsis;font-weight: 600;
	color: #fff;font-size: 0.8rem;position: absolute;top: 30px;left: 140px;
	font-size: 1em;z-index: 1;overflow: hidden; /*white-space: nowrap;text-overflow: ellipsis;overflow: hidden;/* white-space: nowrap; */text-overflow: ellipsis;word-break: break-all;width: calc(100% - 220px);color: #FF9800;}
.blog-system-headlines-headline-title a{color: #FF9800;}
.blog-system-headlines-headline-title a:visited {color: #FF9800;} /*訪問済みのリンクの色*/
.blog-system-headlines-headline-title :hover {color:#fff; } /*カーソルが乗っているリンクの色*/
.blog-system-headlines-headline-title :active {color:#FF9800;} /*クリック中のリンクの色*/





.blog-system-postmonths-yearmonth{display: inline;padding-right: 15px;}


.blog-system-postmonths-yearmonth-year,
.blog-system-postmonths-yearmonth-month2,
.blog-system-postmonths-yearmonth-count {
		font-size: 1.05em;
		color: #fff;
}

.blog-system-postmonths-yearmonth-year{
	padding-left: 1px;
}

.blog-system-postmonths-yearmonth-count{
	padding-left: 10px;
	font-size: 0.8em;
}
.blog-system-postmonths-yearmonth-count:before {
	content: '(';
}
.blog-system-postmonths-yearmonth-count:after {
	content: ')';
}
.blog-system-postmonths-yearmonth-year:after {
	content: '年';
}
.blog-system-postmonths-yearmonth-month2:after {
	content: '月';
}
.blog-system-headlines-headline-date {
	color: #fff;
	font-size: large;
	font-weight: bold;
	/* display: none; */
	font-size: 1rem;
	text-align: left;
	position: relative;
	top: 0;
	padding-left: 0;
	left: 130px;
	width: calc(100% - 130px);
	/* width: calc(100px + 50px); */
	overflow: hidden;
}
.blog-system-headlines-headline-img1 img {
	width: 100%;
	height: auto;
	padding: 5% 2%;
	/* max-height: 150px; */
	/* max-width: 90%; */
	overflow: hidden;
	width: 50%;/* トリミングしたい枠の幅 */
	height: 50%;/* トリミングしたい枠の高さ */
	position: relative;
	overflow: hidden;
	width: 100px;/* トリミングしたい枠の幅 */
	height: 100px;/* トリミングしたい枠の高さ */
	position: relative;
	object-fit: cover;
	/* padding: 1px; */
}


.blog-system-headlines-headline-body{
	font-size: 0.9em;
	color: #fff;
	position: absolute;
	top: 60px;
	left: 140px;
	font-size: 1rem;
	max-height: 3.5em;
	line-height: 1.2;
	overflow: hidden;
	letter-spacing: 0.08em;
	padding: 1px 5px 0 0;
	line-height: 1.3;
	margin: 0;
	overflow: visible;
	/* white-space: nowrap; */
	/* text-overflow: ellipsis; */
}

/* ここから下は自由に記述可 */
.blog-system-post-post-date {
	margin-top: 15px;
	color: #000;
	font-size: large;
	font-weight: 400;
	display: none;
}
.blog-system-post-post-title{
	color: #330401;
	font-size: large;
	font-weight: 600;
	background: #fff;
	margin-bottom: 10px;
	padding: 8px;
}

.blog-system-post-post-body{
	color: #fff;
	margin-top: 10px;
}


.blog-system-post-post-body img {
	height: auto;
}
[class^="blog-system-post-post-img"] img {
	max-width: 100%;
	padding: 3% 1%;
	height: auto;
	float: left;
}


.blog-system-post-post-img1{
	width: 100%;
	max-width: 400px;
	display: none;
}

.blog-system-post-post-img2{
	width: 100%;
	max-width: 400px;
}

.blog-system-post-post-img3{
	width: 100%;
	max-width: 400px;
}



.t_title{
	font-size: 1.3em;
	margin-bottom: 15px;
	text-align: left;
}


.s_title{
	font-size: 1.2em;
	margin-bottom: 15px;
	border-bottom: 1px #999 solid;
	text-align: center;
	background: #330401;
	color: #fff; 
	padding: 5px;
}




[data-img-pos="右"] .blog-system-post-post-img1,
 [data-img-pos="右"] .blog-system-post-post-img2,
 [data-img-pos="右"] .blog-system-post-post-img3{
    float: right;
    width:30%;

}

[data-img-pos="右"] .blog-system-post-post-body {
	width: 60%;
	margin-right: 1%;
	float: left;
}



.blog-system-post-post-body a{
	color:#111;
	/* background: #7eccd6; */
	padding: 3px 10px;
	border-radius: 5px;
}
.blog-system-post-post-body a:hover{
	color:#111;
/* 	background: #caedf2; */
	padding: 3px 10px;
	border-radius: 5px;
}



[data-img-pos="左"] .blog-system-post-post-img1,
[data-img-pos="左"] .blog-system-post-post-img2,
[data-img-pos="左"] .blog-system-post-post-img3{
    float: left;
    width: 30%;
}

[data-img-pos="左"] .blog-system-post-post-body {
	width: 30%;
    float: right;
    margin-left: 1%;
}



.int_blogR{
	width: 100%;
	margin-left: 0%;
	/* float: right; */
	/* margin: 50px 0 0; */
	padding: 50px 5px;
	/* border-top: 1px solid #fff; */
	clear: both;
	font-size: 16px;
}

.int_blogL{
	width: 100%;
	padding-right: 1%;
	float: left;
	/* border-right: 1px solid #f1efef; */
}

.int_blog{
	width: 100%;
}


/* pad SIZE */
@media screen and (max-width: 1024px){


	.int_blogL{
		width: 100%;
	}
	.int_blogR{
		width: 100%;
		margin-bottom: 50px;
	}	



	.blog-system-headlines-headline-container{
		width: 100%;
		/* min-height:350px; */
	}
	
	
}


/* SMARTPHONES SIZE */
@media screen and (max-width: 850px){

		.blog-system-headlines-headline-container{
			width: 98%;
			/* border: 1px #eee solid; */
			padding: 1%;
			margin: 1%;
			float: left;
			min-height: 320px;
		}

		.blog-system-postmonths-yearmonth{
			display: inline; 
			float: left;
			padding: 1%;
			margin-right: 1%;
			margin-bottom: 1%;
			border: 1px solid #999;
			min-width: 29.3%;
		}
					
		.blog-system-postmonths-yearmonth-year,
		.blog-system-postmonths-yearmonth-month2,
		.blog-system-postmonths-yearmonth-count {
				font-size: 0.9em;
		}
		
		.blog-system-postmonths-yearmonth-year{
			padding-left: 2px;
		}


		
	.int_blogR{
		width: 98%;
		margin-left: 1%;
		float: right;
		margin: 2%;
		margin-left:2%;
	}

	.int_blogL{
		width: 98%;
		padding-right: 1%;
		float: left;
		border-right: none;
		margin: 2%;
	}

	.int_blog{
		width: 100%;
	}

		

}





/* SMARTPHONES SIZE */
@media screen and (max-width: 667px){



}

/* SMARTPHONES SIZE */
@media screen and (max-width: 500px){


.blog-system-headlines-headline-date {
    left: 130px;
}


.blog-system-headlines-headline-title {
    left: 130px;
}

.blog-system-headlines-headline-body {
    left: 130px;
}


.blog-system-headlines-headline-img1 img {
    width: 100%;
    height: auto;
    padding: 2%;
    /* max-height: 150px; */
    /* max-width: 90%; */
    overflow: hidden;
    width: 50%;
    height: 50%;
    position: relative;
    overflow: hidden;
    width: 120px;
    height: 90px;
    position: relative;
    object-fit: cover;
}



		.blog-system-postmonths-yearmonth{
			min-width: 44.3%;
		}


		.blog-system-headlines-headline-container{
			width: 96%;
			/* border: 1px #999 solid; */
			padding: 2%;
			margin: 10px 1%;
			float: left;
			min-height: 140px;
		}




		[data-img-pos="右"] .blog-system-post-post-img1,
		[data-img-pos="右"] .blog-system-post-post-img2,
		[data-img-pos="右"] .blog-system-post-post-img3{
		    float: right;
		    width:90%;
		    padding: 5%;

		}
		
		[data-img-pos="右"] .blog-system-post-post-body {
			width: 100%;
			margin-right: 0%;
		    float: left;
		}
		

		[data-img-pos="左"] .blog-system-post-post-img1,
		[data-img-pos="左"] .blog-system-post-post-img2,
		[data-img-pos="左"] .blog-system-post-post-img3{
		    float: left;
		    width: 90%;
		    padding: 5%;
		}
		
		[data-img-pos="左"] .blog-system-post-post-body {
			width: 100%;
		    float: right;
		    margin-left: 0%;
		}



}
		[data-img-pos="左"] .blog-system-post-post-img1,
		[data-img-pos="左"] .blog-system-post-post-img2,
		[data-img-pos="左"] .blog-system-post-post-img3{
		    float: left;
		    width: 90%;
		    padding: 5%;
		}
		
		[data-img-pos="左"] .blog-system-post-post-body {
			width: 100%;
		    float: right;
		    margin-left: 0%;
		}






/*--------------------------------------------------------------------------
   overwrite  - 共通CSSの上書き -
---------------------------------------------------------------------------*/

.pagetitle {
	padding: 5px;
	/* padding-bottom: 0; */
	text-align: center;
	/* background: url(../images/cotents_bg01.jpg); */
	background-position: 0 0;
	position: relative;
	overflow: hidden;
	/* height: 250px; */
	/* background: #eee; */
}

.pagetitle ul{
	width: 100%;
	max-width: 1200px;
	margin:0 auto;
	text-align: right;
	font-size: 14px;
}


	
.pagetitle li{
	display:inline;
	padding: 0 5px;
}



.pagetitle {padding: 5px 1%;position:relative;z-index:1;/* border-top: #ededed 1px solid; *//* border-bottom: #f5f5f5 1px solid; *//* margin-bottom: 30px; *//* background: #999; *//* margin-bottom: 20px; */text-align: right;}
.pagetitle:before {/* position:absolute; *//* top:-1px; *//* left:5%; *//* right:5%; *//* height:0; *//* content:""; */border-top:#ededed 1px solid;z-index:2;}
.pagetitle ol { font-size: 0; margin: 0; padding: 0; line-height: 1.8; line-height:1; }
.pagetitle li {display: inline-block; *display: inline;*zoom: 1;list-style: none;font-size: 14px;font-weight: normal;margin: 0;padding: 0;letter-spacing: 1px;height:20px;line-height:20px;}
/*#pagetitle li:after { font-size: 6px; font-family: 'themify'; content: "\e649"; font-weight: normal; margin: 0 10px; height:20px; line-height:20px; }*/
.pagetitle li:after {/* font-size: 10px; *//* font-family: 'FontAwesome'; *//* content: "\f105"; */font-weight: normal;margin: 0 10px;height:20px;line-height:20px;}


.pagetitle li:last-child:after { display:none;}
.pagetitle li i { font-size: 16px; padding-right: 5px; font-weight: normal; line-height: 1.3; }
.pagetitle li a {/*border-bottom: #999 1px solid;*/position:relative;z-index:1;height:20px;line-height:20px;color: #fff;}
/*.breadcrumb li:first-child a:before {padding-right:5px; font-size: 11px; font-family: 'themify'; content: "\e69b";}*/
.pagetitle li:first-child a:before {padding-right:5px;font-size: 1.2rem;/* font-family: 'FontAwesome'; *//* content: "\f015"; */}

.pagetitle li a:after {position:absolute;top:0;left:0;bottom:0;width:0;content:"";background:transparent;z-index:-1;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;}
.pagetitle li a:hover:after { width:100%; /*background:#d7e4ed; */}
.pagetitle li a:hover { color:#aaa; /*border-bottom: #999 1px solid;*/}

@media only screen and (max-width: 800px) {
.pagetitle { padding:20px 5%; border-top:none;}
.breadcrumb:before { display:none;}
.pagetitle li a {/*border-bottom: #aaa 1px solid;*/font-size: 16px;}
.pagetitle li a:hover:after { display:none;}
.pagetitle li a:hover { color:#000; }
}

@media only screen and (max-width: 414px) {
.pagetitle ol { font-size: 0; margin: -10px auto 0; padding: 0; display:block; text-align:left; }
.pagetitle li {font-size: 14px;margin: 10px 0 0;padding: 0;letter-spacing: 1px;}
.pagetitle li:after { margin: 0 5px;}
.pagetitle li:last-child {overflow: hidden;text-overflow: ellipsis; white-space: nowrap; width:10em;}
.pagetitle li:first-child a { font-size:0; width:auto;padding-bottom: 7px; }
.pagetitle li:first-child a:before {padding-right:0; font-size: 18px;}
}

@media only screen and (max-width: 320px) {
.pagetitle li:last-child { width:6em;}	
}