@charset "UTF-8";

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

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

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

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

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

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

/*----------------------------------*/
/* まずは基本のCSS                 */
/*----------------------------------*/
/* 投稿日付を非表示（固定ページ） */
.page-date {
    display:none;
}
/*投稿日・更新日を消す場合（固定ページ）*/
.page .date-tags {
    display: none;
}
/*更新日だけ消す場合（投稿ページ）*/
.post-update {
    display: none;
}
/*固定ページの著者情報を消す場合*/
.page .author-info {
    display: none;
}
/*投稿ページの著者情報を消す場合*/
.post .author-info {
    display: none;
}

/*----------------------------------*/
/*アピールエリアのボタン消す*/
/*----------------------------------*/
.appeal-content {
display: none;
}

/*----------------------------------*/
/*Contact Form 7カスタマイズ*/
/*スマホContact Form 7カスタマイズ*/
/*----------------------------------*/
@media(max-width:500px){
.inquiry th,.inquiry td {
 display:block!important;
 width:100%!important;
 border-top:none!important;
 -webkit-box-sizing:border-box!important;
 -moz-box-sizing:border-box!important;
 box-sizing:border-box!important;
}
.inquiry tr:first-child th{
 border-top:1px solid #d7d7d7!important;
}
/* 必須・任意のサイズ調整 */
.inquiry .haveto,.inquiry .any {
font-size:10px;
}}
/*見出し欄*/
.inquiry th{
 text-align:left;
 font-size:14px;
 color:#444;
 padding-right:5px;
 width:30%;
 background:#f7f7f7;
 border:solid 1px #d7d7d7;
}
/*通常欄*/
.inquiry td{
 font-size:13px;
 border:solid 1px #d7d7d7;
}
/*横の行とテーブル全体*/
.entry-content .inquiry tr,.entry-content table{
 border:solid 1px #d7d7d7;
}
/*必須の調整*/
.haveto{
 font-size:7px;
 padding:5px;
 background:#ff9393;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:1px;
}
/*任意の調整*/
.any{
 font-size:7px;
 padding:5px;
 background:#93c9ff;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:1px;
}
/*ラジオボタンを縦並び指定*/
.verticallist .wpcf7-list-item{
 display:block;
}
/*送信ボタンのデザイン変更*/
#formbtn{
 display: block;
 padding:15px;
 width:300px;
 background:#ff69b4;
 color:#ffffff;
 font-size:18px;
 font-weight:bold;
 border-radius:2px;
 margin:25px auto 0;
}
/*送信ボタンマウスホバー時*/
#formbtn:hover{
 background:#fff;
 color:#ffd700;
 border:2px solid #ffd700;
}

/*----------------------------------*/
/* フッターカスタマイズ             */
/*----------------------------------*/
.footer {
margin-top: 40px; /*フッターとコンテンツの間に余白追加*/
background: #444d53; /*フッター背景色*/
border-top: 5px solid #ffff00; /*上部にボーダー追加*/
}
.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: 300px; /*ロゴ画像を少し大きく*/
margin: 0 auto;
}
.footer-bottom-content { /*メニュー＆クレジットの位置調整*/
float: none;
text-align: center;
}
.navi-footer-in > .menu-footer { /*メニューの位置調整*/
justify-content: center;
margin-bottom: 1em;
}
.navi-footer-in a {
color: #ffffff; /*メニューの文字色*/
}
.navi-footer-in a:hover { /*メニューのマウスホバー時の指定*/
color: #aab3b9; /*文字色を通常時と同じに*/
background: none; /*背景色をなしに*/
text-decoration: underline; /*アンダーラインを追加*/
}
.footer-bottom.fnm-text-width .menu-footer li {
line-height: 1; /*メニューの区切りボーダーの高さを1文字分にする*/
}
.copyright {
color:  #ffffff; /*クレジットの文字色*/
}
@media screen and (max-width: 834px) {
.navi-footer-in > .menu-footer li.menu-item {
border: none; /*モバイルでメニューのボーダーを消す*/
}
}
@media screen and (max-width: 460px) {
.navi-footer-in > .menu-footer li.menu-item { /*モバイルでメニューを1カラムにする*/
width: 100%;
display: block;
flex: auto;
padding: 0.3em 0;
}
}

/*----------------------------------*/
/* 見出しリセット   */
/*----------------------------------*/
.article h2 {
    padding: 0;
    background: none;
}
.article h3 {
    border: none;
    padding: 0;
}
.article h4 {
    border: none;
    padding: 0;
}
.article h5 {
    border: none;
    padding: 0;
}
.article h6 {
    border: none;
    padding: 0;
}
.sidebar h3 {
    border: none;
    padding: 0;
	background: none;
}
/*----------------------------------*/
/* 見出しカスタマイズ   */
/*----------------------------------*/
.article h1 {
  position: relative;
padding:10px;
}
.article h1:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
height: 7px;
background: -webkit-repeating-linear-gradient(-45deg,#ffff00, #ffff00 4px, #fff 3px, #fff 8px);
background: repeating-linear-gradient(-45deg, #ffff00, #ffff00 4px, #fff 3px, #fff 8px);
}

.article h2 {
position: relative;
  padding: 0.6em;
background: -webkit-repeating-linear-gradient(-45deg,#ffff00, #ffff00 4px, #fff 3px, #fff 8px);
background: repeating-linear-gradient(-45deg, #ffff00, #ffff00 4px, #fff 3px, #fff 8px);
  border-radius: 7px;
color:#3a3a3a;
}

.article h3 {
position: relative;
  padding-left: 35px;
color:#ff6a6a;
}
.article h3:before {
  position: absolute;
  font-family: "Font Awesome 5 Free";
  content: "\f0eb";
  background: #ffff00;
  color: white;
  font-weight: normal;
  font-size: 15px;
  border-radius: 50%;
  left: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.article h3:after {
  /*吹き出しのちょこんと出た部分*/
  content: '';
  display: block;
  position: absolute;
  left: 20px;
  height: 0;
  width: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 12px solid #ffff00;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.article h4 {
  color: #fd9494;/*文字色*/
  /*線の種類（点線）2px 線色*/
  border-bottom: dotted 2px #ffff00;
padding-left:10px;
}

/*----------------------------------*/
/* サイドバー見出しカスタマイズ   */
/*----------------------------------*/
.sidebar h3 {
position: relative;
text-align: center;
color:#3a3a3a;
padding-bottom:5px;
margin-bottom:20px;
}

.sidebar h3:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 7px;
 background: -webkit-repeating-linear-gradient(-45deg,#ffff00, #ffff00 4px, #fff 3px, #fff 8px);
background: repeating-linear-gradient(-45deg, #ffff00, #ffff00 4px, #fff 3px, #fff 8px);
}

/*----------------------------------*/
/* SNSシェアボタンのカスタマイズ */
/*----------------------------------*/
.sns-share-message{
color:#ff6a6a;
margin-bottom:15px;
}

/*----------------------------------*/
/* ナビカスタマイズ                */
/*----------------------------------*/
nav#navi, .menu-header .sub-menu{
    font-weight: bold;
}

.menu-header .sub-menu .item-label{
    font-size: 80%;
}
.menu-header .item-label{
    color: #ffffff !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: #333 !important;
    border-bottom: 3px solid #ffff00;
    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: #ffff00 !important;
    transition: all .2s ease;
}

/************************************
** もっと見るボタン
************************************/
.p-button {
    max-width: 300px;
    margin: 0 auto;
}
.p-button a {
    display: block;
    margin:25px 0;
    padding: 0.8em 1em;
    border-radius: 2em;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    background: #ff69b4;
    box-shadow: 0 5px 20px rgba(235, 160, 47, .5);
    text-align: center;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    opacity:1;
}
.p-button a:hover{
    box-shadow:none;
    transform: translateY(3px);
    opacity:1;
}

