@charset "utf-8";

/*
theme Name: engblogthレスポンシブテーマ
Author: thosoda
Description: shintoko.engblogのレスポンシブテーマ
version： 1.0.0
*/

/* =8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=
テーマ(theme.css)：サイトのトンマナ(統一性)を定義
サイト全体の見た目や、雰囲気を統一させるためのスタイルを指定します
=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8=8= */

/* ================================================================ */
/* 記事一覧 */
/* ================================================================ */
.archive-top h1 {
font-size: 1.6rem;
margin-bottom: 1.5rem;
}
.archive-top p {
font-size: .875rem;
line-height: 1.7;
margin-bottom: 1.5rem;
}
.article-list {
  margin-bottom: 1rem;
  padding: 1rem;
  border: 1px solid #ddd;
}
.article-list:hover,
.article-relatedpost:hover {
  background-color: #eee;
}
.article-list a,
.article-relatedpost a {
  display: block;
  text-decoration: none;
  color: #333;
}
.article-list a:after,
.article-relatedpost a::after {
  display: block;
  clear: both;
  content: '';
}
.article-list .img-wrap {
  position: relative;
  float: left;
  line-height: 1;
}
/*サムネイル：外接トリミング*/
.article-list .img-wrap img {
  width: 360px;/*original 240px;*/
  height: 240px;/*original 160px*/
  object-fit: cover;
}

.article-list .img-wrap .cat-data {
  font-size: .85rem;
  position: absolute;
  top: 0;
  right: 0;
  padding: .3rem .5rem;
  color: #fff;
  background-color: rgb(88,122,160,.85);
}
.article-list .text {
  margin-left: 380px;
}
.article-list .text h2 {
  font-size: 1.2rem;
  line-height: 1.4;
  color: #163957;
  margin-bottom: 0.2rem;
  border-bottom: 1px groove;
}
.article-list .text .article-date,
.article-list .text .article-author {
  font-size: .75rem;
  font-weight: bold;
  display: inline-block;
  margin-bottom: .5rem;
  color: #888;
}
.article-list .text .article-date {
  margin-right: .5rem;
}
.article-list .text .article-author i {
  margin-right: .3rem;
}
.article-list .text p {
  font-size: .95rem;
  line-height: 1.7;
}
/*ページネーション*/
.pagination {
	font-size: 1.1em;
	overflow: hidden;
  margin-top: 15px;
}
.pagination ul, .pagination li{
  list-style: none;
}
.pagination span, .pagination a {
	display: block;
	float: left;
	width: auto;
	margin-right: 0.5em;
	padding: 0.2em 0.8em;
	background-color: #F4F9FD;
	border: 1px solid #c4dce8;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	color: #5e5e5e;
	text-decoration: none;
}
.pagination a:hover {
  color: #fff;
	background-color: #0270BE;
}
.pagination .current{
  background: #c4dce8;
  color: #000000;
  border: 1px solid #c4dce8;
}
.pagination .pc_page_navi{display: none;}

@media screen and (min-width:600px) {
	.pagination .mb_page_navi{ display: none; }
	.pagination .pc_page_navi{ display: block; }
}
/*---------------------------------------------------------
TOPページ
---------------------------------------------------------*/
.home-top .article-top .img-wrap img {
  width: 360px;
}
.home-top .article-top .text {
  margin-left: 380px;
}
.home-top .article-top .new-post {
  font-weight: bold;
  display: block;
  margin-bottom: .5rem;
  color: #f00;
}
/* 最初の記事NEW装飾 */
.ribbon20 {
  display: inline-block;
  position: absolute;
  left: 0;
  top: 5px;
  box-sizing: border-box;
  padding: 0 12px;
  margin: 0;
  height: 30px;
  line-height: 30px;
  font-size: 18px;
  letter-spacing: 0.1em;
  color: white;
  background: #FFAF26;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.12);
}
.ribbon20:before {
  position: absolute;
  content: '';
  top: 0;
  left: -7px;
  border: none;
  height: 38px;
  width: 7px;
  background: #FFAF26;
  border-radius: 5px 0 0 5px;
}
.ribbon20:after {
  position: absolute;
  content: '';
  bottom: -7px;
  left: -5px;
  border: none;
  height: 7px;
  width: 5px;
  background: #FE661B;
  border-radius: 5px 0 0 5px;
}



.home-top .article-top .text h2 {
  font-size: 1.2rem;
  margin-bottom: 0.2rem;
}

.home-top .article-top .text .article-date,
.home-top .article-top .text .cat-data {
  margin-bottom: 0.5rem;
}

@media(max-width: 1024px) {
  .home-top .article-top .img-wrap img {
    width: 360px;
    height: 240px;
  }

  .home-top .article-top .text {
    margin-left: 380px;
  }
}


/***********************************************/
/*記事タイトル表現他     */
/***********************************************/
/* 記事タイトルの二段組み情報 */
div.articleheader {
	position: relative;
	margin: 0px 0px 2px 0px;
}
.postdate {
	display: inline;
	color: #000000;
	font-size: x-small;
}
.addclips {
	right: 0;
	position:absolute;
}

/* 記事タイトル */
.article-content h1 {
	color: #163957;
	position: static;
	clear: none;
	font-size: 20px;
	font-size: 1.428571429rem;
	line-height: 1.2;
	margin: 0px 0px 0px 5px;
	font-weight: normal;
	border-bottom: 1px groove;
}
h1.entry-title a, span.tsubo-bloglink a, span.tsubo-bloglink a:visited {
	text-decoration: none;
	color: #163957;
}

h1.entry-title a:hover, span.tsubo-bloglink a:hover {
	color: #DB6D4B;
}

/* 記事中見出しh2,h3,h4 */
.entry-content h2, .entry-content h3, .entry-content h4 {
	color: #0970BD;
	padding:2px 10px;
	border-left: 5px solid #C4DCE8;
}


/* =========================================================== */
/* ウィジェット */
/* =========================================================== */
/* --------------投稿記事情報 ------------------*/
#articleinfo #totalarticle {
  display: block;
  float: left;
  font-size: 1.2rem;
  margin: 2px 5px 0 5px;
}
span.totalarticlenum {
  color: #f7882c;
  font-weight: bold;
}
span.latestarticle, span.firstarticle {
  display: block;
  font-size: 0.7rem;
}