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

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

/*背景色を無効に*/
.header-container, .main, .sidebar, .footer {
background-color: initial;
}

/*見出し調整*/
/*H2*/
.article h2 {
position: relative;
padding: 25px 15px 15px;
background-color: initial;
box-shadow: 0px 8px 5px -5px rgba(0, 0, 0, 0.1);
}
/*H3*/
.article h3 {
border-left: initial;
border-right: initial;
border-top: initial;
border-bottom: initial;
display: inline-block;
position: relative;
padding: .5em .7em;
font-size: 20px;
border-left: 2px dotted rgba(0, 0, 0, .1);
border-right: 2px dotted rgba(0, 0, 0, .1);
box-shadow: 0 0 5px rgba(0, 0, 0, .2);
background-color: rgba(0, 0, 0, .01);
color: #333;
}

/*リンクカード*/
.link-container {
display: flex;
flex-direction: column;
gap: 20px;
align-items: center;
max-width: 100%;
width: 100%;
padding: 10px;
}
.link-card {
display: flex;
align-items: center;
justify-content: start;
padding: 15px 20px;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 8px;
text-decoration: none;
transition: all 0.3s ease;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
width: 100%;
max-width: 400px;
}
.link-card:hover {
background-color: #fff;
transform: translateY(-3px);
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}
.link-icon {
width: 60px;
height: 60px;
margin-right: 15px;
border-radius: 15%;
overflow: hidden;
}
.link-icon img {
width: 100%;
height: 100%;
object-fit: cover;
}
.link-info {
display: flex;
flex-direction: column;
justify-content: center;
}
.link-title {
font-size: 16px;
font-weight: bold;
color: #333;
margin-bottom: 5px !important;
}
.link-description {
font-size: 14px;
color: #777;
margin-bottom: 5px !important;
}
@media (max-width: 430px) {
	.link-card {
	padding: 18px 10px 10px;
	flex-direction: column;
	align-items: center;
	text-align: center;
	}
	.link-icon {
	margin-bottom: 10px;
	margin-right: 0 !important;
	}
}

/*ヘッダーメニュー区切り*/
.navi-in > ul .caption-wrap {
  border-left: 1px solid #e1e1e1;
  border-image: linear-gradient(to bottom, #f5f5f5 0%, #e1e1e1 100%) 1;
}
.navi-in > ul li:last-child {
  border-right: 1px solid #e1e1e1;
  border-image: linear-gradient(to bottom, #f5f5f5 0%, #e1e1e1 100%) 1;
}

/*トップページSNS誘導*/
.external-site{
display: inline-block;
position: relative;
left: 50%;
transform: translateX(-50%);
padding: .5em .7em;
font-size: 16px;
border-left: 2px dotted rgba(0, 0, 0, .1);
border-right: 2px dotted rgba(0, 0, 0, .1);
box-shadow: 0 0 5px rgba(0, 0, 0, .2);
background-color: rgba(0, 0, 0, .01);
color: #333;
text-align:center;
margin: 1.3em 0 !important;
}

/*トップSNSボタン調整*/
body.home .sns-buttons{
column-gap: 2% !important;
}
@media screen and (max-width: 834px) {
	body.home .sns-follow-buttons a {
	width: 40px !important;
	}
	.sns-follow-buttons {
	column-gap: 2% !important;
	}
}

/*特定外部リンクにマーク（リンクカード）*/
a[href^="https://wavebox.me/"] .link-title:after {
margin: 0 0 0 3px;
font-family: "Font Awesome 5 Free";
content: '\f35d';
font-weight: 900;
}

/*特定外部リンクにマーク（フッターメニュー）*/
.footer-widgets a[href^="https://wavebox.me/"]:after {
margin: 0 0 0 5px;
font-family: "Font Awesome 5 Free";
content: '\f35d';
font-weight: 900;
}

/*特定外部リンクにマーク（モバイルメニュー）*/
.mobile-header-menu-buttons a[href^="https://wavebox.me/"]:after {
margin: 0 0 0 5px;
font-family: "Font Awesome 5 Free";
content: '\f35d';
font-weight: 900;
}

/*ナビメニューに影をつける＆背景色変更*/
.navi {
box-shadow: 0px 10px 10px -5px rgba(0, 0, 0, 0.1);
background-color: #f5f5f5;
}

/*ナビメニューマウスオーバー時アニメ*/
.navi-in a {
transition: .5s;
}
.navi-in a:hover {
background-color: initial;
transform: scale(1.1);
}

/*モバイルメニュー色変更*/
@media screen and (max-width: 1023px){
	.mobile-header-menu-buttons {
	background-color: #f5f5f5 !important;
	}
}

/*モバイルメニュー表示幅調整*/
@media screen and (max-width: 1023px){
	.mobile-header-menu-buttons {
	display: none !important;
	}
	.navi-in .menu-pc {
	display: flex !important;
	}
}
@media screen and (max-width: 834px){
	.mobile-header-menu-buttons {
	display: flex !important;
	}
	.navi-in .menu-pc {
	display: none !important;
	}
}

/*1カラム横幅調整*/
.no-sidebar .wrap {
max-width: 834px;
}

/*エントリーカード調整*/
.entry-card-content {
padding-bottom: 0;
}
.entry-card-wrap {
padding: 15px 20px;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 8px;
transition: all 0.3s ease;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.entry-card-wrap:hover {
background-color: #fff;
transform: translateY(-3px);
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}

/* フッター調整 */
.footer h3 {
text-align: center; 
background-color: initial;
box-shadow: 0px 8px 5px -5px rgba(0, 0, 0, 0.1);
}
#footer .widget_nav_menu li, .widget_categories li{
border-bottom: solid 1px #ccc;
font-size: 16px;
}

/* フッターリンクアニメーション */
#footer .widget_nav_menu li a::before, .widget_categories li a::before{
width: 0; 
height: 0;
font-family: "Font Awesome 5 Free";
content: "";
background-color: transparent;
border-radius: 50%;
transition: 0.5s;
}
#footer .widget_nav_menu li a:hover, .widget_categories li a:hover{
background-color: initial !important;
}
#footer .widget_nav_menu li a:hover::before, .widget_categories li a:hover::before {
width: 0.25em;
height: 0.25em;
font-family: "Font Awesome 5 Free";
content: '\f0a4';
margin-right: .5em;
}
.footer .widget_search form, .widget_recent_entries ul, .widget_categories ul, .widget_archive ul, .widget_pages ul, .widget_meta ul, .widget_rss ul, .widget_nav_menu ul, .widget_block ul {
padding: 15px 0;
}

/*記事シェアボタン調整*/
.article-footer .sns-share-buttons a .button-caption {
display: none;
}
.article-footer .sns-buttons a {
font-size: 23px;
background-color: initial;
color: #999;
border: 1px solid #999;
}
.article-footer .sns-buttons a:hover {
background-color: #999 !important;
color: #f5f5f5;
}
@media screen and (max-width: 834px) {
	.sns-share.ss-top.ss-col-6 a, .sns-share.ss-bottom.ss-col-6 a, .sns-share.ss-top.ss-col-5 a, .sns-share.ss-bottom.ss-col-5 a {
	width: 16% !important;
	}
	.ss-top .sns-share-buttons a, .ss-bottom .sns-share-buttons a {
	font-size: 23px !important;
	}
}

/*モバイルメニューバー調整*/
.mobile-menu-buttons {
min-height: 60px;
}
.menu-drawer a {
margin-bottom: 5px;
}

/*フッターメニュー調整*/
@media screen and (max-width: 834px) {
	.navi-footer-in > .menu-footer li.menu-item {
	width: auto !important;
	margin: initial !important;
	display: initial !important;
	flex: initial !important;
	text-align: initial !important;
	border-left: 1px solid var(--cocoon-thin-color);
	}
}
@media screen and (max-width: 834px) {
	.navi-footer-in > .menu-footer li.menu-item:last-child {
	border-right: 1px solid var(--cocoon-thin-color);
	}
}
@media screen and (max-width: 834px) {
	.navi-footer-in > .menu-footer li.menu-item a {
	padding: 0 10px !important;
	width: initial !important;
}
@media screen and (max-width: 480px) {
	.navi-footer-in > .menu-footer li.menu-item {
	width: auto !important;
	}
}

/*レスポンシブ調整*/
@media screen and (max-width: 1023px) {
	body:where(.mblt-header-mobile-buttons, .mblt-header-and-footer-mobile-buttons) {
	margin-top: 0px !important;
	}
}
@media screen and (max-width: 834px) {
	#header .site-name-text {
	font-size: 28px !important;
	}
    main.main, div.sidebar {
	padding: 36px 29px !important;
    }
    .content {
	margin-top: 12px !important;
    }
}
@media screen and (max-width: 650px) {
	.logo-text {
	padding: 0 !important;
	}
	.logo {
	visibility: hidden !important;
	}
	main.main, div.sidebar {
	padding: 32px 16px !important;
    }
}