@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.2
*/

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

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

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

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

/*-----------------------------
reCAPTCHAバッジを非表示にする
------------------------------*/
.grecaptcha-badge { visibility: hidden; }
/*-----------------------------
アイキャッチ画像非表示
------------------------------*/

.card.mb-3.p-3.hide_empty.\[hide_empty\:featured_image\] {
    display: none;
}
.w3eden .col-md-7 {
    max-width: 100%!important;
    width: 100%!important;
	    -ms-flex: 0 0 100%;
}

@media (min-width: 768px)
.w3eden .col-md-7 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
}

/*-----------------------------
サイト全体のフォント
------------------------------*/

body {
font-family: "游ゴシック Medium", 游ゴシック体, "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important;
font-feature-settings: "palt";
}

/*-----------------------------
オーディオプレイヤー
------------------------------*/

audio{
width:100%;
}

/*-----------------------------
リストの「・」削除
------------------------------*/

li {
list-style-type:none;
}

/*-----------------------------
ナビメニューふわっと表示
------------------------------*/

.navi-in > ul .sub-menu {
    display: block;
    z-index: -1;
}
.navi-in > ul li > ul {
    opacity: 0.0;
    transition: 0.47s ease-in-out;
}
.navi-in > ul li:hover > ul {
    opacity: 1.0;
    transition: 0.31s ease-in;
    z-index: 999;
}

/*-----------------------------
YouTubeブログカード
------------------------------*/

/*youtubeチャンネルリンク用*/
.youtube-ch .blogcard{
border:2px!important;
}
.youtube-ch
.blogcard-snippet {
visibility: visible!important;
}
.youtube-ch
.blogcard-title{
visibility: visible!important;
}

.youtube-ch .blogcard{
background-color: #FFF!important;
}
.youtube-ch .blogcard-domain,.blogcard-favicon-image{
visibility:hidden;
}
.youtube-ch .external-blogcard-title{
background-color: transparent!important;
}
.youtube-ch .blogcard-snippet{
background-color: transparent!important;
visibility: visible;!important;
}

/*-----------------------------
テーブルの見た目等
------------------------------*/
table td{
 background-color:transparent!important;
}
table tr{
 background-color:transparent!important;
}
table {	
	margin:0px!important;
    table-layout: fixed;

  }
/*枠線----
 table, td, th {
border:transparent!important;
}
-----*/
td .blogcard-thumbnail{
width:100%!important;
}

@media screen and (max-width: 834px){
	table{
	font-size: 4.5vw!important;
	}}


/* 記事タイトル非表示*/

.entry-title{
display:none;
}

/* 記事内・日付非表示*/

.main .date-tags {
  display: none;
}

/* 記事上部余白調整*/
.main{
	padding-top:8px!important;
}

/*見出し*/

a:hover{
  text-decoration: none!important;
color:#9621bd!important;
}

h2{
  color:#fff;
  background-color:#ff6040!important;
}
.article h2 {
  font-size: 24px;
  padding: 25px;
  border-radius: 2px;
}

.entry-content h4,.wide-wrap{
    background-image:url("none");
    background-repeat:no-repeat;
	padding-left:2em;
	background-color: transparent;
}

h4:before {
  content: url("none");
}

h4{
	font-size:20px!important;
	color:#fa68c6!important;
		border-top:none!important;
	 border-bottom:3px solid #fa68c6!important;
}

h5{
	color:#262626!important;
  background-color: #000000!important;

}





/*-----------------------------
ギャラリー
------------------------------*/

/* captions */
.post .wp-caption { margin-bottom:0px; background:#fff; border:1px solid #fff; padding:0px; max-width:100%; -webkit-border-radius:0px; -moz-border-radius:0px; border-radius:0px; }
.post .wp-caption img[class*="wp-image-"] { display:block; margin:0 auto; }
 
.gallery-columns-1 .gallery-item {
    max-width: 100%!important;
}


.gallery-item { /** 画像共通のスタイル **/
    float: left;
	margin-bottom: 0 !important;
}
.gallery { /** ギャラリーを囲むボックス **/
	width: 100%!important;
	margin-top: 20px !important;
    overflow: hidden;
}

.gallery-caption { /** キャプション **/
    margin: 10px 0px 10px 0!important;
    text-align: center;
}




.gallery-columns-1 .gallery-item { /** カラムなし **/
    width: 100%!important;
    margin-right: 0!important;
	    text-align: center;	
}
.gallery-columns-2 .gallery-item { /** 2カラム **/
	width: 48%;
	margin: 0 1%;
}
.gallery-columns-3 .gallery-item { /** 3カラム **/
    width: 31.33333%;
	margin: 0 1%;
}
.gallery-columns-4 .gallery-item { /** 4カラム **/
    width: 23%;
    margin: 1% 1%!important;
}

.gallery-columns-5 .gallery-item { /** 5カラム **/
    width: 18%;
    margin: 0 1%;
} 

@media screen and (max-width: 640px) {
	/* 640px以下用の記述 */
	/* ウィンドウサイズ、スマホサイズの表示*/
			.gallery-columns-1 .gallery-item {
		width:100%!important;
		padding:0px;
		margin: 0px 0;
	}
	
		.gallery-columns-2 .gallery-item {
		width:100%!important;
		margin-right:0!important;
padding-right:0!important;
			
	}
	.gallery-columns-3 .gallery-item {
		width:100%;
    margin-right: 0!important;
padding-right:0!important;
	    text-align: center;	
	}
	
 .gallery-columns-4 .gallery-item {
		width:46%;
		padding:0px;
	  margin: 0 5px 8px 5px!important;
	}
	
	.gallery-columns-5 .gallery-item {
		width: 31.33333%;
		margin: 0 1%;
	}
}


/*-----------------------------
モバイル表示関連
------------------------------*/
/* モバイル表示 */

html {
        overflow-x:hidden!important;
}
body {
position: relative;
overflow-x: hidden;
}

/*ヘッダーモバイルボタンの設定*/
.search-menu-button.menu-button{
	color: #FFFFFF;
}

.navi-menu-button.menu-button{
	padding-top: 10px;
}

.menu-caption{
	display:none!important;
}

/*スライドインメニューを右から*/
.navi-menu-content{
	left: auto;
	right: 0;
	background-color:rgba(255,255,255,0.9);
	transform: translateX(101%);
	font-weight:bold
}

/*-----------------------------
記事一覧(wpspプラグイン)
------------------------------*/

.wp-show-posts-single {
margin: 0 5px 0 5px ;
}

.wpsp-read-more {
 float: right;
}

.wp-show-posts-image {
	margin:0!important;
	padding:5px!important;
	}

/* 新着記事表示 */

.new-entry-cards.large-thumb {
display: flex;
flex-wrap: wrap;
}

.new-entry-cards.large-thumb a {
width: 33.333%;
}

/768px以下/
@media screen and (max-width: 768px){
.new-entry-cards.large-thumb a {
width: 50%;
}
}

/480px以下/
@media screen and (max-width: 480px){
.new-entry-cards.large-thumb a {
width: 100%;
}
}

/*-----------------------------
画像表示
------------------------------*/

a:hover img {	
	transition-duration: 0.05s;
	outline: 3px solid lavender;
  outline-offset: -3px;
}

.logo-header img {
transform: none!important;
		transition-duration: 0s;
		outline: 0px solid !important;
  outline-offset: 0px;
}

/*-----------------------------
boxタグ
------------------------------*/

.box-gray {
 padding: 0.5em 1em;
 margin: 2em 0;
 color: #2c2c2f;
 background: rgba(204,204,204,0.3);
}
.box-gray p {
 margin: 0; 
 padding: 0;
}

/*SNSシェアボタン*/
	#main .button-caption {
	display: none; /*キャプション非表示*/
}

/*SNSシェアボタン*/
.sns-share-message{
	font-weight: bold; /*太字*/
	color: #875d5b; /*文字色*/
}
.sns-share-buttons {
	flex-wrap: nowrap; /*折り返さない*/
	justify-content: center; /*中央寄せ*/
}
.sns-share-buttons a {
	border-radius: 50%; /*丸くする*/
	font-size: 20px; /*アイコンのサイズ*/
	margin: 0 10px; /*ボタン同士の間隔*/
}
#main .sns-share a {
	width: 40px; /*ボタンの横幅*/
	height: 40px; /*ボタンの高さ*/
}

/*ダウンロード*/
.w3eden {
	padding: 15px;
	border : 1px solid #ccc;
	background: whitesmoke;
}
.w3eden a {
	text-decoration: underline !important;
}
ul.list-group{
	display:none!important;
}


/*-----------------------------
ショップ内検索ボタン
------------------------------*/

.button_shop {
margin-top:5px;
width:100%;
display       : inline-block;
font-size     : 16pt;        /* 文字サイズ */
text-align    : center;      /* 文字位置   */
cursor        : pointer;     /* カーソル   */
padding       : 12px 100px;   /* 余白       */
background    : #000000!important;     /* 背景色     */
color         : #ffffff;     /* 文字色     */
line-height   : 1em;         /* 1行の高さ  */
transition    : .3s;         /* なめらか変化 */
box-shadow    : 1px 1px 3px #666666;  /* 影の設定 */
border        : 2px solid #000000;    /* 枠の指定 */
}
.button_shop:hover {
box-shadow    : none;        /* カーソル時の影消去 */
background    : #ffffff!important;     /* 背景色     */
color         : #000000;     /* 文字色     */
}


