/* =========================================================
   つきじ治作 — columns ページ固有スタイル（抽出元: columns/index.html の <style>）
   body名前空間: page-columns / url(): css/pages/基準 ../../images/
   ========================================================= */
/* ── Background Images ── */
.lp-hero__image{background-image:url('../../images/visual11.webp');}
.lp-cta__bg{background-image:url('../../images/Img26182.jpg');}

/* ── Columns Card Grid ── */
.cl-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(24px,3vw,40px);margin-top:clamp(48px,6vw,80px);}
.cl-card{background:rgba(18,20,26,.45);border:.5px solid rgba(184,147,90,.18);overflow:hidden;text-decoration:none;display:block;transition:border-color .4s var(--ease);}
.cl-card:hover{border-color:rgba(184,147,90,.45);}
.cl-card__img{aspect-ratio:16/9;background-size:cover;background-position:center;}
.cl-card__body{padding:clamp(20px,2.4vw,32px);}
.cl-card__date{font-family:var(--en-body);font-style:italic;font-size:11px;letter-spacing:.06em;color:var(--caption);display:block;margin-bottom:8px;}
.cl-card__title{font-family:var(--serif-display);font-weight:500;font-size:clamp(15px,1.3vw,19px);letter-spacing:.14em;line-height:1.6;color:var(--mute);margin:0 0 10px;}
.cl-card__excerpt{font-family:var(--serif);font-weight:300;font-size:12px;line-height:1.9;letter-spacing:.06em;color:var(--caption);}
.cl-card__more{display:inline-block;margin-top:14px;font-family:var(--en-serif);font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);}

@media(max-width:768px){
  .cl-grid{grid-template-columns:1fr;}
}

/* SP hero layout — stack H1 → crumb → image (mirrors lifeevent/children) */
@media (max-width:767px){
  .lp-hero{
    height:auto !important;min-height:0 !important;
    display:flex !important;flex-direction:column !important;
    padding-top:120px !important;
  }
  .lp-hero__content{
    position:relative !important;
    inset:auto !important;
    top:auto !important;left:auto !important;right:auto !important;bottom:auto !important;
    height:auto !important;
    padding:0 20px !important;
    order:1;
    justify-content:flex-start !important;
    align-items:flex-start !important;
    text-align:left !important;
  }
  .lp-hero__crumb{
    position:relative !important;
    top:auto !important;left:auto !important;
    margin:10px 20px 0 !important;
    order:2;
  }
  .lp-hero__scrim{display:none !important;}
  .lp-hero__image{
    position:relative !important;
    top:auto !important;left:auto !important;right:auto !important;bottom:auto !important;
    width:100% !important;height:55vh !important;
    margin-top:12px !important;
    order:3;
  }
}
/* シンプルHERO（会社情報と共通） — sp-hero / sp-breadcrumb */
.sp-hero{position:relative;height:320px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:48px;overflow:hidden;background:#1a2638;}
.sp-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(26,38,56,.3) 0%,rgba(26,38,56,.85) 100%);}
.sp-hero__title{position:relative;z-index:1;text-align:center;}
.sp-hero__title h1{font-family:var(--serif-display);font-size:clamp(24px,3vw,36px);font-weight:500;letter-spacing:.2em;color:var(--mute);margin:0 0 8px;}
.sp-hero__title .en{font-family:var(--en-serif);font-size:clamp(11px,1.2vw,14px);letter-spacing:.35em;text-transform:uppercase;color:var(--gold);font-style:italic;}
.sp-breadcrumb{padding:16px clamp(24px,8vw,120px);font-family:var(--serif);font-size:11px;letter-spacing:.15em;color:rgba(232,226,212,.4);}
.sp-breadcrumb a{color:rgba(232,226,212,.4);text-decoration:none;transition:color .3s;}
.sp-breadcrumb a:hover{color:var(--gold);}
.sp-breadcrumb span{margin:0 8px;}
