/*
ここに独自の CSS を追加することができます。

詳しくは上のヘルプアイコンをクリックしてください。
*/
.kaerebalink-box,
.booklink-box {
border-radius: 4px;
box-shadow: 1px 1px 3px 1px #ddd;
padding: 15px;
overflow: hidden;
margin: 50px 0;
}
@media screen and ( min-width: 640px ){
.kaerebalink-box,
.booklink-box {
margin: 50px 15px;
}
}
.kaerebalink-image,
.booklink-image {
margin-right: 20px;
float:left;
}
.kaerebalink-info,
.booklink-info {
overflow: hidden;
}
.kaerebalink-name a,
.booklink-name a{
font-size: 18px;
text-decoration: none;
}
.kaerebalink-powered-date a,
.kaerebalink-powered-date,
.booklink-powered-date a,
.booklink-powered-date {
font-size: 12px;
margin-top: 5px;
color:#444;
margin-bottom:10px;
}
.kaerebalink-link1,
.booklink-link2 {
font-size: 18px;
margin-top:30px;
}
.shoplinkamazon,
.shoplinkrakuten,
.shoplinkyahoo {
width: 75%;
text-align: center;
margin: 15px 0;
}
.shoplinkamazon {
background-color:rgba(255,150,0,0.5);
border: 1px solid #ff9900;
border-radius: 6px;
}
.shoplinkrakuten {
background-color:rgba(255,0,0,0.5);
border: 1px solid #bf0000;
border-radius: 6px;
}
.shoplinkyahoo {
background-color:rgba(0,0,255,0.5);
border: 1px solid #4070ff;
border-radius: 6px;
}
.shoplinkamazon a,
.shoplinkrakuten a,
.shoplinkyahoo a {
text-decoration: none;
display: block;
padding: 5px 0;
color:#fff;
}
.shoplinkamazon a:hover{
background-color:#ffad33;
}
.shoplinkrakuten a:hover{
background-color:#cc3333;
}
.shoplinkyahoo a:hover{
background-color:#668dff;
}

/* iPhone6 Plus以下のスマホを想定 */
@media only screen and (max-width: 380px) {
.kaerebalink-image,
.booklink-image {
margin: 0 auto;
margin-bottom: 20px;
float: none;
}
.kaerebalink-image img,
.booklink-image img {
display: block;
}
.shoplinkamazon,
.shoplinkrakuten,
.shoplinkyahoo {
width: 95%;
margin: 10px auto;
}
.shoplinkamazon a,
.shoplinkrakuten a,
.shoplinkyahoo a {
padding: 10px 0;
}
}

/* 非表示設定 */
.kaerebalink-detail {display:none;}
.booklink-detail {display:none;}

.shoplinkrakuten img,
.shoplinkamazon img {
display: none;
}

.insta_btn2{/*ボタンの下地*/
  color: #FFF;/*文字・アイコン色*/
  border-radius: 7px;/*角丸に*/
  position: relative;
  display: inline-block;
  height: 50px;/*高さ*/
  width: 190px;/*幅*/
  text-align: center;/*中身を中央寄せ*/
  font-size: 25px;/*文字のサイズ*/
  line-height: 50px;/*高さと合わせる*/
  vertical-align: middle;/*垂直中央寄せ*/
  background: -webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
  background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;/*グラデーション①*/
  overflow: hidden;/*はみ出た部分を隠す*/
  text-decoration:none;/*下線は消す*/
}

.insta_btn2:before{/*グラデーション②*/
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;/*全体を覆う*/
  height: 100%;/*全体を覆う*/
  background: -webkit-linear-gradient(15deg, #ffdb2c, rgb(249, 118, 76) 25%, rgba(255, 77, 64, 0) 50%) no-repeat;
  background: linear-gradient(15deg, #ffdb2c, rgb(249, 118, 76) 25%, rgba(255, 77, 64, 0) 50%) no-repeat;
}

.insta_btn2 .fa-instagram{/*アイコン*/
  font-size: 35px;/*アイコンサイズ*/
  position: relative;
  top: 4px;/*アイコン位置の微調整*/
}

.insta_btn2 span {/*テキスト*/
  display:inline-block;
  position: relative;
  transition: .5s
}

.insta_btn2:hover span{/*ホバーで一周回転*/
  -webkit-transform: rotateX(360deg);
  -ms-transform: rotateX(360deg);
  transform: rotateX(360deg);
}