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

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

.scrollable-table th {background:#d7f1fc; font-size:90%;}
.scrollable-table th ,.scrollable-table td {border:1px solid #CCC; line-height:1.6; padding: 0.5em 0.3em; font-weight: 400;}
.sbs-flat .speech-balloon::before, .sbs-flat .speech-balloon::after {border-right-color:#fff8c7; border-left-color:#fff8c7;}
.sbs-flat .speech-balloon {background:#fff8c7; border-color:#fff8c7;}
.entry-content .sbs-flat .speech-balloon p {　line-height:1.6 !important;}
.speech-area {margin-left:auto; margin-right:auto;}
.wp-video{margin-left:auto; margin-right:auto;}

.common-icon-box p {margin-bottom:0;}
.common-icon-box ul {padding:0;  list-style:none;}
.common-icon-box ul li {margin-bottom:0.5em; position:relative; padding-left: 1.7em;}
.common-icon-box ul li:after {
  content: "";
  position: absolute;
  width: 4px;
  height: 8px;
  top: .45em;
  left: 6px;
  -webkit-transform: rotate(50deg);
  -ms-transform: rotate(50deg);
  transform: rotate(50deg);
  border-right: 2px solid #FFF;
  border-bottom: 2px solid #FFF;
}
.common-icon-box ul li:before {
  content: "";
  position: absolute;
  top: .3em;
  left: 0;
  width: 16px;
  height: 16px;
  border: 1px solid #34d713;
  border-radius: 2px;
	background:#34d713;
}
.common-icon-box ul li:last-child{margin-bottom:0;}
#navi-menu-input:checked ~ #navi-menu-content {
	-webkit-transform: translateX(-215%);
    transform: translateX(-215%);
	display: block;
}

.navi-menu-content {left:200%; display: none;}
.toc-title {
    background: #d7f1fc;
}
.appeal-in{min-height: inherit; padding: 2% 5%;}
.appeal-content {position: relative; text-align: left; padding: 1em 2em ;}
.appeal-content::before {
	content: " ";
	display: block;
	background:url(https://mouse-tease.com/wp-content/uploads/2022/01/chara_doc.png) no-repeat center center;
	background-size: 100%;
	width: 100px;
	height: 102px;
	position:absolute;
	right:0;
	top: 50%;
	margin: -60px -60px 0 0;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
	.mblt-header-mobile-buttons {
		margin-top: 56px;
	}
	.has-logo-button .menu-button {
		overflow: hidden;	
	}
}

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	.mobile-menu-buttons .menu-caption {
		font-size: 10px;
	}
	.common-icon-box {
		padding:  36px 1em 1em;
	}
	.common-icon-box p {
		text-align: center;
	}
	.is-style-information-box::before, .is-style-question-box::before, .is-style-alert-box::before, .is-style-memo-box::before, .is-style-comment-box::before, .is-style-ok-box::before, .is-style-ng-box::before, .is-style-good-box::before, .is-style-bad-box::before, .is-style-profile-box::before, .information-box::before, .question-box::before, .alert-box::before, .information::before, .question::before, .alert::before, .memo-box::before, .comment-box::before, .common-icon-box::before {
		top: 1em;
		font-size: 24px;
	}
	.appeal-content {
		text-align: center;
	}
	.appeal-content::before {
		position: static;
		margin: 0 auto 0;
		width: 60px;
		height: 62px;
	}
	.eye-catch .cat-label ,
	.cat-label {
		font-size: 14px;
	}
	.entry-category, .post-date, .post-update, .post-author, .amp-back ,
	.entry-card-info > * {
		font-size: 0.8em;
	}
	.navi-footer-in > .menu-footer {
		margin:2em auto;
	}
	.container {
		overflow: hidden;
	}
}