@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.2
*/

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


/*フロント固定ページのタイトルを非表示*/
.page .entry-title{
  display: none;
}

/* recaptcha 非表示*/
.grecaptcha-badge {
	visibility: hidden; }

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

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

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


/*Contact Form 7カスタマイズ*/

table , td, th {
	border: 2px solid #595959;
	border-collapse: collapse;
}
td, th {
	padding: 3px;
	width: 100px;
	height: 50px;
}
th {
	background: #f0e6cc;
}
.even {
	background: #fbf8f0;
}
.odd {
	background: #fefcf9;
}

.cf7-input {
  margin-right: 10px; /* 下側に10pxの余白を追加 */
}

/*スマホContact Form 7カスタマイズ

/*予約フォームのスマホ対応*/

/*全体のデザイン*/
.wpcf7 {
padding: 20px;
border-radius: 10px;
max-width: 80%;
margin: auto;
}

/* 必須・任意のサイズ調整 */	
.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:12px;
 padding:5px;
 background:#ff9393;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:3px;
}

/*任意の調整*/
.any{
 font-size:12px;
 padding:5px;
 background:#93c9ff;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:3px;
}

/*ラジオボタンを縦並び指定*/
.verticallist .wpcf7-list-item{
 display:block;
}

/*送信ボタンのデザイン変更*/
#formbtn{
 display: block;
 padding:20px;
 width:90%;
 background:#ffaa56;
 color:#fff;
 font-size:18px;
 font-weight:bold;	 
 border-radius:2px;
 margin:25px auto 0;
}

/*送信ボタンマウスホバー時*/
#formbtn:hover{
 background:#fff;
 color:#ffaa56;
 border:2px solid #ffaa56;
}

/* contact form 解答欄 サイズ調整*/
#short{
	width: 20%;
}

#firstname1{
	width: 30%;
}

#lastname1{
	width: 30%;
}

#firstname_kana1{
	width: 30%;
}

#lastname_kana1{
	width: 30%;
}

#firstname2{
	width: 30%;
}

#lastname2{
	width: 30%;
}

#firstname_kana2{
	width: 30%;
}

#lastname_kana2{
	width: 30%;
}

#year{
	width: 20%;
}

#month{
	width: 20%;
}

#day{
	width: 20%;
}

#short8{
	width: 30%;
}

#short9{
	width: 30%;
}

#middle{
	width: 50%;
}

#middle2{
	width: 40%;
}

#long{
	width: 80%;
}

#zip{
	width: 20%;
}

#pref{
	width: 30%;
}

#city{
	width: 50%;
}


/*チェックボックス拡大*/
input[type=checkbox] {
  transform : scale(1.5);
}

/*送信後、フォーム消し*/
form.sent p{
display:none;
}

/* 見出し用CSS */
/* H1 */
h1 {
  position: relative;
  padding: 0.25em 1em;
  border-top: solid 2px black;
  border-bottom: solid 2px black;
}
h1:before, h1:after {
  content: '';
  position: absolute;
  top: -7px;
  width: 2px;
  height: -webkit-calc(100% + 14px);
  height: calc(100% + 14px);
  background-color: black;
}
h1:before {
  left: 7px;
}
h1:after {
  right: 7px;
}


/* H2 */
.article h2{
  background: #a9e1ff; /*背景色*/
  padding: 0.5em;/*文字周りの余白*/
  color: white;/*文字を白に*/
  border-radius: 0.5em;/*角の丸み*/
}

/* H3 */
.article h3 {
  border-top:none;
  border-bottom:none;
  border-left:none;
  border-right:none;
  padding: 0;
  position: relative;
  padding: 2rem;
  border-bottom: 6px solid #00B7EE;
}

.article h3:before {
	position: absolute;
	bottom: -6px;
	left: 0;
	width: 20%;
	height: 6px;
	content: '';
	background: #F7B146;
}
 
/* H4 */
.article h4{
color: #364e96;/*文字色*/
  padding: 0.5em 0;/*上下の余白*/
  border-top: solid 3px #00B7EE;/*上線*/
  border-bottom: solid 3px #F7B146;/*下線*/
}
 
/* H5 */
.article h5{
  padding: 0.25em 0.5em;/*上下 左右の余白*/
  color: #494949;/*文字色*/
  background: transparent;/*背景透明に*/
  border-left: solid 5px #F7B146;/*左線*/
} 
/* H6 
.article h6{
border-bottom:none;
padding: 0;
}*/


/** QRコード表示 **/
.qr-container {
min-height: 150px;
max-height: 400px;
border: 1px solid #ddd;
border-radius: 5px;
display: block;
margin-bottom:20px;
margin-top:10px;
}
img.qrc-image {
float: left;
}
.qr-content {
margin-top: 10px;
font-size: 1em;
}
.qr-content h3 {
margin: 5px;
}

/************************************
** ブログカード
************************************/
/*.blogcard-snippet,*/
.blogcard-footer {
  display: none;
}

.blogcard-wrap {
  transition: all .3s;
  max-width: 600px;
  margin: 2em auto;
}

.blogcard {
	font-size: 12;
	line-height: 1.45em;
	position: relative;
	overflow: hidden;
	height: 100%;

        transition: height 0.3s ease;
	border-radius: 3px;
	background: #ffffff !important;
        box-shadow: 0 3px 7px -3px rgba(0, 0, 0, 0.3);

}

.blogcard01 .blogcard-thumbnail img {
	float: left;
	transition: all 0.5s ease;
}

.blogcard02 .blogcard-thumbnail img {
	float: right !important;
	transition: all 0.5s ease;
}

.blogcard01:hover .blogcard-thumbnail img {
	-webkit-transform: rotate(5deg) scale(1.3);
	        transform: rotate(5deg) scale(1.3);
}

.blogcard-label {
  top: 0px;
  left: 9px;
  padding: 3px 0.6em;
  background:#ff8c00;
  padding: 1px 10px;
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 1px;
}

@media screen and (max-width: 480px) {
	.blogcard {
		font-size: 1.3em;
	}
}

/*続きはこちらを挿入*/
.blogcard01:after{
font-family: "Font Awesome 5 Free";
content: "…続きはこちら \f77d";
font-weight: bold;
font-size: .8em;
color: #f4f4f4;
padding: .5em;
border-radius: 4px;
width: 45%;
background-color: #00B7EE;
margin-left: auto;
text-align: center;
display: block;
margin-top: -0.5em;
margin-bottom: -0.5em;
}

/* ===== CF7 Starter by Chappy ===== 
.cf7--contact{
  --cf7-font: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans JP", sans-serif;
  --cf7-text:#111; --cf7-muted:#6b7280; --cf7-bg:#fff; --cf7-border:#d1d5db;
  --cf7-accent:#0ea5e9; --cf7-success:#16a34a; --cf7-error:#dc2626;
  --cf7-radius:10px; --cf7-gap:12px;
	background-color: #f0f0f0;  ライトグレー
}
.cf7--contact .wpcf7-form{ font-family:var(--cf7-font); display:grid; gap:var(--cf7-gap); }
.cf7--contact p{ margin:0; }
.cf7--contact label{ display:block; font-weight:600; margin-bottom:6px; }
.cf7--contact small{ color:var(--cf7-muted); }

.cf7--contact input[type="text"],
.cf7--contact input[type="email"],
.cf7--contact input[type="tel"],
.cf7--contact input[type="url"],
.cf7--contact input[type="number"],
.cf7--contact input[type="date"],
.cf7--contact input[type="time"],
.cf7--contact textarea,
.cf7--contact select{
  width:100%; padding:12px 14px; border:1px solid var(--cf7-border);
  border-radius:var(--cf7-radius); background:var(--cf7-bg);
  color:var(--cf7-text); line-height:1.6; box-sizing:border-box;
}
.cf7--contact input::placeholder,
.cf7--contact textarea::placeholder{ color:var(--cf7-muted); opacity:1; }

.cf7--contact input:focus-visible,
.cf7--contact textarea:focus-visible,
.cf7--contact select:focus-visible{
  border-color:var(--cf7-accent); outline:2px solid var(--cf7-accent); outline-offset:2px;
}

.cf7--contact .wpcf7-submit{
  padding:12px 20px; border:none; border-radius:var(--cf7-radius);
  background:var(--cf7-accent); color:#fff; font-weight:700; cursor:pointer;
}
.cf7--contact .wpcf7-submit:hover{ filter:brightness(0.95); }
.cf7--contact .wpcf7-submit:disabled{ opacity:.6; cursor:not-allowed; }
.cf7--contact .wpcf7-spinner{ margin-left:8px; }

.cf7--contact .wpcf7-not-valid{ border-color:var(--cf7-error) !important; }
.cf7--contact .wpcf7-not-valid-tip{ margin-top:6px; color:var(--cf7-error); font-size:.875rem; }

.cf7--contact .wpcf7-response-output{
  margin-top:12px; padding:12px; border-radius:var(--cf7-radius); border:1px solid var(--cf7-border);
}
.cf7--contact .wpcf7-response-output.wpcf7-mail-sent-ok{
  border-color:var(--cf7-success); color:var(--cf7-success);
  background:color-mix(in srgb, var(--cf7-success) 10%, #fff);
}
.cf7--contact .wpcf7-response-output.wpcf7-validation-errors,
.cf7--contact .wpcf7-response-output.wpcf7-aborted{
  border-color:var(--cf7-error); color:var(--cf7-error);
  background:color-mix(in srgb, var(--cf7-error) 10%, #fff);
}

/* 2カラム補助 *//*
.cf7--contact .form-grid{ display:grid; gap:var(--cf7-gap); }
@media (min-width:768px){
  .cf7--contact .form-grid{ grid-template-columns:1fr 1fr; }
  .cf7--contact .form-grid .full{ grid-column:1 / -1; }
}

/* チェックボックス・ラジオ・ファイル *//*
.cf7--contact input[type="checkbox"],
.cf7--contact input[type="radio"]{ accent-color:var(--cf7-accent); }
.cf7--contact .wpcf7-list-item{ margin-right:16px; }
.cf7--contact input[type="file"]{
  width:100%; padding:8px; border:1px solid var(--cf7-border);
  border-radius:var(--cf7-radius); background:var(--cf7-bg);
}
.cf7--contact input[type="file"]::file-selector-button{
  margin-right:10px; border:none; border-radius:var(--cf7-radius);
  background:var(--cf7-accent); color:#fff; padding:8px 12px; cursor:pointer;
}
*/
/* ===== /CF7 Starter ===== */