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

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

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

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

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

#main .button-caption {
	display: none; /*キャプション非表示*/
}
/************************************
** SNS ボタンをまとめて丸くする
************************************/
/*SNSシェアボタン*/
.sns-share-message{
	font-weight: bold; /*太字*/
	color: #000000; /*文字色*/
}
.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; /*ボタンの高さ*/
}

/*ヘッダー背景透過化*/
#header-container {
background-color: transparent;
}
/*フッター背景透過化*/
#footer{ /* フッター */
background: rgba(100, 0, 0, 0.8);	
}
/***サイドバー背景透過***/
#sidebar{
background-color:rgba(255, 255, 255, 0.7);
}
/***メインカラム背景透過***/
#main{
background-color:rgba(255, 255, 255, 0.7);
}
/***グローバルナビメニュー背景透過***/
#navi{
background:rgba(100, 0, 0, 0.8);
}	
/*パンクズリストの色 */
#breadcrumb a {
color: #000000;
}
/***サイドバー見出し文字色***/
.sidebar h5{
  color:#000000;/*好きな文字色にする*/
}
/***モバイルボタンの背景色***/
.mobile-menu-buttons {
background: rgba(0, 0, 0, 0.7);
color: white;
}

.mobile-menu-buttons .menu-button > a {
color: white;
}
/*エントリーカードのタイトル文字サイズ**/
.entry-card-title {
	font-size: 16px;
} 

/*===============================
	TablePress
=================================*/
table.tablepress tr {
  background-color: transparent;
}

/*--------------------------------------
画像キャプション
--------------------------------------*/
.wp-caption {
  text-align: center;
  background-color: transparent; /*背景色透明に変更*/
  border-radius: 0;
  border: none;
  margin: 0;
}
.wp-caption-text {
    display: inline-block;
    margin: 0;
}
/*新着記事に日付を表示*/
.new-entry-card-date {
display: block;
text-align: right
}
.new-entry-card-post-date::before{ /*投稿日のアイコンの変更*/
font-family: "Font Awesome 5 Free";
content: "\f017""掲載日"; /*fa-clockアイコン*/
padding-right: 4px; /*右余白*/
font-weight: 400; /*アイコンの太さ*/
}
.new-entry-card-update-date::before{ /*更新日のアイコンの変更*/
font-family: "Font Awesome 5 Free";
content: "\f1da""更新日"; /*fa-historyアイコン*/
padding-right: 4px; /*右余白*/
font-weight: 900; /*アイコンの太さ*/
}
/*/サイドバーの文字サイズ変更*/
.widget-entry-card {
    font-size: 14px;
}
#sidebar {
    font-size: 14px;
}
/*/スライドインサイドバーの文字色の変更*/
#slide-in-sidebar,
#slide-in-sidebar a {
	color: #000;
}
/************************************
**モバイルスライドインメニュー
************************************/
span.fas.fa-times::before{
    font-family: "Font Awesome 5 Free";
    content: "\f060";
}
ul.menu-drawer:before{
    font-size:1.2em;
    background: white;
    color:#333;
    margin-bottom:1em;
    border-bottom:3px dotted #800000; 
    content: "メニュー";
}
ul.menu-drawer:after {
    background: white;
}
.menu-drawer li {
    padding:0;
}
.menu-drawer li{
    font-weight: bold;
}
.menu-drawer a{
    font-size:1.3em;
    background-color:#ffffff;
    color:#545454;
    margin: .5em 0;
}
.menu-drawer a:hover{
    background-color:#f7f7f7;
}
.menu-drawer .sub-menu {
    padding:0;
}
.menu-drawer .sub-menu li{
    font-size: .9em;
}
.menu-drawer .sub-menu li a::before {
    font-family: "Font Awesome 5 Free";
    content : "\f105";
    color:#7b7b7b;
    margin:0 .5em 0 1em;
}
@media (max-width:834px){
.sub-menu{
    box-shadow: none;
}
}
/************************************
****　次のページボタン
************************************/
.pagination-next-link{
transition:0.4s;
}
@media (max-width:1023px){
.pagination-next-link{
box-shadow: 0px 1px 5px 0 rgba(0,0,0,.2);
}
}
@media (max-width:600px){
.pagination-next-link{
width:92%;
margin-right:auto;
margin-left:auto;
}
}
.pagination-next-link:hover{
background-color:#f7f7f7;
transition:0.4s;
}
.pagination-next-link:hover{
background-color:#69ae8f;
color:#fffff4;
box-shadow: 0px 1px 5px 0 rgba(0,0,0,.2);
}
.pagination .current {
background-color: #69ae8f;
}
.page-numbers.current{
color:#f9fff4;
box-shadow: 0 1px 2px slategrey;
}
.pagination a:hover {
background-color:#69ae8f;
transition: all 0.5s;
color: #f9fff4;
}

/* — コンタクトフォーム7　送信ボタンのカスタマイズ — */
input.wpcf7-submit {
padding:1em !important;/* ボタン内の余白 */
margin:2em 0em !important;/* ボタンの上下の余白 */
background-color: #25c04a !important;/* 背景の色 */
border-radius: 5px !important;/* 角を丸く*/
color: #fff !important;/* 文字の色*/
font-size: 18px !important;/* 文字の大きさ */
font-weight: bold !important;/* 文字の太さ*/
width: 50%;/* ボタンの横幅*/
transition:0.5s;/* 背景色が変わるまでの時間*/
box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.10);/* 薄っすらとボタンにドロップシャドウをかける*/
}

input.wpcf7-submit:hover {
background-color:#f2d500 !important;/* マウスを乗せたときの背景色 */
color: #fff !important;/* マウスを乗せたときの文字の色 */
}

.btn-submit {
    width: 100%;
    text-align: center;
}

/* WPギャラリーの画像を複数挿入時に拡大される現象対応（インスタグラムから変更 2024.12.10） */
.entry-content .wp-block-gallery figure.wp-block-image {
    flex-grow: 0;
}

