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

/******************************************************************************************
カテゴリータイトル
******************************************************************************************/
.category_main_title {
	text-align: center;
	height: 50px;
	width: 100%;
	margin: 0 0 30px;
	padding: 15px 0 15px;
}
#main_visual.category_main_title { margin-bottom: 0;}
#category_music { background-color: #3598db; }
#category_movie { background-color: #9b58b5; }
#category_book { background-color: #34495e; }
#category_travel { background-color: #f1c40f; }
#category_diary { background-color: #1bbc9b; }
#category_work { background-color: #e77e23; }
#category_guitar { background-color: #01bdd6; }
#category_live { background-color: #ea1e63; }
#category_comic { background-color: #5d35b0; }
#category_music, #category_movie, #category_book, #category_travel, #category_diary, #category_work, #category_guitar, #category_live, #category_comic { border-radius: 4px; }
/******************************************************************************************
カテゴリーの幅
******************************************************************************************/
#category_wrap {
	margin: 0 0 40px;
	padding: 20px;
	background-color: #ffffff;
	overflow: hidden;
	border-radius: 4px;
}
/******************************************************************************************
記事の文字要素
******************************************************************************************/
#category_wrap p {font-size :16px; color :#232323; }
#category_wrap p.date { color :#3598db;  margin: 0 0 10px; }
.category_title {
	text-align: center;
	margin:0 0 20px;
}
.category_title h1 {
	font-size: 20px;
	color: #3598db;
	font-weight: bold;
}
#category_wrap p a { color :#3598db; text-decoration: underline; }
#category_wrap p a:hover { color :#F24744; text-decoration: underline; }
/******************************************************************************************
ページ送りの要素
******************************************************************************************/
.prevnext { overflow:hidden; }
.prevnext a { color:#3598db; font-weight:bold; }
.prev a { float: left; }
.next a { float: right; }
.prev a, .next a { padding:10px 15px; background-color: #ffffff; transition: .2S; border: solid 2px #3598db; }
.prev a:hover, .next a:hover { background-color: #3598db; color:#ffffff; }
/******************************************************************************************
月別ページの要素
******************************************************************************************/
#archives_title {
	color: #34495e;
	text-align: center;
	font-size: 30px;
	font-weight: bold;
	margin-bottom:20px;
}
/******************************************************************************************
FontAwesomeのアイコンの要素
******************************************************************************************/
.fa-chevron-left { margin-right: 2px; }
.fa-chevron-right { margin-left: 2px; }
/******************************************************************************************
ページネーションの要素
******************************************************************************************/
.pagination { margin: 40px 0 30px; text-align: center; }
.pagination ul {
	display: inline-block;
	margin : 0;
	padding: 0;
	list-style: none;
}
.pagination li a, .pagination li > span {
	display: block;
	margin: 0 5px;
	padding: 10px 15px;
	border: solid 1px #3598db;
	color: #232323;
	font-size: 14px;
	text-decoration: none;
	background-color : #ffffff;
}
.pagination li > span { color: #ffffff; background-color : #3598db; }
.pagination li a:hover { color: #ffffff; background-color : #3598db; }
.pagination ul:after {
	content: "";
	display: block;
	clear: bth;
}
.pagination li { float: left; width: auto; }
.pagination-index li .dots {
	padding: 6px 2px;
	color: #232323;
	border-color: transparent;
	background-color: transparent;
}

/******************************************************************************************
LINEバナー要素
******************************************************************************************/
.line_banner { margin-bottom: 40px; }
.line_banner img { text-align:center; width:100%; }