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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/*ステマ規制法対策*/
#sutemakisei{
	text-align:end;
}
#sutemakisei p{
	font-size: 80%;
    font-weight: 700;
    display: -webkit-inline-box;
    box-shadow: 0 0 2px;
    border-radius: 3px;
    opacity: .7;
    padding: 0.2rem 0.3rem 0;
}
/*ここからテストエリア*/
.box-1{
	margin-bottom:1rem;
	padding:0.5rem 0.5rem 1rem;
}
.box-0{
	padding:0.6rem 0.4rem;
}
.wp-block-column{
	padding:1rem 0.5rem;
}

.dotted{
	border-bottom:dashed 1px #c2c2c2;
	padding-bottom:0.3rem;
	clear:both;
}
.list-none{
	list-style-type: none;
    padding-left: 1rem!important;
	padding-bottom:0.2rem!important;
	margin-bottom:1.4rem!important;
	border-bottom: dashed 1px #c2c2c2;
}

.entry-content .list1{
		list-style-type: none;
	padding-left:20px;
}
.entry-content .list1 li {
  position: relative;
  padding: 0 0 0 1rem;
}
.entry-content .list1 li::before {
  position: absolute;
  left: -14px;
	top:-3px;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
	font-size:1.2rem;
  content: '\f058';
  color: #007b43;
}
/*以下★評価ブロックの構成*/
.box-2{
    padding: 0px 5px 20px 5px;
    border:none;
}
.block{
    display: block;
    width: calc((100% - 40px) /3);
    height: 25px;
    float: left;
    line-height: 25px;
    text-align: center;
    background: #4444;
    margin-left:10px;
}
.block-yellow{
    display: block;
    width: calc((100% - 40px) /3);
    height: 25px;
    float: left;
    line-height: 25px;
    text-align: center;
    background: #f8c31e;
    margin-left:10px;
   color:#fff;
}

.block2{
    display: block;
    width: calc((100% - 40px) /4);
    height: 25px;
    float: left;
    line-height: 25px;
    text-align: center;
    background: #4444;
    margin-left:10px;
}
.block2-yellow{
    display: block;
    width: calc((100% - 40px) /4);
    height: 25px;
    float: left;
    line-height: 25px;
    text-align: center;
    background: #f8c31e;
    margin-left:10px;
   color:#fff;
}
/*アフィボタン装飾*/
.button-block.poyopoyo2{
	animation: poyopoyo2 2s ease-out infinite;
	opacity: 1;
}
.poyopoyo2>a{
	font-size:24px!important;
	padding:20px 20px!important;
}
@keyframes poyopoyo2 {
  0%, 40%, 60%, 80% {
    transform: scale(1.0);
  }
  50%, 70% {
    transform: scale(0.95);
  }
}	
/*アフィ囲みボタン装飾*/
.btn-wrap.poyopoyo {
  animation: poyopoyo 2s ease-out infinite;
  opacity: 1;
}
.poyopoyo>a{
	font-size:24px!important;
	padding:20px 20px!important;
}
@keyframes poyopoyo {
  0%, 40%, 60%, 80% {
    transform: scale(1.0);
  }
  50%, 70% {
    transform: scale(0.95);
  }
}
/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	.poyopoyo>a{
	font-size:22px!important;
	}
	.poyopoyo2>a{
	font-size:18px!important;
	}
}

.table-1>div>table{
margin-top:4rem;
}
.move-up img{
margin-top:-100px;
}
/*ここまでテストエリア*/
/*アコーディオン*/
.toggle-wrap .toggle-content{
	padding:0;
}
.toggle-button {
    background: #fff;
    text-align: center;
    font-weight: bold;
    box-shadow: 0 3px 8px 0px #8f8f8f;
    border: none;
    padding: 1em 0!important;
}
.toggle-button::before,
.toggle-checkbox:checked~.toggle-button::before {
content:none;
}
.toggle-button::after,
.toggle-checkbox:checked~.toggle-button::after {
    font-family: "Font Awesome 5 Free";
    content: '\f0ab';
    color: #ffffff;
    font-size: 1em;
    font-weight: bold;
    position: absolute;
    right: 2em;
    transition: 0.3s;
}
.toggle-checkbox:checked~.toggle-button::after {
    transition: 0.3s;
    transform: rotate(180deg) translateY(3px);
}
.toggle-checkbox:checked~.toggle-content {
	background-color:#ffffff;
    margin-top: 10px;
    border: none;
    padding: 1em 0.1em;
}
.toggle-checkbox:checked~.toggle-content p:first-of-type::before {
    content: none;
}
/*pluginアコーディオンブロック*/

.c-accordion__title--button, .c-accordion__title--button:focus, .c-accordion__title--button:hover{
	background-color:#77b206!important;
}

.c-accordion__title--button{
    border-radius: 5px!important;
    box-shadow: 1px 5px 10px 0 #aaaaaa!important;
    padding:1rem!important;
	text-align: center!important;
	color:#ffffff!important;
}
.c-accordion__content{
    margin-top: 0.7rem!important;
    padding: 1rem 0.5rem!important;
    background-color: #fff8f1!important;
}

.c-accordion__title::after{
    font-family: "Font Awesome 5 Free";
    content: '\f0ab'!important;
    color: #ffffff!important;
    font-size: 1em;
    font-weight: bold!important;
    right: 2em!important;
	transition: 0.5s;
}
.is-open>.c-accordion__title:after{
	top:50%;
	transition: 0.5s;
    transform: rotate(180deg) translateY(14px);
}

/*クチコミデザイン*/
.blank-box.sticky.st-yellow{
	background-color:#fff7f3;
	padding-top:0.7rem;
	padding-bottom:0.5rem;
}
.blank-box.sticky.st-yellow p{
	margin-bottom:0.3rem;
	font-size:0.9rem;
}
.migiyose {
    display: block;
    text-align: right;
    color: #888888;
}
/*いろいろ*/
.navi-in a{
	font-weight:bolder;
}
.box-menu-icon{
	color:#e05a45;
}
.not-margin{
	margin-bottom:.1rem!important;
}
.iconlist-title{
	margin-bottom:2rem;
}
.iconlist-custom{
	background:linear-gradient(transparent 92%, #575757  60%);
	padding:0 1.2rem 0.4rem;
}
/* 見出しリセット */
.article h2{
background:none;
padding: 0;
}

.article h3{
border-top:none;
border-bottom:none;
border-left:none;
border-right:none;
padding: 0;
}

.article h4{
border-top:none;
border-bottom:none;
padding: 0;
}

.article h5{
border-bottom:none;
padding: 0;
}

.article h6{
border-bottom:none;
padding: 0;
}

/*見出しデザイン*/
.entry-content h2 {
	padding:1rem 1.5rem;
	border-top: 4px solid #98ccb1;
	border-bottom: 4px solid #98ccb1;
	background: #fff;
	margin:3rem -16px 2rem -16px;
	font-size:1.35rem;
}
.simple-h2{
	border:none!important;
	background:none!important;
	padding:1rem .5rem!important;
	margin:0 0 2rem!important;
}

.entry-content h3 {
  padding:0.3em 0.5em;/*文字周りの余白*/
  color: #494949;/*文字色*/
  background: #FFF;/*背景色*/
  border-left: solid 5px #98ccb1;/*左線（実線 太さ 色）*/
  margin:3rem 0 1.5rem -5px;
  font-size:1.3rem;
}

.entry-content h4 {
  position: relative;
  margin: 2rem 1rem 1rem 0.3rem;/*アイコン分のスペース*/
  line-height: 1.4;
  border-bottom:solid 2px #98ccb1;
  font-size:1.1rem;
}
/*ランキング見出し*/
.entry-content .ranking-1{
  color: #494949;/*文字色*/
    position: relative;
    background: white;
	padding-left:50px;
}
.entry-content .ranking-1::before {
    font-family: "Font Awesome 5 Free";
    content:"\f521"; /*記号*/
	font-size:1.8rem;
    display: inline-block;
    line-height: 40px;
    position: absolute;
    padding: 0em;
    color: #ffd700;
    background: #fff;
    width: 45px;
    text-align: center;
    height: 45px;
    line-height: 45px;
    left: 0px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.entry-content .ranking-2{
  color: #494949;/*文字色*/
    position: relative;
    background: white;
	padding-left:50px;
}
.entry-content .ranking-2::before {
    font-family: "Font Awesome 5 Free";
    content:"\f521"; /*記号*/
	font-size:1.8rem;
    display: inline-block;
    line-height: 40px;
    position: absolute;
    padding: 0em;
    color: #C0C0C0;
    background: #fff;
    width: 45px;
    text-align: center;
    height: 45px;
    line-height: 45px;
    left: 0px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.entry-content .ranking-3{
  color: #494949;/*文字色*/
    position: relative;
    background: white;
	padding-left:50px;
}
.entry-content .ranking-3::before {
    font-family: "Font Awesome 5 Free";
    content:"\f521"; /*記号*/
	font-size:1.8rem;
    display: inline-block;
    line-height: 40px;
    position: absolute;
    padding: 0em;
    color: #815a2b;
    background: #fff;
    width: 45px;
    text-align: center;
    height: 45px;
    line-height: 45px;
    left: 0px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
/*リストデザイン*/
.entry-content ul{
	margin:0 0 1.5rem;
}
.entry-content ul li, .entry-content ol li{
	margin:.7rem .2rem;
}

.entry-content>ul {
  list-style: none;
  padding: 0;
  margin: 0 0 1.4rem 15px ;
}
.entry-content>ul li {
  position: relative;
  padding: 0 0 0 1rem;
}
.entry-content>ul li::before {
  position: absolute;
  left: 0;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: '\f0da';
  color: #f25000;
}
/* アンダーライン各種 */
.marker-under{
	background: linear-gradient(transparent 83%, #ffe75c 60%);;
}
.marker-under-red {
    background: linear-gradient(transparent 83%, #ff7676 60%);
	padding-bottom:1px;
}
.marker-under-blue {
    background: linear-gradient(transparent 83%, #a8dafb 60%);
	padding-bottom:1px;
}
/*テーブルデザイン*/
.entry-content table{
	font-size:16px;
}
table td {
background: #fff;
}
.scrollable-table.stfc-sticky tr > *:first-child{
	background:#fff8f1;
}
.scrollable-table th{
	background-color:#ffffff;
}
table td{
	border-bottom:2px solid #eee;
}
table th{
	border-top: 4px solid #a0a0a0;
    border-bottom: 2px solid #a0a0a0;
}
/*吹き出しデザイン*/
  .speech-person {
    width: 85px;
    min-width: 85px;
  }
div.speech-balloon{
	padding:15px 10px;
	font-size:16px;
}
/*引用デザイン*/
blockquote {
    position: relative;
    padding: 10px 15px 10px 60px;
    box-sizing: border-box;
    font-style: italic;
    background: #efefef;
    color: #555;
}

blockquote:before{
    display: inline-block;
    position: absolute;
    top: 18px;
    left: 15px;
    content: "\f10d";
    font-family: "Font Awesome 5 Free";
    color: #cfcfcf;
    font-size: 30px;
    line-height: 1;
    font-weight: 900;
}

blockquote p {
    padding: 0;
    margin: 10px 0;
    line-height: 1.7;
}

blockquote cite {
    display: block;
    text-align: right;
    color: #888888;
    font-size: 0.9em;
}
/*アラートboxデザイン*/
.is-style-ok-box, .ok-box{
	background:#f6fffa;
	border:1px solid #3eb370;
}
.is-style-ok-box::before, .ok-box::before{
	color:#3eb370;
	border-right:1px solid #3eb370;
}
/*アピールエリア*/
.appeal .appeal-in {
	width: 100%;
}

.appeal-content {
	background-color: transparent;
}

.appeal-title{
	color: #fff;
	text-shadow: 2px 2px 0 #3f3f3f;
	font-size:2.5rem;
	background-color:#33333387;
}

.appeal-message {
	color: #fff;
	background-color:#33333387;

}
.appeal-button{
	width:65%;
}
/*menu*/
#header-container{
    box-shadow:0 13px 6px -6px rgb(0 0 0 / 20%);
}

nav#navi, .menu-header .sub-menu{
    font-weight: bold;
}

.menu-header .sub-menu .item-label{
    font-size: 80%;
}
.menu-header .item-label{
    color: #333333 !important;
}
.menu-header .current-menu-item,
.menu-header .current-post-item,
.menu-header .current-menu-ancestor,
.menu-header .current-post-ancestor,
.menu-header .menu-item:hover {
    color: #ae0000 !important;
    border-bottom: 3px solid #ae0000;
    transition: all .1s ease;
}

.menu-header .sub-menu .menu-item,
.menu-header .sub-menu .menu-item:hover{
    border-bottom: none;
}
.menu-header .current-menu-item>a .item-label,
.menu-header .current-post-item>a .item-label,
.menu-header .current-menu-ancestor>a .item-label,
.menu-header .current-post-ancestor>a .item-label,
.menu-header .item-label:hover{
    color: #ae0000 !important;
    transition: all .1s ease;
}
.about-menu{
	color:green;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	.appeal-title {
    font-size: 1.6rem;
  }
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	/*吹き出しデザイン*/
	  .speech-person {
    width: 75px;
    min-width: 75px;
  }
	div.speech-balloon {
	font-size:14px;
  }
}
/*440px以下*/
@media screen and (max-width: 440px){
  /*必要ならばここにコードを書く*/
	/*吹き出しデザイン*/
.is-style-ok-box::before, .ok-box::before{
	border-right:none;
	}
}