@charset "utf-8";
/* ケイシン公式サイト 共通（ヘッダー・メニュー・見出し・フッター）2026リニューアル */
:root{--green:#0b5a32;--green2:#009a3e;--line:#dcdcdc;--bg:#f4f5f4;--text:#222;--sub:#666;--raku:#bf0000;--yahoo:#e60033}
*{box-sizing:border-box}
body{margin:0;background:#fff;color:var(--text);font-family:'Noto Sans JP',sans-serif;font-size:15px;line-height:1.7}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:3px solid var(--green2);outline-offset:3px}
img{max-width:100%}
.inner{max-width:1100px;margin:0 auto;padding:0 20px}

/* ヘッダー */
.head{background:#fff}
.head .inner{display:flex;align-items:center;justify-content:space-between;height:84px}
.logo img{height:34px;display:block}
.logo small{display:block;font-size:11px;color:var(--sub);margin-top:4px;letter-spacing:.05em}
.headbtns{display:flex;gap:10px}
.headbtns a{display:flex;align-items:center;justify-content:center;height:42px;padding:0 20px;font-size:13px;font-weight:700;border-radius:3px;transition:.2s}
.headbtns .r{background:var(--raku);color:#fff}
.headbtns .y{background:var(--yahoo);color:#fff}
.headbtns .c{border:1px solid var(--green);color:var(--green)}
.headbtns a:hover{opacity:.8}

/* メニュー帯 */
.gnav{background:var(--green)}
.gnav ul{list-style:none;margin:0 auto;padding:0;max-width:1100px;display:flex}
.gnav li{flex:1;text-align:center;border-left:1px solid rgba(255,255,255,.18)}
.gnav li:last-child{border-right:1px solid rgba(255,255,255,.18)}
.gnav a{display:block;color:#fff;font-size:14px;padding:13px 0;transition:.2s}
.gnav a:hover,.gnav .on a{background:rgba(255,255,255,.12)}
.gnav .on a{box-shadow:inset 0 -3px 0 #9bd36b}

/* 見出し */
.ttl{display:flex;align-items:baseline;gap:14px;margin:0 0 22px}
.ttl h2{font-size:26px;letter-spacing:.06em;margin:0;font-weight:700}
.ttl span{font-size:12px;color:var(--green2);letter-spacing:.15em;font-weight:500}

/* 下層ページの帯（ページ名） */
.pagehead{position:relative;background:var(--green) center/cover no-repeat;color:#fff;overflow:hidden}
.pagehead::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,50,28,.85),rgba(6,50,28,.35))}
.pagehead .inner{position:relative;padding-top:56px;padding-bottom:52px}
.pagehead span{display:block;font-size:13px;letter-spacing:.25em;color:#bfe3a5;font-weight:500}
.pagehead h1{margin:4px 0 0;font-size:34px;letter-spacing:.1em;font-weight:700}
.pagehead p{margin:10px 0 0;font-size:14px;opacity:.9}
.crumb{font-size:12px;color:var(--sub);padding:12px 0}
.crumb a{color:var(--green2)}
.sec{padding:56px 0}
.sec.gray{background:var(--bg)}

/* 表（会社概要・料金など） */
.tbl{width:100%;border-collapse:collapse;border-top:2px solid var(--green)}
.tbl th,.tbl td{border-bottom:1px solid var(--line);padding:16px 18px;text-align:left;vertical-align:top}
.tbl th{width:200px;background:#f7faf7;font-weight:500;color:var(--green)}

/* お問い合わせへの誘導帯 */
.cta{background:var(--green);color:#fff;text-align:center;padding:48px 20px}
.cta h2{margin:0 0 6px;font-size:24px;letter-spacing:.06em}
.cta p{margin:0 0 22px;font-size:14px;opacity:.9}
.cta .btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.cta .btns a{display:inline-flex;align-items:center;gap:8px;min-width:240px;justify-content:center;height:56px;border-radius:28px;font-weight:700;font-size:16px;transition:.2s}
.cta .tel{background:#fff;color:var(--green)}
.cta .mail{border:2px solid #fff;color:#fff}
.cta .btns a:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.2)}

/* フッター */
.foot{border-top:1px solid var(--line);padding:30px 0 26px}
.foot .inner{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}
.foot .co{font-size:13px;color:var(--sub);line-height:1.9}
.foot .co strong{color:var(--text);font-size:15px}
.foot .co a:hover{color:var(--green2)}
.foot nav{display:flex;gap:22px;font-size:13px;align-self:flex-end;flex-wrap:wrap}
.foot nav a:hover{color:var(--green2)}
.copy{background:#2b2b2b;color:#bbb;text-align:center;font-size:12px;padding:14px}

/* スマホ */
@media(max-width:820px){
 .head .inner{height:auto;padding-top:12px;padding-bottom:12px;flex-direction:column;gap:10px}
 .headbtns{width:100%}.headbtns a{flex:1;padding:0 6px}
 .gnav .pconly{display:none}
 .gnav ul{flex-wrap:wrap}.gnav li{flex:1 1 0;border:none!important}.gnav a{font-size:13px;padding:10px 0}
 .ttl h2{font-size:20px}.ttl{gap:10px}
 .pagehead .inner{padding-top:34px;padding-bottom:30px}.pagehead h1{font-size:24px}
 .sec{padding:40px 0}
 .tbl th,.tbl td{display:block;width:auto;padding:10px 12px}.tbl th{border-bottom:none;padding-bottom:4px}
 .cta .btns a{min-width:0;width:100%}
}
.mihon-note{position:fixed;left:10px;bottom:10px;background:#333;color:#fff;font-size:12px;padding:6px 10px;border-radius:4px;z-index:99;opacity:.85}
/* フッターの植木レンタル対応エリア */
.farea{max-width:1100px;margin:18px auto 0;padding:14px 20px 0;border-top:1px dashed var(--line);font-size:12px;color:var(--sub);line-height:2}
.farea a{margin:0 .35em}
.farea a:hover{color:var(--green2)}
