@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,
.article h3,
.article h4,
.article h5,
.article h6 {
background-color: transparent; /* 背景色を透明に*/
border: none; /*枠線なし*/
border-radius: 0; /*角の丸みなし*/
padding-left: 0px;
padding-right: 0px;
	padding-bottom: 0px;
}

/*フォント設定*/


body, p, h2, h1, a {
  font-family: "Forum", "Yu Gothic", sans-serif;
  font-weight: 400 !important;
  font-style: normal;
}


.wp-block-button {
  font-family: "Forum", "Yu Gothic", sans-serif;
  font-weight: 400;
  font-style: normal;
}

/*字間*/
p, body {
letter-spacing: 2px;
}

h1, h2, h3 {
letter-spacing: 2px;
}

/*リンクホバー色*/
a:hover {
color: #666666;
transition : 0.5s;
}

/*ヘッダーフッターまわりの調整*/
.breadcrumb,
.article-header,
.article-footer {
display: none;
}

.header-container-in {
padding-top: 10px;
padding-bottom: 10px;
}

/*セクションまわりの細々とした余白の調整*/
.main {
	border: none;
padding-bottom:0!important;
margin-bottom:0!important;
margin-left:0!important;
margin-right:0!important;
}

/*フルワイドと余白の調整*/
.wp-block-cover, .n2-section-smartslider {
margin-bottom:0!important;
margin-top:0!important;
padding-bottom:0!important;
bottom: 0;
}

.wp-block-columns {
margin-bottom:0!important;
}

.entry-content, .content {
padding-top:0!important;
padding-bottom:0!important;
margin-top:0!important;
margin-bottom:0!important;
}

.content-bottom {
margin:0;
}

.article {
padding-bottom:0px!important;
margin-bottom:0px!important;
}

/*メニュー画像のホバーズーム*/
/*表示したいボックスサイズ*/
.wp-block-column.has-border-color.has-key-color-border-color.is-layout-flow.wp-block-column-is-layout-flow {
  overflow: hidden; /*拡大した時はみ出た部分を隠す*/
}

/*画像の調整*/
.menuimage:hover img {
transform: scale(1.1);
transition: transform 0.3s;
}


/*フッター*/
.footer {
margin-top:0px;
}

/*SNSシェア非表示*/
.page .sns-share,
.page .sns-follow {
display: none ;
}

.veu_socialSet.veu_socialSet-position-after.veu_contentAddSection {
	display: none;
}

/*水平スクロールバー非表示*/
body {
overflow-x:clip;
font-size: 12px;
}

/*フルワイド*/
.fullwideblock {
width: 100vw;
margin: 0 calc(50% - 50vw);
padding: 0 calc(50vw - 50%);
}

/*グローバルメニュー*/
/*メニュー項目の左右の余白*/
#navi .navi-in>ul>li>a{
padding: 0 0em;
}

/*ホバー時にメニューの色が薄くなるのをやめる*/
#navi .navi-in a:hover {
background-color: rgb(255 255 255 / 0);
}

/*ホバー時にメニューにアンダーラインを出す*/
#navi .navi-in a:after{
position: absolute;/*線の位置を絶対配置に*/
content: "";/*文字はなし*/
opacity: .5;
left: 0px;/*線の位置*/
bottom: 0;/*線の位置*/
height: 100%;/*線の高さ*/
width: 100%;/*幅いっぱいに線を引く*/
background: #dddddd ;/*線の色*/
transform: scale(0,1);/*ホバー前は線を消す*/
transition: 0.3s;/*線が0→100%になるまでの秒数*/
}

#navi .navi-in a:hover:after{
transform: scale(1);/*マウスオーバー後、線を100%出す*/
}

/*フォントサイズ等変更*/
.navi-in .menu-header .item-label{
letter-spacing: 2px;
font-size: 13px;
font-weight: 600;
}

/*メニュー項目の幅*/
.menu-item {
width: 10px;
}
/*グローバルメニュー終わり*/

/*ブログ記事一覧のカスタマイズ*/
.new-entry-cards {
margin: auto;
width: 110vh;
}

.new-entry-card-thumb {
transition-duration: 0.3s; /*アニメーションの時間*/ box-shadow: 0px 10px 10px -5px rgba(85,85,85,0.75); /*通常時の画像の影*/
}

.new-entry-card-thumb:hover {
transform: translateY(-6px); /*マウスホバーで上に移動*/
box-shadow: 0px 5px 5px -5px rgba(85,85,85,0.75); /*マウスホバー時の画像の影*/
}

.new-entry-card-thumb img { /*画像下の隙間を消す*/
vertical-align: bottom;
}

.widget-entry-card-thumb {
width: 200px !important;
}

.new-entry-card-title {
margin-top: 5px; /*上に余白を付ける*/
line-height: 1; /*行間を広く*/
font-size: 14px !important;
padding-bottom: 0px!important;
}

.is-list-horizontal.large-thumb .card-title, .is-list-horizontal.large-thumb-on .card-title {
height: 1.5em;
}

/*タイトルと日付の間の調整*/
.new-entry-card-title:hover {
color: #85A4B5 ;/*マウスホバー時の色*/
}
@media screen and (max-width: 768px){
.new-entry-cards {
margin: auto;
width: 45vh;
}
.new-entry-card-title {
font-size: 12px; /*スマホでの文字の大きさ*/
padding-left:5px;
line-height: 1.2; /*スマホでの行間*/
}

.e-card-info {
color: #666 ; /*色を薄く*/
}

.new-entry-card-snippet { padding-left: 5px; font-size: 10px; } 
.e-card-info {font-size: 11px; /*スマホでの文字サイズ*/}
}

/*記事一覧の投稿日表示カスタム*/
/*ウィジェット記事の投稿日・更新日を表示*/
.widget-entry-card-date {
display:block;
text-align: right;/*右寄せ*/
}

/*更新日を非表示にする*/
.widget-entry-card-update-date{
display: none;
}

/*日付にアイコン追加*/
.widget-entry-card-post-date::before,

.widget-entry-card-update-date::before{
font-family: "Font Awesome 5 Free";
padding-right: 3px; /*右余白*/
font-size:10px;
}

/*更新日アイコン*/
.widget-entry-card-update-date::before{
font-weight:bold;
content: "\f1da"; /*fa-historyアイコン*/
}

/*記事一覧カスタマイズ終わり*/

/*ヘッダーインスタfunction編集必要*/
.header-insta {
margin-bottom: 40px !important;
padding-top: 18px;
height: 30px;
width: 30px;
transition-property: opacity;
transition-duration: 0.5s;
}
.header-insta:hover {
opacity: 0.4;
}

/*ヘッダーライン*/
.header-line {
margin-bottom: 40px !important;
padding-top: 18px;
margin-right: 30px;
margin-left: 10px;
height: 30px;
width: 30px;
transition-property: opacity;
transition-duration: 0.5s;
}
.header-line:hover {
opacity: 0.4;
}

/*お問い合わせボタン（ヘッダー）*/
/*ヘッダーロゴ(テキスト)の反対側に問い合わせボタン表示*/

div#header-in {
/* ヘッダーロゴ(テキスト)と問い合わせボタンを横並び */
flex-direction: row;
}

.header-in .logo-header {
/* ヘッダーロゴ(テキスト)と問い合わせボタンの位置を両端にする */
margin-right: auto;

}
.header-contact {
/* 問い合わせボタン見た目を整える */
 margin-top: 10px !important;
margin-top: 30px;
padding-right: 20px;
height:50px;

}

.btn {
color: #fff ;
border-color: #F39800 ;
border-radius: 6px;
height: 45px;
font-size: 14px;
padding-top: 10px;
background: #F39800 ;
}

}
/*お問い合わせボタン終わり*/

/*人気アイコン*/
.wp-block-cover .popular .has-link {
  position: relative;
	}

	.recommend {
		position: absolute;
	top: 0px;
	left: 0px;
}




.wp-block-cover .wp-block-cover__inner-container,.wp-block-cover-image .wp-block-cover__inner-container {
position: static;
	z-index: 200;
}



/*contact form7 カスタマイズ*/
/*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: #f79034 ;/オレンジ/
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:#ebedf5;/ブルーグレー/
}
}

/* レスポンシブ */
@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:#ebedf5;
}
}

/* 「送信する」ボタン */
.wpcf7 input.wpcf7-submit {
background-color:#f79034; /*オレンジ*/
border:0;
color:#fff;
font-size:1.2em;
font-weight:bold;
margin:0 auto;
}

.CF7_btn{
text-align:center;
margin-top:20px;
}

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

/* ajax-loader */
.wpcf7-spinner {
vertical-align: middle;
}

@media screen and (max-width: 767px) {

.cf7__list dt {
width: 100%;
margin-bottom: 15px;
padding-top: 0;
}

.cf7__list dd {
width: 100%;
}

.cf7__list dd:nth-of-type(n + 2) {
margin-top: 0;
}

.cf7__list dd .wpcf7-checkbox,
.cf7__list dd .wpcf7-radio {
padding: 15px 0 0;
}

/* 送信ボタン */
input[type="submit"] {
width: 180px;
height: 56px;
}

}
/contact form 7終わり/



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

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

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

	/*TOPページロゴ一番上の丸サイズ調整*/
.toplogo {
	margin: auto;
	width: 30vw !important;
	margin-bottom: 30px !important;
}
	
	
	/*トップページテキストの字間*/
	.maintext {
			letter-spacing: 0px !important;
		font-size: 12px !important;
	}
	

	
	/*字間*/
	body {
		letter-spacing: 1px !important;
	}
	
	/*パーソナルカラー診断の説明*/
	.list2 {
		padding-left: 0.5px !important;
		padding-right: 0.5px !important;
	}
	
	.colorimage2 {
		width: 65% !important;
	}
	
	.colorimage3 {
		width: 90% !important;
	}
	
.wp-block-column .popular .is-layout-flow .wp-block-column-is-layout-flow {
  position: relative;
	}
	
.recommend {
		position: absolute;
	top: 0px;
	right: 0px;
}
	
.popularicon {
	position: absolute;
	top: 357px;
	left: 10px;
	z-index: 100;
}



	
/*へっだー非表示*/ .header-container { display: none; } 
}


}