@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
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.header-container {
	background-color:#e60012;
}
.header {
	width:100%;
	background-color:#e60012;
}
.footer {
	background-color:#efefef;
}
.sp_only {
	display:none;
}
@media screen and (max-width:787px) {
	.sp_only {
		display:block;
	}
}
.sns_area {
	display:flex;
	justify-content:space-around;
}
.sns_area a {
	display:block;
	margin:0px 2%;
}
.navi {
	background:none;
}
.navi a {
	color:#FFF;
}
div.head_frame {
	margin:1% 2%;
	display:flex;
	flex-wrap:nowrap;
	width:100%;
}
.head_sitedata {
	color:#e60012;
	font-size:1rem;
	line-height:180%;
}

@media screen and (max-width:787px) {
	.head_sitedata {
		width:80%;
	}
}

.head_sitedata a {
	color:#FFF;
	text-decoration:none;
}
.wp_head_menu {
	width:100%;
}
.kobahito_name {
	font-size:2.3rem;
	font-weight:bolder;
}

ul.wp-block-latest-posts li {
	border-bottom:1px solid #CCCCCC;
	display:block;
	padding:1% 0px 2%;
}

ul.wp-block-latest-posts li a {
	color:#333333;
}
ul.wp-block-latest-posts li a.wp-block-latest-posts__post-title {
	color:#e60012;
}

ul.wp-block-latest-posts li div.wp-block-latest-posts__post-excerpt {
	font-size:0.9rem;
}


ul.wp-block-categories li {
	display:block;
	padding:1% 0px 1%;
}

ul.wp-block-categories li a {
	color:#333333;
}
ul.wp-block-categories li a.wp-block-latest-posts__post-title {
	color:#e60012;
}

li.cat-item {
	padding:0px;
	margin:0px;
	line-height:100%;
}
li.cat-item a {
	font-size:0.9rem;
	line-height:100%;
}
.navi-in > ul li {
	width:180px;
}
.navi-in a {
	font-size:20px;
}

.copyright {
	font-size:0.8rem;
}

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

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

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