@charset "utf-8";

/*  【注意】このファイル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;
	color: #222;
}
/* ここから下は全くの自由 */

/* box index list 使用 */
.blog-system-headlines-headline-container{
	width: 95%;
	position:relative;
	top:0;
	font-family: "Brandon Grot W01 Bold";
	/* border-bottom: 1px solid #E5E5E5; */
	padding: 2%;
	margin: 1%;
	/* min-height: 110px; */
}

.blog-system-headlines-headline-title{
	 /* padding-left: 210px; */
	 /* font-size: 1.2em; */
	 /* top: 0; */
	 /* font-size: 15px; */
	 /* font-weight: normal; */
	 /* margin-top: 15px; */
	 /* margin-bottom: 8px; */
	 /* line-height: 1.2; */
	 /* font-size: 16px; */
	 /* font-family: 'Catamaran', sans-serif; */
	 /* font-weight: 500; */
	 /* letter-spacing: 2.5px; */
	 /* line-height: 1.8; */
	 /* position: relative; */
	 /* z-index: 4; */
	 top: 160px;
	 margin: auto 0;
	 /* background: #fefefe;*/
	 font-size: 14px;
	 font-weight: 700;
	 line-height: 50px;
	 letter-spacing: 1px;
	 position: relative;
	 z-index: 3;
	 /* -webkit-border-radius: 100%; */
	 -moz-border-radius: 100%;
	 /* border-radius: 100%; */
}
.blog-system-headlines-headline-title a{
 /*	color: rgba(0,150,182,0.80); */
 color: #111;
 text-decoration: none;
 font-weight: 600;
 font-family: 'Catamaran', sans-serif;
}
.blog-system-headlines-headline-term-from,
.blog-system-headlines-headline-term-to{
	position:relative;
	top: 170px;
	font-size: 13px;
	display:inline;
}


.blog-system-headlines-headline-term-from{
	padding-right:1em;
}
.blog-system-headlines-headline-term-to:before{
	padding-right:1em;
	content:"ー"
}

.blog-system-headlines-headline-sub-title{
	position:relative;
	top: 160px;
	font-size:13px;
	line-height: 1.3;
}



.blog-system-postmonths-yearmonth-year,
.blog-system-postmonths-yearmonth-month2,
.blog-system-postmonths-yearmonth-count {
		font-size: 1.2em;
}

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

.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: 14px;
	font-weight: 500;
	display: none;
}
.blog-system-headlines-headline-img1 img {
	/* position: absolute; */
	/* top: -20px; */
	/* height: 60px; */
	/* width: 100%; */
	/* vertical-align: middle; */
	/* padding: 0 0; */
	overflow: hidden;
	position: relative;
	z-index: 1;
}

.blog-system-headlines-headline-img1{display:block;position: absolute;top: 0;width: 96%;}


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

/* ここから下は自由に記述可 */
.blog-system-post-post-date {
	margin-top: 15px;
	color: #000;
	font-size: large;
	font-weight: 400;
	display: none;
}
.blog-system-post-post-title{
	color: #f5f5f5;
	background: #607D8B;
	margin-bottom: 10px;
	padding: 5px 10px;
	/* border: 3px solid #795548; */
	border-radius: 2px;
	font-size: 20px;
}

.blog-system-post-post-sub-title{
	font-size: 17px;
}

.blog-system-post-post-body p{
	font-size: 16px;
	padding: 5px;
}


.blog-system-post-post-term-from,
.blog-system-post-post-term-to{
		font-size: 17px;
		display: inline;
		color: #3765a3;
}

.blog-system-post-post-term-from:before{
	padding-right:1em;
	content:"会期："
}

.blog-system-post-post-term-from{
	padding-right: 1em;
	color: #3765a3;
}


.blog-system-post-post-term-from:after{
	padding-left:1em;
	content:"ー"
}


.blog-system-post-post-title p{
	font-size:20px;
	font-weight: 700;
}


blog-system-post-post-body{

	margin-top: 10px;
}


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


.blog-system-post-post-img1{
	display:none;
}

.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;
}




[class^="blog-system-post-post-img"] img {
		max-width: 450px;
		height: auto;
	}


/* フレックスボックス
-----------------------------------------------------------------*/

.item-container {
  display: flex;
  flex-wrap: wrap;
  border: 1px solid #eee;
  padding: 0.4em;
  margin: 15px 0 40px;
  /* margin-bottom: 100px; */
}

.item_m {
 /* background: #f9f9f9; */
 padding: 1em;
 border-radius: 5px;
 flex: 1 0 100%;
 margin: 0.4em;
 }
.item_m p {

	}

.item_m2 {
	 background: #fff;
	 padding: 1em;
	 border-radius: 5px;
	 flex: 1 0 250px;
	 margin: 0.2em;
 }

.item_m2 p{
	 padding: 0.1em 0.5em;
	 margin: 0.2em 0.2em 1em;
	}

.item_m3 {
 background: #fff;
 padding: 1em;
 border-radius: 5px;
 flex: 1 0 33.33%;
 margin: 0.4em;
 }

.item_m4 {
 background: #f9f9f9;
 padding: 1em;
 border-radius: 5px;
 flex: 1 0 25%;
 margin: 0.4em;
 }

 .item_m5 {
 background: #f9f9f9;
 padding: 1em;
 border-radius: 5px;
 flex: 1 0 20%;
 margin: 0.4em;
 }


.item_m2 img{
	width: 60%;
	margin: 0 10%;
	padding: 10%;
	}

.item_m h1 {
	margin-bottom: 10px;
}

.item_m h2 {
	
	color: #999;

}


.item_m p {text-align: left;padding: 20px 20px 20px;}

.item_m p.img_cap {padding:0 0 10px; text-align:center;}




.item_m img,
.item_m2 img,
.item_m3 img,
.item_m4 img,
.item_m5 img
{
	width: 90%;
	padding: 5%;
	margin: 0;
	}


.item_m a {
	text-decoration: none;
 }

.item_m img a:hover {
	filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
	
 }

.item_m_title{
	font-size: 17px;
	font-weight: 600;
	color: #09437c;
	background: #eee;
	line-height: 26px;
}
.item_m_title p{
	font-size: 20px;
}

.item_m_txt{
	font-size: 16px;
}

.item_m_txt span{
	border-bottom:1px dashed #9E9E9E;
	line-height:2;
	padding: 3px
}



.txt_c{
	text-align: center;
	
}





@media only screen and (min-width: 1024px){

	.blog-system-headlines-headline-container{
		    width: 600px;

	}
}


@media only screen and (min-width: 768px){

	.blog-system-headlines-headline-container{position:relative;top:0;width: 100%;margin: 0;}
}

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

	.blog-system-headlines-headline-container{
		/* max-height: 100px; */
		position: relative;
		top: 0;
		left: 0;
		width: 100%;
	}

	.blog-system-headlines-headline-title{
		font-size: 0.8em;
		font-size: 13px;
		position: absolute;
		top: 140px;
		/* left: 230px; */
	}

	.blog-system-headlines-headline-sub-title{
		position:relative;
		top: 180px;
		font-size:13px;
		line-height: 1.3;
	}


	.blog-system-post-post-title {
		/* color: #fff; */
		font-size: 1.15em;
		font-weight: 600;
		/* background: #330401; */
		margin-bottom: 10px;
		padding: 12px;
	}


	.blog-system-post-post-title p{
		font-size:15px;
		font-weight: 700;
	}
	.blog-system-post-post-title p span{
		font-size: 11px;
		font-weight: 700;
	}


	.blog-system-headlines-headline-term-from,
	.blog-system-headlines-headline-term-to{
		position:relative;
		top: 200px;
		font-size: 12px;
		display:inline;
	}



	.blog-system-post-post-term-from,
	.blog-system-post-post-term-to{
			font-size: 15px;
			display: inline;
			color: #3765a3;
	}

	.blog-system-post-post-term-from:before{
		padding-right:8px;
		content:"会期："
	}

	.blog-system-post-post-term-from{
		padding-right: 3px;
		color: #3765a3;
	}


	.blog-system-post-post-term-from:after{
		padding-left:3px;
		content:"ー"
	}





	.blog-system-headlines-headline-body {
		font-size: 0.8em;
		font-size: 0.95rem;
		max-height: 5em;
		/* width: calc(100% - 200px); */
		padding-left: 10px;
	}

	[class^="blog-system-post-post-img"] img {
		max-width: 300px;
		height: auto;
	}

		.item_m {
	 /* background: #f9f9f9; */
	 padding: 1em;
	 border-radius: 5px;
	 flex: 1 0 100%;
	 margin: 0.4em;
	 }



}


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

	.item_m ,
	.item_m2,
	.item_m3,
	.item_m4,
	.item_m5 
	{
	 padding: 1em;
	 border-radius: 5px;
	 flex: 1 0 90%;
	 margin: 0.4em;
	 }

}