@charset "utf-8";

/* ******************************************************************

	--post.css--

	1. Post setting
		1-1. PostTitle styles
		1-2. PostMeta styles
		1-3. PostCategory styles
		1-4. PostDate styles
		1-5. PostSubstr styles
		1-6. PostSummery styles
		1-7. PostMore styles
		1-8. PostIcon styles
		1-9. PostThumbnail styles
		1-10. PostBody styles
		1-11. PostList styles
		1-12. PostNav styles

	2. Article setting（詳細ページ）
		2-1. ArticleHead styles
		2-2. ArticleBody styles
		2-3. ArticleFoot styles

****************************************************************** */

/*==================================================================
	1. Post setting
===================================================================*/

/* ------------------------------------------------------------------
	1-1. PostTitle styles
-------------------------------------------------------------------*/
.post_title {
font-size: 16px;
line-height: 1.3;
	font-weight: bold;
}
.post_title a {
	color: #1d3994;
	text-decoration: none;
}
.post_title a:hover {
	color: #3e8bec;
	/*text-decoration: underline;*/
}

/* 記事タイトル（三角付き） */
.post_title-arrow {
	position: relative;
	padding-left: 12px;
}
.post_title-arrow:before {
	position: absolute;
left: 0;
	content: '\f0da';
	font-family: 'FontAwesome';
font-size: 18px;
	line-height: 1;
	font-weight: normal;
	color: #c9d4e2;
}


/* ------------------------------------------------------------------
	1-2. PostMeta styles
-------------------------------------------------------------------*/
.post_meta {
	display: inline-block;
	/*font-size: 12px;*/
}

/* ------------------------------------------------------------------
	1-3. PostCategory styles
-------------------------------------------------------------------*/
.post_cat {
	display: inline-block;
}
.post_cat > span {
	display: inline-block;
	margin-left: 10px;
	background: #333;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding: 1px 5px;
	color: #FFF;
	font-size: 12px;
	line-height: 1.5;
	font-weight: normal;
}
.post_cat span:first-child {
	margin-left: 0;
}
.post_cat a {
	color: #FFF;
	text-decoration: none;
}
span.icon_news { background: #4f7eb9;}
span.icon_sports { background: #22ac38;}
span.icon_editorial { background: #8957a1;}
span.icon_column { background: #f29b76;}
span.icon_fishing { background: #00b7ee;}

/* イベントのカテゴリ色の指定ここから */
span.icon_event_hobby { background: #f29b76;}
span.icon_event_other { background: #7d7d7d;}

span.icon_event_sample01 { background: #4f7eb9;}
span.icon_event_sample02 { background: #22ac38;}
span.icon_event_sample03 { background: #8957a1;}
span.icon_event_sample04 { background: #00b7ee;}
/* イベントのカテゴリ色の指定ここまで */



/* ------------------------------------------------------------------
	1-4. PostDate styles（記事日付）
-------------------------------------------------------------------*/
.post_date {
font-size: 12px;
	font-weight: normal;
	color: #a5a5a5;
}

/* ------------------------------------------------------------------
	1-5. PostSubstr styles（記事抜粋）
-------------------------------------------------------------------*/
.post_substr_parent {
	overflow: hidden;
	width: 100%;
}
.post_substr {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ------------------------------------------------------------------
	1-6. PostSummery styles（記事概要）
-------------------------------------------------------------------*/
.post_summary {
	color: #333;
	/*margin-top: 5px;*/
}
/*
.post_summary_item { }
.post_summary_item:before {
	font-family: 'FontAwesome';
	color: #845f4b;
	font-size: 14px;
}
.post_summary_item-place:before {
	content: '\f041';
	margin: 0 5px 0 2px;
}
.post_summary_item-period:before {
	content: '\f017';
	margin: 0 3px 0 0;
}
*/

/*-------------------------------*/
/*	記事リード文
/*-------------------------------*/
/*
.post_lead {
	line-height: 1.6;
}
*/

/* ------------------------------------------------------------------
	1-7. PostMore styles（続きを見る）
-------------------------------------------------------------------*/
.post_more a {
	color: #4f7eb9;
	text-decoration: underline;
}
.post_more a:hover {
	text-decoration: none;
}

/* ------------------------------------------------------------------
	1-8. PostIcon styles（アイコン）
-------------------------------------------------------------------*/
.post_icon {
	float: left;
	height: 22px;
}
.post_icon span { display: inline-block;}

.icon_photo { background: url(../img/bg_icon.gif) no-repeat 0px 6px; width: 18px; height: 22px;}
.icon_key { background: url(../img/bg_icon.gif) no-repeat -36px 6px; width: 15px; height: 22px;}
.icon_movie { background: url(../img/bg_icon.gif) no-repeat -18px 6px; width: 18px; height: 22px;}
.icon_pdf { background: url(../img/bg_icon.gif) no-repeat -51px 6px; width: 15px; height: 22px;}

/* ------------------------------------------------------------------
	1-9. PostThumbnail styles（写真）
-------------------------------------------------------------------*/
.post_thm {
	float: left;
	margin-right: 10px;
	text-align: center;
}
.post_thm a {
	display: block;
}

/* 写真（逆配置） */
.post_thm-reverse {
	float: right;
	margin-right: 0;
	margin-left: 10px;
}



/* 写真（トリミングする場合） */
.post_thm_fit {
	/*overflow: hidden;*/
}
.post_thm_fit img {
	object-fit: cover;
}
/* 写真（サイズM） */
.post_thm_fit-m_default img {
	width: 80px;
	height: 80px;
}

/* 写真（サイズSS） */
.post_thm_fit-ss_default img {
	width: 60px;
	height: 60px;
}


/* 写真（フレーム） */
.post_thm_bg {
	/*
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	*/
	position: relative;
}
.post_thm_bg img {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);

	max-width: 100%;
	max-height: 100%;
}
/* 写真（サイズL） */
/*
.post_thm_bg-l_default {
	border: 1px solid #e5e5e5;
	background: #FFF;
	width: 180px;
	height: 180px;
}
*/
/* 写真（サイズM） */
.post_thm_bg-m_default {
	background: #eee;
	width: 200px;
	height: 150px;
}

/* 写真（サイズS） */
.post_thm_bg-s_default {
	background: #eee;
	width: 80px;
	height: 60px;
}

/* 写真（サイズSS） */
/*
.post_thm_bg-ss_default {
	background: #eee;
	width: 60px;
	height: 60px;
}
*/

.img1x1 .article_body_photo a {
	display: inline-block;
	width: 100%;
	max-width: 680px;
	position: relative;
}
.img1x1 .article_body_photo a::before {
	content: "";
	display: block;
	padding-top: 100%;
}
.img1x1 .article_body_photo img {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: contain;
}

.img1x1 .h-100 {
  height: auto !important;
}


/* ------------------------------------------------------------------
	1-10. PostBody styles（タイトルや日付を囲むdiv）
-------------------------------------------------------------------*/
.post_body {
	overflow: hidden;
}









/* ------------------------------------------------------------------
	1-11. PostList styles（記事リスト）
-------------------------------------------------------------------*/
.post_list { }
.post_item {
	border-bottom: 1px solid #c9d4e2;
	vertical-align: top;
}
.post_item a {
	display: block;
	padding: 3%;
	text-decoration: none;
}

.fluid_col_post .fluid_col_item {
	margin-bottom: 0;
}

/* 記事_サムネイル80x80付き */
.post_list-type_thm_bg-m { }
.post_list-type_thm_bg-m .post_title {
	padding-bottom: 2%;
}

/* 記事_サムネイル90x90付き */
.post_list-type_thm_bg-s { }
.post_list-type_thm_bg-s .post_title { }



/* 記事_グリッドタイプ */
.post_list-type_grid { }
.post_list-type_grid .post_item {
	border-bottom: none;
}
.post_list-type_grid .post_item a {
	padding: 0;
}
.post_list-type_grid .post_thm {
	float: none;
	margin: 0 0 5% 0;
}
.post_list-type_grid .post_title {
font-size: 12px;
	text-align: center;
	line-height: 1.3;
}
.post_list-type_grid .post_summary {
font-size: 12px;
}
/*
.post_list-type_grid .post_thm_bg {
	width: 100%;
}
*/


/* 記事_アイキャッチ */
/*
.post_list-type_catch { }
.post_list-type_catch .post_item {
	border-bottom: none;
	padding: 5px 0;
}
.post_list-type_catch .post_thm {
	float: left;
	margin-left: 0;
	margin-right: 10px;
}
.post_list-type_catch .post_title {
	font-size: 18px;
}
*/

/* 記事_ランキング */
.post_list-type_rank .post_item a {
	display: table;
	width: 100%;
}
.post_list-type_rank .post_cell {
	display: table-cell;
	vertical-align: top;
}
.post_list-type_rank .post_cell-rank {
	width: 26px;
	font-size: 16px;
	font-weight: bold;
	color: #333;
}


/* 記事_関連記事（日付＆カテゴリナシ） */
.post_list-type_simple { }
.post_list-type_simple .post_item {
	border-bottom: none;
}
.post_list-type_simple .post_item a {
padding: 3%;
/*padding: 3% 3% 3% 25px;*/
}
.post_list-type_simple .post_meta {
padding-left: 12px;
}
/*
.post_list-type_simple .post_title {
	position: relative;
}
.post_list-type_simple .post_title:before {
	position: absolute;
	top: 0;
	left: -15px;
	content: '\f0da';
	font-family: 'FontAwesome';
	font-size: 22px;
	line-height: 1;
	font-weight: normal;
	color: #c9d4e2;
}
*/


/* ------------------------------------------------------------------
	1-12. PostNav styles（記事ナビゲーション）
-------------------------------------------------------------------*/
.post_nav {
	/*background: #eee;*/
	display: table;
	width: 100%;
	border-bottom: 1px solid #333;
	padding: 3%;
	font-weight: bold;
}
.post_nav_prev {
	display: table-cell;
	vertical-align: middle;
}
.post_nav_next {
	display: table-cell;
	vertical-align: middle;
	text-align: right;
}
.post_nav_current {
	display: table-cell;
	width: 70%;
	text-align: center;
	font-size: 16px;
}
.post_nav a {
	display: block;
}










/*==================================================================
	2. Article setting（詳細ページ）
===================================================================*/
.page_article { }

/* ------------------------------------------------------------------
	2-1. ArticleHead styles
-------------------------------------------------------------------*/
.article_head {
	border-bottom: 1px solid #c9c9c9;
padding: 0 3% 3% 3%;
}
.article_head_title {
font-size: 20px;
	line-height: 1.2;
	font-weight: bold;
	color: #1d3994;
}
.article_head .post_meta {
	margin-top: 5px;
}


/* ------------------------------------------------------------------
	2-2. ArticleBody styles
-------------------------------------------------------------------*/
.article_body { }
.article_thm {
margin-bottom: 3%;
}
.article_thm_list {
	background: #eee;
padding: 3%;
}
.article_thm_item {
	margin-top: 10px;
text-align: center;
}
.article_thm_item:first-child {
	margin-top: 0;
}
.article_thm_item a {
	display: block;
	position: relative;
}
.article_thm_item-movie a:before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	display: block;
	background: url(../img/playback.png) center center no-repeat;
	-webkit-background-size: 30%;
	background-size: 30%;
}
.article_thm_item-movie a:hover {
	opacity: .7;
}
.article_thm_caption {
	margin-top: 5px;
text-align: left;
}

.article_text {
font-size: 18px;
line-height: 1.6;
padding: 0 3%;
}

.article_relation {
	background: #eee;
padding: 3%;
margin-bottom: 5%;
}
.article_relation_title {
	font-size: 14px;
}

.article_body_photo {
	background-color: #eee;
	padding:0.8rem;
	font-size:0.8rem;
	position: relative;
	overflow: hidden;
	max-width: 100%;
	text-align: center;
}
.article_body_photo img {
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
}
.article_body_photo .caption {
	margin-top: 5px;
	text-align: left;
}

/* ------------------------------------------------------------------
	2-3. ArticleFoot styles
-------------------------------------------------------------------*/
/*
.article_foot {
	margin-top: 20px;
}
*/









/*-------------------------------*/
/*	SNSアイコン
/*-------------------------------*/
.share_list {
	padding: 2% 3%;
	font-size: 0;
}
.share_item {
	display: inline-block;
	vertical-align: top;
	text-align: center;
	margin-right: 5px;
	font-size: 20px;
	line-height: 1;
}
.share_link{
	border-radius: 50%;
	position: relative;
	display: inline-block;
	width: 34px;
	height: 34px;
	color: #FFF !important;
	text-decoration:none;
}
.share_link i{
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}
/* LINE */
.share_link_li{
background:#00c300;
}
/* はてブ */
.share_link_hb{
background:#1ba5dc;
}
/* Facebook */
.share_link_fb{
background:#3b5998;
}
/* Twitter */
.share_link_tw{
background:#55acee;
}


.provider {
	text-align: right;
}


/*-------------------------------*/
/*	会員限定記事のパネル
/*-------------------------------*/
.members_panel {
	background: #e5e5e5;
	padding: 15px;
	text-align: center;
	font-size: 16px;
	margin: 30px 0;
}
.members_panel_title {
	font-weight: bold;
}
.members_panel_text {

}











/*-------------------------------*/
/*	併せて読みたい
/*-------------------------------*/
/*
.section_relation {
	padding-top: 20px;
}
.section_relation .post_list-type_grid .post_thm_bg {
	height: 100px;
	background-color: #e5e5e5;
}
*/









/*-----------------------------------------------------------------------------------*/
/*	速報
/*-----------------------------------------------------------------------------------*/
.flash_list { }
.flash_list > li {
	background: #d55482;
	position: relative;
	margin-bottom: 5px;
	padding: 5px 5px 5px 48px;
}
.flash_list li:before {
	position: absolute;
	top: 10px;
	left: 15px;
	content: '\f071';
	font-family: 'FontAwesome';
	font-size: 24px;
	line-height: 1;
	font-weight: normal;
	color: #fce805;
}
.flash_list .post_date {
	font-size: 16px;
	font-weight: bold;
	color: #FFF;
	margin-right: 5px;
}
.flash_list > li a {
	font-size: 20px;
	font-weight: bold;
	color: #FFF;
}



/*-----------------------------------------------------------------------------------*/
/*	ジャンル（TOP・記事一覧）
/*-----------------------------------------------------------------------------------*/
.section_genre { }
