@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    1.0.8
*/

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

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

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

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

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

.article h2 {
    color: #fff;
    padding: .3em 1em;
    margin-top: 80px;
    background: #444d53;
    border-top: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
}
.article h3 {
    color: #444d53;
    padding: .5em 0.5em;
    margin-top: 40px;
    border-top: 3px solid #444d53;
    border-bottom: 3px solid #444d53;
}
.article h4 {
    color: #444d53;
    padding: .2em 0.5em;
    margin-top: 40px;
    border-left: 6px solid #444d53;
}
.article h5 {
    color: #444d53;
    margin-top: 40px;
    border-bottom: solid 2px #444d53;
}
.article h6 {
    color: #444d53;
    margin-top: 40px;
    border-bottom: solid 1px #444d53;
}

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

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

.menu-drawer a:hover{
	color: rgba(255,255,255,0.7);
	background-color: rgba(30,124,209,0);
}

/************************************
** SNS ボタンをまとめて丸くする
************************************/

/*シェア・フォローボタンの枠組み*/
.sns-share.ss-top .sns-share-buttons,
.sns-share.ss-bottom .sns-share-buttons,
.sns-follow.sf-bottom .sns-follow-buttons,
.sns-follow.sf-widget .sns-follow-buttons {
	justify-content: center; /*中央に寄せる*/
	flex-wrap: wrap; /*折り返す*/
}

/*シェア・フォローボタンのリンク*/
.sns-share.ss-top .sns-buttons a,
.sns-share.ss-bottom .sns-buttons a,
.sns-follow.sf-bottom .sns-buttons a,
.sns-follow.sf-widget .sns-buttons a {
	width: 40px; /*横幅*/
	height: 40px; /*高さ*/
	margin-right: 4px; /*右側の余白*/
	margin-left: 4px; /*左側の余白*/
	border-radius: 50%; /*丸み*/
}

/*プロフィールウィジェットのリンク*/
.sns-follow.sf-profile .sns-buttons a {
	border-radius: 50%; /*丸み*/
}

/*シェアボタンのアイコン*/
.sns-share.ss-top .sns-buttons a .social-icon,
.sns-share.ss-bottom .sns-buttons a .social-icon {
	font-size: 18px; /*アイコンの大きさ*/
}

/*フォローボタンのアイコン*/
.sns-follow.sf-bottom .sns-follow-buttons .follow-button,
.sns-follow.sf-widget .sns-follow-buttons .follow-button {
	font-size: 24px; /*アイコンの大きさ*/
}

/*シェアボタンのキャプション*/
.sns-share.ss-top .sns-buttons a .button-caption,
.sns-share.ss-bottom .sns-buttons a .button-caption {
	display: none; /*非表示*/
}

/*シェア・フォローボタンのシェア数*/
.sns-share.ss-top .sns-buttons a .share-count,
.sns-share.ss-bottom .sns-buttons a .share-count,
.sns-follow.sf-bottom .sns-buttons a .follow-count,
.sns-follow.sf-widget .sns-buttons a .follow-count {
	right: -2px; /*右側からの距離*/
	bottom: -2px; /*下側からの距離*/
	padding: 2px; /*内側の余白*/
	font-size: 10px; /*文字の大きさ*/
	border: solid 1px; /*線*/
	border-radius: 3px; /*丸み*/
	background-color: inherit; /*背景色*/
}

/*シェア数の表示が必要ないシェア・フォローボタン*/
.sns-share.ss-top .sns-buttons a .share-count:empty,
.sns-share.ss-bottom .sns-buttons a .share-count:empty,
.sns-follow.sf-bottom .sns-buttons a .follow-count:empty,
.sns-follow.sf-widget .sns-buttons a .follow-count:empty {
	padding: 0; /*内側の余白*/
	border: 0; /*線*/
}


/*SNSシェアボタンをカスタマイズ

.sns-share-message{
    font-weight: bold;
    color: #63594d;
}

.button-caption{
    display:none;
}

.sns-share-buttons a {
    border-radius: 50%;
    width: 40px;
    height: 40px;
	margin: 10px;
}

.sns-share-buttons {
    justify-content: center;
}
*/

/*SNSシェアボタンをカスタマイズ

.sns-follow-buttons a {
    border-radius: 50%;
    width: 40px;
    height: 40px;
	margin: 10px;
}

.sns-follow-buttons {
    justify-content: center;
}

.sns-share .sns-share-buttons a .social-icon {
    margin-bottom: 2px;
    font-size: 23px;
}
*/