@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

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

.article h2 {
  /*線の種類（実線） 太さ 色*/
  border-bottom: solid 3px black;
　background: none;/*背景色を消す*/
}

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

      .wp-block-image img {
      max-width:    80%;
      margin:   0 40px;
      }
	
}


/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	.googlemap {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 75%;/*比率4:3*/

}
.googlemap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
    .header div.header-in {
        min-height: auto;
    }
      .wp-block-image img {
      max-width:    80%;
      margin:   0 40px;
      }
	
.col-reverse{
flex-direction: column-reverse; 
}

}


/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
.googlemap {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 75%;/*比率4:3*/

}
.googlemap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}	
	.col-reverse{
flex-direction: column-reverse; 
}
	
    .header div.header-in {
        min-height: auto;
    }
      .wp-block-image img {
      max-width:    80%;
      margin:   0 40px;
      }
}


/************************************
** カスタムテキスト
************************************/
.cocoon-custom-text-1{
 color: rgba(255,255,255,0.9);
 text-shadow: 4px 8px 8px rgb(0 0 0 / 0.8);

}

.cocoon-custom-text-2{
	position: relative;
	font-size: 18px;
	text-align: center;
	border-bottom: 3px solid #ccc;
	padding-bottom: 2px;
}

.cocoon-custom-text-3{
@import url('https://fonts.googleapis.com/css2?family=Itim&display=swap');
  font-family: 'Itim', cursive;
	text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
              -1px 1px 0 #FFF, 1px -1px 0 #FFF,
              0px 1px 0 #FFF,  0-1px 0 #FFF,
              -1px 0 0 #FFF, 1px 0 0 #FFF;
}

.cocoon-custom-text-4{
  font-family: "Kaisei Opti", serif;
  font-style: normal;
}
.cocoon-custom-text-5{
  font-family: "Stick", sans-serif;
  font-style: normal;
}

.cocoon-custom-text-6{
  font-family: "Zen Old Mincho", serif;
  font-style: normal;
}
.cocoon-custom-text-7{
	position: relative;
	font-size: 18px;
	text-align: center;
	border-bottom: 3px solid #111;
	padding-bottom: 2px;
}


/************************************
** グーグルフォント
************************************/
.sidebar h3 {
   font-family: 'Zen Maru Gothic', serif;
	 }


.cat-label {display:none}



/*ContactForm7カスタマイズ*/
table.CF7_table{
	width:80%;
	margin:0 auto;
	border: 3px solid #e5e5e5;
}

table.CF7_table tr{
	border-top: 1px solid #e5e5e5;
}

.single .entry-content table.CF7_table,
.page .entry-content table.CF7_table{
	display:table;
}

/*入力欄*/
.CF7_table input, .CF7_table textarea {
	border: 1px solid #d8d8d8;
}

.CF7_table ::placeholder {
	color:#797979;
}

/*「必須」文字*/
.CF7_req{
	font-size:.9em;
	padding: 5px;
	background: #176717;/*オレンジ*/
	color: #fff;
	border-radius: 3px;
	margin-right:1em;
}

/*「任意」文字*/
.CF7_unreq{
	font-size:.9em;
	padding: 5px;
	background: #bdbdbd;/*グレー*/
	color: #fff;
	border-radius: 3px;
	margin-right:1em;
}

/* タイトル列 */
@media screen and (min-width: 768px){
	.CF7_table th{
	width:30%;/*横幅*/
	background-color:#ebf8f4;/*ブルーグレー*/
	}
}

/* レスポンシブ */
@media screen and (max-width: 768px){
	table.CF7_table{
	width:95%;
	}
	.CF7_table tr, .CF7_table td, .CF7_table th{
	display: block;
	width: 100%;
	line-height:2.5em;
	}
	.CF7_table th{
	background-color:#a7e0ce;
	}
}

/* 「送信する」ボタン */
.wpcf7 input.wpcf7-submit {
	background-color:#176717;/* 緑*/
	border:0;
	color:#fff;
	font-size:1.2em;
	font-weight:bold;
	margin:0 auto;
}
.wpcf7 input.wpcf7-submit:hover {
  background: #a7e0ce;
  color: #fff;
}
 
.CF7_btn{
	text-align:center;
	margin-top:20px;
}

.wpcf7-spinner{
	width:0;
	margin:0;
}


.logo-image * {
  display: block;
}

.logo-image {
  padding: 0;
}
#navi {
    margin: 0 auto;
}
.page-id-828 {
  background-color: #fff;
}
.page-id-1438 {
  background-color: #ebf8f4;
}

.archive-title .fa-folder-open:before {
  content: "\f005";
	
}
.archive-title {
  color: #5f5f5f;
  text-align: center;
  font-family: 'Baloo Thambi 2', noto sans jp;
  font-size: 26px !important;
  margin-left: -10px;
}

/*

#menu-item-1513 {
  background-color: #a7e0ce;
}

*/
/* recaptchaを非表示 */

.grecaptcha-badge { visibility: hidden; }



/* フローティングバナー */
.floating-banner {
  position: fixed;
  top: 50%; /* 縦位置 */
  right: 0px; /* 右端からの位置 */
  transform: translateY(-50%);
  z-index: 20;
}
.floating-banner a {
  display: flex;
  align-items: center;
  gap: 0.5em;
  writing-mode: vertical-rl;
  color: #fff; /* 文字色 */
  font-size: 16px; /* 文字サイズ */
  font-weight: 700; /* 文字太さ */
  background-color: #197A80; /* 背景色 */
  letter-spacing: 0.1em; /* 文字間隔 */
  padding: 1.2em 0.7em; /* 上下左右余白 */
  border-radius: 10px 0 0 10px; /* 角丸 */
  transition: opacity 0.25s;
}
.floating-banner a:hover {
  opacity: 0.7;
}
.floating-banner i::before {
  padding-bottom:3px; /* フォントアイコンの余白調整 */
}


/* 背景色 */
@media screen and (max-width: 600px) {
  .floating-banner {
    display: none; /* スマホで非表示 */
  }
}

/* フローティングバナースマホバナー */
/* 背景色 */
 
.floating-sp-banner {
    display: none; /* スマホで非表示 */
  }
@media screen and (max-width: 600px) {

.floating-sp-banner {
  position: fixed;
	z-index: 20;
  bottom: 10px;
  right: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 80px;
  border-radius: 100%;
  background: #197A80;
  color: #fff;
  text-decoration: none;
	   letter-spacing: 0em; /* 文字間隔 */
  padding: 1em 0.1em; /* 上下左右余白 */
}
.floating-sp-banner a {
   z-index: 1;
  position: fixed;
	z-index: 20;
  bottom: 10px;
  right: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 80px;
  border-radius: 100%;
  background: #197A80;
  color: #fff;
  text-decoration: none;
  font-size: 15px;
}
.floating-sp-banner a:hover {
  opacity: 0.7;
}
.floating-sp-banner i::before {
  padding-bottom:10px; /* フォントアイコンの余白調整 */
}

