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

/************************************
****　亜梨沙編集部分↓
************************************/
/* 引用元：https://kenko-san.com/cocoon-width/ */

/*PC用*/
.no-sidebar .wrap {
    width: 860;       /* デフォルト設定の 860px → auto に変更している */
}
/* パンくずリスト無効の場合は不要 */
/*.breadcrumb.sbp-main-before,
.breadcrumb.sbp-footer-before,
.breadcrumb.pbp-main-before,
.breadcrumb.pbp-footer-before {
    padding-left: 30px;
    padding-right: 30px;
} */
/*480px以下*/
@media screen and (max-width: 480px){
    .no-sidebar .wrap {
        width: auto;
    }
/* パンくずリスト無効の場合は不要 */
/*  .breadcrumb.sbp-main-before, 
    .breadcrumb.sbp-footer-before,
    .breadcrumb.pbp-main-before,
    .breadcrumb.pbp-footer-before {
        padding-left: 1em;
        padding-right: 1em;
    } */
}

/************************************
****　全体のバランス
************************************/
.entry-content {/*本文下の空白を削除*/
padding-bottom: 0;
margin-bottom: 0;
}
@media (max-width: 1023px){
article > .entry-content, aritcle > footer.article-footer {/*本文左右の空白*/
padding: 0 20px;
}
}
@media screen and (max-width: 880px){
.page-body {
font-size: 16px;
}
}
@media screen and (max-width: 480px){
.page-body {
font-size: 15px;
}
}
img{
box-shadow: 0px 0px 0px 0 rgba(0,0,0,.2);
}
a {
 -webkit-tap-highlight-color:rgba(0,0,0,0);
}
.body .article {/*本文SNSフォロー下の空白*/
margin-bottom: 0;
}

/************************************
****　ヘッダーメニュー
************************************/
/* .navi-in > ul{ */ /*メニューを中央に配置する場合は4～7行目を削除してください*/
/* justify-content:flex-start; */
/* } */
/* .navi-in>ul li { */
line-height: 40px;
height: 40px;
}
.navi-in a{
font-size:15px;
}
#navi .navi-in a:hover {
transform: none!important;
}
.navi-in > ul .sub-menu a {
padding: 0;
}
.navi-in > ul .sub-menu{
box-shadow: 0px 2px 5px 0 rgba(0,0,0,.26);
}
.sub-menu .caption-wrap {
color:#333;/*サブメニューの文字色*/
border-top: dotted #dddddd;
background:#fff;/*サブメニューの背景色*/
padding:0 0 0 2em;
margin:0;
}
.navi-in > ul .sub-menu a:hover {
transform: none!important;
}
div#header-container {
box-shadow: none;
}
div.item-label{
font-weight:bold;
}

/************************************
****　フッター
************************************/
#footer, #footer a, .footer-title {
color: #545454;
}
.footer-title{
border-bottom:3px dotted;
border-color:#90C31F;/*点線の色変更はこちら*/
margin-bottom:1em;
}
@media (max-width:1023px){
.footer {
margin-top: 0;
padding-top: 0;
}}
@media screen and (max-width: 480px){
h2, h3 {
font-size: 1.17em;
}
}
.footer-widgets, .footer-widgets-mobile {
margin: 0 auto;
}
.footer-left, .footer-center, .footer-right, .footer-mobile {
padding: 0 10px;
}
.widget.widget-footer-mobile{
padding:0;
}
.widget-footer-mobile div.tagcloud,.widget-footer-mobile ul li a{
margin-right:.2em;
margin-left:.2em;
}
@media screen and (max-width: 1023px){/*スマホ画面でサイドバーを非表示*/
div.sidebar {
display: none;
}
}

/************************************
****　モバイル表示　ヘッダーメニュー・検索アイコン
************************************/
.mobile-menu-buttons{
height:50px;
box-shadow: none;
}
.mobile-menu-buttons > li {
padding-top:0;
}
.menu-button{
margin: auto;
}
.sidebar-menu-button{
  color:#dd3333 ;/* メニューのテキストの色 */
}
.mobile-menu-buttons .menu-button:hover{
background-color:#dd3333;/* メニューの背景色 */
}
span.fas.fa-search::before{
color:#90C31F;/*検索マーク色変更はこちら*/
margin-left:1em;
}
span.fas.fa-bars::before{
color:#90C31F;/*ハンバーガーメニュー色変更はこちら*/
margin-right:1em;
}
.navi-menu-caption.menu-caption,.home-menu-caption.menu-caption,.search-menu-caption.menu-caption,.top-menu-caption.menu-caption,.sidebar-menu-caption.menu-caption{
display:none;
}

/************************************
****　SNSシェアボタン
************************************/

.sns-share{
margin: 0 0 24px ;
}
.sns-share-message:before, .sns-follow-message:before, span.related-entry-main-heading.main-caption:before, .comment-title:before {
letter-spacing:.3em;
border-radius:20px;
border: 0;
padding: 0;
background-color:#3f5569;/*SHARE 背景色の変更はこちら*/
color:#fff;
display: inline-block;
width: 40%;
}
.sns-share-message, .sns-follow-message, span.related-entry-main-heading.main-caption, .comment-title {
margin:20px 0 10px 0;
}
.sns-share.ss-high-and-low-lc a .button-caption.button-caption{
display:none;
}
.sns-share-buttons {
padding-right:10%;
padding-left:10%;	
}
.sns-share-buttons a {		
transition:0.5s;
}
.sns-share.ss-top.ss-col-1 a, .sns-share.ss-bottom.ss-col-1 a {/*設定したカラム数に応じて数字を変更してください(例：カラム6列→6)*/
width: 13%;
}
.sns-share.ss-high-and-low-lc a .social-icon{
font-size: 25px;
}
@media (max-width:480px){
.sns-share-message:before, .sns-follow-message:before, span.related-entry-main-heading.main-caption:before, .comment-title:before {
width: 55%;
}
.sns-share-buttons {
padding-right:5%;
padding-left:5%;
}
.sns-share.ss-top.ss-col-1 a, .sns-share.ss-bottom.ss-col-1 a {/*設定したカラム数に応じて数字を変更してください(例：カラム6列→6)*/
width: 15%;
}
.sns-share.ss-high-and-low-lc a .social-icon{
font-size: 20px;
}
}


/***ヘッダーロゴエリア画像周りの影を無くす***/
/* PC */
.logo-header img{
box-shadow: 0 0px 0px rgba(0, 0, 0, 0);
}
/* スマホ ※機能してない？*/
@media (max-width: 480px){
	#main-image{
		box-shadow: none;
	}	
}

/***コンテンツの背景色***/
.main{
    background-color: #ffffff;
}

/*ヘッダーボタンの色と高さ、アイコンの位置を調整*/
.search-menu-button.menu-button,
.navi-menu-button.menu-button{
	background-color: #dd3333;
	color: #000000;
	height: 50px;
	padding-top: 10px;
}

.logo-menu-button.menu-button{
	background-color: #dd3333;
}

.logo-menu-button img {
	margin-left: 0;
}



/*スライドインメニューをカスタマイズ*/
.navi-menu-content{
	left: auto;
	right: 0;
	background-color: rgba(255,255,255,0.9);
	transform: translateX(101%);
}

.menu-drawer a{
	font-size: 1.1em;/*文字の大きさ*/
	color: #000000;/*文字の色*/
	height: 3em;/*行の高さ*/
}

.menu-drawer a:hover{
	color: rgba(255,255,255,0.7);
	background-color: rgba(224,224,224,0.5);
}

/* フッター背景画像の指定 */
/* #footer {
background-image: url( https://assetsdance.net/wp-content/uploads/2024/01/yogosi01-.png );
} */

/* 投稿、固定ページの背景を透明化 */
/* #main, #footer {
  background: transparent;
} */

/* キャッチフレーズの文字色、サイズ */
.tagline {
	color: #000000;
	font-size: 15px;
	font-weight: bold;
}

/* 表の背景色 */ 
.table td {
       background: #ffffff;
}