@charset "utf-8";

/*ソーシャルボタンCSS*/
/*Font Awesome5 アイコンフォント*/
/* ボタンを囲むdiv */
.snsbtn{
width:100%;
height:auto;
margin:0 auto;
}

/* ボタン全体 */
.flowbtn{
border-radius:50%;
position:relative;
display:inline-block;
width:50px;
height:50px;
font-size:30px;
color:#fff!important;
text-decoration:none;
transition:.5s;			
}
/* アイコンをど真ん中に*/
.flowbtn i {
position:absolute;
top:50%;
left:50%;
-ms-transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
transform:translate(-50%,-50%);
}

/* ulタグの内側余白を０にする */
ul.snsbtniti{
padding:0!important;
list-style-type:none!important;
}
/* ボタン全体の位置 */
.snsbtniti{
display:flex;
flex-flow:row wrap;
justify-content:space-around;
}
/* ボタン同士の余白(並ばせる数はここを調整33%で3、24%で4、19%で5) */
.snsbtniti li{
flex:0 0 19%;
text-align:center !important;
}
/* ボタンにマウスを乗せた時 */
.flowbtn:hover{
-webkit-transform:translateY(-5px);
-ms-transform:translateY(-5px);
transform:translateY(-5px);
}
/* Twitter */
.fl_tw{
background:linear-gradient(135deg, #999999 0%,#000000 100%);
}
/* Instagramアイコン位置 */
.insta_btn .fa-instagram{
font-size:35px;	
}
/* Instagram紫グラデ背景 */
.insta_btn{
background:-webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
background:linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
overflow:hidden;	
}
/* Instagramオレンジグラデ背景 */
.insta_btn:before{
content: '';
position:absolute;
top:27px;
left:-12px;
width:59px;
height:40px;
background:-webkit-radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);
background:radial-gradient(#ffdb2c 5%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);
}
/* Facebook */
.fl_fb{
background: linear-gradient(135deg, #6699ff 0%,#3b5998 100%);
}
/* Feedly */
.fl_fd{
background:linear-gradient(135deg, #b1ea4d 0%,#459522 100%);
font-size:28px;
}
/* Pocket */
.fl_pk{
background:linear-gradient(135deg, #f36265 0%,#dd4f68 100%);
}
/* はてブ */
.fl_hb{
background: linear-gradient(to bottom, #1fbccd 0%, #1c91d4 84%);
font-size:25px;
}
/* YouTube */
.fl_yu{
background:linear-gradient(135deg, #f5515f 0%,#c9293c 100%);
font-size:26px;
}
/* LINE */
.fl_li{
background: linear-gradient(135deg, #3a9278 0%,#00c300 100%);
}
/* メールボタン */
.fl_ma{
background:linear-gradient(135deg, #fad961 0%,#f76b1c 100%);
font-size:26px;	
}