/* =========================================================
   Top page — the design from before the renewal (made with VK Blocks), drawn by the theme.
   Colors: navy #091d3d, teal #61c1be. Font: Noto Serif JP.
   ========================================================= */
.stc{--c-navy:#091d3d;--c-teal:#61c1be;--c-teal-d:#4aa9a6;--c-gray:#4e4e4e;--c-ink:#333;
  font-family:"Noto Serif JP","Noto Serif CJK JP","Hiragino Mincho ProN","Yu Mincho","Noto Sans CJK JP",serif;color:var(--c-ink);padding:0;overflow-x:clip;line-height:1.9}
.stc h1,.stc h2,.stc h3{font-family:inherit;margin:0}
.stc p{margin:0}
.stc img{max-width:100%;height:auto;display:block}
.stc-wrap{max-width:1140px;margin:0 auto;padding:0 20px}
.stc-center{text-align:center}
.stc-sec{padding:72px 0}
.stc-h2{font-size:clamp(1.4rem,1.1rem + 1.2vw,1.6rem);font-weight:700;text-align:center;letter-spacing:.01em;line-height:1.4}
.stc-h2.is-en{font-size:clamp(2rem,1.8rem + .9vw,2.5rem);letter-spacing:.06em}
.stc-h2sub{text-align:center;font-size:1.15rem;letter-spacing:1px;margin-top:6px!important}
.stc-h2.is-line+.stc-h2sub{position:relative;margin-bottom:56px!important}
.stc-h2.is-line+.stc-h2sub::after{content:"";position:absolute;left:50%;bottom:-38px;width:2px;height:25px;background:currentColor;transform:translateX(-50%)}
.stc-lead{text-align:center;margin-top:12px!important}
.stc-btnwrap{display:flex;justify-content:center;margin-top:28px!important}
.stc-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:min(100%,520px);padding:13px 24px;background:var(--c-teal);border:1px solid var(--c-teal);color:#fff!important;text-decoration:none;border-radius:4px;transition:background .2s}
.stc-btn:hover{background:var(--c-teal-d)}
.stc-btn__ar{width:18px;height:18px;border:1.5px solid currentColor;border-radius:50%;position:relative;flex:none}
.stc-btn__ar::after{content:"";position:absolute;top:5px;left:4px;width:6px;height:6px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg)}

/* Hero */
.stc-hero{position:relative;min-height:640px;display:flex;align-items:center;justify-content:center;color:#fff;text-align:center;overflow:hidden;background:#222}
.stc-hero::before{content:"";position:absolute;inset:0;background:var(--bg) center/cover no-repeat;filter:grayscale(1)}
.stc-hero::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.4)}
.stc-hero__in{position:relative;z-index:1;padding:60px 20px 48px;text-shadow:0 0 10px rgba(0,0,0,.5)}
.stc-hero__title{writing-mode:vertical-rl;display:inline-block;font-size:clamp(1.35rem,1rem + .6vw,1.6rem);font-weight:700;letter-spacing:.1em;line-height:1.35;text-align:start;margin:0 auto 28px!important}
.stc-hero__title span{display:block;margin-left:.35em}
.stc-hero__title span:last-child{margin-left:0}
.stc-hero__name{font-size:1.15rem;letter-spacing:.1em}
.stc-hero__en{font-size:1.25rem;letter-spacing:.06em;margin-top:2px!important}
@media (max-width:767px){
  .stc-hero{min-height:520px}
  .stc-hero__title{writing-mode:horizontal-tb;display:block;font-size:1.45rem;letter-spacing:.04em}
}

/* 更新情報 */
.stc-ticker{background:var(--c-teal);color:#fff;padding:12px 0}
.stc-ticker__in{max-width:1140px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:24px}
.stc-ticker__h{font-size:1.15rem;font-weight:700;white-space:nowrap}
.stc-ticker__box{position:relative;display:flex;align-items:center;min-width:0}
.stc-ticker__list{list-style:none;margin:0;padding:0 28px;position:relative;flex:1;min-height:2.6em;min-width:0}
.stc-ticker__list li{position:absolute;inset:0 28px;display:flex;align-items:center;gap:18px;opacity:0;visibility:hidden;transition:opacity .5s}
.stc-ticker__list li.is-on{opacity:1;visibility:visible}
.stc-ticker__list time{font-size:.85rem;white-space:nowrap}
.stc-ticker__list a{color:#fff;font-size:.9rem;line-height:1.35;text-decoration:none;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.stc-ticker__list a:hover{text-decoration:underline}
.stc-ticker__nav{position:absolute;top:50%;width:22px;height:22px;margin-top:-11px;border:0;background:none;color:#fff;cursor:pointer;z-index:2}
.stc-ticker__nav::after{content:"";position:absolute;top:7px;width:8px;height:8px;border-top:2px solid currentColor;border-right:2px solid currentColor}
.stc-ticker__nav.is-prev{left:0}.stc-ticker__nav.is-prev::after{left:8px;transform:rotate(-135deg)}
.stc-ticker__nav.is-next{right:0}.stc-ticker__nav.is-next::after{left:4px;transform:rotate(45deg)}
.stc-ticker__all{color:#fff!important;border:1px solid #fff;padding:8px 22px;text-decoration:none;white-space:nowrap;font-size:.9rem;border-radius:4px}
.stc-ticker__all::after{content:"\203A";margin-left:10px}
.stc-ticker__all:hover{background:rgba(255,255,255,.15)}
@media (max-width:767px){
  .stc-ticker__in{grid-template-columns:1fr;gap:6px}
  .stc-ticker__list{min-height:4.4em}
  .stc-ticker__list li{flex-direction:column;align-items:flex-start;justify-content:center;gap:2px}
  .stc-ticker__all{display:none}
}

/* 紹介 */
.stc-intro{position:relative;color:#fff;padding:120px 0 110px;overflow:hidden;background:#222}
.stc-intro::before{content:"";position:absolute;inset:0;background:var(--bg) center/cover no-repeat;filter:grayscale(1)}
.stc-intro::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.4)}
.stc-intro .stc-wrap{position:relative;z-index:1;text-shadow:0 0 10px rgba(0,0,0,.5)}
.stc-intro__title{font-size:clamp(1.15rem,.95rem + .9vw,1.6rem);font-weight:700;line-height:1.6}
.stc-intro__text{margin-top:36px}
.stc-intro__text p{margin-top:1.2em!important;font-size:1rem;line-height:1.9}
@media (max-width:767px){.stc-intro{padding:72px 0}.stc-intro br{display:none}}

/* 写真の3枚 */
.stc-cards{display:grid;grid-template-columns:repeat(3,1fr)}
.stc-card{position:relative;display:block;height:240px;overflow:hidden;color:#fff!important;text-decoration:none;background:#333}
.stc-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s ease-out}
.stc-card:hover img{transform:scale(1.08);transition:transform .2s linear}
.stc-card::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.25)}
.stc-card__in{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:16px;text-shadow:0 0 10px rgba(0,0,0,.6)}
.stc-card__h{font-size:clamp(1.2rem,1rem + .8vw,1.5rem);font-weight:700}
.stc-card__s{font-size:1rem;margin-top:4px}
@media (max-width:767px){.stc-cards{grid-template-columns:1fr}.stc-card{height:190px}}

/* 最新補助金 */
.stc-sub__cards{display:flex;justify-content:center;flex-wrap:wrap;gap:24px;margin-top:36px}
.stc-sub__card{width:min(100%,420px);text-align:center;color:#000!important;text-decoration:none;font-size:.88rem;line-height:1.6}
.stc-sub__card img{width:100%;height:auto;margin-bottom:8px;transition:opacity .2s,transform .3s}
.stc-sub__card:hover img{transform:translateY(-3px)}
.stc-sub__card:hover img{opacity:.85}
.stc-sub__card b{font-weight:400;text-decoration:underline}
.stc-sub .stc-center{margin-top:32px!important;font-size:1.05rem}

/* 3つの紹介（設計・施工／高品質施工／補助金の活用） */
.stc-feat{position:relative;padding:72px 0 80px}
.stc-feat.is-photo{color:#fff;background:#222;overflow:hidden}
.stc-feat.is-photo::before{content:"";position:absolute;inset:0;background:var(--bg) center/cover no-repeat}
.stc-feat.is-photo::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.37)}
.stc-feat.is-plain{background:#f1f1f1}
.stc-feat .stc-wrap{position:relative;z-index:1}
.stc-feat.is-photo .stc-h2,.stc-feat.is-photo .stc-h2sub{text-shadow:0 0 10px rgba(0,0,0,.5)}
.stc-feat__box{background:#fff;color:var(--c-ink);max-width:1080px;margin:0 auto;padding:40px clamp(20px,3vw,30px)}
.stc-feat__cols{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}
.stc-feat__cols.is-imgright .stc-feat__img{order:2}
.stc-feat__img{margin:0}
.stc-feat__img img{width:100%}
.stc-feat__text h3{font-size:clamp(1.2rem,1rem + .8vw,1.5rem);font-weight:600;color:#000;line-height:1.35;margin-bottom:16px!important}
.stc-feat__text p{line-height:1.9}
.stc-feat__text strong{font-weight:700}
.stc-feat__note{margin-top:20px}
.stc-feat__note p{line-height:1.9}
.stc-feat.is-n2 .stc-feat__note,.stc-feat.is-n3 .stc-feat__note{text-align:center}
.stc-feat .stc-btn{min-width:min(100%,480px)}
/* the triangle under the 1st and over the 3rd band (as on the old page) */
.stc-feat.is-n1{clip-path:polygon(0 0,100% 0,100% calc(100% - 40px),50% 100%,0 calc(100% - 40px));padding-bottom:110px}
.stc-feat.is-n3{clip-path:polygon(0 0,50% 40px,100% 0,100% calc(100% - 40px),50% 100%,0 calc(100% - 40px));padding-top:110px;padding-bottom:110px}
.stc-feat.is-n2{margin-top:-40px;padding-top:112px}
.stc-feat.is-n3{margin-top:-40px}
.stc-feat.is-n1{z-index:3}.stc-feat.is-n2{z-index:1}.stc-feat.is-n3{z-index:2}
.stc-reasons{position:relative;z-index:1;margin-top:-40px}
.stc-reasons__band{padding-top:96px!important}
@media (max-width:767px){
  .stc-feat__cols{grid-template-columns:1fr;gap:20px}
  .stc-feat__cols.is-imgright .stc-feat__img{order:0}
  .stc-feat.is-n1,.stc-feat.is-n3{clip-path:none;padding-bottom:72px}
  .stc-feat.is-n3{padding-top:72px}
  .stc-feat.is-n2,.stc-feat.is-n3{margin-top:0}
  .stc-feat.is-n2{padding-top:72px}
  .stc-reasons{margin-top:0}
  .stc-reasons__band{padding-top:56px!important}
}

/* 選ばれる理由 */
.stc-reasons{padding-bottom:64px}
.stc-reasons__band{background:var(--c-gray);color:#fff;padding:56px 20px 150px}
.stc-reasons__grid{list-style:none;margin:-110px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.stc-reason{background:#fff;padding:20px;box-shadow:0 2px 14px rgba(0,0,0,.12);text-align:left}
.stc-reason img{width:100%;aspect-ratio:4/3;object-fit:cover;margin-bottom:16px}
.stc-reason__no{display:block;background:#f5f5f5;color:#202020;font-size:.88rem;line-height:1;padding:8px 16px;text-align:center}
.stc-reason h3{color:var(--c-teal);font-size:1rem;font-weight:600;text-align:center;line-height:1.35;margin:14px 0 10px!important}
.stc-reason p:last-child{font-size:.95rem;line-height:1.8}
.stc-reasons__note{max-width:1080px;margin:48px auto 0!important;line-height:1.9}
@media (max-width:991px){.stc-reasons__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:575px){.stc-reasons__grid{grid-template-columns:1fr}}

/* お得な情報 */
.stc-info{background:#f4f5f7}
.stc-info__grid{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.stc-post{background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.1);padding:0 0 18px;display:flex;flex-direction:column;align-items:center;text-align:center}
.stc-post__img{display:block;width:100%;aspect-ratio:16/9;overflow:hidden;margin-bottom:14px}
.stc-post__img img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.stc-post:hover .stc-post__img img{transform:scale(1.04)}
.stc-badge{display:inline-block;background:#999;color:#fff;font-size:.8rem;font-weight:500;line-height:1.7;padding:0 .8em;border-radius:2px;white-space:nowrap}
.stc-post h3{font-size:1rem;font-weight:700;line-height:1.5;margin:10px 16px 6px!important}
.stc-post h3 a{color:var(--c-ink);text-decoration:none}
.stc-post h3 a:hover{color:var(--c-teal-d)}
.stc-post time{font-size:.85rem;color:#666}
@media (max-width:991px){.stc-info__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:575px){.stc-info__grid{grid-template-columns:1fr}}

/* お知らせ */
.stc-news__list{list-style:none;margin:32px auto 0;padding:0;max-width:1000px}
.stc-news__list li{display:grid;grid-template-columns:96px auto 1fr;align-items:center;gap:16px;padding:14px 4px;border-bottom:1px solid #e5e5e5}
.stc-news__list time{font-size:.95rem}
.stc-news__list a{color:#666;text-decoration:none;line-height:1.5}
.stc-news__list a:hover{color:var(--c-teal-d);text-decoration:underline}
@media (max-width:575px){.stc-news__list li{grid-template-columns:auto 1fr;gap:6px 12px}.stc-news__list a{grid-column:1/-1}}

/* 実績 */
.stc-works{position:relative;padding:64px 0;background:#222}
.stc-works::before{content:"";position:absolute;inset:0;background:var(--bg) center/cover no-repeat}
.stc-works::after{content:"";position:absolute;inset:0;background:rgba(9,29,61,.5)}
.stc-works .stc-wrap{position:relative;z-index:1}
.stc-works__box{background:#fff;padding:48px clamp(16px,3vw,40px)}
.stc-works__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.stc-works__grid li{text-align:center;border:1px solid #e3e6ea;padding:22px 10px}
.stc-works__grid h3{font-size:1.05rem;font-weight:600}
.stc-works__num{font-size:clamp(2.4rem,2rem + 1.6vw,3.2rem);font-weight:700;color:var(--c-navy);line-height:1.2;margin-top:8px!important}
@media (max-width:991px){.stc-works__grid{grid-template-columns:repeat(2,1fr)}}

/* 対応エリア */
.stc-area .stc-center{margin-top:24px!important}
.stc-area__list{max-width:1000px;margin:32px auto 0;display:grid;grid-template-columns:140px 1fr;gap:0}
.stc-area__list dt{font-size:1.25rem;font-weight:600;padding:18px 0;border-top:1px solid #e5e5e5}
.stc-area__list dd{margin:0;padding:18px 0;border-top:1px solid #e5e5e5;font-size:.95rem;line-height:1.9}
@media (max-width:575px){.stc-area__list{grid-template-columns:1fr}.stc-area__list dd{border-top:0;padding-top:0}}

/* お問い合わせ */
.stc-contact{display:grid;grid-template-columns:1fr 1fr;background:var(--c-navy);color:#fff}
.stc-contact__text{padding:64px clamp(20px,5vw,72px);display:flex;flex-direction:column;justify-content:center}
.stc-contact__text h2{font-size:clamp(1.4rem,1.1rem + 1.2vw,1.8rem);font-weight:700}
.stc-contact__text>p{margin:20px 0 28px!important;line-height:1.9}
.stc-contact__btn{display:flex;flex-direction:column;align-items:center;background:#fff;color:var(--c-navy)!important;text-decoration:none;padding:14px 16px;border-radius:4px;margin-top:12px;transition:opacity .2s}
.stc-contact__btn:hover{opacity:.88}
.stc-contact__main{display:flex;align-items:center;gap:8px;font-size:1.05rem}
.stc-contact__main b{font-size:1.5rem;letter-spacing:.04em}
.stc-contact__main svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8}
.stc-contact__btn small{font-size:.85rem;margin-top:2px}
.stc-contact__img{position:relative;min-height:360px;background:var(--bg) center/cover no-repeat}
.stc-contact__img::after{content:"";position:absolute;inset:0;background:rgba(9,29,61,.5)}
@media (max-width:767px){.stc-contact{grid-template-columns:1fr}.stc-contact__img{min-height:200px;order:-1}}

/* 横の固定ボタン（パソコン） */
.stc-side{position:fixed;left:0;top:50%;transform:translateY(-50%);z-index:45;display:none;flex-direction:column;gap:6px}
.stc-side a{writing-mode:vertical-rl;background:var(--c-teal);color:#fff!important;text-decoration:none;padding:16px 10px;font-size:.88rem;letter-spacing:.12em;border-radius:0 6px 6px 0;font-family:"Noto Serif JP",serif}
.stc-side a:hover{background:var(--c-teal-d)}
@media (min-width:1080px){.stc-side{display:flex}}

/* ---------- 動き（1.2.0）：スクロールで順に表示、最初の写真はゆっくり寄る ---------- */
@keyframes stc-zoom{from{transform:scale(1.12)}to{transform:scale(1)}}
@keyframes stc-up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.stc-hero::before{animation:stc-zoom 9s ease-out both}
.stc-hero__title{animation:stc-up 1s .2s cubic-bezier(.2,.7,.2,1) both}
.stc-hero__name{animation:stc-up 1s .6s cubic-bezier(.2,.7,.2,1) both}
.stc-hero__en{animation:stc-up 1s .8s cubic-bezier(.2,.7,.2,1) both}
.stc-anim .stc-rv{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s);will-change:opacity,transform}
.stc-anim .stc-rv.is-left{transform:translateX(-40px)}
.stc-anim .stc-rv.is-right{transform:translateX(40px)}
.stc-anim .stc-rv.is-zoom{transform:scale(.94)}
.stc-anim .stc-rv.is-in{opacity:1;transform:none}
.stc-reason,.stc-post,.stc-works__grid li{transition:box-shadow .3s,transform .3s}
.stc-reason:hover,.stc-post:hover{transform:translateY(-4px);box-shadow:0 10px 26px rgba(0,0,0,.16)}
.stc-btn{position:relative;overflow:hidden}
.stc-btn::before{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .6s}
.stc-btn:hover::before{left:120%}
.stc-side a{transition:padding .2s,background .2s}
.stc-side a:hover{padding-left:16px}
@media (prefers-reduced-motion:reduce){
  .stc-hero::before,.stc-hero__title,.stc-hero__name,.stc-hero__en{animation:none}
  .stc-anim .stc-rv{opacity:1;transform:none;transition:none}
}
