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

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


/************************************
*タイトル非表示*
************************************/
.entry-title {
display: none;
}

/************************************
** アイキャッチ画像を全幅表示する
************************************/

/*枠組み*/
.eye-catch-wrap {
	margin-left: -29px; /*左の余白*/
	margin-right: -29px; /*右の余白*/
}

/*横幅 834px 以下に適用される*/
@media screen and (max-width: 834px){
	/*枠組み*/
	.eye-catch-wrap {
		margin-left: -20px; /*左の余白*/
		margin-right: -20px; /*右の余白*/
	}
}

/************************************
** アニメーション
************************************/
/* ①アピールエリア */
#appeal {
	height: calc(100vw * calc(600 / 1260));
}

/* ②アピールエリアのアニメーション設定 */
#appeal {
	animation : appeal-fadein 1s ease-in;
}

/* ③アピールエリアのアニメーション詳細 */
@keyframes appeal-fadein{
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
	
	
/************************************
* 画像をフル画面に表示 *
************************************/
.full-wide-screen{
margin:0 calc(50% - 50vw);
}

/************************************
*各固定ページのアピールエリア設定*
************************************/

/*サービス*/
.page-id-14 .appeal {
  background-image: url('http://fly-jp.com/wp-content/uploads/2022/10/service-1.jpeg');
}


/*会社概要*/
.page-id-44 .appeal {
  background-image: url('http://fly-jp.com/wp-content/uploads/2022/10/office.jpg');
}

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

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



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

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

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


/************************************
*アピールエリアの高さ設定　スマホ*
************************************/
@media (max-width: 767px){
#appeal {
height: 100vw; 
}
/* 商品情報页面：隐藏 Cocoon Appeal 区域 */
body.elementor-page-1389 #appeal,
body.page-id-1389 #appeal,
body.postid-1389 #appeal {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}