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

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


body {
background-color: #fffffe;
	font-family: 'UDデジタル教科書体 M JIS2004', 'Lato', 'Noto Sans JP', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}

#main  {
background-color: #fffffe;
}



nav#navi, .menu-header .sub-menu{
    box-shadow: 0 5px 15px -5px rgba(0,0,0,0.2);
}




#navi .navi-in > .menu-header .item-label{
	font-size: 16pt;
}

	.nwa .author-box {
		padding: 10px 0 0 0;
	}
	.nwa .author-box .author-description {
		text-align:center;
		font-size:11pt;
	}
	.nwa .author-box .author-thumb {
		width:160px;
	}
	.author-box .author-name {
		margin: 0 0;
	}
	.author-box img.avatar.photo {
		border-radius:10%;
	}

/*---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; /*ボタンの高さ*/
}

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

.widget-sidebar ul li {
font-size:12pt;
}

.widget-sidebar p {
  text-align: center;
}

.widget-sidebar a{
  position: relative;
  display: inline-block;
  transition: .3s;
  color:#999999;
}

.widget-sidebar a::after {
  position: absolute;
  bottom: 0;
  left: 50%;
  content: '';
  width: 0;
  height: 2px;
  background-color: #ff5a00;
  transition: .3s;
  transform: translateX(-50%);
}

.widget-sidebar a:hover::after{
  width: 100%;
}

.widget-sidebar {
 background-color: #fffffe;
}


ul {
	list-style-type: none;
}
a {
    text-decoration:none; 
}

.footer {
  margin-top: 40px; /*フッターとコンテンツの間に余白追加*/
}

.footer-bottom {
  margin-top: 14px; /*フッター内上部の余白を詰める*/
}

.footer-bottom-logo { /*ロゴの位置調整*/
  float: none;
  bottom: auto;
  position: static;
  margin-bottom: 10px;
}

.footer-bottom-logo .logo-image {
  padding: 0;
  max-width: 160px; /*ロゴ画像を少し大きく*/
  margin: 0 auto;
}

.footer-bottom-content { /*メニュー＆クレジットの位置調整*/
  float: none;
  text-align: center;
}

.copyright {
  color: #fff; /*クレジットの文字色*/
}

.widget_categories ul li a{ 
  border-bottom: 1px dashed #CCCCCC; /* 下線の種類 */
}

.widget_categories > ul > li > a:first-child{ 
  border-top: none;
}

.tab-caption-box-content {
  margin-top: -3px;
  border: 3px solid #eee;
  padding: 0.4em 0;
  border-radius: 8px;
  border-top-left-radius: 0;
}

/************************************
**モバイル表示　ヘッダーメニュー・検索アイコン
************************************/
.mobile-menu-buttons{
height:50px;
}
.mobile-menu-buttons > li {
padding-top:0;
}
.menu-button{
color: #ffbaba!important;
margin: auto;
}
.mobile-menu-buttons .menu-button:hover{
background-color:white;
}
span.fa.fa-search::before{
margin-left:1em;
color: #ffbaba!important;
}
span.fa.fa-bars::before{
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;
}

/************************************
**モバイル表示　ヘッダーメニュー
************************************/
span.fa.fa-close::before{/*戻るボタン*/
font-family: FontAwesome;
content: "\f060";
}
.menu-content .menu-drawer {
padding: 0 1em;
margin:0;
}
ul.menu-drawer:before{
font-size:1.2em;
display: block;
font-weight: normal;
background: white;
color:#ffffff;
padding: .5em;
margin-bottom:1em;
font-family: sans-serif;
text-align: center;
border-bottom:3px dotted #ffbaba;
}
ul.menu-drawer:after {
background: white;
}
.menu-drawer li {
background-color:#fff;
padding:0;
border-radius:20px;
}
.menu-drawer a{/*menuの文字色をグレー*/
font-size:1.5em;
background-color:#ffbaba;
color:#ffffff!important;
margin: 6px 0;
padding: 4px 1em;
border-radius:20px;
}
.menu-drawer a:hover{
background-color:#ffbaba!important;
color:#ffbaba!important;
transition: 0.2s ;
}
.menu-drawer .sub-menu {
padding-left:30px;
margin-top:0;
}
.menu-drawer ul.sub-menu li {/*サブメニューの文字サイズ*/
font-size: 1em;
}
@media (max-width:834px){
.sub-menu{
box-shadow: none!important;
}
}

/*---------------------------------
ボックス（白抜き）の枠の色と太さを変える
--------------------------------*/
.blank-box {border-color: #95CE4B;}
.blank-box.bb-tab .bb-label {
  background-color: #95CE4B;}

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

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

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