@charset "UTF-8";

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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
#header-container .navi-in > ul li {
   height: auto;
   font-weight: 600;
   line-height:1.3;
}
#header-container #navi{
   background:#88abda; /* 背景色 */
}
#header-container #navi a{
   color:#fff; /* 文字色 */
   padding:0.8em 0;
}
#header-container #navi a:hover{
   color:#88abda; /* マウスホバー時の文字色 */
}
#header-container .navi-in > ul .sub-menu{
   background:#88abda; /* サブメニュー背景色 */
}
#header-container .navi-in > ul > .menu-item-has-children > a::after {
   top: 0.8em;
   font-size: 1.2em;
   font-weight: 600;
}
#header-container .sub-menu .caption-wrap{
   padding-left:1em;
}
.navi-in > ul .menu-item-has-description > a > .caption-wrap{
   height:auto;
}
@media screen and (max-width: 1030px){
   .navi-in > .menu-header{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	overflow-x: scroll;
	white-space: nowrap;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
        flex-wrap: nowrap;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
   }
   #header-container #navi a{
	font-size:0.8em;
	padding: 1em 1.2em; /* 余白 */
   }
   #header-container .navi-in > ul > .menu-item-has-children > a::after{
	display:none;
   }
}

#footer a:hover {
    color: #88abda;
}

/*著者情報を消す場合*/
.page .author-info {
    display: none;
}

/*著者情報を消す場合*/
.post .author-info {
    display: none;
}
/*フロント固定ページのタイトルを非表示*/
.home.page .entry-title{
  display: none;
}

/*フロント固定ページのシェアボタンを非表示*/
.home.page .sns-share{
  display: none;
}

/*フロント固定ページのフォローボタンを非表示*/
.home.page .sns-follow{
  display: none;
}

/*フロント固定ページの投稿日を非表示*/
.home.page .post-date{
  display: none;
}

/*フロント固定ページの更新日を非表示*/
.home.page .post-update{
  display: none;
}


/************************************
** 横長テーブル
************************************/
.p-sticky-table{
  white-space: nowrap;
  line-height:1.6;
}
.p-sticky-table table{
  border:none;
  border-left:1px solid #dedede;
  border-right:1px solid #dedede;
  border-bottom: 1px solid #dedede;
    border-collapse: collapse;
  word-break: break-all;
  table-layout: fixed;
  display:block;
  overflow:scroll;
}
.p-sticky-table th{
  background:#f0f9ff !important; /* 見出し背景色 */
  color: #666;/* 見出し文字色 */
  font-weight: 500 !important;/* 見出し文字太さ */
  font-size:13px !important; /* 見出し文字サイズ */
}
.p-sticky-table td{
  font-size: 13px !important; /* 文字サイズ */
  color:#555; /* 文字色 */
}
.p-sticky-table thead th:first-child,.p-sticky-table tbody th:first-child{
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    z-index: 1;
  border:none;
}
.p-sticky-table tr{
  border-top:1px solid #dedede;
  border-bottom:none !important;
}
.p-sticky-table tr:last-child{
  border-bottom:1px solid #dedede;
}
.p-sticky-table th, .p-sticky-table td {
  vertical-align:middle !important;
  border: none !important;
  background:#fff;
  text-align:center;
  padding:12px !important;
}
.p-sticky-table img{
  margin:0;
  padding:0;
  max-width:70px !important; /* 画像最大サイズ */
}
/* スマホ */
@media screen and (max-width: 560px) {
  .p-sticky-table th{
    font-size:11px !important; /* スマホ見出し文字サイズ */
  }
  .p-sticky-table td{
    font-size: 11px !important; /* スマホ文字サイズ */
  }
  .p-sticky-table thead th:first-child,.p-sticky-table tbody th:first-child{
    white-space:normal;
    min-width:80px; /* スマホ見出し横幅 */
  }
  .p-sticky-table th, .p-sticky-table td {
    padding:8px !important;
  }
  .p-sticky-table img{
    max-width:50px !important; /* スマホ画像最大サイズ */
  }
}


table {
  border-collapse: collapse;
  text-align: center;
  border: solid 2px #84ccc9;/*表全体を線で囲う*/
}
table th, table td {
  border: dashed 1px #84ccc9;/**/
}

/*見出しスタイルの削除*/
.article h2 {
	padding: 0;
	border-top: none;
    background: none;
}
.article h3 {
    border: none;
}
.article h4 {
    border: none;
}

/*見出しスタイルここから*/

.article h2 {
  background: rgb(248, 246, 248);
  padding: .4em;
  margin: 0 0 1em;
  color: rgb(76, 67, 64);
  font-size: 26px;
  font-weight: bold;
  border-bottom: .125em solid rgb(136, 171, 218);
  text-align: left;
}
.article h3 {
	padding: .4em;
	margin: 0.5 0 0.5em;
	color: rgb(76, 67, 64);
	font-size: 24px;
	font-weight: bold;
	border-bottom: .0833em dashed rgb(136, 171, 218);
}

.article h4 {
	padding: .4em .8em;
	margin: 0.5 0 0.5em;
	color: rgb(76, 67, 64);
	font-size: 22px;
	font-weight: bold;
	border-left: .1em solid rgb(136, 171, 218);
	text-align: left;
}


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

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

/*768px以下*/
@media screen and (max-width: 768px){
  /*必要ならばここにコードを書く*/
	.article h2 {
  	background: rgb(248, 246, 248);
  	padding: .4em;
  	margin: 0 0 1em;
 	color: rgb(76, 67, 64);
  	font-size: 22px;
	font-weight: bold;
 	border-bottom: .125em solid rgb(136, 171, 218);
 	text-align: left;
	}
	.article h3 {
	padding: .4em;
	margin: 0.5 0 0.5em;
	color: rgb(76, 67, 64);
	font-size: 20px;
	font-weight: bold;
	border-bottom: .0833em dashed rgb(136, 171, 218);
	}

	.article h4 {
	padding: .4em .8em;
	margin: 0.5 0 0.5em;
	color: rgb(76, 67, 64);
	font-size: 18px;
	font-weight: bold;
	border-left: .1em solid rgb(136, 171, 218);
	text-align: left;
	}
}

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