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


.amazon-ad iframe {
min-height: 250px;
}













/*--------------------------------------
wppでランキング順位を表示する
--------------------------------------*/
/* カウンタをリセット */
.my-widget.show_num {
    counter-reset: wpp-ranking;
}
/* 一覧の表示 */
.my-widget.show_num li {
    position: relative;
}
/* 順位を表示 */
.my-widget.show_num li:before {
    content: counter(wpp-ranking, decimal);
    counter-increment: wpp-ranking;
 	display: inline-block;
 	position: absolute;
 	z-index: 1;
 	top: 0;
 	left: 0;
 	width: 25px;
 	height: 25px;
	border-radius: 50%;
	text-align: center;
	line-height: 25px;
}
/* 1位 */
.my-widget.show_num li:nth-child(1):before {
	background: #FCE36b;
	color: #fff;
}
/* 2位 */
.my-widget.show_num li:nth-child(2):before {
	background: #FCE36b;
	color: #fff;
}
/* 3位 */
.my-widget.show_num li:nth-child(3):before {
	background: #FCE36b;
	color: #fff;
}
/* 4位以降の色 */
.my-widget.show_num li:nth-child(n + 4):before{
	background: #f3f3f3;
	color: #9a9a9a;
}







/*ロゴ画像を横全体に表示*/
#inner-header, #drawer + #inner-header, #logo {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
}
.header--center #logo img {
    padding: 0;
    height: auto;
    width: 100%;
    max-width: 600px;
}
.header--center #logo {
    padding: 0;
}
/*END ロゴ画像を横全体に表示*/





/*---Rinkerのデザイン変更---*/
div.yyi-rinker-contents {
    border: solid 2px #42424230;
    border-radius: 5px;
    box-shadow: none;
}
div.yyi-rinker-contents div.yyi-rinker-box {
    padding: .25em 0;
}
div.yyi-rinker-contents div.yyi-rinker-image {
    margin: 2%;
    width: 30%;
}
div.yyi-rinker-info {
    padding: 0 2%;
    width: 100%;
    margin: auto;
}
.yyi-rinker-title {
    font-size: 1em;
    margin-left: .5em;
}
div.yyi-rinker-contents div.yyi-rinker-title p {
    margin: 0;
}
div.yyi-rinker-contents div.yyi-rinker-detail {
    font-size: .8em;
    color: #42424280;
    padding-left: 0;
    margin-top: 0;
    margin-left: .5em;
}
div.yyi-rinker-contents div.yyi-rinker-detail .price-box {
    margin: .5em 0;
    margin-left: .5em;
}
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{
    display: inline-block;
}
div.yyi-rinker-contents ul.yyi-rinker-links li{
    width: 46%;
    padding: 0 .7em;
    margin: .5em .5em .4em .5em;
    font-size: .85em;
    display: inline-block;
    height: 40px;
    border-radius: 3px;
    box-shadow: 0 8px 10px -5px rgba(0,0,0,.25);
    font-weight: bold;
    vertical-align: middle;
    line-height: 40px;
    transition: .3s ease-in-out;
    text-align: center;
}

div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink {
    background: #FFC266;/*Amazonボタンの色*/
}
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink a {
    color: #3A4D66;/*Amazonボタン文字色*/
}
div.yyi-rinker-contents ul.yyi-rinker-links li.rakutenlink{
    background: #ff7c74;/*楽天ボタンの色*/
}
div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink {
    background: #95cad7;/*Yahoo!ショッピングボタンの色*/
}
div.yyi-rinker-contents ul.yyi-rinker-links li a{
    height: 40px;
    line-height: 40px;
    font-size: 0.95em;
    padding-left: 0px;
    padding-right: 0;
}
div.yyi-rinker-contents ul.yyi-rinker-links li a:after{
    padding-left: 5px;
    font-family: "Font Awesome 5 Free";
    content: "\f138"!important; 
    right: auto;
}
@media screen and (max-width: 500px){/*スマホ表示用（ブレイクポイント500px）*/
div.yyi-rinker-contents div.yyi-rinker-box {
    padding: 0;
    display: block;
}
div.yyi-rinker-contents div.yyi-rinker-image {
    width: auto;
    max-width:50%;
    margin:2% auto;
}
div.yyi-rinker-contents div.yyi-rinker-box div.yyi-rinker-info {
    padding: 0;
    margin: auto;
    width: 87%;
    text-align: center;
}
.yyi-rinker-title {
    font-size: .95em;
　　text-align:left
}	
div.yyi-rinker-contents div.yyi-rinker-detail .price-box .price {
    display: block;
}
div.yyi-rinker-contents ul.yyi-rinker-links li {
	width: 85%;
	font-size: .9em;
        margin-top:2px;
}
body div.yyi-rinker-contents ul.yyi-rinker-links li a {
    padding: 0;
}
div.yyi-rinker-contents ul.yyi-rinker-links li a:after{
}}
@media screen and (min-width: 501px) and (max-width: 1239px){/*スマホとPCの中間くらい（ブレイクポイント501～1239px）*/
div.yyi-rinker-contents ul.yyi-rinker-links li{
    width:80%;
}}


div#text-51{
    background: none;
}


div#text-54{
    background: none;
}





div#text-48{
    background: none;
}





div#text-61{
    background: none;
}



div#text-34{
    background: none;
}

div#text-36{
    background: none;
}


div#text-35{
    background: none;
}






div#text-52{
    background: none;
}


div#text-65{
    background: none;
}






#inner-content .btn {
    width: 100%;
    text-align: center;
}








/* アプリーチのカスタマイズ */
.appreach {
  text-align: left;
  padding: 10px;
  border: 1px solid #7C7C7C;
  overflow: hidden;
}
.appreach:after {
  content: "";
  display: block;
  clear: both;
}
.appreach p {
  margin: 0;
}
.appreach a:after {
  display: none;
}
.appreach__icon {
  float: left;
  border-radius: 10%;
  overflow: hidden;
  margin: 0 3% 0 0 !important;
  width: 25% !important;
  height: auto !important;
  max-width: 120px !important;
}
.appreach__detail {
  display: inline-block;
  font-size: 20px;
  line-height: 1.5;
  width: 72%;
  max-width: 72%;
}
.appreach__detail:after {
  content: "";
  display: block;
  clear: both;
}
.appreach__name {
  font-size: 16px;
  line-height: 1.5em !important;
  max-height: 3em;
  overflow: hidden;
}
.appreach__info {
  font-size: 12px !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;
  height: 40px;
  width: 135px;
}
.appreach__gplink img {
  height: 40px;
  width: 134.5px;
}


































.post h2 {
  color: #364e96;/*文字色*/
  padding: 0.5em 0;/*上下の余白*/
  border-top: solid 3px #364e96;/*上線*/
  border-bottom: solid 3px #364e96;/*下線*/
}










/*コメント欄*/
.comment-notes {display:none;}
.comment-form-email {display:none;}
.comment-form-url {display:none;}








.sample-box-12 {
    border: 2px solid #da4033;
    border-radius: 4px;
    margin: 2em 0;
    padding: 2em;
    position: relative;
}
.sample-box-12::before {
    background-color:  #ffffff;
    color: #da4033;
    content: "LINK";
    font-weight: bold;
    left: 1em;
    padding: 0 .5em;
    position: absolute;
    top: -1em;
}











.sample-box-13 {
    border: 2px solid #da4033;
    border-radius: 4px;
    margin: 2em 0;
    padding: 2em;
    position: relative;
}
.sample-box-13::before {
    background-color: #ffffff;
    color: #da4033;
    content: "POINT";
    font-weight: bold;
    left: 1em;
    padding: 0 .5em;
    position: absolute;
    top: -1em;
}


.sample-box-14 {
    border: 2px solid #818181;
    border-radius: 4px;
	background: #F8F8FF;
    margin: 2em 0;
    padding: 2em;
    position: relative;
}





/*--------------------------------------
  ヨメレバ・カエレバ（レスポンシブ）
--------------------------------------*/
.booklink-box, .kaerebalink-box{
    padding:25px;
    margin-bottom: 10px;
    border:double #CCC;
    overflow: hidden;
    font-size:small;
}
.booklink-image, .kaerebalink-image{
    margin:0 15px 0 0;
    float:left;
    min-width: 160px;
    text-align: center;
}
.booklink-image img, .kaerebalink-image img{
    margin:0 auto;
    text-align:center;
}
.booklink-info, .kaerebalink-info{
    margin:0;
    line-height:120%;
    overflow: hidden;
}
.booklink-name, .kaerebalink-name{
    margin-bottom:24px;
    line-height:1.5em;
}
.booklink-powered-date, .kaerebalink-powered-date{
     font-size:8px;
     margin-top:10px;
     font-family:verdana;
     line-height:120%;
}
.booklink-detail, .kaerebalink-detail{font-size: 12px;}
.booklink-powered-date, .kaerebalink-detail{margin-bottom:15px;}
.booklink-link2, .kaerebalink-link1{margin-top:10px;}
.booklink-link2 a,
.kaerebalink-link1 a{
    width:30%;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    display:inline-block;
    margin:5px 2px 0 0;
    padding:10px 1px;
    text-align:center;
    float:left;
    text-decoration:none;
    font-weight:800;
    text-shadow:1px 1px 1px #dcdcdc;
    font-size:12px;
    color: #fff !important;
}
.booklink-link2 a:hover,
.kaerebalink-link1 a:hover{opacity: 0.6;}
.booklink-link2 a:active
.kaerebalink-link1 a:active{
    position:relative;
    top:1px;
}
/*ボタンを変えるときはここから*/
.shoplinkamazon a{color:#FF9901 !important;border: 1px solid #FF9901 !important;}
.shoplinkrakuten a{color:#c20004 !important;border: 1px solid #c20004 !important;}
.shoplinkkindle a{color:#007dcd !important;border: 1px solid #007dcd !important;}
.shoplinkkakakucom a{color:#314995 !important;border: 1px solid #314995;}
.shoplinkyahoo a{color:#7b0099 !important;border: 1px solid #7b0099 !important;}
/*ここまでを変更*/
.shoplinkyahoo img{display:none;}
.shoplinkyahoo a{font-size:10px;}
.booklink-footer{display: none;}

@media screen and (max-width: 680px) {
.booklink-box, .kaerebalink-box{padding:15px;}
.booklink-image, .kaerebalink-image{
    width: 100px !important;
    min-width: initial;
}
.booklink-name > a, .kaerebalink-name > a{
    font-size: 15px;
    font-weight: bold;
}
.booklink-name, .kaerebalink-name{margin-bottom:12px;}
.booklink-powered-date, .kaerebalink-powered-date{margin-top:5px;}
.booklink-link2 a,
.kaerebalink-link1 a{
    width:calc(100% - 4px);
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    margin: 2px 0px;
    padding:10px 0px;
}
}





/*アフィリエイト用ボタンリンク*/
.btn_link{
text-align:center;/*中央寄せ*/
}
.btn_link>a{
    margin: .5em .5em .5em 0;
    text-decoration: none;
width: 100%;
    display: inline-block;
    padding: .4em 1.3em;
    border-radius: 3px;
    box-shadow: 0 2px 3px rgba(0,0,0,.2), 0 2px 3px -2px rgba(0,0,0,.15);
    background-color: #4fc3f7;/*背景色*/
    color: #fff;/*文字色*/
    font-weight: bold;/*文字の太さ*/
}
.btn_link>a:hover{
    text-decoration: none;
    box-shadow: 0 13px 20px -3px rgba(0,0,0,.24);
    -webkit-tap-highlight-color: transparent;
}









/*アフィリエイト用ボタンリンク*/
.btnn_link{
text-align:center;/*中央寄せ*/
}
.btnn_link>a{
    margin: .5em .5em .5em 0;
    text-decoration: none;
width: 100%;
    display: inline-block;
    padding: .4em 1.3em;
    border-radius: 3px;
    box-shadow: 0 2px 3px rgba(0,0,0,.2), 0 2px 3px -2px rgba(0,0,0,.15);
    background-color: #4fc3f7;/*背景色*/
    color: #fff;/*文字色*/
    font-weight: bold;/*文字の太さ*/
}
.btnn_link>a:hover{
    text-decoration: none;
    box-shadow: 0 13px 20px -3px rgba(0,0,0,.24);
    -webkit-tap-highlight-color: transparent;
}




/*アフィリエイト用ボタンリンク*/
.btnnn_link{
text-align:center;/*中央寄せ*/
}
.btnnn_link>a{
    margin: .5em .5em .5em 0;
    text-decoration: none;
width: 100%;
    display: inline-block;
    padding: .4em 1.3em;
    border-radius: 3px;
    box-shadow: 0 2px 3px rgba(0,0,0,.2), 0 2px 3px -2px rgba(0,0,0,.15);
    background-color: #ffc90e;/*背景色*/
    color: #fff;/*文字色*/
    font-weight: bold;/*文字の太さ*/
}
.btnnn_link>a:hover{
    text-decoration: none;
    box-shadow: 0 13px 20px -3px rgba(0,0,0,.24);
    -webkit-tap-highlight-color: transparent;
}





/*トップページおすすめ*/
#pickup{
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top:0.5em;
  margin-bottom:2em;
}
#pickup .pickup_post{
  width:24%;
}
@media only screen and (max-width: 767px) {
  #pickup .pickup_post{
    width:48%;
    margin-bottom:1em;
  }
}
#pickup .pickup_post a img{
  box-shadow: 0 0 3px 0 rgba(0,0,0,.12), 0 2px 3px 0 rgba(0,0,0,.22);
  border-radius:2px;
  transition: .3s ease-in-out;
}
#pickup .pickup_post a img:hover{
  box-shadow: 0 13px 20px -3px rgba(0,0,0,.24);
}

/*トップページの見出し*/
h2.top_menu {
  border-left:none;
  background-color:#fff;
  color:#000;
  overflow: hidden;
  text-align: center;
}
h2.top_menu span {
  position: relative;
  display: inline-block;
  margin: 0 2.5em;
  padding: 0 1em;
  text-align: left;
}
h2.top_menu span::before,
h2.top_menu span::after {
  position: absolute;
  top: 50%;
  content: '';
  width: 400%;
  height: 1px;
  background-color: #000;
}
h2.top_menu span::before {
  right: 100%;
}
h2.top_menu span::after {
  left: 100%;
}
@media only screen and (max-width: 767px) {
  h2.top_menu {
    font-size:1em;
  }
}











/*アフィリエイト用ボタンリンク*/
.btna_link{
text-align:center;/*中央寄せ*/
}
.btna_link>a{
    margin: .5em .5em .5em 0;
    text-decoration: none;
width: 100%;
    display: inline-block;
    padding: .4em 1.3em;
    border-radius: 3px;
    box-shadow: 0 2px 3px rgba(0,0,0,.2), 0 2px 3px -2px rgba(0,0,0,.15);
    background-color: #e6b422;/*背景色*/
    color: #fff;/*文字色*/
    font-weight: bold;/*文字の太さ*/
}
.btna_link>a:hover{
    text-decoration: none;
    box-shadow: 0 13px 20px -3px rgba(0,0,0,.24);
    -webkit-tap-highlight-color: transparent;
}






/*アフィリエイト用ボタンリンク*/
.btnaa_link{
text-align:center;/*中央寄せ*/
}
.btnaa_link>a{
    margin: .5em .5em .5em 0;
    text-decoration: none;
width: 100%;
    display: inline-block;
    padding: .4em 1.3em;
    border-radius: 3px;
    box-shadow: 0 2px 3px rgba(0,0,0,.2), 0 2px 3px -2px rgba(0,0,0,.15);
    background-color: #C0C0C0;/*背景色*/
    color: #fff;/*文字色*/
    font-weight: bold;/*文字の太さ*/
}
.btnaa_link>a:hover{
    text-decoration: none;
    box-shadow: 0 13px 20px -3px rgba(0,0,0,.24);
    -webkit-tap-highlight-color: transparent;
}



/*アフィリエイト用ボタンリンク*/
.btnaaa_link{
text-align:center;/*中央寄せ*/
}
.btnaaa_link>a{
    margin: .5em .5em .5em 0;
    text-decoration: none;
width: 100%;
    display: inline-block;
    padding: .4em 1.3em;
    border-radius: 3px;
    box-shadow: 0 2px 3px rgba(0,0,0,.2), 0 2px 3px -2px rgba(0,0,0,.15);
    background-color: #d69f81;/*背景色*/
    color: #fff;/*文字色*/
    font-weight: bold;/*文字の太さ*/
}
.btnaaa_link>a:hover{
    text-decoration: none;
    box-shadow: 0 13px 20px -3px rgba(0,0,0,.24);
    -webkit-tap-highlight-color: transparent;
}






.title1 {
text-align: center;
background: #e6b422;
margin: 17px -16.5px -17px;
}
.title2 {
text-align: center;
background: #C0C0C0;
margin: 17px -16.5px -17px;
}
.title3 {
text-align: center;
background: #d69f81;
margin: 17px -16.5px -17px;
}
.rank1{
color: #ffffff;
 vertical-align: middle;
 font-size: 20px;
}
.ch1{
list-style-type: none;
 padding-left: 0;
 text-align: center;
 line-height: 40px;
}
.ch1-co{
display: inline; 
background: white; 
border: solid #235180;
 color: #235180;
 font-weight: bold;
 width: 50px;
 height: 50px; 
 padding: 5px !important;
 margin: 5px;
}
.fukidesc {
    display: table;
    margin: 2em;
    width: 95%;
}
.fukicell {
    display: table-cell;
    vertical-align: middle;
    width: 50%;
    padding-right: 10px;
}
.fukidesc .fukibig {
    width: 62%;
}
.fukiimg {
    display: table-cell;
    vertical-align: middle;
    width: 50%;
    padding-right: 10px;
}
.fukiimg img {
    width: 100%;
}
.boxshadow {
    box-shadow: 0 2px 7px rgba(0,0,0,0.15), 0 5px 6px rgba(0,0,0,0.15);
}
.fukicell {
    display: table-cell;
    vertical-align: middle;
    width: 49%;
    position: relative;
}
.fukip {
    border: #ccc solid 4px;
    position: relative;
    background: white;
    padding: 12px 10px;
    border-radius: 13px;
}
.fukip:before {
    border-right: 23px solid #ccc;
    border-bottom: 20px solid transparent;
    border-top: 20px solid transparent;
    top: 30%;
    content: '';
    position: absolute;
    left: -23px;
}
.fukip p {
    margin: 0;
}
.fukip:after {
    content: '';
    position: absolute;
    border-right: 24px solid #fff;
    border-bottom: 20px solid transparent;
    border-top: 20px solid transparent;
    top: 30%;
    left: -17px;
   }
@media screen and (max-width: 600px){
.fukicell, .fukidesc, .fukip, .fukiimg, .post-content .codefuki .codebig, .fukiimg img, .post-content .fukidesc .fukisml, .post-content .fukidesc .fukibig {
    display: block;
    width: 95%;
	}	
}
@media screen and (max-width: 600px){
.fukiimg.fukibig {
    max-width: 600px;
	}
}
@media screen and (max-width: 600px){
.fukiimg {
    padding-right: 0;
    max-width: 400px;
    text-align: center;
	}
}
@media screen and (max-width: 600px){
.fukip:before {
    border-bottom: 20px solid silver;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    top: -40px;
    content: '';
    position: absolute;
    left: 40%;
	}
}
@media screen and (max-width: 600px){
.fukip:after {
    border-bottom: 20px solid white;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    top: -37px;
    content: '';
    position: absolute;
    left: 40%;
	}
}
@media screen and (max-width: 600px){
.fukicell {
    padding-top: 0px;
	padding-right: 0;
	}
}
@media screen and (max-width: 600px){
.fukip {
    border-radius: 6px;
    background: white;
	margin-top: -14px;
    border: solid 2px silver;
	}
}
.mc-plus-btn{/*全体（ボタンと文字）*/
    text-align: center;/*中央揃え*/
    margin: 1em 0 1.5em 0;/*外側の余白（上1em 下1.5em）*/
}
.mc-plus-btn .btn{/*ボタンの設定*/
    width: 100%;/*幅100%*/
    padding: .2em 1.3em;/*内側の余白（上下.2em 左右1.3em）*/
    font-size: 1.3em;/*文字の大きさ*/
    font-weight: bold;/*文字を太文字に*/
}
.mc-top-text, .mc-btn{/*文字＋ボタン*/
    margin-bottom:-.2em!important;/*外側の余白（下-2em）*/
}
.mc-top-text{/*上の文字*/
    font-weight: bold;/*太文字に*/
}
.mc-under-text{/*下の文字*/
    font-size: .8em;/*ちょい小さく*/
}
.mc-btn a:after{/*ボタンのアイコン*/
    content: "\f138";/*お好きに変更してください*/
    font-family:"FontAwesome";
    margin-left: 20px;/*ボタンの文字との余白*/
}