@charset "UTF-8";

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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*ブログ全体*/
body{
	font-family:Hiragino Maru Gothic Pro;
	font-size:16.5px!important;
}
/*グローバルメニューカスタマイズ*/
nav#navi, .menu-header .sub-menu{
    font-weight: bold;
    box-shadow: 0 5px 15px -5px rgba(0,0,0,0.2);
}

.menu-header .sub-menu .item-label{
    font-size: 80%;
}
.menu-header .item-label{
    color: #fff !important;
}
.menu-header .current-menu-item,
.menu-header .current-post-item,
.menu-header .current-menu-ancestor,
.menu-header .current-post-ancestor,
.menu-header .menu-item:hover {
    color: #fff !important;
    border-bottom: 3px solid #696969;
    transition: all .2s ease;
}

.menu-header .sub-menu .menu-item,
.menu-header .sub-menu .menu-item:hover{
    border-bottom: none;
}
.menu-header .current-menu-item>a .item-label,
.menu-header .current-post-item>a .item-label,
.menu-header .current-menu-ancestor>a .item-label,
.menu-header .current-post-ancestor>a .item-label,
.menu-header .item-label:hover{
    color: #fff !important;
    transition: all .2s ease;
}



/*---------囲み枠布風---------*/
.box14{
    padding: 1.0em 0.5em;
    margin: 2em 0;
    background: #f2f1e8;
    box-shadow: 0px 0px 0px 10px #f2f1e8;
    border: dashed 2px white;
}
.box14 p {
    margin: 0; 
    padding: 0;
}

/*---------サイドバーフォローボタン---------*/
.sidebar .sns-follow-buttons {
  justify-content: center; /*ボタンを中央寄せにする*/
}
.sidebar .sns-follow-buttons a {
  width: 30%; /*ボタンの幅*/
}
.sidebar .sns-follow {
  margin: 0 0 24px 0;
}
.sidebar .sns-follow-buttons a {
  background: none !important;
  border: 1px solid #444d53;
  color: #444d53;
  border-radius: 50px;
  
}
.sidebar .twitter-button:hover {
  background-color: #1da1f2 !important;
  color: #fff;
  border-color: #1da1f2;
}

/*------記事一覧タイトルの大きさ変更*/
.entry-card-title {
 font-size: 20px;
} 
/*------サイドバープロフィール吹き出し部分*/
.balloon1 {
position: relative;
display: inline-block;
margin: 1.5em 0;
padding: 7px 10px;
min-width: 120px;
max-width: 100%;
color: #fff;
font-size: 16px;
background:#ecbcbc;
border-radius: 15px;
}
.balloon1:before{
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -15px;
border: 15px solid transparent;
border-top: 15px solid #ecbcbc;
}
.balloon1 p {
margin: 0;
padding: 0;
}

/*------ウィジェット肩書きラベル背景色*/
.author-widget-name {
	margin-bottom: 1.4%;
	padding: 2px 0;
	text-align: center;
	background-color: #fff;
	color: #fff;
}

/*エントリーカードホバー時の設定*/
.a-wrap:hover {
background-color: #fff;
transform: scale(1.01);
box-shadow: 2px 2px 6px 0 #696969;
}

/*エントリーカード枠線の色*/
.a-wrap{
	border-color:#d3d3d3 !important;
}

/*エントリーカードタイトルの位置調整*/
.entry-card-content, .related-entry-card-content {
    padding-bottom: 1.2em;
	padding-top:1.5em;
}

/*ブログ全体のフォント*/
*{font-family:Hiragino Maru Gothic Pro;}

/*記事タイトルのフォントの大きさ*/
.entry-title {
font-size: 24px;
}

.entry-card-title{
	line-height:1.5;
}

/*リンクテキストカスタマイズ*/
a {
  text-decoration: none ;
  color:#4169e1;
  display: inline-block;
  transition: .3s;
  -webkit-transform: scale(1);
  transform: scale(1);
}
a:hover {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
 color:#4682b4;
}

/*フッター文字カスタマイズ*/
 .navi-footer-in a {
  color: #fff !important; /*メニューの文字色*/
}

.navi-footer-in a:hover {
  color: #fff; /*文字色を通常時と同じに*/
  background: none !important; /*背景色をなしに*/
}

/*記事下背景色を白に*/
.entry-footer {
    margin-right: -30px;
    margin-left: -30px;
    padding: 20px 30px;
	background:#fff;
}

/*記事下関連記事背景色を白に*/
.pager-post-navi {
    margin-right: -30px;
    margin-left: -30px;
    padding: 20px 30px;
    background: #fff !important;
}

/*外部ブログカード枠線と背景色*/
/*外部ブログカードのフッター非表示*/
.external-blogcard-footer{
display:none;
}
/*背景色*/
.blogcard-wrap {
background-color:#fff;
}
/*枠線*/
.blogcard{
border-color:#d3d3d3 !important;
}

/*H3見出しデザインを一旦リセット*/
.article h3 {
    border: none;
    padding: 0;
}
/*H2見出しデザインを一旦リセット*/
article h2 {
    padding: 0;
    background: none;
}

.article h2:before {
	border-top: none;
}

.article h2:after {
	border-bottom: none;
}

/*H2見出しデザイン*/
.article h2 {
    color: #fff;
    padding: .8em 1em;
    margin-top: 80px;
    background: #444d53;
    border-top: 4px solid #444d53;
    border-bottom: 4px solid #444d53;
}
/*見出し3カスタマイズ*/
.article h3 {
  padding: 0.25em 0.5em;/*上下 左右の余白*/
  color: #494949;/*文字色*/
  background: transparent;/*背景透明に*/
  border-left: solid 5px #ede4cd;/*左線*/
}
/*見出し4カスタマイズ*/
.article h4 {
  /*線の種類（実線） 太さ 色*/
  border-bottom: solid 3px #ede4cd;
}


/*LP固定ページのみh2h3のデザインを変更*/
.page-id-75 .article h2{
}

/*LP固定ページのみh2h3のデザインを変更*/
.page-id-2050 .article h2{
}

/*引用背景色カスタマイズ*/
blockquote{
  background: #fffafa;/*背景色を少し濃いめの灰色に*/
  border-radius: 5px; /*角を丸める*/
}
blockquote:before{ /*上の引用アイコン*/
  position: absolute;
  font-family: FontAwesome;
  content: '\f10d';
  top: 10px;/*上からの距離*/
  left: 10px;/*左からの距離*/
  color: silver;
  font-size: 1.5em;
}
blockquote:after{ /*下の引用アイコン*/
  position: absolute;
  font-family: FontAwesome;
  content: '\f10e';
  bottom: 20px;/*下からの距離*/
  right: 10px;/*右からの距離*/
  color: silver;
  font-size: 1.5em;
}

/*アピールエリアボタン文字色*/
.appeal-content .appeal-button {
	color: #fff; 
}
/*アマアドレビュー固定ページの日付を非表示にする*/
.post-1228 .date-tags {
  display: none;
}

/*ブログカード ラベル背景色カスタマイズ*/
.blogcard-label::after {
color: #ffffff; /*ラベル文字色*/
}
.blogcard-label.internal-blogcard-label {
background-color: #00a3af; /*内部リンクのラベル背景色*/
}
.blogcard-label.external-blogcard-label {
background-color: #00a3af; /*外部リンクのラベル背景色*/
}

/*ブログ全体*/
body{
	font-size:17px !important;
}

/*見出し風囲み枠*/
.box3 {
    padding: 0.5em 1em;
    margin: 2em 0;
    color:#e597b2;
    background:#e597b2;/*背景色*/
}
.box3 p {
    margin: 0; 
    padding: 0;
}

/*個別記事タイトルまわり余白*/
.entry-title-inner {
padding-bottom: 10px;
padding-top: 10px;
}
.entry-title {
padding-bottom: 20px;
padding-top: 20px;
padding-left : 20px;	
}

/*カテゴリータグの背景色*/
.cat-label {
color: #ffffff;
border:none;
background-color:#696969;
}

/*メインカラムコンテンツ幅*/
.main{
	padding:60px
}

/*タイトルの行間*/
.article h1{
	line-height:1.5;
}

/* サイドバープロフィール欄カスタマイズ */
.nwa .author-box {
	border: none;
	padding: 0 20px;
}

/* アイコン */
.nwa .author-box .author-thumb{
	width: 110px;
}
.nwa .author-box .author-thumb img{
	box-shadow: 0 1px 3px rgba(0,0,0,.18)
}

/* 下側 */
.nwa .author-box .author-content {
	padding: 1em 0;
}


/* 名前 */
.author-box .author-name {
	margin-bottom: 1em;
}
.author-box .author-content .author-name a{
	color: #696969; /* リンク色にしない */
	font-size: 1.0em;
	font-weight: normal; /* 太字にしない */
	text-decoration: none; /* 下線をなくす */
	letter-spacing: 0.2em; /* 字間を広く */
}

/* プロフィール文 */
.author-description{
	margin-bottom: 16px;
}
.author-description p{
	margin: 0 0 0.5em 0;
	text-align: left;
	line-height: 2.0;
	font-size:15.5px;
}


/* SNSボタン */
.author-follows{
	padding-top: 14px;
	padding-bottom: 0.2px;
	background-color: #ecbcbc;
}
.author-follows::before{
	content: 'Follow Me';
	color: #fff;
	font-family: お好きなフォント(設定する場合);
	letter-spacing: 0.2em; /* 字間を広く */
}
.author-box .sns-follow-buttons a.follow-button{
	width: 40px;
	height: 40px;
	margin: 6px 10px 2px 2px;
	border-radius: 20px;
	color: #fff;
	border-color: #fff;
	font-size: 24px;
	line-height: 1.6;
}
.author-box a.follow-button span::before {
	font-size: 22px;
}

/* SNSボタン マウスオーバーしたとき */
.author-box .sns-follow-buttons a.follow-button:hover{
	background-color: transparent;
	opacity: 0.6; /* 薄く */
	transform: scale(1.1); /* 1.1倍の大きさに */
}

/*サイドバー見出しデザイン*/
.sidebar h3 {
	background:transparent; /* Cocoon親テーマCSSリセットのため */
	padding: 8px 0px;
	padding-left: 12px;
	padding-bottom:2px;
	border-bottom: 2px #696969 dotted; /* ドット下線追加 */
	letter-spacing: 0.05em; /* 字間を広げる */
}

p { font-size:17px;}

/*アピールエリア文字間隔*/
.appeal-title{
	 letter-spacing: 0.02em;
}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*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){
  /*必要ならばここにコードを書く*/
}