/*
Theme Name: SYSTECH 辻合繊加工
Description: 辻合繊加工株式会社のサイト用テーマ。文章・写真は固定ページのブロックエディタで編集します。
Version: 1.1.4
Requires at least: 6.4
Text Domain: systech
*/

/*
  現行 kyo-systech.com からの変更点は4つだけ：
  1. 余白   … 区画ごとの上下余白を広げ、詰まった印象をなくす
  2. 見出し … 明朝の見出しを大きくし、本文との大きさの差をはっきりさせる
  3. 区切り … 1px の枠線をやめ、背景色の差（生成り／白／藍）で区切る
  4. 写真   … 元画像が小さいため引き伸ばさない。原寸〜1.5倍、文字の載った画像は切らない
  アイコンは使わない。
*/
:root{
  --ink:#2b2b2b;
  --sub:#555;
  --ai:#2f4a6e;         /* 藍：現行の青線 #5081bc を深めた基調色 */
  --ai-light:#5081bc;   /* 現行の青線そのまま */
  --shu:#c4514f;        /* 朱：現行の電話番号 #e36767 をコントラストが取れる濃さに */
  --kinari:#f3f0ea;
  --paper:#faf9f6;
  --serif:"Noto Serif JP","Yu Mincho","YuMincho","Hiragino Mincho ProN",serif;
  --sans:"Noto Sans JP","Yu Gothic","YuGothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  --gutter:max(20px,calc((100% - 1080px) / 2));
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.95;font-weight:400;letter-spacing:.03em}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.wrap{width:min(1080px,100% - 40px);margin-inline:auto}
p{margin:0 0 1.2em}
p:last-child{margin-bottom:0}

/* ---------- ヘッダー ---------- */
.tagline{background:var(--kinari);color:var(--sub);font-size:14px;line-height:1.6;padding:8px 0}
.tagline p{margin:0}
.head{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 0}
.head .logo img{width:353px}
.head .contact{text-align:right;line-height:1.5}
.head .addr{font-size:15px;color:var(--sub);margin:0 0 4px}
.head .tel{margin:0;font-family:var(--serif);font-size:15px;color:var(--sub)}
.head .tel span{white-space:nowrap;font-size:26px;color:var(--shu);margin:0 18px 0 6px;letter-spacing:.04em}
.head .tel span:last-child{margin-right:0}

/* ---------- ナビ ---------- */
.gnav{background:var(--ai)}
.gnav>ul{list-style:none;margin:0 auto;padding:0;display:flex;width:min(1080px,100% - 40px)}
.gnav>ul>li{flex:1;position:relative}
.gnav>ul>li>a{display:block;text-align:center;color:#fff;text-decoration:none;padding:14px 8px 12px;font-family:var(--serif);font-size:18px;line-height:1.4}
.gnav>ul>li>a small{display:block;font-family:var(--sans);font-size:14px;letter-spacing:.06em;color:#d6e0ee;font-weight:500}
.gnav>ul>li:hover>a,.gnav>ul>li:focus-within>a{background:#243b59}
.gnav ul ul{list-style:none;margin:0;padding:8px 0;position:absolute;left:0;right:0;top:100%;background:#fff;box-shadow:0 10px 24px rgba(0,0,0,.12);display:none;z-index:10}
.gnav li:hover>ul,.gnav li:focus-within>ul{display:block}
.gnav ul ul a{display:block;padding:10px 20px;text-decoration:none;font-size:16px;font-weight:500}
.gnav ul ul a:hover{background:var(--kinari)}
.menu-btn{display:none;border:0}

/* ---------- 下層ページの見出し帯（区分名＋ページ名／右に区分の写真を原寸で） ---------- */
.page-title{background:var(--kinari)}
.page-title .wrap{display:flex;align-items:center;justify-content:space-between;gap:32px;min-height:153px}
.page-title .sec-name{margin:0 0 6px;font-family:var(--serif);font-size:16px;color:var(--ai);letter-spacing:.12em}
.page-title .sec-name small{margin-left:12px;font-family:var(--sans);font-size:14px;color:var(--sub);letter-spacing:.06em}
.page-title h1{margin:0;font-family:var(--serif);font-weight:600;font-size:34px;line-height:1.5;letter-spacing:.1em;color:#1f2d40}
.page-title .band{width:533px;height:153px;flex:none}

/* ---------- 本文の区画（ブロックエディタの「グループ」に sec クラス） ---------- */
.entry .sec{padding:84px var(--gutter);margin:0}
.entry .sec.kinari{background:var(--paper)}
.entry .sec.kinari-dark{background:var(--kinari)}
.entry .sec > .wp-block-group__inner-container{max-width:none}
.entry .sec + .sec{margin-top:0}
.entry .wp-block-group.is-layout-constrained > *{max-width:none}

/* 見出し（明朝・大きく・左に藍の太い帯。細い線の枠は使わない） */
.entry h2,.entry h3,.page-title h1{text-wrap:balance}
.entry h2,.entry .h2{font-family:var(--serif);font-weight:600;font-size:30px;line-height:1.55;letter-spacing:.08em;margin:0 0 32px;padding-left:22px;position:relative;color:#1f2d40}
.entry h2::before{content:"";position:absolute;left:0;top:.25em;bottom:.25em;width:6px;background:var(--ai-light)}
.entry h3,.entry .h3{font-family:var(--serif);font-weight:600;font-size:23px;line-height:1.6;letter-spacing:.06em;margin:0 0 24px;color:#1f2d40}
.entry h2.h3{padding-left:0}
.entry h2.h3::before{content:none}

/* 写真：どの画像も原寸を超えて引き伸ばさない。文字の載った画像は切らない */
.entry .wp-block-image{margin:0}
.entry .wp-block-image img{width:auto;max-width:100%;height:auto;object-fit:contain}
.entry .wp-block-image.x15 img{width:150%;max-width:100%}

/* 段組み（ブロックの「カラム」） */
.entry .wp-block-columns{gap:48px;margin:0;align-items:flex-start}
.entry .wp-block-column > *:last-child{margin-bottom:0}

/* ---------- トップ：スライド（900×365 を超えて引き伸ばさない・切らない） ---------- */
.entry .sec.hero{padding-top:40px;padding-bottom:40px;background:var(--kinari)}
.hero-slides{margin:0 auto !important}
.hero-slides:not(.slides) figure:not(:first-child){display:none !important}
.slides{position:relative;max-width:900px;margin-inline:auto;aspect-ratio:900/365;overflow:hidden;background:#fff}
.slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity 1.2s ease}
.slides img.on{opacity:1}
.dots{display:flex;justify-content:center;gap:10px;margin-top:16px}
.dots button{width:36px;height:6px;border:0;padding:0;background:#cfc9bd;cursor:pointer}
.dots button.on{background:var(--ai)}

.entry .intro p{max-width:860px}

/* What's New ＋ バナー */
.entry .news-row > .wp-block-column:last-child{flex:0 0 290px}
.news-card{background:#fff;padding:32px 36px}
.news-card + .news-card{margin-top:20px}
.news-card .date{font-size:15px;color:var(--ai);font-weight:700;letter-spacing:.08em;margin:0 0 6px}
.entry .news-card h3,.news-card h3{margin:0 0 14px;font-family:var(--sans);font-size:19px;line-height:1.7;font-weight:700;letter-spacing:.03em}
.news-card h3 a{text-decoration:none}
.news-card h3 a:hover{text-decoration:underline}
.entry .banners .wp-block-image + .wp-block-image{margin-top:18px}
.entry .banners .wp-block-image a:hover img{opacity:.85}

/* チャレンジ25 */
.entry .c25{align-items:center}
.entry .c25 > .wp-block-column:first-child{flex:0 0 198px}

/* 会社情報 */
.entry .company > .wp-block-column:first-child{flex:0 0 300px}
.entry .company .wp-block-image img{width:300px}
.entry .info-table{margin:0}
.entry .info-table table{border-collapse:collapse;width:auto}
.entry .info-table td{border:0;padding:5px 22px 5px 0;vertical-align:top}
.entry .info-table td:first-child{font-weight:700;color:#1f2d40;white-space:nowrap}

/* ---------- 下層ページの部品 ---------- */
/* 写真＋文章（カラムの左に写真。写真は原寸のまま・切らない） */
.entry .item{align-items:flex-start}
.entry .item > .wp-block-column:first-child{flex:0 0 auto;max-width:300px}
.entry .wp-block-columns + *,.entry .sec > h3:not(:first-child),.entry .wp-block-column > h3:not(:first-child){margin-top:56px}
.entry .lead-b{font-weight:700;font-size:18px;color:#1f2d40;margin-bottom:.6em}
.entry .ba .wp-block-image img{margin:0}
.entry .pair h3{margin-bottom:16px}

/* 設備写真ギャラリー（185×140 を最大1.5倍まで・切らない） */
.entry .wp-block-gallery.gal{gap:16px !important}
.entry .wp-block-gallery.gal figure.wp-block-image:not(#x){flex-grow:0;width:calc(25% - 12px) !important}
.entry .wp-block-gallery.gal figure.wp-block-image:not(#x) img{width:100%;height:auto !important;max-width:278px;object-fit:contain !important}
.entry .wp-block-gallery.gal3 figure.wp-block-image:not(#x){width:calc(33.33% - 11px) !important}
.entry .wp-block-gallery.gal3 figure.wp-block-image:not(#x) img{max-width:420px}
.entry .wp-block-gallery.gal2 figure.wp-block-image:not(#x){width:calc(50% - 8px) !important}
.entry .figure-wide{margin:0 auto}
.entry .figure-wide img{margin-inline:auto}

/* 表（会社概要）：線で囲まず、行の背景色で区切る */
.entry .spec{margin:0}
.entry .spec table{border-collapse:collapse;width:100%}
.entry .spec td{border:0;padding:16px 20px;vertical-align:top}
.entry .spec tr:nth-child(odd) td{background:var(--paper)}
.entry .spec td:first-child{width:9em;font-weight:700;color:#1f2d40;white-space:nowrap}
.entry .map iframe{display:block;width:100%;height:380px;border:0}
.entry .rules p{margin-bottom:.4em}

/* お問い合わせフォーム（Contact Form 7） */
.entry .sec.form .wpcf7{max-width:760px}
.entry .wpcf7 p{margin:0 0 22px}
.entry .wpcf7 label{display:block;font-weight:700;color:#1f2d40}
.entry .wpcf7 input[type=text],.entry .wpcf7 input[type=email],.entry .wpcf7 input[type=tel],.entry .wpcf7 textarea{display:block;width:100%;margin-top:8px;padding:12px 14px;font:inherit;background:#fff;border:0;border-bottom:3px solid #cfd8e3;border-radius:0}
.entry .wpcf7 input:focus,.entry .wpcf7 textarea:focus{outline:none;border-bottom-color:var(--ai-light)}
.entry .wpcf7 textarea{height:220px}
.entry .wpcf7 textarea[name=your-address]{height:96px}
.entry .wpcf7 .req{color:var(--shu);font-weight:700;margin-left:6px}
.entry .wpcf7 input[type=submit]{display:block;margin:12px auto 0;min-width:240px;padding:16px 32px;border:0;background:var(--ai);color:#fff;font:700 17px var(--sans);letter-spacing:.3em;cursor:pointer}
.entry .wpcf7 input[type=submit]:hover{background:#243b59}
.entry .wpcf7-not-valid-tip{font-size:15px}
.entry .wpcf7 form .wpcf7-response-output{margin:24px 0 0;padding:14px 18px;border:0;background:var(--kinari)}

/* ---------- 下層ページ下部の問い合わせ枠 ---------- */
.cta{background:var(--ai);color:#fff;padding:48px 0}
.cta .wrap{display:flex;justify-content:space-around;align-items:center;gap:32px;flex-wrap:wrap}
.cta p{margin:0}
.cta .lbl{font-family:var(--serif);font-size:17px;letter-spacing:.1em;color:#d6e0ee;margin-bottom:6px}
.cta .num{font-family:var(--serif);font-size:16px}
.cta .num a{color:#fff;text-decoration:none;font-size:32px;margin-left:10px;letter-spacing:.04em}
.cta .hours{font-size:15px;color:#d6e0ee}
.cta .btn{display:inline-block;background:#fff;color:var(--ai);text-decoration:none;font-weight:700;padding:16px 40px;letter-spacing:.12em}
.cta .btn:hover{background:var(--kinari)}

/* 投稿 */
.entry .post-item:nth-child(even){background:var(--paper)}
.post-date{font-size:15px;color:var(--ai);font-weight:700;letter-spacing:.08em;margin:0 0 4px}
.entry .post-item h2 a{text-decoration:none}
.entry .post-item h2 a:hover{text-decoration:underline}
.entry .pager{padding-top:0;padding-bottom:0}
.back{margin-top:48px}
.nav-links{display:flex;gap:16px;margin-top:32px}

/* ---------- フッター ---------- */
.foot{background:#243248;color:#e8ecf2;padding:64px 0 28px;font-size:15px;line-height:1.9}
.foot .tag{margin:0 0 28px;color:#c9d2de}
.foot .info{margin:0 0 36px}
.foot .name{font-family:var(--serif);font-size:21px;color:#fff;margin:0 0 6px;letter-spacing:.08em}
.foot nav{display:grid;grid-template-columns:repeat(4,auto);justify-content:start;gap:8px 56px;padding:28px 0}
.foot nav div{display:grid;gap:4px;align-content:start}
.foot nav b{font-family:var(--serif);font-weight:500;color:#fff;font-size:16px}
.foot nav a{color:#e8ecf2;text-decoration:none}
.foot nav a:hover{text-decoration:underline}
.foot .copy{margin:24px 0 0;font-size:14px;color:#aab6c6;text-align:center}
.spbar{display:none}

/* ---------- スマホ ---------- */
@media (max-width:820px){
  body{font-size:16px;line-height:1.9}
  .head{flex-direction:column;align-items:flex-start;gap:12px;padding:18px 0}
  .head .logo img{width:min(353px,100%)}
  .head .contact{text-align:left}
  .head .tel span{font-size:22px;margin-right:12px}
  .head .tel{line-height:1.7}
  .menu-btn{display:block;width:100%;background:var(--ai);color:#fff;border:0;padding:12px;font:500 16px var(--sans);letter-spacing:.2em}
  .gnav>ul{display:none;flex-direction:column}
  .gnav.open>ul{display:flex}
  .gnav ul ul{position:static;display:block;box-shadow:none;background:#243b59;padding:0}
  .gnav ul ul a{color:#fff;padding:10px 28px}
  .gnav ul ul a:hover{background:#1c3049}
  .page-title .wrap{flex-direction:column;align-items:stretch;gap:0;min-height:0}
  .page-title .txt{padding:24px 0 20px}
  .page-title h1{font-size:26px}
  .page-title .band{width:calc(100% + 40px);max-width:none;height:auto;margin:0 -20px;aspect-ratio:533/153}
  .entry .item > .wp-block-column:first-child{max-width:none}
  .entry .wp-block-gallery.gal figure.wp-block-image:not(#x),.entry .wp-block-gallery.gal3 figure.wp-block-image:not(#x){width:calc(50% - 8px) !important}
  .entry .spec td{display:block;padding:4px 16px}
  .entry .spec td:first-child{padding-top:14px;width:auto}
  .entry .spec td:last-child{padding-bottom:14px}
  .entry .spec tr:nth-child(odd) td{background:var(--paper)}
  .cta .wrap{flex-direction:column;align-items:flex-start}
  .entry .sec{padding-top:56px;padding-bottom:56px}
  .entry .sec.hero{padding-top:20px;padding-bottom:20px}
  .entry h2,.entry .h2{font-size:24px;margin-bottom:24px}
  .entry .wp-block-columns{flex-wrap:wrap !important;gap:28px}
  .entry .wp-block-columns > .wp-block-column{flex:1 1 100% !important}
  .news-card{padding:24px 20px}
  .foot nav{grid-template-columns:1fr 1fr;gap:20px 24px}
  .foot{padding-bottom:84px}
  .spbar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;background:var(--ai);z-index:20}
  .spbar a{color:#fff;text-align:center;text-decoration:none;padding:14px 0;font-weight:700;font-size:15px;letter-spacing:.1em}
  .spbar a+a{box-shadow:inset 1px 0 0 rgba(255,255,255,.25)}
}