@charset "UTF-8";

/*!
Theme Name: Simplicity2 child
Template:   simplicity2
Version:    20161002
*/

/* Simplicity子テーマ用のスタイルを書く */


/*ここから追加分*/
/*サイトタイトルと詳細の文字を縁取る*/
#site-title,
#site-description{
text-shadow: 
        black 1px 1px 0, black -1px -1px 0,/*右下、左上*/
        black -1px 1px 0, black 1px -1px 0,/*右上、左下*/
        black 0px 1px 0, black  0-1px 0,/*右、左*/
        black -1px 0 0, black 1px 0 0;/*上、下*/
}


#header{
	background-position:bottom;
}

body{
	word-break: break-all;
}

/*Amazon用の自作CSSここから*/
.etc_ad{
	width:100%;
}
.etc_ad_img_spc{
	width:200px;
	float:left;
}
.etc_ad_main_spc
{
	padding-left:205px;
}

.etc_ad_sub_spc
{
	padding-top:0.9em;
	padding-bottom:0.9em;
	display:inline-block;
}

.etc_ad_sub_spc a
{
	margin-bottom: 5px;
	border-radius: 3px;
	text-align: center;
	padding: 0.75em 0.5em;
	color:#ffffff;
	font-weight: 600;
}
.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;
}
.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 ここから*/
/*.ad_table_block_left{
	float:left;
	width:32%;
}
.ad_table_block_left img{
	max-width:95%;
}
.ad_table_block_right{
	float:right;
	width:68%;
}
.ad_table_block_bottom{
	clear:both;
}
table.ad_table_block_tablecontent{
	width:100%;
	margin-top:0px;
}
.ad_table_block_right td.gray_box{
	background-color:#cccccc;
	width:50%;
}*/

@media screen and (min-width: 700px)
{
	.ad_table_block_left
	{
		float:left;
		width:32%;
	}
	.ad_table_block_left img
	{
		max-width:95%;
	}
	.ad_table_block_right
	{
		float:right;
		width:68%;
	}
	.ad_table_block_bottom
	{
		clear:both;
	}
	table.ad_table_block_tablecontent
	{
		width:100%;
		margin-top:0px;
	}
	.ad_table_block_right td.gray_box
	{
		background-color:#cccccc;
		width:50%;
	}
}
@media screen and (max-width: 700px)
{
	.ad_table_block{
		max-width:330px;
		margin:0 auto;
	}
	.ad_table_block_left
	{
		width:100%;
	}
	.ad_table_block_left img
	{
		max-width:95%;
	}
	.ad_table_block_right
	{
		width:100%;
	}
	.ad_table_block_bottom{
	}
	table.ad_table_block_tablecontent{
		width:100%;
		max-width:336px;
	}
	.ad_table_block_right td.gray_box{
		background-color:#cccccc;
		width:50%;
	}
}

/*レンタルサーバー用の概要付き広告のCSS ここまで*/

/*Amazon用の自作CSSここから*/
/*ここからパソコン用*/
@media screen and (min-width: 900px)
{
	.aspla{
/*		width:100%;*/
		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_button_block
	{
	/*	padding-top:0.9em;*/
		padding-bottom:5px;
		display:inline-block;
		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;
	}
	.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%;
		border: 2px solid #dddddd;
/*		margin:0 auto;*/
		padding-top:5px;
	}
	.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_title_block{
		padding-bottom:10px;
	}
	.aspla_button_block
	{
	/*	padding-top:0.9em;*/
		padding-bottom:5px;
		display:inline-block;
		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;
	}
	.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 ここまで*/

/*PR 表示用*/
.aspla{
	position: relative;
	margin-top:25px;
}
.aspla .box_title {
	position: absolute;
	display: inline-block;
	top: -24px;
	left: -1px;
	padding: 0 9px;
	height: 25px;
	line-height: 25px;
	font-size: 17px;
	/*background: #ff9900;*/
	background:#dddddd;
	color:#000000;
	/*color: #ffffff;*/
	font-weight: bold;
	border-radius: 5px 5px 0 0;
}