@charset "UTF-8";
/*
 Theme Name: SANGO Child
 Theme URI: https://saruwakakun.design
 Author: SARUWAKA
 Author URI: https://saruwakakun.com
 Template: sango-theme
 Version: 4.0
*/
/*こちらはSANGOの子テーマ用CSSです。以下にCSSを記入していきましょう。*/

.booklink-image > img {
    display: none!important;
}

/* -----------------------
    アプリーチ用CSS
   ----------------------- */

.appreach {
	max-width: 400px;
	text-align: left;
	padding: 10px;
	border: 10px solid lightblue;
	overflow: hidden;
}
.appreach:after {
	content: "";
	display: block;
	clear: both;
}
.appreach p {
	font-size: calc(80% + 0.2vw);
	margin: 0;
}
.appreach a:after {
	display: none;
}
.appreach__icon {
	float: left;
	width:30%;
	height:auto;
}
.appreach__detail {
	margin-left: 2%;
	display: inline-block;
	line-height: 1.5;
	width: 67%;
	max-width: 67%;
}
.appreach__detail:after {
	content: "";
	display: block;
	clear: both;
}
.appreach__name {
	padding-bottom:0.5em;
	line-height: 1.5em !important;
	font-weight: bold;
	max-height: 3em;
	overflow: hidden;
}
.appreach__info {
	font-size: calc(60% + 0.2vw)!important;
}
.appreach__developper, .appreach__price {
	margin-right: 0.5em;
}
.appreach__posted a {
	margin-left: 0.5em;
}
.appreach__links {
	float: left;
	height: 40px;
	margin-top: 8px;
	white-space: nowrap;
}
.appreach__aslink img {
	margin-right: 10px;
	max-height: 40px;
	width: auto;
}
.appreach__gplink img {
	max-height: 40px;
	width: auto;
}


/* SANGO用 見出し<h2>設定 */
.entry-content h2{
  position: relative;
  color: #FFFFFF;
  background: #f5b49d;
  line-height: 1.4;
  padding: 0.5em 0.5em 0.5em 1.8em;
}

.entry-content h2:before {
  font-family: "Font Awesome 5 Free";
  content: "\f14a";
  position: absolute;
  left : 0.5em; /*左端からのアイコンまでの距離*/
}

/* SANGO用 見出し<h4>設定 */
.entry-content h4 {
border-bottom: solid 3px #cce4ff;
position: relative;
}

.entry-content h4:after {
position: absolute;
content: " ";
display: block;
border-bottom: solid 3px #5472cd;
bottom: -3px;
width: 20%;
}

/*合わせて読みたい*/
.awasete{
    margin-bottom: 20px;
}
.awasete .awasete__title{
    border: none;
    margin: 0;
    padding: 0;
}
.awasete .awasete__title span{
    background: #333;
    color: #fff;
    display: inline-block;
    font-size: 14px;
    padding:5px 10px;
}
.awasete .awasete__title i{
    margin-right: 5px;
}
.awasete .awasete__list{
    border: 1px solid #ccc;
    padding: 20px;
}
.awasete .awasete__list__item{
    list-style: none;
    margin:0 0 20px 0;
}
.awasete .awasete__list__item:last-child{
    margin-bottom: 0;
}
.awasete .awasete__list__item__link{
    text-decoration: none;
    box-shadow: none;
}
.awasete .awasete__list__item__link__image{
    width: 20%;
}
.awasete .awasete__list__item__link__image img{
    height: auto;
    width: 100%;
}
.awasete .awasete__list__item__link__content{
    width: 75%;
}
.awasete .awasete__list__item__link__content__title:before{
    content: none;
}
.awasete .awasete__list__item__link__content__date{
    color: #666;
    font-size: 14px;
}

/*比較表*/
.compare-box {
   margin: 2em auto;
   background: #fef9ed;
   border-radius:4px;
   box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
   max-width:600px;
}
.compare-box .compare-box-head {
   font-size: 1em;
   background: #fdc44f;
   text-align: center;
   color: #FFF;
   font-weight: bold;
   letter-spacing: 0.05em;
   display:flex;
   border-radius:4px 4px 0 0;
   line-height:1.5;
}
.compare-box p {
   padding: 0;
   margin: 0 0 20px 0;
}
.compare-box .compare-box-head div{
   padding:1.2em 1em;
   font-size:1em;
   line-height:1.1;
}
.compare-box .compare-box-content{
   display:flex;
   font-size:0.9em;
   line-height:2;
   text-align: justify;
   text-justify: inter-ideograph;
}
.compare-box .compare-box-content div {
   padding: 1em 1.6em;
}
.compare-head-left,.compare-head-right,.compare-left,.compare-right{
   flex:1;
}
@media screen and (max-width: 480px){
   .compare-box .compare-box-content div {
      padding:1em 0.8em;
   }
}

/*--------------------------------------
Rinkerのデザイン変更
--------------------------------------*/
/*-----全体-----*/
div.yyi-rinker-contents {/*内容（全体）*/
    border: solid 1px #42424230;/*枠線の種類・幅・色*/
    border-radius: 10px;/*枠線の丸み（上　右）*/
    box-shadow: 0 0px 3px rgba(0, 0, 0, 0.1);/*影*/
}
div.yyi-rinker-contents div.yyi-rinker-box {/*内容（中身）*/
    padding: 1em 0;/*余白（中）*/
}
/*-----左側（画像）-----*/
div.yyi-rinker-contents div.yyi-rinker-image {/*画像*/
    margin-left: 3%;/*左の余白*/
    width: 30%;/*画像の幅*/
}
/*-----右側（商品名やボタンなど）-----*/
div.yyi-rinker-info {/*右側全体*/
    padding: 0 3%;/*左右の余白*/
    width: 100%;/*右側全体の幅*/
}
.yyi-rinker-title {/*商品名*/
    font-size: .9em;/*文字の大きさ*/
}
div.yyi-rinker-contents div.yyi-rinker-title p {/*タイトル*/
    margin: 0;/*タイトルの余白*/
}
div.yyi-rinker-contents div.yyi-rinker-title a {/*タイトル*/
    color: #42424290;/*タイトルの文字色*/
}
div.yyi-rinker-contents div.yyi-rinker-detail {/*販売者と価格*/
    font-size: .8em;/*文字の大きさ*/
    color: #42424280;/*文字の色*/
    padding-left: 0;/*左側の余白*/
    margin-top: 0;/*上の余白*/
}
div.yyi-rinker-contents div.yyi-rinker-detail .price-box {/*価格*/
    margin: .5em 0;/*上下の余白*/
}
div.yyi-rinker-contents div.yyi-rinker-detail .price-box .price {/*価格の文字*/
    letter-spacing: 0.1em;/*文字の間隔*/
    font-size: 1.2em;/*文字の大きさ*/
    margin-right: .5em;/*右側の余白*/
}
div.yyi-rinker-contents ul.yyi-rinker-links li {/*すべてのボタン*/
    width: 45%;/*幅（2列になるように）*/
    padding: 0 .7em;/*左右の余白（ボタン内）*/
    margin: .5em 1.5em .4em 0;/*左側の余白だけ0（ボタン外）*/
    box-shadow: 0 2px 3px rgba(0,0,0,.2);/*影*/
    font-size: .8em;/*文字の大きさ*/
}
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink a:before, div.yyi-rinker-contents ul.yyi-rinker-links li.rakutenlink a:before, div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink a:before {
    display: none;/*マーク削除*/
}
/*-----ボタンの色-----*/
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink {/*Amazon*/
    background: #FFC266;
}
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink a {
    color: #3A4D66;
}
div.yyi-rinker-contents ul.yyi-rinker-links li.rakutenlink {/*楽天*/
    background: #D95656;
}
div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink {/*Yahoo*/
    background: #FF4D4D;
}
/*-----マウスホバー（ボタン）-----*/
div.yyi-rinker-contents ul.yyi-rinker-links li:hover {
    box-shadow: 0 3px 14px rgba(0, 0, 0, .25);/*優しく浮き上がる影*/
}
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink a:hover, div.yyi-rinker-contents ul.yyi-rinker-links li.rakutenlink a:hover, div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink a:hover {
    box-shadow: none;/*手前のマウスホバー*/
}
div.yyi-rinker-contents ul.yyi-rinker-links li a:hover {
    opacity: 1;/*ホバー時に薄くなるのをオフ*/
}
@media screen and (max-width: 500px){/*スマホ表示用（ブレイクポイント500px）*/
/*-----全体-----*/
div.yyi-rinker-contents div.yyi-rinker-box {
    display: block;/*縦表示になるように*/
}
/*-----画像ー----*/
div.yyi-rinker-contents div.yyi-rinker-image {
    width: auto;/*画像を中央表示*/
}
/*-----商品名やボタンなど-----*/
div.yyi-rinker-contents div.yyi-rinker-box div.yyi-rinker-info {/*全体*/
    padding: 0;/*余白削除*/
    margin: auto;/*中央揃え*/
    width: 87%;/*横幅*/
    text-align: center;/*商品名やボタンを中央表示*/
}
div.yyi-rinker-contents div.yyi-rinker-detail .price-box .price {/*価格*/
    display: block;/*価格を縦並びにする*/
}
div.yyi-rinker-contents ul.yyi-rinker-links li {/*ボタン*/
    width: 100%;/*横幅いっぱい*/
    margin: .5em 0;/*上下の余白　左右の余白削除*/
}
body div.yyi-rinker-contents ul.yyi-rinker-links li a {/*ボタンの文字*/
    padding: 0;/*文字の余計な余白を削除*/
}}
@media screen and (min-width: 501px) and (max-width: 1239px){/*スマホとPCの中間くらい（ブレイクポイント501～1239px）*/
div.yyi-rinker-contents ul.yyi-rinker-links li{
    width:80%;/*横幅を80％*/
}}

/*メニューバーの下にアドセンス広告*/
.centerad{
text-align: center;
padding-top: 10px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
margin-left : auto ;/*-----IE用-----*/
margin-right : auto ;/*-----IE用-----*/
}