@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/


.logo-image {
	margin-left: -10px;
}

.main#main {
	padding-top: 0;
}

.site-name site-name-text-link{
	margin-top:10;
}
/*ギャラリーの表示方法変更*/
.blocks-gallery-grid .blocks-gallery-item,
.wp-block-gallery .blocks-gallery-item {
width: 80% !important;
margin: 0 0 16px !important;
}

/*固定ページに投稿タイトル出さない*/
.article .entry-title {
   display: none;
}

/*メニューとコンテンツの間幅修正*/
.content { 
margin-top: 0; 
}
/*スマホのみ・PCのみ表示*/
@media(min-width:751px){
    .SmartPhone{
        display: none !important;
    }
}
@media(max-width:750px){
    .PC{
        display: none !important;
    }
}

/* 画面横幅いっぱいに表示*/
.my-cover-full{
margin-right: calc(50% - 50vw);
margin-left: calc(50% - 50vw);
width: auto;
}

/*インスタグラムボタンデザイン*/
/* ボタン全体 */
.flowbtn11{
font-family:'Verdana',sans-serif;	
border-radius:4px;
position:relative;
display:inline-block;
width:90%;
font-size:20px;
color:#fff!important;
text-decoration:none;
margin-bottom:5px;
}

/* Instagramアイコン位置 */
.insta_btn11 .fa-instagram{
position:relative;
z-index:1;	
}
/* Instagram紫グラデ背景色 */
.insta_btn11{
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_btn11:before{
content: '';
position:absolute;
top:17px;
left:-75px;
width:100%;
height:100%;
background:-webkit-radial-gradient(#ffdb2c 5%, rgba(255, 105, 34, 0.65) 45%, rgba(255, 88, 96, 0) 80%);
background:radial-gradient(#ffdb2c 5%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 80%);
}

/* アイコンボタンホバー時 */
.flowbtn11:hover span{
-webkit-transform: rotateX(360deg);
-ms-transform: rotateX(360deg);
transform: rotateX(360deg);
text-decoration:none;
}
/* ボタン内テキスト調整 */
.flowbtn11 span{
font-size:18px;	
position:relative;
left:8px;
bottom:2px;
transition:.6s;	
display:inline-block;	
}
/* ulタグの内側余白を０にする */
ul.snsbtniti2{
padding:0!important;
list-style-type:none!important;
}
/* アイコンボタンの位置調整 */
.snsbtniti2{
display:flex;
flex-flow:row wrap;
}
/* アイコンボタン同士の余白調整 */
.snsbtniti2 li{
flex:0 0 100%;
text-align:center!important;
}
.over-animation img{
  transition: all 1s; /* 1秒で適用する*/
  opacity:1; 
}
.over-animation{
  background: #ffffff; /* 白いバックグラウンド */
}
.over-animation:hover img{
  opacity:0.5; /* 透明度が0.5 */
}

/* 店舗名の背景色上下幅調整 */
.title-padding{
	padding-bottom:15px;
	padding-top:15px;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}