@charset "utf-8";
/* ============================================================
   K.E興業株式会社 上書きCSS（sinoki の css/style.css の後に読み込む）
   方針：レイアウトは sinoki のまま。ここでやるのは
     1) 配色の置き換え（赤 #e60012 → ロゴのグリーン #009944、差し色スカイブルー）
     2) 英字フォント（Montserrat → Manrope）
     3) 見出しを和文主体に（英字は小ラベル）
     4) ロゴ・写真の差し替えに伴うサイズ調整
   新しいレイアウト部品は作らない。
   ============================================================ */
:root {
  --ke-green: #009944;
  --ke-green-d: #00733a;
  --ke-sky: #2ea7e0;
  --ke-sky-d: #1f8fc4;
  --ke-line: #dfe6ea;
  --primary-color: #009944;
  --primary-color2: #2ea7e0;
}
.ke-en { font-family: 'Manrope', 'Noto Sans JP', sans-serif; }

/* ---------- 1) 配色の置き換え ---------- */
/* ヘッダー／SPドロワー／SP固定CTAは linect のCSS（css/ke-header.css・色置換済み）に任せる。ここでは触らない */
.c-btn, a.c-btn, button.c-btn, a.c-btn-flat.c-btn--red { background: var(--ke-green); }
.c-btn:hover, a.c-btn:hover, button.c-btn:hover, a.c-btn-flat.c-btn--red:hover { background: var(--ke-green-d); }
.home-mv__catch .catchLabel { color: #fff; }
.home-mv__catch .catchText .catchAccent { color: #7fe0a8; }
.p-home-svc__item:hover::before { background: linear-gradient(to top, rgba(0, 115, 58, .70), rgba(0, 0, 0, .25)); }
.p-recycle-sys__btn { background-color: var(--ke-green); border-radius: 50px; }
.p-recycle-sys__card:hover::after { background: linear-gradient(to top, rgba(0, 115, 58, .82) 0%, rgba(0, 0, 0, .45) 50%, rgba(0, 0, 0, .08) 100%); }
.p-recycle-sys__num { color: var(--ke-green); }
.p-topics__col .p-topics__tit { background: linear-gradient(135deg, var(--ke-green) 0%, var(--ke-green-d) 100%); }
.section-heading__num { color: rgba(0, 153, 68, .28); }
.sub-shop__table tr::before { background: var(--ke-green); }
.sub-shop__map-note { color: var(--ke-green); }
.sub-contact__list-top--tel { border-color: var(--ke-green); }
.sub-contact__item dt .required { background-color: var(--ke-green); }
.sub-contact__submit input { background: var(--ke-green); }
.sub-contact__time span.sub-contact__time-label { background: var(--ke-green); border: none; color: #fff; }
.sub-thanks__title { color: var(--ke-green-d); }
/* フッターCTA：ベタ塗り回避。深緑→緑の淡いグラデ＋2つの導線を薄い枠のカードに（sinoki の .footer_cta_box / .btnArea をそのまま使用） */
.footer_cta { position: relative; background: linear-gradient(120deg, #005c2f 0%, var(--ke-green-d) 45%, var(--ke-green) 100%); overflow: hidden; }
.footer_cta::before { content: ""; position: absolute; right: -8rem; top: -10rem; width: 42rem; height: 42rem; border-radius: 50%; background: rgba(255, 255, 255, .07); pointer-events: none; }
.footer_cta .inner { position: relative; }
.footer_cta .footer_cta_box { align-items: stretch; gap: 2.4rem; }
.footer_cta .btnArea { flex: 1 1 0; margin-top: 0; padding: 3rem 3.2rem; border: 1px solid rgba(255, 255, 255, .28); border-radius: 1.4rem; background: rgba(255, 255, 255, .06); }
.footer_cta .footer-txt { font-size: 1.5rem; margin-bottom: 1.4rem; letter-spacing: .06em; }
.footer_cta .footer-txt::before { content: ""; display: inline-block; width: 1.6rem; height: 2px; background: #fff; vertical-align: middle; margin-right: 1rem; opacity: .8; }
.footer_cta .telArea .tel { color: #fff; }
.footer_cta .telArea .tel .num { letter-spacing: .04em; }
.footer_cta .telInfo { opacity: .85; }
.footer_cta .c-btnB { position: relative; display: inline-flex; align-items: center; gap: 1.4rem; background: #fff; border-radius: 50px; padding: 1.6rem 5.2rem 1.6rem 3.6rem; box-shadow: 0 6px 18px rgba(0, 0, 0, .18); transition: transform .25s ease, box-shadow .25s ease; }
.footer_cta .c-btnB::after { content: ""; position: absolute; right: 2.2rem; top: 50%; width: .8rem; height: .8rem; border-top: 2px solid var(--ke-green); border-right: 2px solid var(--ke-green); transform: translateY(-50%) rotate(45deg); transition: right .25s ease; }
.footer_cta .c-btnB:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0, 0, 0, .22); }
.footer_cta .c-btnB:hover::after { right: 1.8rem; }
.footer_cta .c-btnB__text { color: var(--ke-green-d); font-weight: 700; letter-spacing: .04em; }
@media screen and (max-width: 768px) {
  .footer_cta .btnArea { width: 100%; padding: 2.4rem 2rem; text-align: center; }
  .footer_cta .footer-txt::before { display: none; }
}
.footer .footer-box .infoArea .navArea .listWrap .listTit { color: var(--ke-green); }
.copyArea { background: var(--ke-green-d); }
.footer__copyright { background: transparent; color: #fff; }
.footer .page-top span { color: #fff; }

/* ---------- 2) 英字フォント Montserrat → Manrope ---------- */
.c-titA__en, .sub-section-title, .header__tel, .sub-contact__tel-link, .sub-contact__tel, .telArea .tel,
.p-home-svc__tit span, .p-recycle-sys__cardEn, .section-heading__num, .c-btn, a.c-btn, button.c-btn,
.home-mv__catch .catchLabel, .footer .footer-box .infoArea .navArea .listWrap .listTit {
  font-family: 'Manrope', 'Noto Sans JP', sans-serif;
}

/* ---------- 3) 見出しを和文主体に（sinoki は英字8remが主） ---------- */
body .c-titA { display: flex; flex-direction: column; align-items: flex-start; gap: .8rem; }
body .c-titA .c-titA__en { order: 1; position: relative; font-size: 1.3rem; font-weight: 800; letter-spacing: .22em; color: var(--ke-green); line-height: 1; padding-left: 2.8rem; text-transform: uppercase; white-space: nowrap; }
body .c-titA .c-titA__en::before { content: ""; position: absolute; left: 0; top: 50%; width: 1.8rem; height: 2px; background: var(--ke-green); transform: translateY(-50%); }
body .c-titA .c-titA__jp { order: 2; font-size: 3.6rem; font-weight: 700; color: #222; line-height: 1.3; letter-spacing: .04em; margin: 0; padding: 0; border: none; width: auto; }
body .c-titA--white .c-titA__en, body .c-titA--white .c-titA__jp { color: #fff; }
body .c-titA--white .c-titA__en::before { background: #fff; }
body .c-titA--center { align-items: center; text-align: center; }
.p-aboutus .c-titA__jp { margin-top: 0; }
@media screen and (max-width: 768px) {
  body .c-titA .c-titA__jp { font-size: 2.6rem; }
}
/* 下層タイトル帯：写真をK.Eの厨房フードに、赤文字→白 */
.ttl_cover_20230406 { background-image: linear-gradient(90deg, rgba(0, 80, 40, .78), rgba(0, 153, 68, .38)), url(../img/ke/g05.jpg); background-position: center 55%; background-size: cover; }
.sub-section-title { color: #fff; }
@media screen and (max-width: 768px) {
  .sub-section-title { background: none; -webkit-text-fill-color: #fff; color: #fff; }
}

/* ---------- 4) 素材差し替えに伴う調整 ---------- */
.header__logo img, .header-sp__logo img { height: auto; width: 100%; }
.footer .footer-box .infoArea .footer_information_item .footer__logo img { width: 24rem; }
/* MVのキャッチは画像→テキスト（sinokiの .catchLabel/.catchText を使用） */
.home-mv__catch .catchText { text-align: right; }
.home-mv__catch .catchLabel { font-size: 1.5rem; letter-spacing: .2em; margin-bottom: 1.4rem; }
/* sinoki の「.home-mv__catch span { font-size:7rem }」が強調spanに効いてSPで巨大化するため親に合わせる */
.home-mv__catch .catchText .catchAccent { font-size: inherit; line-height: inherit; }
/* フッターCTA：見出し下の一文（sinokiには無い要素なので余白だけ） */
.footer_cta__lead { margin-top: 2rem; font-size: 1.5rem; line-height: 2; color: #fff; }
/* フッター：ナビ項目が sinoki より多く長いため、住所列が潰れないように列幅を固定し、リストは折り返す
   （sinoki 側はネストCSSで詳細度が高いので同じ深さで指定） */
.footer .footer-box .infoArea .footer_information_item { width: 34%; flex: 0 0 34%; min-width: 0; }
.footer .footer-box .infoArea .navArea { flex: 1 1 auto; min-width: 0; }
.footer .footer-box .infoArea .navArea .listWrap .footer__list { flex-wrap: wrap; gap: 1.2rem 3rem; }
.footer .footer-box .infoArea .navArea .listWrap .footer__list .footer__item .footer__link { white-space: normal; }
@media screen and (max-width: 768px) {
  .footer .footer-box .infoArea .footer_information_item { width: 100%; flex: 1 1 auto; }
}
/* サービスタイル：タイトル下に短い説明を1行足す（sinokiのタイルはタイトルのみ） */
.p-home-svc__item { cursor: default; }
.p-home-svc__tit .p-home-svc__txt { display: block; margin-top: .8rem; font-size: 1.3rem; font-weight: 400; line-height: 1.7; letter-spacing: .02em; color: rgba(255, 255, 255, .9); max-width: 46rem; }
@media screen and (max-width: 768px) {
  .p-home-svc__item, .p-home-svc__item--wide { height: 22rem; }
  .p-home-svc__tit .p-home-svc__txt { display: none; }
}
/* 会社セクションの背景写真（sinoki は img/company/company-bg.png を CSS 指定） */
.company::before { background-image: url(../img/ke/g01.jpg); }
/* 実績カード（p-recycle-sys）はリンクではなく表示のみ */
.p-recycle-sys__card { cursor: default; }
/* 会社概要ページ：ごあいさつ・お問い合わせ（sinoki の部品に文言を足しただけ） */
.ke-greeting { margin-top: 4rem; align-items: start; }
.ke-greeting__catch { font-size: 2.2rem; font-weight: 700; line-height: 1.5; margin-bottom: 1.6rem; }
.ke-greeting .grid-col02_text p + p { margin-top: 1.2rem; }
.ke-note { display: inline-block; margin-left: .6rem; font-size: 1.2rem; color: var(--ke-sky-d); }
.ke-sec__lead { margin-top: 2.4rem; font-size: 1.5rem; line-height: 2; color: #444; max-width: 82rem; }
.ke-contact { padding: 9rem 0 10rem; background: #fff; scroll-margin-top: 10rem; }
.ke-contact .sub-contact__btm { margin-top: 4rem; }
.sub-contact__list-top--fax { padding: 3rem; border-radius: 14px; background: #fff; border: 1px solid var(--ke-sky); }
.sub-contact__list-top--fax .c-titA--contact { flex-wrap: wrap; gap: .6rem 2rem; }
.sub-contact__list-top--fax .sub-contact__item-top { margin-top: 2.5rem; }
.sub-contact__fax-num { font-size: 4.2rem; font-weight: 800; letter-spacing: .05em; line-height: 1.2; color: #0A0A0A; }
.ke-contact .sub-contact__box { padding-top: 7rem; }
.ke-contact .sub-contact__intro { margin: 2.4rem 0 0; text-align: left; font-size: 1.5rem; line-height: 2; }
.ke-contact .sub-contact__form { margin-top: 3rem; padding-top: 0; }
.sub-contact__submit { margin-bottom: 0; }
@media screen and (max-width: 768px) {
  .ke-contact { padding: 6rem 0 7rem; }
  .sub-contact__list-top--fax { padding: 2.5rem 1.75rem; }
  .sub-contact__fax-num { font-size: 3.2rem; }
  .ke-contact .sub-contact__box { padding-top: 5rem; }
  .ke-greeting__catch { font-size: 1.9rem; }
}
