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

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

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

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/*Amazon用の自作CSSここから*/
/*ここからパソコン用*/
@media screen and (min-width: 900px)
{
	.aspla{
/*		width:100%;*//*コメントアウト 2020年6月27日*/
		border: 1px solid #dddddd;
		padding: 10px;
	}
	.aspla_left_block{
		width:200px;
		float:left;
	}
	.aspla_img_block{
/*		width:200px;
		float:left;*/
	}
	.aspla_img_block img{
		max-width:98%;
	}
	.aspla_right_block
	{
		padding-left:205px;
	}
	.aspla_title_block{
		width:100%;
		margin-bottom:20px;/*デザイン用*/
	}
	.aspla_title_block .detail_area{
		font-size:0.8em;
		line-height:1.6;
	}
	.aspla_button_block
	{
	/*	padding-top:0.9em;*/
		padding-bottom:5px;
		display:inline-block;
		width:98%;
	/*	width:49%;*//*50%ではだめっぽい*/
/*		float:left;*/
	}

	.aspla_button_block img{
		float:left;
	}

	.aspla_button_block a
	{
		margin-bottom: 5px;
		border-radius: 3px;
		text-align: center;
	/*	padding: 0.75em 0.5em;*/
		padding-top:0.75em;
		padding-bottom:0.75em;
		color:#ffffff;
		font-weight: 600;
/*		width:90%;*/
		display:block;
		text-decoration: none;/*アンダーバーを消す*/
	}
/*	.orange_box a
	{
		background-color: #FF9901;
		-webkit-box-shadow: 0 5px 0 #cc7a01;
		-moz-box-shadow: 0 5px 0 #cc7a01;
		box-shadow: 0 5px 0 #cc7a01;
		-o-box-shadow: 0 5px 0 #cc7a01;
		-ms-box-shadow: 0 5px 0 #cc7a01;
	}*/
	.orange_box a
	{
		background-color: #000000;
		-webkit-box-shadow: 0 5px 0 #94A78E;
		-moz-box-shadow: 0 5px 0 #94A78E;
		box-shadow: 0 5px 0 #94A78E;
		-o-box-shadow: 0 5px 0 #94A78E;
		-ms-box-shadow: 0 5px 0 #94A78E;
	}
	.blue_box a
	{
		background-color: #0066ff;
		-webkit-box-shadow: 0 5px 0 #006699;
		-moz-box-shadow: 0 5px 0 #006699;
		box-shadow: 0 5px 0 #006699;
		-o-box-shadow: 0 5px 0 #006699;
		-ms-box-shadow: 0 5px 0 #006699;
	}

	.red_box a
	{
		background-color: #bb0000;
		-webkit-box-shadow: 0 5px 0 #770000;
		-moz-box-shadow: 0 5px 0 #770000;
		box-shadow: 0 5px 0 #770000;
		-o-box-shadow: 0 5px 0 #770000;
		-ms-box-shadow: 0 5px 0 #770000;
	}

	.green_box a
	{
		background-color: #007700;
		-webkit-box-shadow: 0 5px 0 #004400;
		-moz-box-shadow: 0 5px 0 #004400;
		box-shadow: 0 5px 0 #004400;
		-o-box-shadow: 0 5px 0 #004400;
		-ms-box-shadow: 0 5px 0 #004400;
	}
}
/*ここからスマホ用*/
@media screen and (max-width: 900px)
{
	.aspla{
/*		width:100%;*//*コメントアウト 2020年6月27日*/
/*		margin:0 auto;*/
/*ここから追加 2020年6月27日*/
		border: 1px solid #dddddd;
		padding: 10px;
/*ここまで追加 2020年6月27日*/
	}
	.aspla_img_block{
		width:100%;
/*		float:left;*/
		text-align:center;
	}
	.aspla_img_block img{
		max-width:98%;
/*		margin:0 auto;*/
	}
	.aspla_right_block
	{
/*		padding-left:205px;*/
	}
	.aspla_right_block
	{
		max-width:98%;
	}

	.aspla_button_block
	{
	/*	padding-top:0.9em;*/
		padding-bottom:5px;
		display:inline-block;
		width:98%;
	/*	width:49%;*//*50%はダメ*/
	/*	float:left;*/
	}

	.aspla_button_block img{
		float:left;
	}

	.aspla_button_block a
	{
		margin-bottom: 5px;
		border-radius: 3px;
		text-align: center;
	/*	padding: 0.75em 0.5em;*/
		padding-top:0.75em;
		padding-bottom:0.75em;
		color:#ffffff;
		font-weight: 600;
/*		width:90%;*/
		display:block;
		text-decoration: none;/*アンダーバーを消す*/
	}
/*	.orange_box a
	{
		background-color: #FF9901;
		-webkit-box-shadow: 0 5px 0 #cc7a01;
		-moz-box-shadow: 0 5px 0 #cc7a01;
		box-shadow: 0 5px 0 #cc7a01;
		-o-box-shadow: 0 5px 0 #cc7a01;
		-ms-box-shadow: 0 5px 0 #cc7a01;
	}*/
	.orange_box a
	{
		background-color: #000000;
		-webkit-box-shadow: 0 5px 0 #94A78E;
		-moz-box-shadow: 0 5px 0 #94A78E;
		box-shadow: 0 5px 0 #94A78E;
		-o-box-shadow: 0 5px 0 #94A78E;
		-ms-box-shadow: 0 5px 0 #94A78E;
	}
	.blue_box a
	{
		background-color: #0066ff;
		-webkit-box-shadow: 0 5px 0 #006699;
		-moz-box-shadow: 0 5px 0 #006699;
		box-shadow: 0 5px 0 #006699;
		-o-box-shadow: 0 5px 0 #006699;
		-ms-box-shadow: 0 5px 0 #006699;
	}

	.red_box a
	{
		background-color: #bb0000;
		-webkit-box-shadow: 0 5px 0 #770000;
		-moz-box-shadow: 0 5px 0 #770000;
		box-shadow: 0 5px 0 #770000;
		-o-box-shadow: 0 5px 0 #770000;
		-ms-box-shadow: 0 5px 0 #770000;
	}

	.green_box a
	{
		background-color: #007700;
		-webkit-box-shadow: 0 5px 0 #004400;
		-moz-box-shadow: 0 5px 0 #004400;
		box-shadow: 0 5px 0 #004400;
		-o-box-shadow: 0 5px 0 #004400;
		-ms-box-shadow: 0 5px 0 #004400;
	}
}

/*Amazon用の自作CSSここまで*/

/*付箋のデザインCSS ここから*/
.husen{
	padding: 0.5em 1em;
	margin: 2em 0;
	color: #232323;
	background: #fff8e8;
	border-left: solid 10px #ffc06e;
}
/*付箋のデザインCSS ここまで*/

/*テープ風のデザイン ここから*/
.tape{
	position: relative;
	background: #fff0cd;
	box-shadow: 0px 0px 0px 5px #fff0cd;
	border: dashed 2px white;
	padding: 0.2em 0.5em;
	color: #454545;
}
.tape:after{
	position: absolute;
	content: '';
	right: -7px;
	top: -7px;
	border-width: 0 15px 15px 0;
	border-style: solid;
	border-color: #ffdb88 #fff #ffdb88;
	box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.15);
}
/*テープ風のデザイン ここまで*/

/*記事下用divブロック ここから*/
.next_step {
	position: relative;
	margin: 2em 0;
	padding: 0.5em 1em;
	border: solid 3px #62c1ce;
}
.next_step .box_title {
	position: absolute;
	display: inline-block;
	top: -27px;
	left: -3px;
	padding: 0 9px;
	height: 25px;
	line-height: 25px;
	font-size: 17px;
	background: #62c1ce;
	color: #ffffff;
	font-weight: bold;
	border-radius: 5px 5px 0 0;
}
/*記事下用divブロック ここまで*/

/*ポイント用ブロック ここから*/
.point_box {
	position: relative;
	margin: 2em 0;
	padding: 0.5em 1em;
	border: solid 3px #00aa00;
}
.point_box .box_title {
	position: absolute;
	display: inline-block;
	top: -27px;
	left: -3px;
	padding: 0 9px;
	height: 25px;
	line-height: 25px;
	font-size: 17px;
	background: #00aa00;
	color: #ffffff;
	font-weight: bold;
	border-radius: 5px 5px 0 0;
}
/*ポイント用ブロック ここまで*/

/*Caution用ブロック ここから*/
.caution_box {
	position: relative;
	margin: 2em 0;
	padding: 0.5em 1em;
	border: solid 3px #ff9900;
}
.caution_box .box_title {
	position: absolute;
	display: inline-block;
	top: -27px;
	left: -3px;
	padding: 0 9px;
	height: 25px;
	line-height: 25px;
	font-size: 17px;
	background: #ff9900;
	color: #ffffff;
	font-weight: bold;
	border-radius: 5px 5px 0 0;
}
/*Caution用ブロック ここまで*/


/*フローチャート用CSS ここから*/
ul.arrowlist{
	list-style: none;
	padding: 0 10px 15px 10px;
	margin: 15px 0;
	border: 2px solid #e8e8e8; /* 外枠ボーダー 好みに合わせて */
	background-color: #e8fcf3; /* 背景色 好みに合わせて */
}
ul.arrowlist:before{
	content: attr(data-title)"";
	display: block;
	padding: 10px;
	margin: 0 -10px 15px -10px;
	background-color: #e8e8e8; /* タイトル背景色 好みに合わせて */
	text-align: center;
	font-weight: bold;
}
ul.arrowlist li{
	display: table;
	margin: 0 auto;
	display: table;
	position: relative;
	box-sizing: border-box;
	padding: 10px 20px;
	border: 2px solid #e8e8e8; /* ブロックボーダー 好みに合わせて */
	background-color: #FFF;
	border-radius: 10px;
	text-align: center;
}
ul.arrowlist li:not(:last-child){
	margin-bottom: 30px;
}
ul.arrowlist li:not(:last-child):after{
	content: "\f078";
	font-family: FontAwesome;
	/* FontAwesome5を使用する場合はこっちに置き換えてください */
	/* font-family: "Font Awesome 5 Free"; */
	position: absolute;
	left: 50%;
	bottom: -30px;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	display: block;
	text-align: center;
	color: #37AB9D; /* 矢印の色 好みに合わせて */
}
/*フローチャート用CSS ここまで*/

/*サイドバー広告用CSS ここから*/
.side_ads img{
	max-width:95%;
}
/*サイドバー広告用CSS ここまで*/



/*Googleフォーム用 ここから*/
.iframe-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}

.iframe-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
/*Googleフォーム用 ここまで*/


/*電験2種用*/
.denken2 {
	position: relative;
	margin: 2em 0;
	padding: 0.5em 1em;
	border: solid 3px #ffd700;
	/*background:#ffedb3;*/
	/*background:#ffefcf;*/
}
.denken2 .box_title {
	position: absolute;
	display: inline-block;
	top: -27px;
	left: -3px;
	padding: 0 9px;
	height: 25px;
	line-height: 25px;
	font-size: 17px;
	background: #ffd700;
	color: #000000;
/*	color: #ffffff;*/
	font-weight: bold;
	border-radius: 5px 5px 0 0;
}
/*電験2種用*/


/**********************************************
** 固定ページの新着記事一覧(new_list)を
** 2カラム表示にする
**********************************************/
/*.new-entry-cards.fp-new-entry-cards {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
}

.fp-new-entry-cards .new-entry-card-link.a-wrap {
    display: inline-block;
    width: 49.5%;
}*/

@media screen and (min-width: 900px)
{
	.new-entry-cards.fp-new-entry-cards {
    display: flex;
    flex-wrap: wrap;
	 /*   justify-content: space-between;*/
    box-sizing: border-box;
	}

	.fp-new-entry-cards .new-entry-card-link.a-wrap {
    display: inline-block;
	width:33%;
  	/*  width: 49.5%;*/
	}
}

@media screen and (max-width: 900px)
{
	.new-entry-cards.fp-new-entry-cards {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
	}

	.fp-new-entry-cards .new-entry-card-link.a-wrap {
    display: inline-block;
    width: 49.5%;
	}
}

/*メモ用CSS*/
.memo{
    margin-bottom: 1.5em;
    padding: 1em;
    background: #fff9e5;
    color: #545454;
}

.memo_title{
    margin-bottom: 5px;
    color: #ffb36b;
    font-size: 1.2em;
    font-weight: 700;
    font-family: inherit !important;
}
.memo_title:before{
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900;
}

/*ブログカード*/
.blogcard-footer{
  display:none;
}

/*ここから3rdのCSS*/
.cta-3rd{
  display:inline-flex;
  align-items:center;
  gap:.6em;
  padding:14px 22px;
  border-radius:14px;
  border:2px solid #0f172a;
  color:inherit;
  text-decoration:none;
  font-weight:700;
  transition:
    transform .08s ease,
    box-shadow .2s ease,
    background-color .2s ease,
    border-color .2s ease;
  background:transparent;
  box-shadow:0 2px 0 rgba(0,0,0,0.06);

  /* ここから修正 */
  width:100%;            /* 幅100%に変更 */
  max-width:none;         /* 最大幅制限を解除 */
  justify-content:center; /* 中央寄せ */
}
.cta-3rd:hover{
  transform:translateY(-1px);
  background-color:#38bdf8;
  border-color:#38bdf8;
  color:#fff;
}
.cta-3rd:active{ transform:translateY(0); }
.cta-3rd:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(56,189,248,.35);
}
.cta-3rd svg{ flex:0 0 auto; }

/* 注意書き */
.notes-3rd{
  margin-top:12px;
  font-size:.9rem;
  color:#475569;
}


/* 3rd注意書き */
.notes-3rd{
  margin-top:12px;
  font-size:.9rem;
  color:#475569;
}

/* Responsive */
@media screen and (min-width: 900px){
  .notes-3rd{ font-size:.9rem; }
}
@media screen and (max-width: 900px){
  .notes-3rd{ font-size:.9rem; }
}

/*ここから1st*/
.cta-1st{
  display:inline-flex;
  align-items:center;
  gap:.6em;
  padding:14px 22px;
  border-radius:14px;
  border:2px solid #dc2626;
  color:inherit;
  text-decoration:none;
  font-weight:700;
  transition:
    transform .08s ease,
    box-shadow .2s ease,
    background-color .2s ease,
    border-color .2s ease;
  background:transparent;
  box-shadow:0 2px 0 rgba(0,0,0,0.06);
  width:100%;
  justify-content:center;
  max-width:320px;
}
.cta-1st:hover{
  transform:translateY(-1px);
  background-color:#ef4444;
  border-color:#ef4444;
  color:#fff;
}
.cta-1st:active{ transform:translateY(0); }
.cta-1st:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(239,68,68,.35);
}
.cta-1st svg{ flex:0 0 auto; }

/* 1st注意書き */
.notes-1st{
  margin-top:12px;
  font-size:.9rem;
  color:#475569;
}

/* Responsive */
@media screen and (min-width: 900px){
  .notes-1st{ font-size:.9rem; }
}
@media screen and (max-width: 900px){
  .notes-1st{ font-size:.9rem; }
}

/* --- 基礎を攻略（2nd-1） --- */
.cta-2nd-1{
  display:inline-flex; align-items:center; gap:.6em;
  padding:14px 22px; border-radius:14px;
  border:2px solid #1d4ed8; /* 濃いめ青枠 */
  color:inherit; text-decoration:none; font-weight:700;
  transition:transform .08s ease, box-shadow .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease;
  background:transparent; box-shadow:0 2px 0 rgba(0,0,0,0.06);
  width:100%; justify-content:center; box-sizing:border-box;
  max-width:320px;
}
.cta-2nd-1:hover{
  transform:translateY(-1px);
  background:#38bdf8; /* 水色ホバー */
  border-color:#38bdf8;
  color:#fff;
}
.cta-2nd-1:active{ transform:translateY(0); }
.cta-2nd-1:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(56,189,248,.35);
}
.cta-2nd-1 svg{ flex:0 0 auto; }
.notes-2nd-1{ margin-top:10px; font-size:.9rem; color:#475569; }

/* --- 科目・分野別対策（2nd-2） --- */
.cta-2nd-2{
  display:inline-flex; align-items:center; gap:.6em;
  padding:14px 22px; border-radius:14px;
  border:2px solid #0ea5e9; /* シアン寄り青枠 */
  color:inherit; text-decoration:none; font-weight:700;
  transition:transform .08s ease, box-shadow .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease;
  background:transparent; box-shadow:0 2px 0 rgba(0,0,0,0.06);
  width:100%; justify-content:center; box-sizing:border-box;
  max-width:320px;
}
.cta-2nd-2:hover{
  transform:translateY(-1px);
  background:#1d4ed8; /* 濃い青ホバー */
  border-color:#1d4ed8;
  color:#fff;
}
.cta-2nd-2:active{ transform:translateY(0); }
.cta-2nd-2:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(29,78,216,.35);
}
.cta-2nd-2 svg{ flex:0 0 auto; }
.notes-2nd-2{ margin-top:10px; font-size:.9rem; color:#475569; }

/* Responsive */
/*
@media screen and (min-width:900px){
  .cta-2nd-1, .cta-2nd-2{ font-size:1rem; }
}
@media screen and (max-width:900px){
  .cta-2nd-1, .cta-2nd-2{ font-size:.95rem; }
}*/

/* --- 白枠・黒字（more-info） --- */
.more-info{
  display:inline-flex; align-items:center; gap:.6em;
  padding:14px 22px; border-radius:14px;
  border:2px solid #000;   /* 黒枠 */
  background-color:#fff;   /* 白背景 */
  color:#000;              /* 黒字 */
  font-weight:700;
  text-decoration:none;
  transition:transform .2s ease, background-color .2s ease, color .2s ease;
}

/* hover時：反転 */
.more-info:hover{
  background-color:#000;   /* 黒背景 */
  color:#fff;              /* 白字 */
  transform:scale(1.03);
}


/* --- 全共通：幅100%オーバーライド --- */
a.cta-3rd,
a.cta-2nd-1,
a.cta-2nd-2,
a.cta-1st,
a.more-info{
  width: 100% !important;
  max-width: none !important;
  justify-content: center !important;
  box-sizing: border-box;
}

.categoryid-4 #related-entries {
  display: none;
}
.categoryid-18 #related-entries {
  display: none;
}