@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    0.0.5
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.site-name-text {
  font-size: 36px;
  font-weight: bold;
}

.article h2 {
  font-size: 24px;
	box-shadow: 0px 0px 0px 3px #4bc0f2;
	border: dashed 2px #fff;
  margin-top: 40px;
  margin-bottom: 20px;
  padding: 20px;
  background-color: #4bc0f2;
  color: #fff;
}
.article h3 {
  background-image: url(https://pc-chain.com/sns/wp-content/uploads/2019/03/h3_mak.png);
  background-repeat: no-repeat;
	padding: 8px 50px;
	border-left: 0;
  border-right: 0;
  border-top: 0;
	border-bottom: 3px solid #CCC;
  font-size: 22px;
}
/*
.article h3 {
  border-left: 7px solid #FF9999;
  border-right: 0px solid #ccc;
  border-top: 0px solid #ccc;
  border-bottom: 1px solid #999999;
  font-size: 22px;
  padding: 6px 20px;
}
.article h4 {
  border-top: 2px solid #ccc;
  border-bottom: 2px solid #ccc;
}
*/
.article h4 {
  border-left: 0;
  border-right: 0;
  border-top: 0;
  border-bottom: 2px solid #ccc;
}
.sidebar h3 {
  background-color: #4bc0f2;
  box-shadow: 0px 0px 0px 3px #4bc0f2;
  border: dashed 2px #fff;
  padding: 10px 10px;
  margin: 16px 0;
  font-size: 18px;
  color: #fff;
}
.sidebar h2 {
  color: #fff;
}

.widget_recent_entries ul li a,
.widget_categories ul li a,
.widget_archive ul li a,
.widget_pages ul li a,
.widget_meta ul li a,
.widget_rss ul li a,
.widget_nav_menu ul li a {
  color: #000;
  text-decoration: none;
  padding: 2px 0;
  display: block;
  padding-right: 4px;
  padding-left: 4px;
}
.widget_recent_entries ul li a:hover,
.widget_categories ul li a:hover,
.widget_archive ul li a:hover,
.widget_pages ul li a:hover,
.widget_meta ul li a:hover,
.widget_rss ul li a:hover,
.widget_nav_menu ul li a:hover {
  background-color: #f0f8ff;
  transition: all 0.5s ease;
  color: #000;
}

.blank-box {
	border-width: 2px;
	border-color: #d3d3d3;
}
.blank-box.bb-red {
	border-width: 2px;
	border-color: #FF9999;
	background-color: #fffafa;
}
.blank-box.bb-blue {
	border-color: #68c9f1;
	background-color: #E8F6FC;
}

.blank-box.sticky.st-green {
  border-color: #32cd32;
  background-color: #f0fff0;
}

.primary-box {
	background-color: #E8F6FC;
}

.danger-box {
	background-color: #FDDDCD;
}
.dark-box {
	background-color: #f0f0f0;
}
.warning-box {
	background-color: #FFFACD;
	color: #000;
}

.badge.badge-blue {
	background-color: #68c9f1;
}

.bold.red {
	color: #FF9999;
}
.list-r{
   list-style: none;
   padding:0;
   margin:0;
}
.list-r li { 
   position: relative;
   margin:0.5em 0 !important;
   padding-left: 25px;
}
.list-r li:before {
   font-family: FontAwesome;
   content: "\f058";
   color:  #FF9999;
   position: absolute;
   left:0;
}
.list-b{
   list-style: none;
   padding:0;
   margin:0;
}
.list-b li { 
   position: relative;
   margin:0.5em 0 !important;
   padding-left: 25px;
}
.list-b li:before {
   font-family: FontAwesome;
   content: "\f058";
   color:  #68c9f1;
   position: absolute;
   left:0;
}

.sb-id-11 .speech-balloon {
  background-color: #f0f8ff; /* 吹き出しメイン部分の背景色 */
  border: 2px solid #f0f8ff; /* 吹き出しメイン部分のボーダー */
  color: #333; /* セリフの文字色 */
}
.sb-id-11 .speech-balloon::before {
  border-left: 12px solid #f0f8ff; /* 三角部分の外側（ボーダー）の太さ・形状・色 */
}
.sb-id-11 .speech-balloon::after {
  border-left: 12px solid #f0f8ff; /* 三角部分の内側（背景）の色 */
}
@media screen and (max-width: 480px){
  .sb-id-11 .speech-balloon::before { border-left: 7px solid #f0f8ff; /* スマホでの三角部分の外側 */
  }
  .sb-id-11 .speech-balloon::after { border-left: 7px solid #f0f8ff; /* スマホでの三角部分の内側 */
  }
}
.sb-id-12 .speech-balloon {
  border: 2px solid #FFC0CB; /* 吹き出しメイン部分のボーダー */
}
div.sb-id-12 .speech-balloon::before { /* 丸パーツ(大)の指定 */
  border: 2px solid #FFC0CB;
}
div.sb-id-12 .speech-balloon::after { /* 丸パーツ(小)の指定 */
  border: 2px solid #FFC0CB;
}

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

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

/*768px以下*/
@media screen and (max-width: 768px){
  /*必要ならばここにコードを書く*/
ul {
   padding-left: 0px;		
}
.list-r li { 
   padding-left: 15px;
}
.list-b li { 
   padding-left: 15px;
}	
}

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