@charset "UTF-8";

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

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

@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 300;
    src: url('fonts/NotoSansCJKjp-DemiLight.woff2') format('woff2'),
	     url('fonts/NotoSansCJKjp-DemiLight.woff') format('woff'),
	     url('fonts/NotoSansCJKjp-DemiLight.ttf')  format('truetype'),
       url('fonts/NotoSansCJKjp-DemiLight.eot') format('embedded-opentype');
}
@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 400;
    src: url('fonts/NotoSansCJKjp-Regular.woff2') format('woff2'),
	     url('fonts/NotoSansCJKjp-Regular.woff') format('woff'),
	     url('fonts/NotoSansCJKjp-Regular.ttf')  format('truetype'),
       url('fonts/NotoSansCJKjp-Regular.eot') format('embedded-opentype');
}
@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 500;
    src: url('fonts/NotoSansCJKjp-Medium.woff2') format('woff2'),
	     url('fonts/NotoSansCJKjp-Medium.woff') format('woff'),
	     url('fonts/NotoSansCJKjp-Medium.ttf')  format('truetype'),
       url('fonts/NotoSansCJKjp-Medium.eot') format('embedded-opentype');
}
body {
  font-family: 'Noto Sans Japanese', sans-serif;
  font-style: normal;
  font-weight: 300;
	background-color:#FEF1F3;
}

/*header*/
.tagline {
	font-family: 'Noto Sans Japanese', sans-serif;
	font-style: normal;
  font-weight: 400;
}


/************************************
** グローバルメニュー PC
************************************/
.navi{
	background: -moz-linear-gradient(left,  rgba(205,125,14,1) 0%, rgba(223,218,51,1) 26%, rgba(124,194,126,1) 71%, rgba(27,157,177,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(205,125,14,1) 0%,rgba(223,218,51,1) 26%,rgba(124,194,126,1) 71%,rgba(27,157,177,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(205,125,14,1) 0%,rgba(223,218,51,1) 26%,rgba(124,194,126,1) 71%,rgba(27,157,177,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.navi-in a {
  font-size: 1.2rem; /* ナビ文字大きさ */
	font-family: 'Noto Sans Japanese', sans-serif;
  font-style: normal;
  font-weight: 400;
}

.navi-in > ul .sub-menu a {
  font-size: 1.1rem; /* サブメニュー文字の大きさ */
		font-family: 'Noto Sans Japanese', sans-serif;
	  font-style: normal;
  font-weight: 400;
}

/*h1～h6*/
h1,h2,h3,h4,h5,h6 {
	font-family: 'Noto Sans Japanese', sans-serif;
	font-style: normal;
  font-weight: 400;}

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

.cat-label {
	background-color: #4DC5E2; /*シアン*/
	/*background-color: #F45E32; オレンジ*/
	color: #000; border: transparent;
	font-size: 0.8rem;
	padding: 0.313em 0.625em;
	top: 0;
	left: 0;}
	
/*tag*/
.entry-card-category { display: flex; }

.entry-card-tag {display: flex;}


/*本文下カテゴリ*/
.cat-link {
  color: #000;
  text-decoration: none;
  display: inline-block;
  margin: 0.625em 0.625em 0 0;
	padding: 0.313em 0.625em;
  font-size: 0.8rem;
  background-color: #F5F5F0;
  border-radius: 2px;
  word-break: break-all;
}
.cat-link:hover {
  color: #000;
	background-color: #FFF;
  transition: all 0.3s ease-in-out;
	opacity: 0.8;
}

/*本文下タグ*/
.tag-link, .comment-reply-link {
  color: #000;
	background-color: #F5F5F0;
  text-decoration: none;
  display: inline-block;
  margin: 0.625em 0.625em 0 0;
	padding: 0.313em 0.625em;
  font-size: 0.8rem;
  border: 0;
  border-radius: 2px;
  word-break: break-all;
}
.tag-link:hover, .comment-reply-link:hover {
  color: #000;
	background-color: #FFF;
  transition: all 0.3s ease-in-out;
	opacity: 0.8;
}

header.entry-header h1.entry-title{
	font-family: 'Noto Sans Japanese', sans-serif;
	font-style: normal;
  font-weight: 400;
	font-size: 1.8em;}

/*share*/
/*---SNSボタンを丸くする---*/
#main .button-caption {
	display: none; /*キャプション非表示*/
}

/*SNSシェアボタン*/
.sns-share-message{
	font-size: 1.1rem;
	font-family: 'Noto Sans Japanese', sans-serif;
}
.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: 24px; /*アイコンのサイズ*/
	margin: 0 10px; /*ボタン同士の間隔*/
}
#main .sns-follow a {
	width: 40px; /*ボタンの横幅*/
	height: 40px; /*ボタンの高さ*/
}

/* 投稿者名の表示設定 */
.footer-meta .author-info{
  display:none;            /* 投稿者名を非表示 */
}

/*footer SNS*/
ul.f-sns {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap; /*折り返さない*/
	justify-content: center; /*中央寄せ*/
	list-style:none;
	margin-left: 0;
	padding-left: 0;
	}
ul.f-sns li { margin: 0 10px; padding-left: 0;}
ul.f-sns li a:hover, ul.f-sns li a:visited { color:#1967D2;}

/*外部リンクアイコン消*/
/*ul.f-sns li a[target="_blank"]::after {
	content: none;
}*/

ul.f-sns a span.external-icon,
ul.f-sns a span.anchor-icon { display: none; }


/*side*/
h3.widget-sidebar-title, h3.widget-sidebar-scroll-title{
  font-size: 1.3rem; /* サブメニュー文字の大きさ */
	font-family: 'Noto Sans Japanese', sans-serif;
	font-style: normal;
  font-weight: 500;
	background-color: #FFF;
	border-bottom: 2px solid #C7C7C7;
  position: relative;
	padding: 0 0.313em;}

h3.widget-sidebar-title:after{
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #F9BF45;
  bottom: -3px;
	left: 0;
  width: 35%;}

h3.widget-sidebar-scroll-title:after{
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #F75C2F;
  bottom: -3px;
	left: 0;
  width: 35%;}

h2.entry-card-title,
.entry-card-snippet{
	line-height: 1.5em;}

.entry-card-snippet{
	font-size:1.0rem;}

/*新着記事、人気記事　日付表示*/
.widget_new_entries .display-none {
	display: block;
	padding-top: 0.2em;
	text-align: right;}


.widget-entry-card-title { padding-top: 0.313em; padding-left: 0.313em;}

/*公開日文字サイズ変更.post-date { color: #555;}*/
.widget-entry-card-date span {
	font-size: 0.8rem; }

/*更新日を非表示*/
.widget-entry-card-update-date { display: none; }
.widget-entry-card-date span { margin-right: 1em;}

/*投稿*/
.entry-content h2 { background-color: #F6F6F6;  }
.entry-content h3 { border:1px solid #C7C7C7; border-left: 8px solid #F75C2F;  }
.entry-content h4 { }

/*基本データ*/
.entry-content dl{
  display:flex;
  flex-wrap: wrap;}

.entry-content dt{
  background-color: #F6F6F6; border-bottom: 1px solid #FFF; padding: 10px; 
  width: 20%;
  font-size: 0.9rem; font-weight: bold;
	text-align: center; align-items: center; }

.entry-content dd{
  padding: 10px; margin: 0; border-top: 1px dashed #C7C7C7; 
  width: 80%; align-items: center; }
.entry-content dd:last-child { 	border-bottom: 1px dashed #C7C7C7; }


/************************************
** 人気記事ウィジェットランキング表示
************************************/

.widget-entry-cards.ranking-visible .card-thumb::before {
  content: counter(p-rank);
  position: absolute;
  top: 0;
  left: 0;
  padding: 4px;
  width: 18px;
  height: 18px;
  line-height: 18px;
  background-color: #F75C2F;/*#666;*/
  color: #fff;
  opacity: 0.9;
  text-align: center;
  font-size: 13px;
  z-index: 1;
}



@media screen and (max-width: 320px) {
  dl{
    flex-flow: column nowrap;
  }
  dt,
  dd{
    width: 100%;
  }
  dd{
    border-left: none;
  }
}

/*ページ送り*/
.pagination-next-link {
	background-color: #FFF; font-size: 1.0em;
	color: #1cbe61;
	border: 1px solid #1cbe61;
	border-radius: 30px;}
			
.pagination-next-link:hover {
	background-color: #18A252;
	transition: all 0.5s ease;
	color: #fff;}

.page-numbers {
	color: #1cbe61;
	border: 1px solid #1cbe61;
  border-radius: 50%;}

.pagination .current {
  background-color: #1cbe61;
  color: #fff;}

.page-numbers.dots {
  opacity: 1;
  background: none;}

.pagination a:hover {
  background-color: #1cbe61;
  color: #fff;}

/* contactform7*/
input.wpcf7-submit[type="submit"]{
 font-size: 1.0em;
	background-color: #18A252;
	transition: all 0.5s ease;
	color: #fff;
	border-radius: 30px;}


/*footer*/
#footer {
	background-color: #FFF;}

.footer-bottom {
	border-top: 2px solid #F5F5F5;}

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