@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
table th {
	background-color: #c7ede4;
	font-size: inherit;
	font-weight: normal;
}
.wp-block-table thead {
	border-bottom: 0px;
}

/* レスポンシブ仮対応 */
.pc_hide{
	display:none;
	text-align:center;	
}
.sp_hide{
	display:block;
	text-align:center;
		}

@media screen and (max-width: 640px) {
	.pc_hide{
		display:block;
		}
	.sp_hide{
		display:none;
		}
}


/* サイドメニュー */
.side-widget a {
    font-size:1.8rem;
    font-size:18px;
    color: #333;
}

/* header */
.header-in {
	justify-content: normal;
}
.logo {
	text-align:left
}
.site-name-text {
	color: #666;
	font-size: 1rem;
}
.logo-text {
	padding: 0px 0px 50px;
}

/************* 背景色など  *******/
/* ヘッダーナビ部分の背景色 */
.main, .sidebar {
	background-color: #f8fff0;
}
/* サイドバーの背景色 */
.sidebar h2, .sidebar h3 {
	background-color: #e5f9cf;
	border-color: #e5f9cf;
}
/* 記事部の背景色 */

article.post{
    background: #f8fff0;
}
.cat-content {
    background: #f8fff0;
}
.post-header{
    background: #f8fff0;
}
.post-content {
	padding-top: 0;
    background-color: #f8fff0;
}
.post-meta li{   /* 日付背景 */
    background-color: #f8fff0;
}

article.page .post-header{
    background: #f8fff0;
}

/* 記事の装飾 */
.bullet_ttl {
	display: inline-block;
	font-weight: 700;
	padding: 0 ;
	margin-right: .5em;
	/* color: #fff;
	background-color: #d4fff4; */
	border-radius: 2px;
}
.ylw {
  padding: 2px;
  font-weight: bold;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), color-stop(50%, #ff9));
  background: linear-gradient(transparent 50%, #ff9 50%); 
}
.red {
  padding: 2px;
  color: #ff372b;
  font-weight: bold; 
}
.navy{
	color: #000080;
}
.post-content p {
	font-size: large;
}



/* カテゴリーリスト */
.post-loop-wrap .post-thumbnail {
    width: 200px;
    height:200px;
}
/* 記事のサムネイル */
.post-thumbnail {
	float: none;
	margin-bottom: 20px;
	text-align: center;
}


/* カテゴリ別記事一覧 */

#kijimap_table1,#kijimap_table2{
	width:85%;
	border:none;
	margin:0 auto;
	}
#kijimap_table1 td,#kijimap_table2 td{
	border:none;
	vertical-align:top;
	}
#kijimap_table1 td img,#kijimap_table2 td img{
	display:inline;
	}
@media screen and (max-width: 640px) {
	#kijimap_table1,#kijimap_table2{
		width:100%;
		}
}

/*リンクボックス*/

.clearfix:after{
  content: ' ';
  display: block;
  clear: both;
  height: 0;
}

.link-box{
	text-align:left;
	padding-bottom:20px;
	overflow: hidden;
}

.link-image{
	float:left;
	margin:0 15px 10px 0;
}
.link-image img{
	width:200px;
}

.link-info{
	line-height:120%;
	overflow: hidden;
}

.link-name{
	background:url('/wp-content/uploads/icon/square_blue.gif') left 3px no-repeat;
	color:navy;
	font-weight:bold;
	margin-bottom:10px;
	line-height:120%;
	padding-left:25px;
}

.link-review{
	background-color: #F3FFFF;
	border: 1px solid #C3F3F3;
	border-radius:8px;
	font-size:0.9em;
	padding:8px 12px 8px 14px;	
}

.link-link{
	margin-top:10px;
	line-height:1.6;
}

.rakuten{
	margin-right:5px;
	background: url('/wp-content/uploads/icon/rakuten.gif') left 2px no-repeat;
	padding: 2px 0 2px 32px;
}

.amazon{
	margin-right:5px;
	background: url('/wp-content/uploads/icon/amazon.gif') left 2px no-repeat;
	padding: 2px 0 2px 32px;
	}

.yahoo{
	margin-right:5px;
	background: url('/wp-content/uploads/icon/yahoo.gif') left 2px no-repeat;
	padding: 2px 0 2px 32px;
}
.link-box .official{
	margin-right:5px;
	background: url('/wp-content/uploads/icon/official.png') left 2px no-repeat;
	padding: 2px 0 2px 32px;
}
@media screen and (max-width: 640px) {
	.link-box{
		font-size:1em;
		overflow: auto;
	}

	.link-image{
		float:none;
		margin:0 auto 10px;
		text-align:center;
	}
	.link-info{
		line-height:160%;
	}
	.link-name{
		margin-bottom:10px;
		line-height:140%
	}
	.link-review{
		font-size:1em;
		line-height:140%;
	}
	.link-link{
	line-height:2em;
	}
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}