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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/* BOX枠線のエラー処理 */

.tab-caption-box,
.label-box {
	border:none;
}
/* 表の外枠線 */
table table {
    border: 2px solid #204646;
    border-collapse: collapse;
}

/* 表の各セルの枠線 */
table thead th,
table tbody td {
    border: 1px solid #204646;
}
/* １列目右側の枠線
table thead th:first-child,
table tbody td:first-child {
    border-right: solid 2px #204646;
} */

/* ヘッダーラベル下の枠線 */
table thead th {
    border-bottom: solid 2px #204646;
}
/* table th */
table th{
	background: #0d2b19;
	font-size:15px;
}
/* table td */
table td {
	font-size:14px;
}
/* 偶数行に着色、奇数行は白 */
table tr:nth-child(odd) {
    background: #333d37;
}
table tr:nth-child(even) {
    background: #515452;
}

a{color:#3cb371;}

/***************テーブル2種類目*/

/* table th */
table.sv th{
	background: #397b82;
	font-size:15px;
}
/* 偶数行、奇数行 */
table.sv tr:nth-child(odd) {
    background: #1e2120;
}
table.sv tr:nth-child(even) {
    background: #2a2e2d;
}

a{color:#3cb371;}

/* table td */
table.sv td {
	color:#58a5a6;
	text-align:left;
}

/* H1 */
H1.sv {}

/***************テーブル3種類目*/

/* table th */
table.sv2 {
	table-layout: fixed;
}
table.sv2 th{
	background: #397b82;
	font-size:15px;
}
/* 偶数行、奇数行 */
table.sv2 tr:nth-child(odd) {
    background: #1e2120;
}
table.sv2 tr:nth-child(even) {
    background: #2a2e2d;
}

a{color:#3cb371;}

/* table td */
table.sv2 td {
	color:#58a5a6;
}

/* H1 */
H1.sv2 {}

/***************テーブル4種類目*/

/* table tr */

table.sv4 tr:nth-child(odd) {
    background: #272c2e;
}
table.sv4 tr:nth-child(even) {
    background: #091012;
}


/* table th */
table.sv4 th{
	background: #397b82;
	font-size:15px;
}

/* table td */
table.sv4 td {
	color:#53c2e0;
    text-align:left;
}

/***************テーブルcs*/

/* table */
table.cs tr{
	background: #121111;
	font-size:15px;
	border-color: #0c0f0f;
}


/*H2 */
.entry-content h2.sv4{
border:none;
background:none;
padding: 0;
}


.article h2.sv4 {   position: relative;/*相対位置*/
  padding-left: 1.5em;/*アイコン分のスペース*/
  line-height: 1.4;/*行高*/
  color: #c5afdb;/*文字色*/
}
.article h2.sv4:before {
  font-family: "Font Awesome 5 Free";
  content: "\f5e4";/*アイコンのユニコード*/
  font-weight: 900;
  position: absolute;/*絶対位置*/
  font-size: 1em;/*サイズ*/
  left: 0;/*アイコンの位置*/
  top: 0px;/*アイコンの位置*/
  color: #ffffff; /*アイコン色*/
}
.article h2.sv4:after {
	content: "";
	position: absolute;
	width: 100%;
	height: 5px;
	left: 0;
	background: -webkit-repeating-linear-gradient(135deg, #fff, #fff 3px, #c5afdb 3px, #c5afdb 6px, white 6px, white 9px, #a9deb1 9px, #a9deb1 12px);
	background: repeating-linear-gradient(135deg, #fff, #fff 3px, #c5afdb 3px, #c5afdb 6px, white 6px, white 9px, #a9deb1 9px, #a9deb1 12px);
	bottom: -4px;
}

.entry-content h3.sv4{
border:none;
background:none;
padding: 0;
}


.article h3.sv4 {   position: relative;/*相対位置*/
  padding-left: 1.5em;/*アイコン分のスペース*/
  line-height: 1.4;/*行高*/
  color: #c5afdb;/*文字色*/
  background:#427a49;
}
.article h3.sv4:before{
  font-family: "Font Awesome 5 Free";
  content: "\f5e4";/*アイコンのユニコード*/
  font-weight: 900;
  position: absolute;/*絶対位置*/
  font-size: 1em;/*サイズ*/
  left: 0;/*アイコンの位置*/
  top: 0px;/*アイコンの位置*/
  color: #ffffff; /*アイコン色*/
}

/*新しいスタイル試し***********/
/*H2 */
.entry-content h2.sv2023{
border:none;
background:none;
padding: 0;
}


.article h2.sv2023 {   position: relative;/*相対位置*/
  line-height: 1.4;/*行高*/
  color:#54f77a;/*文字色*/
}
.article h2.sv2023:after {
content: "";
  display: block;
  height: 4px;
  background: -webkit-linear-gradient(to right, rgb(136, 237, 114), #3b3b39);
  background: linear-gradient(to right, rgb(136, 237, 114), #3b3b39);
}

/*H3 */
.entry-content h3.sv2023{
border:none;
background:none;
padding: 0;
}


.article h3.sv2023 {
  position: relative;/*相対位置*/
  padding-left: 1.5em;/*アイコン分のスペース*/
  line-height: 1.4;/*行高*/
  color: #c5afdb;/*文字色*/
}
.article h3.sv2023:before {
  font-family: "Font Awesome 5 Free";
  content: "\f017";/*アイコンのユニコード*/
  font-weight: 900;
  position: absolute;/*絶対位置*/
  font-size: 1em;/*サイズ*/
  left: 0;/*アイコンの位置*/
  top: 0px;/*アイコンの位置*/
  color: #ffffff; /*アイコン色*/
}
.article h3.sv2023:after {
	content: "";
	position: absolute;
	width: 100%;
	height: 4px;
	left: 0;
	top:26px;
	background: -webkit-repeating-linear-gradient(135deg, #343d45, #343d45 3px, #edd472 3px, #edd472 6px, #baf5b8 6px, #baf5b8 9px, #a9deb1 9px, #a9deb1 12px);
	background: repeating-linear-gradient(135deg, #343d45, #343d45 3px, #edd472 3px, #edd472 6px, #baf5b8 6px, #baf5b8 9px, #a9deb1 9px, #a9deb1 12px);
	bottom: -4px;
}

/*H4 */
.entry-content h6.sv2023{
border:none;
background:none;
}




h6.sv2023:before {

  font-family: "Font Awesome 5 Free";
  content: "\f217";/*アイコンのユニコード*/

  color: #ffffff; /*アイコン色*/
}

h6.sv2023:after {
content:"";
display: inline-block;
  width: 100%;
  height: 1.4px;
  background: red;

}


hr.sv1 {
  width:75%;
	margin:auto;
    height: 1px;
    background: linear-gradient(to right, yellow, black);
    border: none;
}
hr.sv2 {
	margin:auto;
    height: 2px;
    background: linear-gradient(to right, gray, black);
    border: none;
}

/**********sv2024*/
/*H3 */
.entry-content h3.sv2024{
border:none;
background:none;
padding: 0;
}


.article h3.sv2024 {
  position: relative;/*相対位置*/
  padding-left: 1.5em;/*アイコン分のスペース*/
  line-height: 1.4;/*行高*/
  color: #cecdd4;/*文字色*/
}
.article h3.sv2024:before {
  font-family: "Font Awesome 5 Free";
  content: "\f017";/*アイコンのユニコード*/
  font-weight: 900;
  position: absolute;/*絶対位置*/
  font-size: 1em;/*サイズ*/
  left: 0;/*アイコンの位置*/
  top: 0px;/*アイコンの位置*/
  color: #ffffff; /*アイコン色*/
}
.article h3.sv2024:after {
	content: "";
	position: absolute;
	width: 100%;
	height: 4px;
	left: 0;
	top:26px;
	background: -webkit-repeating-linear-gradient(135deg, #32d96c, #32d96c 6px, #050505 6px, #050505 12px, #17181a 12px, #17181a 18px, #333536 18px, #333536 24px);
	background: repeating-linear-gradient(135deg, #32d96c, #32d96c 6px, #050505 6px, #050505 12px, #17181a 12px, #17181a 18px, #333536 18px, #333536 24px);
	bottom: -4px;
}




/*必要ならばここにコードを書く*/

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

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/***************回り込み*********/
.right {
    float: right;
}
.left {
    float: left;
}

/******************imageの表示系******************************/
/*******sky******/
.framesky {
display: inline-block;
position: relative;
overflow: hidden; /* 不要部分を消す */
padding: 6px; /* 6px だけは写真からはみ出す */
}
.framesky img {
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
}
.framesky:before,
.framesky:after {
content: "";
position: absolute;
z-index: 1;
width: 97px;
height: 50px;
background: #4682b4; /* 背景色 */
transform: rotate(-30deg);
}
/* 左上 */
.framesky:before {
box-shadow: 0 10px 8px -12px rgba(0, 0, 0, 0.8);
top: -24px;
bottom: auto;
right: auto;
left: -26px;

}
/* 右下 */
.framesky:after {
box-shadow: 0 -10px 10px -10px rgba(0, 0, 0, 0.7);
top: auto;
bottom: -22px;
right: -25px;
left: auto;
}
/*******green******/
.framegreen {
display: inline-block;
position: relative;
overflow: hidden; /* 不要部分を消す */
padding: 6px; /* 6px だけは写真からはみ出す */
}
.framegreen img {
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
}
.framegreen:before,
.framegreen:after {
content: "";
position: absolute;
z-index: 1;
width: 97px;
height: 50px;
background: #00ff7f; /* 背景色 */
transform: rotate(-30deg);
}
/* 左上 */
.framegreen:before {
box-shadow: 0 10px 8px -12px rgba(0, 0, 0, 0.8);
top: -24px;
bottom: auto;
right: auto;
left: -26px;

}
/* 右下 */
.framegreen:after {
box-shadow: 0 -10px 10px -10px rgba(0, 0, 0, 0.7);
top: auto;
bottom: -22px;
right: -25px;
left: auto;
}
/*******pink******/
.framepink {
display: inline-block;
position: relative;
overflow: hidden; /* 不要部分を消す */
padding: 6px; /* 6px だけは写真からはみ出す */
}
.framepink img {
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
}
.framepink:before,
.framepink:after {
content: "";
position: absolute;
z-index: 1;
width: 97px;
height: 50px;
background: #ffc0cb; /* 背景色 */
transform: rotate(-30deg);
}
/* 左上 */
.framepink:before {
box-shadow: 0 10px 8px -12px rgba(0, 0, 0, 0.8);
top: -24px;
bottom: auto;
right: auto;
left: -26px;

}
/* 右下 */
.framepink:after {
box-shadow: 0 -10px 10px -10px rgba(0, 0, 0, 0.7);
top: auto;
bottom: -22px;
right: -25px;
left: auto;
}