/* ============================================================
   いわて外構マガジン — 共有スタイル
   参考ページ VERITIS MAGAZINE の設計言語を踏襲
   近黒 #1A1A1A × ラスト #9F441F × 生成り #F0ECE0 / ティール #1B4444
   Hanken Grotesk(英) / Zen Kaku Gothic New(和見出し) / Noto Sans JP(本文)
   ============================================================ */
html{scroll-behavior:smooth}
body{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;color:#1A1A1A;background:#fff;-webkit-font-smoothing:antialiased;line-height:1.7}
.en{font-family:"Hanken Grotesk","Noto Sans JP",sans-serif}
.zen{font-family:"Zen Kaku Gothic New","Noto Sans JP",sans-serif}

/* 大見出し（Hanken・小文字・56px級） */
.sec-title{font-family:"Hanken Grotesk",sans-serif;font-weight:700;text-transform:lowercase;font-size:clamp(2.2rem,5.5vw,3.5rem);line-height:1;letter-spacing:-.01em}
/* 小さい下線英字ラベル */
.sec-label{font-family:"Hanken Grotesk",sans-serif;font-weight:600;font-size:12px;letter-spacing:.04em;text-transform:lowercase;border-bottom:3px solid #1A1A1A;display:inline-block;padding-bottom:3px}
/* セクション上辺のヘアライン */
.hair{border-top:1px solid #1A1A1A}

.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* 画像プレースホルダ（偽施工事例は作らない／生成画像投入まで） */
.ph{position:relative;background:#F0ECE0;display:grid;place-items:center;overflow:hidden}
.ph svg{width:30%;height:30%;opacity:.32;color:#1A1A1A}
.ph .ph-tag{position:absolute;left:12px;bottom:12px;font-size:11px;background:rgba(255,255,255,.9);color:#5C5C56;padding:2px 8px}
.ph .ph-soon{position:absolute;inset:0;display:grid;place-items:center;font-size:12px;font-weight:700;color:#1A1A1A;background:rgba(240,236,224,.55)}

/* 矢印付きリンク */
a.arrow::after{content:"";display:inline-block;width:1.1em;height:1.1em;margin-left:.3em;vertical-align:-.2em;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat}

/* Splide 調整（参考はSwiper） */
.splide__arrow{background:#fff;border:1px solid #1A1A1A;border-radius:0;opacity:1;width:2.6rem;height:2.6rem}
.splide__arrow svg{fill:#1A1A1A;width:1rem;height:1rem}
.splide__arrow:hover:not(:disabled){background:#1A1A1A}
.splide__arrow:hover:not(:disabled) svg{fill:#fff}
.splide__arrow:disabled{opacity:.3}
.splide__pagination__page.is-active{background:#9F441F}

/* モバイルドロワー */
.drawer-hidden{display:none}

/* パンくず */
.breadcrumb{font-size:12px;color:#727272}
.breadcrumb a{color:#727272;text-decoration:underline;text-underline-offset:2px}
.breadcrumb a:hover{color:#9F441F}

/* ===== ヒーロー特集カルーセル（VERITIS pick up 準拠） ===== */
/* 左余白の縦組み英語ラベル */
.vlabel{position:absolute;top:2px;left:14px;font-family:"Hanken Grotesk",sans-serif;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:lowercase;color:#1A1A1A;border-bottom:3px solid #1A1A1A;padding-bottom:4px;white-space:nowrap;transform-origin:top left;transform:rotate(90deg);pointer-events:none}
@media (max-width:1023px){.vlabel{display:none}}
/* カード：ヘアライン→日付→タイトル→タグ→縦長写真（テキスト上・写真下） */
.pk-link{position:relative;display:flex;flex-direction:column;height:100%;padding-top:18px;border-top:1px solid #1A1A1A}
.pk-date{font-family:"Hanken Grotesk",sans-serif;font-size:11px;font-weight:600;letter-spacing:.03em;color:#1A1A1A;position:relative;padding-left:1.5em}
.pk-date::before{content:"";position:absolute;left:0;top:.5em;width:1em;height:1px;background:#1A1A1A}
.pk-title{font-family:"Zen Kaku Gothic New","Noto Sans JP",sans-serif;font-weight:500;font-size:17px;line-height:1.5;margin-top:10px;min-height:2.9em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;transition:color .2s}
.pk-link:hover .pk-title{color:#9F441F}
.pk-tags{margin-top:10px;display:flex;flex-wrap:wrap;gap:4px 10px}
.pk-tag{color:#727272;font-size:12px;letter-spacing:.03em}
.pk-thumb{width:100%;margin-top:16px;aspect-ratio:3/4;overflow:hidden;background:#F0ECE0}
.pk-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.2,.6,.2,1)}
.pk-link:hover .pk-thumb img{transform:scale(1.05)}
/* ヒーローのSplideは矢印を右上に寄せる（任意） */
#splide-hero .splide__arrows{position:absolute;top:-52px;right:0;display:flex;gap:8px}
@media (max-width:1023px){#splide-hero .splide__arrows{display:none}.pk-thumb{aspect-ratio:4/5}}
/* マストヘッド：この号の目次（コンテンツ索引） */
.issue-idx{border-top:1px solid #1A1A1A}
.issue-idx a{display:flex;align-items:baseline;gap:14px;padding:11px 2px;border-bottom:1px solid #D9D3C4;transition:padding .18s,background .18s}
.issue-idx a:hover{background:#F7F5EE;padding-left:9px}
.issue-idx .n{font-family:"Hanken Grotesk",sans-serif;font-size:12px;font-weight:700;letter-spacing:.02em;color:#9F441F;flex:none;width:1.7em}
.issue-idx .jp{font-family:"Zen Kaku Gothic New","Noto Sans JP",sans-serif;font-weight:500;font-size:15px;color:#1A1A1A}
.issue-idx a:hover .jp{color:#9F441F}
.issue-idx .en2{margin-left:auto;font-family:"Hanken Grotesk",sans-serif;font-size:11px;letter-spacing:.04em;color:#9A9A9A;text-transform:lowercase;align-self:center}
/* マストヘッドの薄い地紋（フラット感の解消） */
.hero-masthead{background:#fff;position:relative}
.hero-masthead::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 88% 0%,#F4F1E8 0%,rgba(244,241,232,0) 60%);pointer-events:none}

/* ===== 記事本文 article-body（コラム・事例詳細） ===== */
.article-body{font-size:max(.9375rem,15px);line-height:1.95;color:#1A1A1A}
.article-body>*+*{margin-top:1.15em}
.article-body h2{font-family:"Zen Kaku Gothic New","Noto Sans JP",sans-serif;font-size:max(1.3rem,18px);font-weight:700;line-height:1.5;margin-top:2.4em;padding:.5em .9em;border-left:5px solid #9F441F;background:#F0ECE0}
.article-body h3{font-family:"Zen Kaku Gothic New","Noto Sans JP",sans-serif;font-size:max(1.1rem,16px);font-weight:700;line-height:1.5;margin-top:1.9em;padding-bottom:.3em;border-bottom:2px solid #1A1A1A}
.article-body h4{font-weight:700;margin-top:1.5em}
.article-body p{line-height:1.95}
.article-body a{color:#9F441F;text-decoration:underline;text-underline-offset:2px}
.article-body a:hover{opacity:.75}
.article-body strong{font-weight:700}
.article-body ul,.article-body ol{padding-left:1.5em;display:flex;flex-direction:column;gap:.4em}
.article-body ul{list-style:disc}.article-body ol{list-style:decimal}
.article-body table{width:100%;border-collapse:collapse;font-size:max(.85rem,13px);line-height:1.6}
.article-body th,.article-body td{border:1px solid #CCCCCC;padding:.6em .8em;text-align:left;vertical-align:top}
.article-body thead th{background:#1A1A1A;color:#fff;font-weight:700}
.article-body tbody th{background:#F0ECE0;font-weight:600;white-space:nowrap}
.article-body .tbl-wrap{overflow-x:auto}
.article-body .note-warn{background:#F4E5DC;border-left:4px solid #9F441F;padding:.8em 1em;font-size:max(.8125rem,13px)}
.article-body .note-info{background:#F0ECE0;border-left:4px solid #1B4444;padding:.8em 1em;font-size:max(.8125rem,13px)}
.article-body .src{font-size:max(.7rem,11px);color:#9A9A9A;line-height:1.6}
.article-body blockquote{border-left:3px solid #CCCCCC;padding-left:1em;color:#727272}
