@charset "UTF-8";
/* ============================================================
   SOLAR WORKS Renewal Top  -  renewal.css
   モックアップ忠実再現。クラスは r- プレフィックスで親テーマと分離。
   ============================================================ */

:root{
  --cream: #ffffff;
  --cream-2: #f8f5ee;
  --white: #ffffff;
  --ink: #272320;
  --muted: #7a766d;
  --line: #ece5d6;
  --green: #9a8458;       /* accent: sand brown (EN/見出し補助/アイコン) */
  --green-dark: #7d6a44;  /* hover */
  --green-soft:#cdbb95;   /* soft accent (数字など) */
  --btn-bg: #e3d6bb;      /* ボタン/帯の背景（淡色） */
  --btn-text: #3a3326;    /* ボタン/帯の文字（濃色） */
  --radius: 10px;
  --maxw: 1120px;
  --font-serif: "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --font-sans: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", YuGothic, Meiryo, sans-serif;
}

/* SWELLベースCSS干渉対策の最小リセット（.r-body配下を独立化） */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body.r-body{
  margin:0; color:var(--ink); background:var(--cream) !important;
  font-family:var(--font-sans);
  font-size:15px; line-height:1.9; -webkit-font-smoothing:antialiased;
  letter-spacing:.02em;
}
body.r-body #page,
body.r-body .l-content,
body.r-body .l-container{ max-width:none; margin:0; padding:0; }
.r-body h1,.r-body h2,.r-body h3,.r-body p,.r-body ul,.r-body dl,.r-body dd,.r-body figure{ margin:0; padding:0; }
.r-body ul{ list-style:none; }
.r-body main{ display:block; }
.r-body img{ max-width:100%; height:auto; display:block; }
.r-body a{ color:inherit; text-decoration:none; }
.r-inner{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 24px; }

/* 見出し共通 */
.r-sec-title{ text-align:center; margin:0 0 40px; }
.r-sec-title__ja{ font-family:var(--font-serif); font-size:26px; letter-spacing:.08em; font-weight:600; margin:0; }
.r-sec-title__en{ display:block; font-size:11px; letter-spacing:.25em; color:var(--green); margin-top:8px; text-transform:uppercase; }

/* ボタン */
.r-btn{
  display:inline-flex; align-items:center; gap:12px;
  background:var(--btn-bg); color:var(--btn-text); font-size:13px; letter-spacing:.08em;
  padding:14px 26px; border-radius:4px; transition:.25s;
}
.r-btn:hover{ background:var(--green-dark); color:#fff; }
.r-btn--ghost{ background:transparent; color:var(--ink); border:1px solid var(--ink); padding:13px 25px; }
.r-btn--ghost:hover{ background:var(--ink); color:#fff; }
.r-arrow{ width:18px; height:1px; background:currentColor; position:relative; }
.r-arrow::after{ content:""; position:absolute; right:0; top:-3px; width:7px; height:7px; border-top:1px solid currentColor; border-right:1px solid currentColor; transform:rotate(45deg); }

/* ============ Header ============ */
.r-header{
  position:sticky; top:0; z-index:50; background:rgba(244,241,234,.92);
  backdrop-filter:saturate(120%) blur(6px); border-bottom:1px solid var(--line);
}
.r-header__in{ display:flex; align-items:center; justify-content:space-between; height:72px; }
.r-logo{ font-family:var(--font-serif); font-weight:700; font-size:20px; letter-spacing:.06em; }
.r-logo small{ font-size:12px; letter-spacing:.04em; }
.r-gnav{ display:flex; align-items:center; gap:30px; }
.r-gnav__list{ display:flex; gap:28px; list-style:none; margin:0; padding:0; }
.r-gnav__list a{ font-size:13.5px; letter-spacing:.06em; position:relative; padding:4px 0; }
.r-gnav__list a:hover{ color:var(--green); }
.r-gnav__cta{ background:var(--btn-bg); color:var(--btn-text); padding:11px 22px; border-radius:4px; font-size:13px; }
.r-gnav__cta:hover{ background:var(--green-dark); color:#fff; }
.r-burger{ display:none; width:30px; height:22px; position:relative; cursor:pointer; background:none; border:0; }
.r-burger span,.r-burger::before,.r-burger::after{ content:""; position:absolute; left:0; width:100%; height:2px; background:var(--ink); transition:.3s; }
.r-burger::before{ top:0; } .r-burger span{ top:10px; } .r-burger::after{ bottom:0; }

/* ============ Hero ============ */
.r-hero{ padding:70px 0 40px; overflow:hidden; }
.r-hero__in{ display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:center; }
.r-hero__copy{ max-width:480px; }
.r-hero__title{ font-family:var(--font-serif); font-weight:600; font-size:44px; line-height:1.5; letter-spacing:.04em; margin:0 0 26px; }
.r-hero__lead{ color:#4a473f; font-size:14px; line-height:2.1; margin:0 0 34px; }
.r-hero__scroll{ margin-top:34px; font-size:10px; letter-spacing:.3em; color:var(--muted); display:flex; align-items:center; gap:10px; }
.r-hero__scroll::before{ content:""; width:1px; height:40px; background:var(--muted); display:inline-block; }
.r-hero__visual{ position:relative; aspect-ratio:1/1; max-width:520px; margin-left:auto; }
.r-hero__diagram{ width:100%; height:100%; object-fit:contain; }
.r-hero__ring{ position:absolute; inset:8%; border:1px solid var(--line); border-radius:50%; background:radial-gradient(circle at 50% 45%, #fff 0%, #f0ebe1 70%); }
.r-hero__product{ position:absolute; inset:0; margin:auto; width:42%; object-fit:contain; z-index:2; }
.r-node{ position:absolute; display:flex; flex-direction:column; align-items:center; text-align:center; z-index:3; }
.r-node__ic{ width:54px; height:54px; border-radius:50%; background:#fff; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; box-shadow:0 6px 18px rgba(0,0,0,.05); }
.r-node__ic svg{ width:24px; height:24px; stroke:var(--green); }
.r-node__t{ font-size:11px; margin-top:8px; line-height:1.5; color:#54514a; }
.r-node--top{ top:-2%; left:50%; transform:translateX(-50%); }
.r-node--left{ bottom:14%; left:-4%; }
.r-node--right{ bottom:14%; right:-4%; }

/* ============ Strengths ============ */
.r-strength{ padding:64px 0; }
.r-strength__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.r-strength__item{ text-align:center; padding:0 8px; }
.r-strength__ic{ width:58px; height:58px; margin:0 auto 16px; display:flex; align-items:center; justify-content:center; }
.r-strength__ic svg{ width:40px; height:40px; stroke:var(--green); fill:none; }
.r-strength__t{ font-size:14px; line-height:1.7; font-weight:600; letter-spacing:.04em; }
.r-strength__t span{ display:block; font-size:12px; color:var(--green); font-weight:600; }

/* ============ About ============ */
.r-about{ padding:0 0 70px; }
.r-about__box{ background:#f8f5ee; border-radius:var(--radius); overflow:hidden; display:grid; grid-template-columns:1.05fr .95fr; }
.r-about__img{ width:100%; height:100%; object-fit:cover; min-height:340px; }
.r-about__body{ padding:54px 50px; }
.r-about__h{ font-family:var(--font-serif); font-size:24px; letter-spacing:.06em; margin:0 0 22px; }
.r-about__txt{ font-size:13.5px; line-height:2.1; color:#4a473f; margin:0 0 26px; }
.r-about__link{ font-size:13px; letter-spacing:.06em; display:inline-flex; gap:12px; align-items:center; color:var(--green-dark); }

/* ============ Brand ============ */
.r-brand{ padding:70px 0; background:var(--cream-2); }
.r-brand__in{ display:grid; grid-template-columns:.9fr 1.1fr; gap:48px; align-items:center; }
.r-brand__label{ font-size:11px; letter-spacing:.25em; color:var(--green); }
.r-brand__name{ font-family:var(--font-serif); font-size:34px; letter-spacing:.08em; margin:6px 0 20px; }
.r-brand__txt{ font-size:13.5px; line-height:2.1; color:#4a473f; margin:0 0 28px; }
.r-brand__capy{ width:90px; opacity:.5; margin-top:30px; }
.r-brand__photos{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.r-brand__photo figure{ margin:0; }
.r-brand__photo img{ border-radius:var(--radius); aspect-ratio:4/3; object-fit:cover; width:100%; }
.r-brand__photo figcaption{ text-align:center; font-size:12.5px; margin-top:12px; letter-spacing:.08em; color:#54514a; }

/* ============ Business ============ */
.r-biz{ padding:72px 0; }
.r-biz__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.r-biz__card{ background:#fff; border-radius:var(--radius); overflow:hidden; box-shadow:0 8px 24px rgba(0,0,0,.04); transition:.3s; }
.r-biz__card:hover{ transform:translateY(-4px); box-shadow:0 14px 30px rgba(0,0,0,.08); }
.r-biz__card img{ aspect-ratio:16/10; object-fit:cover; width:100%; }
.r-biz__body{ padding:24px 24px 28px; }
.r-biz__h{ font-size:16px; font-weight:600; letter-spacing:.04em; margin:0 0 10px; }
.r-biz__d{ font-size:12.5px; line-height:1.9; color:var(--muted); margin:0 0 18px; }
.r-biz__more{ display:flex; justify-content:flex-end; }

/* ============ Good Life Project ============ */
.r-glp{ padding:0 0 76px; }
.r-glp__box{ display:grid; grid-template-columns:1fr 1fr; gap:0; border-radius:var(--radius); overflow:hidden; background:#f8f5ee; }
.r-glp__body{ padding:54px 50px; align-self:center; }
.r-glp__h{ font-family:var(--font-serif); font-size:26px; letter-spacing:.04em; margin:0 0 8px; }
.r-glp__sub{ font-size:14px; font-weight:600; margin:0 0 20px; }
.r-glp__txt{ font-size:13px; line-height:2.05; color:#4a473f; margin:0 0 28px; }
.r-glp__imgs{ display:grid; grid-template-columns:1fr 1fr; }
.r-glp__imgs img{ width:100%; height:100%; object-fit:cover; min-height:300px; }

/* ============ News + Company ============ */
.r-foot-info{ padding:0 0 80px; }
.r-foot-info__grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:56px; }
.r-blk__h{ font-family:var(--font-serif); font-size:19px; letter-spacing:.06em; margin:0 0 22px; display:flex; align-items:baseline; justify-content:space-between; }
.r-blk__h a{ font-size:11px; letter-spacing:.1em; color:var(--green); }
.r-news__item{ display:flex; gap:16px; align-items:center; padding:14px 0; border-bottom:1px solid var(--line); font-size:12.5px; }
.r-news__date{ color:var(--muted); white-space:nowrap; }
.r-news__cat{ font-size:10.5px; letter-spacing:.05em; color:#fff; background:var(--green-soft); padding:3px 10px; border-radius:3px; white-space:nowrap; }
.r-news__ttl{ flex:1; }
.r-company--center{ max-width:640px; margin:0 auto; }
.r-company__row{ display:flex; gap:14px; padding:13px 0; border-bottom:1px solid var(--line); font-size:12.5px; }
.r-company__row dt{ width:84px; color:var(--muted); margin:0; flex-shrink:0; }
.r-company__row dd{ margin:0; }
.r-company__more{ margin-top:22px; }

/* ============ Footer ============ */
.r-footer{ background:#f1ede5; border-top:1px solid var(--line); }
.r-footer__in{ display:flex; align-items:center; justify-content:space-between; padding:26px 24px; flex-wrap:wrap; gap:16px; }
.r-footer__logo{ font-family:var(--font-serif); font-weight:700; font-size:17px; letter-spacing:.06em; }
.r-footer__nav{ display:flex; gap:22px; list-style:none; margin:0; padding:0; font-size:12.5px; }
.r-footer__cta{ display:inline-flex; gap:10px; align-items:center; border:1px solid var(--ink); border-radius:4px; padding:12px 22px; font-size:12.5px; }
.r-footer__copy{ text-align:center; font-size:11px; color:var(--muted); padding:14px; border-top:1px solid var(--line); }

/* ============ Responsive ============ */
@media (max-width:900px){
  .r-hero__in{ grid-template-columns:1fr; }
  .r-hero__visual{ order:-1; margin:0 auto; max-width:360px; }
  .r-about__box,.r-brand__in,.r-glp__box,.r-foot-info__grid{ grid-template-columns:1fr; }
  .r-strength__grid{ grid-template-columns:1fr 1fr; gap:32px 16px; }
  .r-biz__grid{ grid-template-columns:1fr; }
  .r-glp__imgs{ grid-template-columns:1fr 1fr; }
}
@media (max-width:767px){
  .r-gnav__list{ display:none; }
  .r-gnav__cta{ display:none; }
  .r-burger{ display:block; }
  .r-hero__title{ font-size:32px; }
  .r-about__body,.r-glp__body{ padding:38px 26px; }
  .r-brand__name{ font-size:28px; }
  .r-footer__in{ flex-direction:column; text-align:center; }
  .r-inner{ padding:0 18px; }
  /* モバイルメニュー */
  .r-gnav.is-open .r-gnav__list{ display:flex; flex-direction:column; position:absolute; top:72px; left:0; right:0; background:var(--cream); padding:20px 24px; gap:18px; border-bottom:1px solid var(--line); }
  .r-gnav.is-open .r-gnav__cta{ display:inline-flex; }
}