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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/*ADD メインとサイドバーの透過*/
#main, #sidebar {
  background: rgba(255,255,255,0.5);
}

/*ADD YouTube動画センター表示*/
.video-container {margin: 0px auto;}

/*ADD ページタイトル非表示*/
.entry-title {
display: none;
}

/* マウスオーバー */
.sk1{
color: #1b8b01;
background-color: white;
text-decoration: underline;	
}.eth04:hover{
color: #7eb272;
background-color: #cdfad3;
}

.sk2:hover img{
opacity: 0.6;
transition-duration: 0.3s;
}

.sk3:img{
border-radius: 8px;
}

/* アイキャッチ画像の角を丸く */
figure > img{
  border-radius: 8px;
}

/* 白抜きボックス　コピーして各ページに貼り付け */
.blank-box-sk0{
  boarder-style: dotted;/*線の種類*/
  boarder-width: 10px;/*線の太さ*/
  boarder-radius: 10px;/*角の丸み*/
  border-color: #000000;/*微妙な色*/
  margin: 0 10px 0 10px;/*上右下左*/
  padding: 20px 20px 20px 20px; 	
}

/* タブ見出しボックス　コピーして各ページに貼り付け */
.tab-caption-box-content-sk0 {
	position: relative;  /*配置に関するもの（ここを基準に）*/
	top: 1px; /*上から(1px）移動*/
	border: 2px solid; /*ボックス線*/
	padding: 48px 24px; /*ボックス内側余白*/
	border-radius: 4px; /*ボックス角丸*/
	border-top-left-radius: 0px; /*ボックス左上角丸*/
}

/* 新着記事表示３列横並び */

.new-entry-cards.large-thumb {
display: flex;
flex-wrap: wrap;
}

.new-entry-cards.large-thumb a {
width: 33.333%;
}

/768px以下/
@media screen and (max-width: 768px){
.new-entry-cards.large-thumb a {
width: 50%;
}
}

/480px以下/
@media screen and (max-width: 480px){
.new-entry-cards.large-thumb a {
width: 100%;
}
}

/* 新着記事のフォントサイズ */
.new-entry-card-title {
 font-size: 14px;
} 

/*サイドバーH3*/
.sidebar h3{
 font-size: 16px;
}

/************************************
** スキン上書き
************************************/

.article h3 {
	border-bottom: 2px dotted #aaa;
}



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

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

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