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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/* 
* ヘッダーロゴ左寄せ
*/
.logo {
  text-align: left;
}

/* コンテンツ上の余白 */
.content {
margin-top: 0;
}

/* フロントページのアピールエリア高さ */
.front-top-page 
.appeal {
/*height: calc(100vw * calc(750 / 1600));
 幅・高さを固定に修正
*/
 max-width:1200px; /* 最低の高さを1200pxに指定 */
 height:500px;
 margin:auto;
 object-fit:cover;
}

/* アピールエリア画像を設定（会社概要） */
.page-id-56 .appeal {
  height: calc(100vw * calc(275 / 1600));
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_corporate.png);
}

/* アピールエリア画像を設定（開発事例） */
.page-id-95 .appeal {
  height: calc(100vw * calc(275 / 1600)); 
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/works-1.png);
}

/* アピールエリア画像を設定（問い合わせ） */
.page-id-72 .appeal {
  height: calc(100vw * calc(275 / 1600)); 
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/contact.png);
}

/* アピールエリア画像を設定（リクルート） */
.page-id-138 .appeal {
  height: calc(100vw * calc(275 / 1600)); 
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/recruit.png);
}

/* アピールエリア画像を設定（福利厚生） */
.page-id-317 .appeal {
  height: calc(100vw * calc(275 / 1600)); 
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/benefits.png);
}

/* アピールエリア画像を設定（個人情報保護） */
.page-id-2 .appeal {
  height: calc(100vw * calc(275 / 1600)); 
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/privacy.png);
}

/* アピールエリア画像を設定（個人情報取り扱い） */
.page-id-3 .appeal {
  height: calc(100vw * calc(275 / 1600)); 
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/personal.png);
}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
	
/* フロントページのアピールエリア高さ */
.front-top-page .appeal {
　object-fit: cover;
  background-image: url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_top.jpg);
  max-width:900px;
  height:500px;
  margin:auto;
}
	
.front-top-page .apple{
 height:98vh;
 background-position:bottom; 
}
	
/* アピールエリア画像を設定（会社概要） */
.page-id-56 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_corporate.png);
}
	
/* アピールエリア画像を設定（開発事例） */
.page-id-95 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_works-1.png);
}	
	
/* アピールエリア画像を設定（問い合わせ） */
.page-id-72 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_contact.png);
　object-fit: none;
}

/* アピールエリア画像を設定（リクルート） */
.page-id-138 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_recruit.png);
}

/* アピールエリア画像を設定（個人情報保護） */
.page-id-2 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_privacy.png);
}

/* アピールエリア画像を設定（福利厚生） */
.page-id-317 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_benefits.png);
}

/* アピールエリア画像を設定（個人情報取り扱い） */
.page-id-3 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_personal.png);
}

.content-top {
  margin: 0;
	}
}

/*834px以下*/
@media screen and (max-width: 834px){

/* フロントページのアピールエリア高さ */
.front-top-page .appeal {
　object-fit: cover;
  background-image: url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_top.jpg);
  max-width:800px;
  height:300px;
  margin:auto;
}


/* アピールエリア画像を設定（会社概要） */
.page-id-56 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_corporate.png);
}

/* アピールエリア画像を設定（開発事例） */
.page-id-95 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_works-1.png);
}		
		
/* アピールエリア画像を設定（問い合わせ） */
.page-id-72 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_contact.png);
}

/* アピールエリア画像を設定（リクルート） */
.page-id-138 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_recruit.png);
}

/* アピールエリア画像を設定（個人情報保護） */
.page-id-2 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_privacy.png);
}

/* アピールエリア画像を設定（福利厚生） */
.page-id-317 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_benefits.png);
}

/* アピールエリア画像を設定（個人情報取り扱い） */
.page-id-3 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_personal.png);
}

.content-top {
  margin: 0;
}
}

/*480px以下*/	
@media screen and (max-width: 480px){
	
/* フロントページのアピールエリア高さ */
.front-top-page .appeal {
height: 200px;
width:380px;
}

.apple{
　object-fit: cover;	
	}

.appeal {
 background-image: url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_top.jpg);
 min-height:100px; /* 最低の高さを100pxに指定 */
}
	
/* アピールエリア画像を設定（会社概要） */
.page-id-56 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_corporate.png);
}

/* アピールエリア画像を設定（開発事例） */
.page-id-95 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_works-1.png);
}

/* アピールエリア画像を設定（問い合わせ） */
.page-id-72 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_contact.png);
}

/* アピールエリア画像を設定（リクルート） */
.page-id-138 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_recruit.png);
}

/* アピールエリア画像を設定（個人情報保護） */
.page-id-2 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_privacy.png);
}

/* アピールエリア画像を設定（福利厚生） */
.page-id-317 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_benefits.png);
}

/* アピールエリア画像を設定（個人情報取り扱い） */
.page-id-3 .appeal {
  background-image:url(https://www.ft-com.co.jp/main/wp-content/uploads/2025/04/s_personal.png);
}
	
.content-top {
  margin: 0;
}
}